From 8591ec376ba7ffcbad6ca4a32fc7e3c432341176 Mon Sep 17 00:00:00 2001 From: mik-tf Date: Thu, 5 Sep 2024 20:59:46 -0400 Subject: [PATCH] basic poc --- .gitignore | 3 ++ backend/README.md | 25 ++++++++++ backend/frontend/favicon.png | Bin 0 -> 426 bytes backend/frontend/index.html | 34 ++++++++++++++ backend/frontend/pages/calendar.html | 20 ++++++++ backend/frontend/pages/chat.html | 15 ++++++ backend/frontend/pages/file_management.html | 22 +++++++++ backend/frontend/pages/home.html | 49 ++++++++++++++++++++ backend/frontend/pages/login.html | 15 ++++++ backend/frontend/pages/logout.html | 8 ++++ backend/frontend/pages/profile.html | 16 +++++++ backend/frontend/pages/settings.html | 20 ++++++++ backend/frontend/pages/video.html | 18 +++++++ backend/frontend/style.css | 13 ++++++ backend/main.py | 24 ++++++++++ backend/requirements.txt | 4 ++ 16 files changed, 286 insertions(+) create mode 100644 .gitignore create mode 100644 backend/README.md create mode 100644 backend/frontend/favicon.png create mode 100644 backend/frontend/index.html create mode 100644 backend/frontend/pages/calendar.html create mode 100644 backend/frontend/pages/chat.html create mode 100644 backend/frontend/pages/file_management.html create mode 100644 backend/frontend/pages/home.html create mode 100644 backend/frontend/pages/login.html create mode 100644 backend/frontend/pages/logout.html create mode 100644 backend/frontend/pages/profile.html create mode 100644 backend/frontend/pages/settings.html create mode 100644 backend/frontend/pages/video.html create mode 100644 backend/frontend/style.css create mode 100644 backend/main.py create mode 100644 backend/requirements.txt diff --git a/.gitignore b/.gitignore new file mode 100644 index 0000000..c14a9a0 --- /dev/null +++ b/.gitignore @@ -0,0 +1,3 @@ +# Virtual Environment Directories +venv/ +__pycache__/ \ No newline at end of file diff --git a/backend/README.md b/backend/README.md new file mode 100644 index 0000000..a3afc25 --- /dev/null +++ b/backend/README.md @@ -0,0 +1,25 @@ +# Dashboard UI + +## Introduction + +This is a proof-of-concept of a basic Dashboard UI in Python using FastApi and HTMX. + +## Deploy Locally + +``` +# Clone the repository +git clone https://git.ourworld.tf/tfgrid/ui_poc +# Go to backend +cd ui_poc/backend +# Set Python environment +python3 -m venv venv +source venv/bin/activate +# Install requirements +python3 -m pip install -r requirements.txt +# Deploy the local website at port 8000 +uvicorn main:app --reload +``` + +## Notes + +The .gitignore file is set with `venv` as the Python virtual environment. \ No newline at end of file diff --git a/backend/frontend/favicon.png b/backend/frontend/favicon.png new file mode 100644 index 0000000000000000000000000000000000000000..c7e01153caf1829aeaaa8c89e7465624d935b53c GIT binary patch literal 426 zcmV;b0agBqP)C0@vl1l~y8chd&Fg~GcEh2{UGFjFYh ziufaO5pfKM`AAj7?INNq8mO$X1#9@2xwW)*Sz}K=qD0k5$H_a!EELYuNT=w;Zmp3b zij_meA+)6)U+^$ + + + + + + User Dashboard + + + + + + +
+
+

Dashboard

+
+ +
+
+

Welcome to Your Dashboard

+

Select an option from the menu on the left to get started.

+
+ + \ No newline at end of file diff --git a/backend/frontend/pages/calendar.html b/backend/frontend/pages/calendar.html new file mode 100644 index 0000000..11b602a --- /dev/null +++ b/backend/frontend/pages/calendar.html @@ -0,0 +1,20 @@ + +
+

Calendar

+

Keep track of your events and appointments.

+
+

You can add your events using the form below:

+
+ + + + + + + + + + +
+
+
\ No newline at end of file diff --git a/backend/frontend/pages/chat.html b/backend/frontend/pages/chat.html new file mode 100644 index 0000000..b81d378 --- /dev/null +++ b/backend/frontend/pages/chat.html @@ -0,0 +1,15 @@ + +
+

Chat

+

Connect with your contacts in real-time.

+
+
+
Contact 1: Hey, how are you?
+
You: I'm doing well, thanks! And you?
+
Contact 1: Good to hear!
+
Contact 2: Did you see the news?
+
+ + +
+
\ No newline at end of file diff --git a/backend/frontend/pages/file_management.html b/backend/frontend/pages/file_management.html new file mode 100644 index 0000000..99c84c4 --- /dev/null +++ b/backend/frontend/pages/file_management.html @@ -0,0 +1,22 @@ + +
+

