feat: implement root endpoint and add base HTML template for improved UI

yashksaini-coder · yashksaini-coder · commit 7adc537cafc2 · 2025-02-21T01:35:16.000+05:30
diff --git a/app.py b/app.py
@@ -1,14 +1,23 @@
 # API imports
-from fastapi import FastAPI
+from fastapi import FastAPI, Request
 import groq
 import os
 from dotenv import load_dotenv
+import datetime
+import requests
+
 from fastapi.middleware.cors import CORSMiddleware
+from fastapi.responses import HTMLResponse
+from fastapi.templating import Jinja2Templates
+from pyfiglet import Figlet, FigletFont
+
+# Custom imports
 from topStocks import get_top_stocks
 from agents import multi_ai
 from agno.agent import RunResponse
-import datetime
-import requests
+
+
+templates = Jinja2Templates(directory="templates")
 
 GROQ_API_KEY = os.getenv("GROQ_API_KEY")
 groq_client = groq.Client(api_key=GROQ_API_KEY)
@@ -25,6 +34,12 @@
     allow_headers=["*"],  
 )
 
+@app.get("/")
+async def read_root(request: Request):
+    text = "Investo-glow Backend API Server"
+    return templates.TemplateResponse("base.html",{"request":request, "text": text})
+
+
 @app.get("/top-stocks")
 async def read_top_stocks():
     top_stocks = ['AAPL', 'MSFT', 'AMZN', 'GOOGL']
@@ -34,8 +49,8 @@ async def read_top_stocks():
 
 @app.get("/")
 async def read_root():
-    return {"message": "Welcome to the Investo-glow Backend API!"}
-
+    return {"Welcome to the Investo-glow Backend API!"}
+    return templates.TemplateResponse("home.html",{"request": request, "home_art": home_art})
 
 @app.get("health/")  # Changed to GET since it's retrieving status
 async def health_check():
diff --git a/templates/base.html b/templates/base.html
@@ -0,0 +1,98 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>Investo</title>
+    <link rel="preconnect" href="https://fonts.googleapis.com">
+    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
+    <link href="https://fonts.googleapis.com/css2?family=Fira+Sans+Condensed:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=JetBrains+Mono:ital,wght@0,100..800;1,100..800&family=Source+Code+Pro:ital,wght@0,200..900;1,200..900&display=swap" rel="stylesheet">
+    <style>
+        html {
+            background-color: black;
+            font-family: 'JetBrains Mono', monospace;
+            box-sizing: border-box;
+            font-size: 8px;
+            padding: 15px;
+            display: flex;
+            flex-direction: column;
+            min-height: 100vh;
+        }
+
+        *, *:before, *:after {
+            box-sizing: inherit;
+        }
+
+        pre{
+            color: rgb(41, 199, 162);
+        }
+
+        main, h1, h2, h3, h4, h5, h6, p, ol, ul {
+            font-size: 18px;
+            font-weight: normal;
+            color: white;
+            margin-bottom: 80px;
+        }
+
+        footer{
+            margin-top: 30px;
+            display: flex;
+            align-items: center;
+            justify-content: center;
+            font-size: 6px;
+            
+        }
+
+        .blinking_bar {
+            font-size: 2px;
+            color: white;
+            background-color: black;
+            padding: 3px;
+            border: 2px solid white;
+            animation: blink 1s infinite;
+            width: 2px;
+            height: 15px;
+        }
+
+        @keyframes blink {
+            0% {
+                background-color: black;
+                color: white;
+            }
+            50% {
+                background-color: white;
+                color: black;
+            }
+            100% {
+                background-color: black;
+                color: white;
+            }
+        }
+
+    </style>
+    {% block title %}
+    {% endblock %}
+</head>
+<pre>
+    {% block header %}
+    ██╗███╗   ██╗██╗   ██╗███████╗███████╗████████╗ ██████╗     ███████╗███████╗██████╗ ██╗   ██╗███████╗██████╗ 
+    ██║████╗  ██║██║   ██║██╔════╝██╔════╝╚══██╔══╝██╔═══██╗    ██╔════╝██╔════╝██╔══██╗██║   ██║██╔════╝██╔══██╗
+    ██║██╔██╗ ██║██║   ██║█████╗  ███████╗   ██║   ██║   ██║    ███████╗█████╗  ██████╔╝██║   ██║█████╗  ██████╔╝
+    ██║██║╚██╗██║╚██╗ ██╔╝██╔══╝  ╚════██║   ██║   ██║   ██║    ╚════██║██╔══╝  ██╔══██╗╚██╗ ██╔╝██╔══╝  ██╔══██╗
+    ██║██║ ╚████║ ╚████╔╝ ███████╗███████║   ██║   ╚██████╔╝    ███████║███████╗██║  ██║ ╚████╔╝ ███████╗██║  ██║
+    ╚═╝╚═╝  ╚═══╝  ╚═══╝  ╚══════╝╚══════╝   ╚═╝    ╚═════╝     ╚══════╝╚══════╝╚═╝  ╚═╝  ╚═══╝  ╚══════╝╚═╝  ╚═╝
+    {% endblock %}
+    </pre>
+<body>
+    <main>
+        {% block content %}
+        <div style="display: flex; align-items: center;">
+            <div class="blinking_bar" style="margin-right: 8px;"></div> {{text}}
+        </div>
+        {% endblock %}
+    </main>
+    <!-- <footer>
+        <p>Investo &copy; 2021</p>
+    </footer> -->
+</body>
+</html>