File Management

+

Upload and manage your files.

+
+ + + +

Your Files:

+ +
+
\ No newline at end of file diff --git a/backend/frontend/pages/home.html b/backend/frontend/pages/home.html new file mode 100644 index 0000000..dc6c1ed --- /dev/null +++ b/backend/frontend/pages/home.html @@ -0,0 +1,49 @@ + +
+

Home

+

Welcome to your dashboard! Click on a section below to view more details.

+ +
+
+

Profile

+

Manage your personal information and settings.

+ Go to Profile +
+ +
+

Chat

+

Connect with your contacts in real-time.

+ Go to Chat +
+ +
+

Videos

+

Watch and manage your video content.

+ Go to Videos +
+ +
+

Calendar

+

Keep track of your events and appointments.

+ Go to Calendar +
+ +
+

File Management

+

Upload and manage your files.

+ Go to File Management +
+ +
+

Settings

+

Customize your application settings.

+ Go to Settings +
+
+
\ No newline at end of file diff --git a/backend/frontend/pages/login.html b/backend/frontend/pages/login.html new file mode 100644 index 0000000..1c3f427 --- /dev/null +++ b/backend/frontend/pages/login.html @@ -0,0 +1,15 @@ + +
+

Login

+

Please enter your credentials to log in.

+
+ + + + + + + +
+
+
\ No newline at end of file diff --git a/backend/frontend/pages/logout.html b/backend/frontend/pages/logout.html new file mode 100644 index 0000000..3b3e925 --- /dev/null +++ b/backend/frontend/pages/logout.html @@ -0,0 +1,8 @@ + +
+

Logout

+

You have been logged out successfully.

+

+ Return to Dashboard +

+
\ No newline at end of file diff --git a/backend/frontend/pages/profile.html b/backend/frontend/pages/profile.html new file mode 100644 index 0000000..6616d24 --- /dev/null +++ b/backend/frontend/pages/profile.html @@ -0,0 +1,16 @@ + +
+

Profile

+

Manage your profile settings and personal information.

+
+
+ + + + + + + +
+
+
\ No newline at end of file diff --git a/backend/frontend/pages/settings.html b/backend/frontend/pages/settings.html new file mode 100644 index 0000000..d58d4cb --- /dev/null +++ b/backend/frontend/pages/settings.html @@ -0,0 +1,20 @@ + +
+

Settings

+

Customize your application settings.

+
+
+ + + + + + + +
+
+
\ No newline at end of file diff --git a/backend/frontend/pages/video.html b/backend/frontend/pages/video.html new file mode 100644 index 0000000..cb8e338 --- /dev/null +++ b/backend/frontend/pages/video.html @@ -0,0 +1,18 @@ + +
+

Videos

+

Watch and manage your video content.

+
+ +
+
\ No newline at end of file diff --git a/backend/frontend/style.css b/backend/frontend/style.css new file mode 100644 index 0000000..a958b83 --- /dev/null +++ b/backend/frontend/style.css @@ -0,0 +1,13 @@ +/* frontend/style.css */ + +body { + font-family: 'Arial', sans-serif; +} + +.content { + transition: opacity 0.3s ease; +} + +.content h3 { + margin-top: 25; +} \ No newline at end of file diff --git a/backend/main.py b/backend/main.py new file mode 100644 index 0000000..1e7bec5 --- /dev/null +++ b/backend/main.py @@ -0,0 +1,24 @@ +# backend/main.py +from fastapi import FastAPI +from fastapi.responses import HTMLResponse +from fastapi.staticfiles import StaticFiles + +app = FastAPI() + +# Serve static files +app.mount("/static", StaticFiles(directory="frontend"), name="static") + +# Home route +@app.get("/", response_class=HTMLResponse) +async def read_root(): + with open("frontend/index.html", "r") as f: + return f.read() + +# Dynamic routes for different dashboard pages; all pages served from the `pages` directory +@app.get("/pages/{page_name}", response_class=HTMLResponse) +async def get_page(page_name: str): + try: + with open(f"frontend/pages/{page_name}.html", "r") as f: + return f.read() + except FileNotFoundError: + return HTMLResponse(content="Page not found", status_code=404) \ No newline at end of file diff --git a/backend/requirements.txt b/backend/requirements.txt new file mode 100644 index 0000000..cafb7a6 --- /dev/null +++ b/backend/requirements.txt @@ -0,0 +1,4 @@ +fastapi==0.95.0 # FastAPI version +uvicorn==0.22.0 # ASGI server +python-multipart==0.0.6 # For form data parsing +starlette # Compatible Starlette version with FastAPI 0.95.0 \ No newline at end of file