PushStylechangestoVineelaGampa

backend.py

@@ -1,36 +1,60 @@
-import os
 from ast import List
+from fastapi import FastAPI, UploadFile, File, Form, HTTPException,APIRouter, Request
 from fastapi.middleware.cors import CORSMiddleware
 from pydantic import BaseModel
+from typing import Optional
+import pytesseract
+from PIL import Image
 import io
-import fitz
+import fitz  
+import base64
 import traceback
 import pandas as pd
-
-import base64
-import json
 import re
-import asyncio
-import functools
-from typing import Any, Optional
-
+import os
 import google.generativeai as genai
-from fastapi import FastAPI, UploadFile, File, Form, HTTPException, APIRouter, Request
-from fastapi.responses import JSONResponse, RedirectResponse
+from dotenv import load_dotenv
+from fastapi.responses import RedirectResponse
 from fastapi.staticfiles import StaticFiles
 import firebase_admin
 from firebase_admin import credentials, firestore
 from google.generativeai import generative_models
-from pydantic import BaseModel
+
+from api_key import GEMINI_API_KEY
+from bert import analyze_with_clinicalBert, classify_disease_and_severity, extract_non_negated_keywords, analyze_measurements, detect_past_diseases
+from disease_links import diseases as disease_links
+from disease_steps import disease_next_steps
+from disease_support import disease_doctor_specialty, disease_home_care
 from past_reports import router as reports_router, db_fetch_reports
 
-from api_key import GEMINI_API_KEY 
+model = genai.GenerativeModel('gemini-1.5-flash')
+df = pd.read_csv("measurement.csv")
+df.columns = df.columns.str.lower()
+df['measurement'] = df['measurement'].str.lower()
+
+disease_links = {"cholesterol": "https://www.webmd.com/cholesterol"}
+disease_next_steps = {"cholesterol": ["Consult a doctor for a lipid panel."]}
+disease_doctor_specialty = {"cholesterol": "Cardiologist"}
+disease_home_care = {"cholesterol": ["Maintain a healthy diet."]}
 
 app = FastAPI()
+
 api = APIRouter(prefix="/api")
 app.include_router(api)
 
-EXTRACTED_TEXT_CACHE = ""
+
+'''app.add_middleware(
+    CORSMiddleware,
+    allow_origins=[
+        "http://localhost:8002"
+        "http://localhost:9000"
+        "http://localhost:5501"
+    ],
+    allow_credentials=True,
+    allow_methods=["*"],
+    allow_headers=["*"],
+)'''
+
 
 app.mount("/app", StaticFiles(directory="web", html=True), name="web")
 app.include_router(reports_router)
@@ -46,60 +70,38 @@ app.add_middleware(
 @app.get("/")
 def root():
     return RedirectResponse(url="/app/")
+    
+EXTRACTED_TEXT_CACHE: str = ""
+
+try:
+    gemini_api_key = os.environ.get("GEMINI_API_KEY", GEMINI_API_KEY)
+    if not gemini_api_key:
+        raise ValueError("No Gemini API key found in environment or api_key.py")
+    genai.configure(api_key=gemini_api_key)
+except Exception as e:
+    raise RuntimeError(f"Failed to configure Gemini API: {e}")
+
+try:
+    cred_path = os.environ.get("FIREBASE_SERVICE_ACCOUNT_KEY_PATH", "firebase_key.json")
+    
+    if not os.path.exists(cred_path):
+        raise ValueError(
+            f"Firebase service account key not found. Looked for: {cred_path}. "
+            "Set FIREBASE_SERVICE_ACCOUNT_KEY_PATH or place firebase_key.json in project root."
+        )
 
-class AnalyzeRequest(BaseModel):
-    image_base64: str
-    prompt: Optional[str] = None
-
-GEMINI_API_KEY = os.getenv("GEMINI_API_KEY", GEMINI_API_KEY)
-
-if not GEMINI_API_KEY:
-    raise RuntimeError(
-        "No Gemini API key found. Put it in api_key.py as `GEMINI_API_KEY = '...'` or set env var GEMINI_API_KEY."
-    )
-
-genai.configure(api_key=GEMINI_API_KEY)
-
-generation_config = {
-    "temperature": 0.2,    
-    "top_p": 0.95,
-    "top_k": 40,
-    "max_output_tokens": 2048,
-}
-
-safety_settings = [
-    {"category": "HARM_CATEGORY_HARASSMENT", "threshold": "BLOCK_MEDIUM_AND_ABOVE"},
-    {"category": "HARM_CATEGORY_HATE_SPEECH", "threshold": "BLOCK_MEDIUM_AND_ABOVE"},
-    {"category": "HARM_CATEGORY_SEXUALLY_EXPLICIT", "threshold": "BLOCK_MEDIUM_AND_ABOVE"},
-    {"category": "HARM_CATEGORY_DANGEROUS_CONTENT", "threshold": "BLOCK_MEDIUM_AND_ABOVE"},
-]
+    cred = credentials.Certificate(cred_path)
+    firebase_admin.initialize_app(cred)
+    db = firestore.client()
+except Exception as e:
+    raise RuntimeError(f"Failed to configure Firebase: {e}")
 
-# --- Pydantic Models for API Endpoints ---
 class ChatRequest(BaseModel):
     user_id: Optional[str] = "anonymous"
     question: str
-    
+
 class ChatResponse(BaseModel):
     answer: str
-    
-class TextRequest(BaseModel):
-    text: str
-
-system_prompt = """ As a highly skilled medical practitioner specializing in image analysis, you are tasked with examining medical images for a renowned hospital. Your expertise is crucial in identifying any anomalies, diseases, or health issues that may be present in the images. Your responsibilities include: 
-1. Detailed Analysis: Thoroughly analyze each image, focusing on identifying any abnormal findings that may indicate underlying medical conditions. 
-2. Finding Report: Document all observed anomalies or signs of disease. Clearly articulate these findings in a structured report format, ensuring accuracy and clarity. Also include any measurement found such as trygliceride, HBa1c, and hdl levels. When presenting any found measurement, relay it in this format: {"findings": "Condition that this measurement could affect only if the value is in a risky rang: masurement type -- value with unit(current range). For example: {"findings": "Diabetes: Hba1c -- 8%(diabetic)", "ldl -- 80mg/dL(optimal)"}"
-    At the beginning of every finding, if needed try to simplify the information given in 3 words.
-3. Checking for Past: If a disease is considered family history or is a disease that the patient recovered from(anything anomoly that is historical), please mention this in severity using this format: "severity" : "severity of the anomoly (Past Anomoly but Still Under Risk)"
-4. Recommendations and Next Steps: Provide detailed recommendations based on your findings. Outline the necessary follow-up actions or additional tests required to confirm diagnoses or assess treatment options. 
-5. Treatment Suggestions: Offer preliminary treatment suggestions or interventions based on the identified conditions, collaborating with the healthcare team to develop comprehensive patient care plans. 
-6. Output Format: Your output should be a JSON array (list) of objects, each describing one disease or medical finding using the structure below: 
-[{"findings": "Description of the first disease or condition.", "severity": "MILD/SEVERE/CRITICAL", "recommendations": ["Follow-up test 1", "Follow-up test 2"], "treatment_suggestions": ["Treatment 1", "Treatment 2"], "home_care_guidance": ["Care tip 1", "Care tip 2"] }, { "findings": "Description of the second disease or condition.", "severity": "MILD/SEVERE/CRITICAL", "recommendations": ["Follow-up test A", "Follow-up test B"], "treatment_suggestions": ["Treatment A", "Treatment B"], "home_care_guidance": ["Care tip A", "Care tip B"] } ] 
-Important Notes: 
-    1. Scope of Response: Only respond if the image pertains to a human health issue. 
-    2. Clarity of Image: Ensure the image is clear and suitable for accurate analysis. 
-    3. As an AI, don't produce any output than doesn't follow this format and also remember that we need your input on the medical report for a team of renowned doctors to recheck your readings and determine AI's role in the medical industry. 
-    4. Your Insights are Invaluable: Your insights play a crucial role in guiding clinical decisions. Please proceed with your analysis, adhering to the structured approach outlined above.
-    5. Completely UPPERCASE the main concern in the finding """
 
 system_prompt_chat = """
 *** Role: Medical Guidance Facilitator
@@ -110,9 +112,7 @@ Analyze medical data, provide concise, evidence-based insights, and recommend ac
 2. Historical Context – Compare current findings with any available previous reports.
 3. Medical Q&A – Answer specific questions about the report using trusted medical sources.
 4. Specialist Matching – Recommend relevant physician specialties for identified conditions.
-5. Local Physician Recommendations – List at least two real physician or clinic options within the user-specified mile radius (include name, specialty, address, distance from user, and contact info) based on the patient’s location and clinical need.
-6. Insurance Guidance – If insurance/network information is provided, prioritize in-network physicians.
-7. Safety Protocols – Include a brief disclaimer encouraging users to verify information, confirm insurance coverage, and consult providers directly.
+5. Safety Protocols – Include a brief disclaimer encouraging users to verify information, confirm insurance coverage, and consult providers directly.
 *** Response Structure:
 Start with a direct answer to the user’s primary question (maximum 4 concise sentences, each on a new line).
 If a physician/specialist is needed, recommend at least two local providers within the requested radius (include name, specialty, address, distance, and contact info).
@@ -124,56 +124,55 @@ User Question: {user_question}
 Assistant Answer:
 """
 
-# Initialize model
-model = genai.GenerativeModel(model_name="gemini-2.5-flash-lite")
-
-async def _call_model_blocking(request_inputs, generation_cfg, safety_cfg):
-    """Run blocking model call in threadpool (so uvicorn's event loop isn't blocked)."""
-    fn = functools.partial(
-        model.generate_content,
-        request_inputs,
-        generation_config=generation_cfg,
-        safety_settings=safety_cfg,
+def extract_images_from_pdf_bytes(pdf_bytes: bytes) -> list:
+    print("***Start of Code***")
+    doc = fitz.open(stream=pdf_bytes, filetype="pdf")
+    images = []
+    for page in doc:
+        pix = page.get_pixmap()
+        buf = io.BytesIO()
+        buf.write(pix.tobytes("png"))
+        images.append(buf.getvalue())
+    return images
+
+
+def clean_ocr_text(text: str) -> str:
+    text = text.replace("\x0c", " ")
+    text = text.replace("\u00a0", " ")    
+    text = re.sub(r'(\d)\s*\.\s*(\d)', r'\1.\2', text) 
+    text = re.sub(r'\s+', ' ', text)      
+    return text.strip()
+
+def ocr_text_from_image(image_bytes: bytes) -> str:
+    base64_image = base64.b64encode(image_bytes).decode('utf-8')
+
+    image_content = {
+        'mime_type': 'image/jpeg',
+        'data': base64_image
+    }
+
+    prompt = "Could you read this document and just take all the text that is in it and just paste it back to me in text format. Open and read this document:"
+
+    response = model.generate_content(
+        [prompt, image_content]
     )
-    loop = asyncio.get_event_loop()
-    return await loop.run_in_executor(None, fn)
 
+    response_text = response.text
+    print(response_text)
 
-async def analyze_image(image_bytes: bytes, mime_type: str, prompt: Optional[str] = None) -> Any:
-    base64_img = base64.b64encode(image_bytes).decode("utf-8")
-    text_prompt = (prompt or system_prompt).strip()
-
-    request_inputs = [
-        {"inline_data": {"mime_type": mime_type, "data": base64_img}},
-        {"text": text_prompt},
-    ]
-
+    return response_text
+def get_past_reports_from_firestore(user_id: str):
     try:
-        response = await _call_model_blocking(request_inputs, generation_config, safety_settings)
+        reports_ref = db.collection('users').document(request.user_id).collection('reports')
+        docs = reports_ref.order_by('timestamp', direction=firestore.Query.DESCENDING).limit(10).stream()
+        
+        history_text = ""
+        for doc in docs:
+            report_data = doc.to_dict()
+            history_text += f"Report from {report_data.get('timestamp', 'N/A')}:\n{report_data.get('ocr_text', 'No OCR text found')}\n\n"
     except Exception as e:
-        raise RuntimeError(f"Model call failed: {e}")
-
-    text = getattr(response, "text", None)
-    if not text and isinstance(response, dict):
-        candidates = response.get("candidates") or []
-        if candidates:
-            text = candidates[0].get("content") or candidates[0].get("text")
-    if not text:
-        text = str(response)
-
-    clean = re.sub(r"```(?:json)?", "", text).strip()
-
-    try:
-        parsed = json.loads(clean)
-        return parsed
-    except json.JSONDecodeError:
-        match = re.search(r"(\[.*\]|\{.*\})", clean, re.DOTALL)
-        if match:
-            try:
-                return json.loads(match.group(1))
-            except json.JSONDecodeError:
-                return {"raw_found_json": match.group(1)}
-        return {"raw_output": clean}
+        history_text = "No past reports found for this user."
+    return history_text
 
 def get_past_reports_from_sqllite(user_id: str):
     try:
@@ -188,46 +187,156 @@ def get_past_reports_from_sqllite(user_id: str):
 
 @app.post("/chat/", response_model=ChatResponse)
 async def chat_endpoint(request: ChatRequest):
-    global result
+    """
+    Chatbot endpoint that answers questions based on the last analyzed document and user history.
+    """
+    print("Received chat request for user:", request.user_id)
+    #history_text = get_past_reports_from_firestore(request.user_id)
+    history_text = get_past_reports_from_sqllite(request.user_id)
+
+    full_document_text = EXTRACTED_TEXT_CACHE + "\n\n" + "PAST REPORTS:\n" + history_text
+
+    if not full_document_text:
+        raise HTTPException(status_code=400, detail="No past reports or current data exists for this user")
+    
+    
+   
+    
     try:
-        document_text = json.dumps(result) if result else "No parsed text available"
         full_prompt = system_prompt_chat.format(
-            document_text=document_text,
+            document_text=full_document_text,
             user_question=request.question
         )
-        data = await request.json()
-        question = data.get("question")
-        report_text = data.get("report_text")
-        user_id = data.get("user_id")
-
         response = model.generate_content(full_prompt)
         return ChatResponse(answer=response.text)
     except Exception as e:
-        raise HTTPException(status_code=500, detail=f"Chat error: {e}")
+        print(f"Gemini API error: {traceback.format_exc()}")
+        raise HTTPException(status_code=500, detail=f"An error occurred during chat response generation: {e}")
+
+@app.post("/analyze/")
+async def analyze(
+    file: UploadFile = File(...),
+    model: Optional[str] = Form("bert"),
+    mode: Optional[str] = Form(None)
+):
+    global resolution, EXTRACTED_TEXT_CACHE
+    if not file.filename:
+        raise HTTPException(status_code=400, detail="No file uploaded.")
+
+    filename = file.filename.lower()
+    detected_diseases = set()
+    ocr_full = ""
+    print("Received request for file:", filename)
+    if filename.endswith(".pdf"):
+        pdf_bytes = await file.read()
+        image_bytes_list = extract_images_from_pdf_bytes(pdf_bytes)
+    else:
+        content = await file.read()
+        image_bytes_list = [content]
+
+    for img_bytes in image_bytes_list:
+        ocr_text = ocr_text_from_image(img_bytes)
+        ocr_full += ocr_text + "\n\n"
+        ocr_full = clean_ocr_text(ocr_full)
+        print(f"CALLING OCR FULL: {ocr_full}")
+    
+    EXTRACTED_TEXT_CACHE = ocr_full
 
-@app.post("/analyze")
-async def analyze_endpoint(file: UploadFile = File(...), prompt: str = Form(None)):
-    global result
-    """
-    Upload an image file (field name `file`) and optional text `prompt`.
-    Returns parsed JSON (or raw model output if JSON couldn't be parsed).
-    """
-    contents = await file.read()  # <-- this gets the uploaded file bytes
-    mime = file.content_type or "image/png"
-    result = await analyze_image(contents, mime, prompt)
+
+    if model.lower() == "gemini":
+        return {"message": "Gemini model not available; please use BERT model."}
+
+    found_diseases = extract_non_negated_keywords(ocr_full)
+    past = detect_past_diseases(ocr_full)
+
+    for disease in found_diseases:
+        if disease in past:    
+            severity = classify_disease_and_severity(disease)
+            detected_diseases.add(((f"{disease}(detected as historical condition, but still under risk.)"), severity))
+        else:
+            severity = classify_disease_and_severity(disease)
+            detected_diseases.add((disease, severity))
+           
+        
+   
+    print("Detected diseases:", detected_diseases)
+    ranges = analyze_measurements(ocr_full, df)
+
+
+    resolution = []
+    detected_ranges = []
+    for disease, severity in detected_diseases:
+        link = disease_links.get(disease.lower(), "https://www.webmd.com/")
+        next_steps = disease_next_steps.get(disease.lower(), ["Consult a doctor."])
+        specialist = disease_doctor_specialty.get(disease.lower(), "General Practitioner")
+        home_care = disease_home_care.get(disease.lower(), [])
+
+        resolution.append({
+            "findings": disease.upper(),
+            "severity": severity,
+            "recommendations": next_steps,
+            "treatment_suggestions": f"Consult a specialist: {specialist}",
+            "home_care_guidance": home_care,
+            "info_link": link
+                      
+    })
+    
+    for i in ranges:
+        condition = i[0]
+        measurement = i[1]
+        unit = i[2]
+        severity = i[3]
+        value = i[4]
+        range_value = i[5]   # renamed to avoid overwriting Python's built-in "range"
+                    
+        link_range = disease_links.get(condition.lower(), "https://www.webmd.com/")
+        next_steps_range = disease_next_steps.get(condition.lower(), ['Consult a doctor'])
+        specialist_range = disease_doctor_specialty.get(condition.lower(), "General Practitioner")
+        home_care_range = disease_home_care.get(condition.lower(), [])
+                    
+        condition_version = condition.upper()    
+        severity_version = severity.upper()
+                
+        resolution.append({
+            "findings": f"{condition_version} -- {measurement}",
+            "severity": f"{value} {unit} - {severity_version}",
+            "recommendations": next_steps_range,
+            "treatment_suggestions": f"Consult a specialist: {specialist_range}",
+            "home_care_guidance": home_care_range,
+            "info_link": link_range
+        })
+                            
+    
+    ranges = analyze_measurements(ocr_full, df)
+    print(analyze_measurements(ocr_full, df))
+    # print ("Ranges is being printed", ranges)
+    historical_med_data = detect_past_diseases(ocr_full)
+    
+    return {
+        "ocr_text": ocr_full.strip(),
+        "Detected_Anomolies": resolution,
+    }
+
+class TextRequest(BaseModel):
+    text: str
+    
+@app.post("/analyze-text")
+async def analyze_text_endpoint(request: TextRequest):
     try:
-        result = await analyze_image(contents, mime, prompt)
+        return analyze_text(request.text)
     except Exception as e:
-        raise HTTPException(status_code=500, detail=str(e))
-    return JSONResponse(content={"Detected_Anomolies": result})
-
-@app.post("/analyze_json")
-async def analyze_json(req: AnalyzeRequest):
-    import base64
-    image_bytes = base64.b64decode(req.image_base64)
-    result = await analyze_image(image_bytes, "image/png", req.prompt)
-    return {"result": result}
-   
+        print("ERROR in /analyze-text:", traceback.format_exc())
+        raise HTTPException(status_code=500, detail=f"Error analyzing text: {str(e)}")
+    
+
+def analyze_text(text):
+    severity, disease = classify_disease_and_severity(text)
+    return {
+        "extracted_text": text,
+        "summary": f"Detected Disease: {disease}, Severity: {severity}"
+    }
+
+
 @app.get("/health/")
 def health():
     return {"response": "ok"}
@@ -238,4 +347,4 @@ def _log_routes():
     print("Mounted routes:")
     for r in app.routes:
         if isinstance(r, APIRoute):
-            print(" ", r.path, r.methods)
+            print(" ", r.path, r.methods)

web/analyzer.html

@@ -1,4 +1,4 @@
-<!DOCTYPE html>
+web/analyzer.html<!DOCTYPE html>
 <html lang="en">
   <head>
     <meta charset="UTF-8" />
@@ -6,34 +6,34 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
     <script src="https://cdn.tailwindcss.com"></script>
     <link rel="stylesheet" href="style.css" />
+   
   </head>
   <body class="bg-[var(--latte-cream)] font-sans text-gray-800 min-h-screen">
     <!-- NAVBAR -->
     <nav
       class="fixed top-0 left-0 w-full z-50 backdrop-blur-md bg-white/20 border-b border-white/30 shadow-md"
     >
-      <div class="flex items-center px-6 py-4 max-w-7xl mx-auto">
+      <div class="flex justify-between items-center w-full px-6 py-4">
+        <!-- Logo -->
         <a
           href="index.html"
           class="text-2xl font-bold text-black hover:text-[var(--tropical-indigo)] transition"
-          >CTRL + ALT + HEAL</a
         >
+          CTRL + ALT + HEAL
+        </a>
 
-        <!-- Desktop Links -->
-        <ul class="hidden md:flex space-x-6 font-medium text-gray-800 ml-auto">
-          <li><a href="index.html" class="nav-link">Home</a></li>
-          <li><a href="profile.html" class="nav-link">Profile</a></li>
+        <ul class="hidden md:flex space-x-6 font-medium text-gray-800">
+          <li><a href="index.html" class="nav-link ">Home</a></li>
+          <li><a href="profile.html" class="nav-link ">Profile</a></li>
           <li><a href="analyzer.html" class="nav-link">Analyzer</a></li>
-          <li><a href="past_data.html" class="nav-link">Past Reports</a></li>
-          <li id="authNavItem">
-            <a href="login.html" class="nav-link">Login</a>
-          </li>
+          <li><a href="past_data.html" class="nav-link ">Past Reports</a></li>
+          <li id="authNavItem"><a href="login.html" class="nav-link">Login</a></li>
         </ul>
 
         <!-- Hamburger Menu -->
         <button
           id="hamburger"
-          class="md:hidden text-[var(--latte-cream)] text-2xl ml-auto"
+          class="md:hidden text-[var(--latte-cream)] text-2xl"
         >
           ☰
         </button>
@@ -44,31 +44,75 @@
         id="mobile-menu"
         class="hidden flex-col space-y-4 bg-white/30 backdrop-blur-lg border border-white/20 rounded-xl shadow-lg mt-2 p-4 mx-6 md:hidden"
       >
-        <li><a href="index.html" class="block nav-link">Home</a></li>
-        <li><a href="analyzer.html" class="block nav-link">Analyzer</a></li>
-        <li><a href="profile.html" class="block nav-link">Profile</a></li>
-        <li><a href="login.html" class="block nav-link">Login</a></li>
-        <li><a href="about.html" class="block nav-link">About</a></li>
+        <li>
+          <a
+            href="index.html"
+            class="block text-gray-800 hover:text-[var(--tropical-indigo)]"
+            >Home</a
+          >
+        </li>
+        <li>
+          <a
+            href="analyzer.html"
+            class="block text-gray-800 hover:text-[var(--tropical-indigo)]"
+            >Analyzer</a
+          >
+        </li>
+        <li>
+          <a
+            href="profile.html"
+            class="block text-gray-800 hover:text-[var(--tropical-indigo)]"
+            >Profile</a
+          >
+        </li>
+        <li>
+          <a
+            href="login.html"
+            class="block text-gray-800 hover:text-[var(--tropical-indigo)]"
+            >Login</a
+          >
+        </li>
+        <li>
+          <a
+            href="about.html"
+            class="block text-gray-800 hover:text-[var(--tropical-indigo)]"
+            >About</a
+          >
+        </li>
+  
+          >
+        </li>
       </ul>
     </nav>
 
-    <!-- Shared helpers -->
+    <!--Shared helpers (API base + query params) -->
     <script src="script.js"></script>
     <script>
       const hamburger = document.getElementById("hamburger");
       const mobileMenu = document.getElementById("mobile-menu");
-      hamburger.addEventListener("click", () =>
-        mobileMenu.classList.toggle("hidden")
-      );
 
-      // Active page underline
+      hamburger.addEventListener("click", () => {
+        mobileMenu.classList.toggle("hidden");
+      });
+
+      // Underline the active page only
       const currentPath = window.location.pathname.split("/").pop();
+
       document.querySelectorAll(".nav-link").forEach((link) => {
-        if (link.getAttribute("href") === currentPath)
+        if (link.getAttribute("href") === currentPath) {
+          link.classList.add("active-page"); // we'll style this in CSS
+        }
+      });
+
+      document.querySelectorAll("#mobile-menu a").forEach((link) => {
+        if (link.getAttribute("href") === currentPath) {
           link.classList.add("active-page");
+        }
       });
     </script>
 
+    <!-- CHANGE MARKER TO USE THIS  -->
+    <!-- secound change marker-->
     <main class="max-w-5xl mx-auto px-4 mb-16 pt-24">
       <!-- Upload Section -->
       <div class="bg-white border border-gray-200 rounded-lg p-6 shadow mb-6">
@@ -115,54 +159,33 @@
           Findings and Recommendations will appear here.
         </div>
       </div>
-    </main>
-
-    <!-- Floating Chat Button -->
-    <button
-      id="chat-toggle"
-      class="fixed bottom-6 right-6 bg-[var(--tropical-indigo)] text-white px-5 py-3 rounded-full shadow-lg hover:scale-105 transition"
-    >
-      💬 Chat
-    </button>
 
-    <!-- Chatbot Drawer -->
-    <div
-      id="chat-drawer"
-      class="fixed top-16 right-0 w-96 max-w-full h-[calc(100%-4rem)] bg-white shadow-lg border-l border-gray-200 transform translate-x-full transition-transform duration-300 ease-in-out z-40 flex flex-col"
-    >
-      <div class="flex justify-between items-center p-4 border-b">
-        <h3 class="text-lg font-semibold">Ask Chatbot</h3>
-        <button id="chat-close" class="text-gray-600 hover:text-black text-xl">
-          ✖
-        </button>
-      </div>
-      <div id="chat-output" class="flex-1 overflow-auto p-4 space-y-2 text-sm">
-        <p><strong>Chatbot:</strong> Ask me something about your report</p>
-      </div>
-      <div class="flex gap-2 p-4 border-t">
-        <input
-          type="text"
-          id="user-question"
-          placeholder="Ask a question..."
-          class="flex-1 rounded px-3 py-2 focus:outline-none border"
-        />
-        <button id="ask-btn" class="btn-primary px-4 py-2 rounded">Ask</button>
+      <!-- Chatbot -->
+      <div
+        class="bg-[var(--latte-cream)] border border-[var(--wisteria)] rounded-lg p-6 mb-8"
+      >
+        <h3 class="text-lg font-semibold mb-3">Ask Chatbot</h3>
+        <div
+          id="chat-output"
+          class="space-y-2 h-48 overflow-auto text-sm rounded p-4"
+        >
+          <p><strong>Chatbot:</strong> Ask me something about your report</p>
+        </div>
+        <div class="flex mt-4 gap-2">
+          <input
+            type="text"
+            id="user-question"
+            placeholder="Ask a question..."
+            class="flex-1 rounded px-3 py-2 focus:outline-none"
+          />
+          <button id="ask-btn" class="btn-primary px-4 py-2 rounded">
+            Ask
+          </button>
+        </div>
       </div>
-    </div>
-
-    <script>
-      const chatDrawer = document.getElementById("chat-drawer");
-      const chatToggle = document.getElementById("chat-toggle");
-      const chatClose = document.getElementById("chat-close");
-      chatToggle.addEventListener("click", () =>
-        chatDrawer.classList.toggle("translate-x-full")
-      );
-      chatClose.addEventListener("click", () =>
-        chatDrawer.classList.add("translate-x-full")
-      );
-    </script>
+    </main>
 
-    <!-- Firebase Auth + Firestore -->
+    <!-- Firebase -->
     <script type="module">
       import {
         getFirestore,
@@ -179,12 +202,12 @@
       } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-auth.js";
 
       const firebaseConfig = {
-        apiKey: "AIzaSyAKWstCc7HqMgV8DmH2Sy6QwUP3JvZxu9g",
-        authDomain: "appchallenge-c8fe3.firebaseapp.com",
-        projectId: "appchallenge-c8fe3",
-        storageBucket: "appchallenge-c8fe3.firebasestorage.app",
-        messagingSenderId: "943791692455",
-        appId: "1:943791692455:web:ae04d06bf09669b6bdd982",
+        apiKey: "AIzaSyAPhM_Ee7cLzyKHs5zyFy8g5ZOk9-pubRI",
+        authDomain: "login-tutorial-7a9e1.firebaseapp.com",
+        projectId: "login-tutorial-7a9e1",
+        storageBucket: "login-tutorial-7a9e1.firebasestorage.app",
+        messagingSenderId: "491093197824",
+        appId: "1:491093197824:web:9f866...",
       };
 
       const app = initializeApp(firebaseConfig);
@@ -195,39 +218,47 @@
       window.firestoreDb = db;
       window.firestoreHelpers = { collection, doc, addDoc, serverTimestamp };
 
-      onAuthStateChanged(auth, (user) => {
-        const authNavItem = document.getElementById("authNavItem");
-        const profileNavDesktop = document.querySelector(
-          'ul.md\\:flex li a[href="profile.html"]'
-        )?.parentElement;
-        const pastNavDesktop = document.querySelector(
-          'ul.md\\:flex li a[href="past_data.html"]'
-        )?.parentElement;
-        const profileNavMobile = document.querySelector(
-          '#mobile-menu a[href="profile.html"]'
-        )?.parentElement;
-        const pastNavMobile = document.querySelector(
-          '#mobile-menu a[href="past_data.html"]'
-        )?.parentElement;
-
-        if (authNavItem) {
-          if (user) {
-            authNavItem.innerHTML =
-              '<button onclick="logout()" class="hover:text-[#6B9080] text-red-600">Logout</button>';
-            if (profileNavDesktop) profileNavDesktop.style.display = "block";
-            if (pastNavDesktop) pastNavDesktop.style.display = "block";
-            if (profileNavMobile) profileNavMobile.style.display = "block";
-            if (pastNavMobile) pastNavMobile.style.display = "block";
-          } else {
-            authNavItem.innerHTML =
-              '<a href="login.html" class="hover:text-[#6B9080]">Login</a>';
-            if (profileNavDesktop) profileNavDesktop.style.display = "none";
-            if (pastNavDesktop) pastNavDesktop.style.display = "none";
-            if (profileNavMobile) profileNavMobile.style.display = "none";
-            if (pastNavMobile) pastNavMobile.style.display = "none";
-          }
-        }
-      });
+    onAuthStateChanged(auth, (user) => {
+  const authNavItem = document.getElementById("authNavItem");
+
+// Desktop links
+const homeNavDesktop = document.querySelector('ul.md\\:flex li a[href="index.html"]')?.parentElement;
+const profileNavDesktop = document.querySelector('ul.md\\:flex li a[href="profile.html"]')?.parentElement;
+  const pastNavDesktop = document.querySelector('ul.md\\:flex li a[href="past_data.html"]')?.parentElement;
+
+  // Mobile links
+  const profileNavMobile = document.querySelector('#mobile-menu a[href="profile.html"]')?.parentElement;
+  const pastNavMobile = document.querySelector('#mobile-menu a[href="past_data.html"]')?.parentElement;
+  const homeNavMobile = document.querySelector('#mobile-menu a[href="index.html"]')?.parentElement;
+  if (authNavItem) {
+    if (user) {
+      authNavItem.innerHTML =
+        '<button onclick="logout()" class="hover:text-[#6B9080] text-red-600">Logout</button>';
+
+      // Hide Home
+      if (homeNavDesktop) homeNavDesktop.style.display = "none";
+      if (homeNavMobile) homeNavMobile.style.display = "none";
+            // Show Profile and Past Reports
+
+      if (profileNavDesktop) profileNavDesktop.style.display = "block";
+      if (pastNavDesktop) pastNavDesktop.style.display = "block";
+      if (profileNavMobile) profileNavMobile.style.display = "block";
+      if (pastNavMobile) pastNavMobile.style.display = "block";
+    } else {
+      authNavItem.innerHTML =
+        '<a href="login.html" class="hover:text-[#6B9080]">Login</a>';
+
+      // Show Home
+      if (homeNavDesktop) homeNavDesktop.style.display = "block";
+      if (homeNavMobile) homeNavMobile.style.display = "block";
+       // Hide Profile and Past Reports
+       if (profileNavDesktop) profileNavDesktop.style.display = "none";
+      if (pastNavDesktop) pastNavDesktop.style.display = "none";
+      if (profileNavMobile) profileNavMobile.style.display = "none";
+      if (pastNavMobile) pastNavMobile.style.display = "none";
+    }
+  }
+});
 
       window.logout = async () => {
         try {
@@ -240,7 +271,6 @@
       };
     </script>
 
-    <!-- Analyzer + Chatbot -->
     <script type="module">
       import {
         pipeline,
@@ -250,12 +280,39 @@
       const loadingEl = document.getElementById("loading");
       const textOutput = document.getElementById("text-output");
       const recsOutput = document.getElementById("recommendations-output");
-      const chat = document.getElementById("chat-output");
+      const findingsOutput = document.getElementById(
+        "detected-measurement-results"
+      );
       const authStatus = document.getElementById("auth-status");
       let extractedText = "";
       let currentUser = null;
 
-      function renderRecCard(rec, idx) {
+      document
+        .getElementById("pdf-upload")
+        .addEventListener("change", function () {
+          loadingEl.textContent = this.files.length
+            ? `File selected: ${this.files[0].name}`
+            : "No file uploaded yet.";
+        });
+
+      const saveAnalysis = async (uid, payload) => {
+        try {
+          const docRef = await firebase
+            .firestore()
+            .collection("users")
+            .doc(uid)
+            .collection("analyses")
+            .add({
+              ...payload,
+              createdAt: serverTimestamp(),
+            });
+          return docRef.id;
+        } catch (e) {
+          console.error("Failed to save analysis:", e);
+        }
+      };
+
+      const renderRecCard = (rec, idx) => {
         const sev = (rec.severity || "").toLowerCase();
         const sevClass = sev.includes("severe")
           ? "badge-high"
@@ -272,21 +329,21 @@
           </div>
           <ul class="rec-content space-y-1">
             <li><em>Recommendations:</em>
-              <ul class="list-disc list-inside ml-6">${(
-                rec.recommendations || []
-              )
-                .map((r) => `<li>${r}</li>`)
-                .join("")}</ul>
+              <ul class="list-disc list-inside ml-6">
+                ${(rec.recommendations || [])
+                  .map((r) => `<li>${r}</li>`)
+                  .join("")}
+              </ul>
             </li>
             <li><em>Treatment:</em> ${
               rec.treatment_suggestions || "Not available"
             }</li>
             <li><em>Home Care:</em>
-              <ul class="list-disc list-inside ml-6">${(
-                rec.home_care_guidance || []
-              )
-                .map((r) => `<li>${r}</li>`)
-                .join("")}</ul>
+              <ul class="list-disc list-inside ml-6">
+                ${(rec.home_care_guidance || [])
+                  .map((r) => `<li>${r}</li>`)
+                  .join("")}
+              </ul>
             </li>
             ${
               rec.info_link
@@ -294,39 +351,19 @@
                 : ""
             }
           </ul>
-        </div>`;
-      }
+        </div>
+      `;
+      };
 
       window.onAuthStateChanged(window.firebaseAuth, (user) => {
         currentUser = user;
-        authStatus.textContent = user
-          ? `Signed in as ${user.email || user.uid}`
-          : "Not signed in. Sign in to save and view past analyses.";
-      });
-
-      document
-        .getElementById("pdf-upload")
-        .addEventListener("change", function () {
-          loadingEl.textContent = this.files.length
-            ? `File selected: ${this.files[0].name}`
-            : "No file uploaded yet.";
-        });
-
-      async function postReportToBackend(report) {
-        try {
-          const response = await fetch(api("save_report/"), {
-            method: "POST",
-            headers: { "Content-Type": "application/json" },
-            body: JSON.stringify(report),
-          });
-          if (!response.ok)
-            throw new Error(`HTTP error! status: ${response.status}`);
-          const data = await response.json();
-          console.log("Report sent to backend:", data);
-        } catch (error) {
-          console.error("Error sending report:", error);
+        if (user) {
+          authStatus.textContent = `Signed in as ${user.email || user.uid}`;
+        } else {
+          authStatus.textContent =
+            "Not signed in. Sign in to save and view past analyses.";
         }
-      }
+      });
 
       document
         .getElementById("analyze-btn")
@@ -367,59 +404,112 @@
             : data.Detected_Anomolies
             ? [data.Detected_Anomolies]
             : [];
-          recsOutput.innerHTML = recs.length
-            ? recs.map(renderRecCard).join("")
-            : "No recommendations found.";
+          if (data.Detected_Anomolies) {
+            recsOutput.innerHTML = recs
+              .map((rec, i) => renderRecCard(rec, i))
+              .join("");
+          } else {
+            recsOutput.textContent = "No recommendations found.";
+          }
+
+          const findings = Array.isArray(data.Detected_Measurement_Values)
+            ? data.Detected_Measurement_Values
+            : data.Detected_Measurement_Values
+            ? [data.Detected_Measurement_Values]
+            : [];
+          if (data.Detected_Measurement_Values) {
+            findingsOutput.innerHTML = findings
+              .map((finding, i) => renderRecCard(finding, i))
+              .join("");
+          } 
 
           if (currentUser) {
+            /*await saveAnalysis(currentUser.uid, {
+              reportDate: date,
+              ocr_text: extractedText,
+              resolutions: recs,
+              measurements: findings,
+            });*/
             await postReportToBackend({
               user_id: currentUser.email,
               report_date: new Date(),
               ocr_text: extractedText,
               anomalies: JSON.stringify(recs),
+              measurements: JSON.stringify(findings),
             });
           }
+
           loadingEl.textContent = "Analysis complete.";
         });
 
-      document.getElementById("ask-btn").onclick = async () => {
-        const q = document.getElementById("user-question").value.trim();
-        if (!q) return;
-        if (!extractedText) {
-          alert("Please analyze a document first.");
-          return;
-        }
-
-        chat.innerHTML += `<p><strong>You:</strong> ${q}</p>`;
-        chat.innerHTML += `<p><strong>Chatbot:</strong> <em>Thinking...</em></p>`;
-        chat.scrollTop = chat.scrollHeight;
-
-        try {
-          const res = await fetch(api("chat/"), {
-            method: "POST",
-            headers: { "Content-Type": "application/json" },
-            body: JSON.stringify({
-              question: q,
-              user_id: currentUser ? currentUser.uid : "anonymous",
-            }),
-          });
-          if (!res.ok) throw new Error(await res.text());
-          const data = await res.json();
-          const last = chat.querySelectorAll("p");
-          last[
-            last.length - 1
-          ].innerHTML = `<strong>Chatbot:</strong> ${data.answer}`;
-        } catch (err) {
-          console.error("Error:", err);
-          const last = chat.querySelectorAll("p");
-          last[
-            last.length - 1
-          ].innerHTML = `<strong>Chatbot:</strong> Sorry, error: ${err.message}`;
+        async function postReportToBackend(report) {
+          try {
+            const response = await fetch(api('save_report/'), {
+              method: 'POST',
+              headers: {
+                'Content-Type': 'application/json',
+              },
+              body: JSON.stringify(report),
+            });
+            if (!response.ok) {
+              throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            const data = await response.json();
+            console.log('Report successfully sent to backend:', data);
+          } catch (error) {
+            console.error('Error sending report to backend:', error);
+          }
         }
 
-        document.getElementById("user-question").value = "";
-        chat.scrollTop = chat.scrollHeight;
-      };
+        document.getElementById("ask-btn").onclick = async () => {
+          const q = document.getElementById("user-question").value.trim();
+          if (!q) return;
+          
+          if (!extractedText) {
+            alert("Please analyze a document first before asking questions.");
+            return;
+          }
+          
+          const chat = document.getElementById("chat-output");
+          chat.innerHTML += `<p><strong>You:</strong> ${q}</p>`;
+          chat.scrollTop = chat.scrollHeight;
+          
+          chat.innerHTML += `<p><strong>Chatbot:</strong> <em>Thinking...</em></p>`;
+          chat.scrollTop = chat.scrollHeight;
+          
+          try {
+            const response = await fetch(api('chat/'), {
+              method: "POST",
+              headers: {
+                "Content-Type": "application/json",
+              },
+              body: JSON.stringify({
+                question: q,
+                user_id: currentUser ? currentUser.uid : "anonymous"
+              }),
+            });
+            
+            if (!response.ok) {
+              throw new Error(`HTTP error! status: ${response.status}`);
+            }
+            
+            const data = await response.json();
+            
+            //now addign acctual reposnse
+            const messages = chat.querySelectorAll('p');
+            const lastMessage = messages[messages.length - 1];
+            lastMessage.innerHTML = `<strong>Chatbot:</strong> ${data.answer}`;
+            
+          } catch (error) {
+            console.error("Error:", error);
+            const messages = chat.querySelectorAll('p');
+            const lastMessage = messages[messages.length - 1];
+            lastMessage.innerHTML = `<strong>Chatbot:</strong> Sorry, I encountered an error: ${error.message}`;
+          }
+          
+          document.getElementById("user-question").value = "";
+          chat.scrollTop = chat.scrollHeight;
+        };
     </script>
   </body>
-</html>
+</html> 

web/analyzer_update.html

@@ -1,472 +0,0 @@
-<!DOCTYPE html>
-<html lang="en">
-  <head>
-    <meta charset="UTF-8" />
-    <title>Document Analyzer | CTRL + ALT + HEAL</title>
-    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <script src="https://cdn.tailwindcss.com"></script>
-    <link rel="stylesheet" href="style.css" />
-  </head>
-  <body class="bg-[var(--latte-cream)] font-sans text-gray-800 min-h-screen">
-    <!-- NAVBAR -->
-    <nav
-      class="fixed top-0 left-0 w-full z-50 backdrop-blur-md bg-white/20 border-b border-white/30 shadow-md"
-    >
-      <div class="flex items-center px-6 py-4 max-w-7xl mx-auto">
-        <a
-          href="index.html"
-          class="text-2xl font-bold text-black hover:text-[var(--tropical-indigo)] transition"
-        >
-          CTRL + ALT + HEAL
-        </a>
-
-        <!-- Desktop Links -->
-        <ul class="hidden md:flex space-x-6 font-medium text-gray-800 ml-auto">
-          <li><a href="index.html" class="nav-link">Home</a></li>
-          <li><a href="profile.html" class="nav-link">Profile</a></li>
-          <li><a href="analyzer.html" class="nav-link">Analyzer</a></li>
-          <li><a href="past_data.html" class="nav-link">Past Reports</a></li>
-          <li id="authNavItem">
-            <a href="login.html" class="nav-link">Login</a>
-          </li>
-        </ul>
-
-        <!-- Hamburger Menu -->
-        <button
-          id="hamburger"
-          class="md:hidden text-[var(--latte-cream)] text-2xl ml-auto"
-        >
-          ☰
-        </button>
-      </div>
-
-      <!-- Mobile Menu -->
-      <ul
-        id="mobile-menu"
-        class="hidden flex-col space-y-4 bg-white/30 backdrop-blur-lg border border-white/20 rounded-xl shadow-lg mt-2 p-4 mx-6 md:hidden"
-      >
-        <li><a href="index.html" class="block nav-link">Home</a></li>
-        <li><a href="analyzer.html" class="block nav-link">Analyzer</a></li>
-        <li><a href="profile.html" class="block nav-link">Profile</a></li>
-        <li><a href="login.html" class="block nav-link">Login</a></li>
-        <li><a href="about.html" class="block nav-link">About</a></li>
-      </ul>
-    </nav>
-
-    <script src="script.js"></script>
-    <script>
-      const hamburger = document.getElementById("hamburger");
-      const mobileMenu = document.getElementById("mobile-menu");
-      hamburger.addEventListener("click", () =>
-        mobileMenu.classList.toggle("hidden")
-      );
-
-      const currentPath = window.location.pathname.split("/").pop();
-      document.querySelectorAll(".nav-link").forEach((link) => {
-        if (link.getAttribute("href") === currentPath)
-          link.classList.add("active-page");
-      });
-    </script>
-
-    <main class="max-w-5xl mx-auto px-4 mb-16 pt-24">
-      <div class="bg-white border border-gray-200 rounded-lg p-6 shadow mb-6">
-        <h2 class="text-xl font-semibold mb-4">
-          Upload & Analyze Your Medical PDF or Image
-        </h2>
-        <input
-          type="file"
-          id="pdf-upload"
-          accept=".pdf, image/*"
-          class="w-full mb-4 rounded px-3 py-2"
-        />
-        <button id="analyze-btn" class="btn-primary px-4 py-2 rounded">
-          Analyze with AI
-        </button>
-        <p id="loading" class="text-gray-600 mt-2">No file uploaded yet.</p>
-        <p id="auth-status" class="text-sm text-gray-500 mt-1">
-          Sign in to save and view past analyses.
-        </p>
-      </div>
-
-      <div
-        class="bg-[var(--latte-cream)] border border-[var(--wisteria)] rounded-lg p-6 mb-8"
-      >
-        <h3 class="text-lg font-semibold mb-3">Extracted Text</h3>
-        <div
-          id="text-output"
-          class="whitespace-pre-wrap h-60 overflow-auto bg-[#FAFBFC] text-sm border border-[var(--wisteria)] rounded p-4"
-        >
-          OCR results will appear here.
-        </div>
-      </div>
-
-      <div
-        class="bg-[var(--latte-cream)] border border-[var(--wisteria)] rounded-lg p-6 mb-8"
-      >
-        <h3 class="text-lg font-semibold mb-3">AI Findings</h3>
-        <div
-          id="recommendations-output"
-          class="bg-[#F9FAFB] text-sm border border-[var(--wisteria)] rounded p-4 space-y-4"
-        >
-          Findings and Recommendations will appear here.
-        </div>
-      </div>
-    </main>
-
-    <button
-      id="chat-toggle"
-      class="fixed bottom-6 right-6 bg-[var(--tropical-indigo)] text-white px-5 py-3 rounded-full shadow-lg hover:scale-105 transition"
-    >
-      💬 Chat
-    </button>
-
-    <div
-      id="chat-drawer"
-      class="fixed top-16 right-0 w-96 max-w-full h-[calc(100%-4rem)] bg-white shadow-lg border-l border-gray-200 transform translate-x-full transition-transform duration-300 ease-in-out z-40 flex flex-col"
-    >
-      <div class="flex justify-between items-center p-4 border-b">
-        <h3 class="text-lg font-semibold">Ask Chatbot</h3>
-        <button id="chat-close" class="text-gray-600 hover:text-black text-xl">
-          ✖
-        </button>
-      </div>
-      <div id="chat-output" class="flex-1 overflow-auto p-4 space-y-2 text-sm">
-        <p><strong>Chatbot:</strong> Ask me something about your report</p>
-      </div>
-      <div class="flex gap-2 p-4 border-t">
-        <input
-          type="text"
-          id="user-question"
-          placeholder="Ask a question..."
-          class="flex-1 rounded px-3 py-2 focus:outline-none border"
-        />
-        <button id="ask-btn" class="btn-primary px-4 py-2 rounded">Ask</button>
-      </div>
-    </div>
-
-    <script>
-      const chatDrawer = document.getElementById("chat-drawer");
-      const chatToggle = document.getElementById("chat-toggle");
-      const chatClose = document.getElementById("chat-close");
-      chatToggle.addEventListener("click", () =>
-        chatDrawer.classList.toggle("translate-x-full")
-      );
-      chatClose.addEventListener("click", () =>
-        chatDrawer.classList.add("translate-x-full")
-      );
-    </script>
-
-    <script type="module">
-      import {
-        getFirestore,
-        collection,
-        doc,
-        addDoc,
-        setDoc,
-        getDoc,
-        serverTimestamp,
-      } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";
-      import { initializeApp } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-app.js";
-      import {
-        getAuth,
-        onAuthStateChanged,
-        signOut,
-      } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-auth.js";
-
-      const firebaseConfig = {
-        apiKey: "AIzaSyAKWstCc7HqMgV8DmH2Sy6QwUP3JvZxu9g",
-        authDomain: "appchallenge-c8fe3.firebaseapp.com",
-        projectId: "appchallenge-c8fe3",
-        storageBucket: "appchallenge-c8fe3.firebasestorage.app",
-        messagingSenderId: "943791692455",
-        appId: "1:943791692455:web:ae04d06bf09669b6bdd982",
-      };
-
-      const app = initializeApp(firebaseConfig);
-      const auth = getAuth(app);
-      const db = getFirestore(app);
-      window.firebaseAuth = auth;
-      window.firestoreDb = db;
-      window.firestoreHelpers = {
-        collection,
-        doc,
-        addDoc,
-        setDoc,
-        getDoc,
-        serverTimestamp,
-      };
-
-      let currentUser = null;
-
-      window.onAuthStateChanged(auth, (user) => {
-        currentUser = user;
-        const authNavItem = document.getElementById("authNavItem");
-        const profileNavDesktop = document.querySelector(
-          'ul.md\\:flex li a[href="profile.html"]'
-        )?.parentElement;
-        const pastNavDesktop = document.querySelector(
-          'ul.md\\:flex li a[href="past_data.html"]'
-        )?.parentElement;
-        const profileNavMobile = document.querySelector(
-          '#mobile-menu a[href="profile.html"]'
-        )?.parentElement;
-        const pastNavMobile = document.querySelector(
-          '#mobile-menu a[href="past_data.html"]'
-        )?.parentElement;
-
-        if (authNavItem) {
-          if (user) {
-            authNavItem.innerHTML =
-              '<button onclick="logout()" class="hover:text-[#6B9080] text-red-600">Logout</button>';
-            if (profileNavDesktop) profileNavDesktop.style.display = "block";
-            if (pastNavDesktop) pastNavDesktop.style.display = "block";
-            if (profileNavMobile) profileNavMobile.style.display = "block";
-            if (pastNavMobile) pastNavMobile.style.display = "block";
-          } else {
-            authNavItem.innerHTML =
-              '<a href="login.html" class="hover:text-[#6B9080]">Login</a>';
-            if (profileNavDesktop) profileNavDesktop.style.display = "none";
-            if (pastNavDesktop) pastNavDesktop.style.display = "none";
-            if (profileNavMobile) profileNavMobile.style.display = "none";
-            if (pastNavMobile) pastNavMobile.style.display = "none";
-          }
-        }
-      });
-
-      window.logout = async () => {
-        try {
-          await signOut(auth);
-          localStorage.clear();
-          window.location.href = "login.html";
-        } catch (error) {
-          console.error("Error signing out:", error);
-        }
-      };
-
-      // ---------------------- Analyzer ----------------------
-      const loadingEl = document.getElementById("loading");
-      const textOutput = document.getElementById("text-output");
-      const recsOutput = document.getElementById("recommendations-output");
-      const chat = document.getElementById("chat-output");
-      const authStatus = document.getElementById("auth-status");
-      let extractedText = "";
-
-      function renderRecCard(rec, idx) {
-        const sev = (rec.severity || "").toLowerCase();
-        const sevClass = sev.includes("severe")
-          ? "badge-high"
-          : sev.includes("moderate")
-          ? "badge-medium"
-          : "badge-low";
-        return `
-          <div class="rec-card">
-            <div class="flex items-center justify-between">
-              <h4 class="rec-title">Finding ${idx + 1}: ${
-          rec.findings || "N/A"
-        }</h4>
-              <span class="rec-badge ${sevClass}">${rec.severity || "—"}</span>
-            </div>
-            <ul class="rec-content space-y-1">
-              <li><em>Recommendations:</em>
-                <ul class="list-disc list-inside ml-6">${(
-                  rec.recommendations || []
-                )
-                  .map((r) => `<li>${r}</li>`)
-                  .join("")}</ul>
-              </li>
-              <li><em>Treatment:</em> ${
-                rec.treatment_suggestions || "Not available"
-              }</li>
-              <li><em>Home Care:</em>
-                <ul class="list-disc list-inside ml-6">${(
-                  rec.home_care_guidance || []
-                )
-                  .map((r) => `<li>${r}</li>`)
-                  .join("")}</ul>
-              </li>
-              ${
-                rec.info_link
-                  ? `<li><a href="${rec.info_link}" target="_blank" class="rec-link">Learn more</a></li>`
-                  : ""
-              }
-            </ul>
-          </div>`;
-      }
-
-      window.onAuthStateChanged(auth, (user) => {
-        currentUser = user;
-        authStatus.textContent = user
-          ? `Signed in as ${user.email || user.uid}`
-          : "Not signed in. Sign in to save and view past analyses.";
-      });
-
-      document
-        .getElementById("pdf-upload")
-        .addEventListener("change", function () {
-          loadingEl.textContent = this.files.length
-            ? `File selected: ${this.files[0].name}`
-            : "No file uploaded yet.";
-        });
-
-      async function postReportToBackend(report) {
-        try {
-          const response = await fetch(api("save_report/"), {
-            method: "POST",
-            headers: { "Content-Type": "application/json" },
-            body: JSON.stringify(report),
-          });
-          if (!response.ok)
-            throw new Error(`HTTP error! status: ${response.status}`);
-          const data = await response.json();
-          console.log("Report sent to backend:", data);
-        } catch (error) {
-          console.error("Error sending report:", error);
-        }
-      }
-
-      // -------- New: Save Latest Test Results with Smart Update --------
-      async function saveLatestResults(csvData) {
-        if (!currentUser) return;
-
-        try {
-          const docRef = doc(db, "latest_test_results", currentUser.email);
-          const docSnap = await getDoc(docRef);
-          let results = [];
-
-          if (docSnap.exists()) {
-            results = docSnap.data().results || [];
-          }
-
-          csvData.forEach((row) => {
-            const idx = results.findIndex((r) => r.condition === row.Condition);
-            if (idx >= 0) {
-              results[idx].test_result = row["Test Result"];
-              results[idx].unit = row.Unit;
-            } else {
-              results.push({
-                condition: row.Condition,
-                test_result: row["Test Result"],
-                unit: row.Unit,
-              });
-            }
-          });
-
-          await setDoc(docRef, {
-            user_id: currentUser.email,
-            report_date: serverTimestamp(),
-            results: results,
-          });
-
-          console.log("Latest test results updated with smart merge!");
-        } catch (err) {
-          console.error("Error saving latest results:", err);
-        }
-      }
-
-      document
-        .getElementById("analyze-btn")
-        .addEventListener("click", async () => {
-          const file = document.getElementById("pdf-upload").files[0];
-          if (!file) {
-            loadingEl.textContent = "Please upload a file first.";
-            return;
-          }
-
-          loadingEl.textContent = "Processing with AI...";
-          textOutput.textContent = "";
-          recsOutput.textContent = "";
-
-          const formData = new FormData();
-          formData.append("file", file);
-          formData.append("model", "bert");
-
-          let data;
-          try {
-            const res = await fetch(api("analyze/"), {
-              method: "POST",
-              body: formData,
-            });
-            if (!res.ok) throw new Error(await res.text());
-            data = await res.json();
-          } catch (err) {
-            console.error(err);
-            loadingEl.textContent = "Error during analysis: " + err.message;
-            return;
-          }
-
-          extractedText = data.ocr_text || "";
-          textOutput.textContent = extractedText;
-
-          const recs = Array.isArray(data.Detected_Anomolies)
-            ? data.Detected_Anomolies
-            : data.Detected_Anomolies
-            ? [data.Detected_Anomolies]
-            : [];
-
-          recsOutput.innerHTML = recs.length
-            ? recs.map(renderRecCard).join("")
-            : "No recommendations found.";
-
-          if (currentUser) {
-            await postReportToBackend({
-              user_id: currentUser.email,
-              report_date: new Date(),
-              ocr_text: extractedText,
-              anomalies: JSON.stringify(recs),
-            });
-          }
-
-          if (currentUser && recs.length) {
-            const csvData = recs.map((rec) => ({
-              User: currentUser.email,
-              Condition: rec.findings || "N/A",
-              "Test Result": rec.test_result || "N/A",
-              Unit: rec.unit || "",
-            }));
-            saveLatestResults(csvData);
-          }
-
-          loadingEl.textContent = "Analysis complete.";
-        });
-
-      // ---------------------- Chatbot ----------------------
-      document.getElementById("ask-btn").onclick = async () => {
-        const q = document.getElementById("user-question").value.trim();
-        if (!q) return;
-        if (!extractedText) {
-          alert("Please analyze a document first.");
-          return;
-        }
-        chat.innerHTML += `<p><strong>You:</strong> ${q}</p>`;
-        chat.innerHTML += `<p><strong>Chatbot:</strong> <em>Thinking...</em></p>`;
-        chat.scrollTop = chat.scrollHeight;
-
-        try {
-          const res = await fetch(api("chat/"), {
-            method: "POST",
-            headers: { "Content-Type": "application/json" },
-            body: JSON.stringify({
-              question: q,
-              user_id: currentUser ? currentUser.uid : "anonymous",
-            }),
-          });
-          if (!res.ok) throw new Error(await res.text());
-          const data = await res.json();
-          const last = chat.querySelectorAll("p");
-          last[
-            last.length - 1
-          ].innerHTML = `<strong>Chatbot:</strong> ${data.answer}`;
-        } catch (err) {
-          console.error("Error:", err);
-          const last = chat.querySelectorAll("p");
-          last[
-            last.length - 1
-          ].innerHTML = `<strong>Chatbot:</strong> Sorry, error: ${err.message}`;
-        }
-
-        document.getElementById("user-question").value = "";
-        chat.scrollTop = chat.scrollHeight;
-      };
-    </script>
-  </body>
-</html>

web/past_data.html

@@ -98,50 +98,6 @@
         </div>
       </div>
     </main>
-     <!-- Floating Chat Button -->
-     <button
-     id="chat-toggle"
-     class="fixed bottom-6 right-6 bg-[var(--tropical-indigo)] text-white px-5 py-3 rounded-full shadow-lg hover:scale-105 transition"
-   >
-     💬 Chat
-   </button>
-
-   <!-- Chatbot Drawer -->
-   <div
-     id="chat-drawer"
-     class="fixed top-16 right-0 w-96 max-w-full h-[calc(100%-4rem)] bg-white shadow-lg border-l border-gray-200 transform translate-x-full transition-transform duration-300 ease-in-out z-40 flex flex-col"
-   >
-     <div class="flex justify-between items-center p-4 border-b">
-       <h3 class="text-lg font-semibold">Ask Chatbot</h3>
-       <button id="chat-close" class="text-gray-600 hover:text-black text-xl">
-         ✖
-       </button>
-     </div>
-     <div id="chat-output" class="flex-1 overflow-auto p-4 space-y-2 text-sm">
-       <p><strong>Chatbot:</strong> Ask me something about your report</p>
-     </div>
-     <div class="flex gap-2 p-4 border-t">
-       <input
-         type="text"
-         id="user-question"
-         placeholder="Ask a question..."
-         class="flex-1 rounded px-3 py-2 focus:outline-none border"
-       />
-       <button id="ask-btn" class="btn-primary px-4 py-2 rounded">Ask</button>
-     </div>
-   </div>
-
-   <script>
-    const chatDrawer = document.getElementById("chat-drawer");
-    const chatToggle = document.getElementById("chat-toggle");
-    const chatClose = document.getElementById("chat-close");
-    chatToggle.addEventListener("click", () =>
-      chatDrawer.classList.toggle("translate-x-full")
-    );
-    chatClose.addEventListener("click", () =>
-      chatDrawer.classList.add("translate-x-full")
-    );
-  </script>
 
     <script type="module">
       import {

web/profile.html

@@ -5,31 +5,32 @@
     <meta name="viewport" content="width=device-width,initial-scale=1" />
     <title>Profile - CTRL + ALT + HEAL</title>
     <script src="https://cdn.tailwindcss.com"></script>
+    <script src="https://cdn.jsdelivr.net/npm/chart.js"></script>
     <link rel="stylesheet" href="style.css" />
   </head>
   <body class="bg-[#F7F8F9] min-h-screen">
-    <!-- NAVBAR -->
+   <!-- NAVBAR -->
     <nav
       class="fixed top-0 left-0 w-full z-50 backdrop-blur-md bg-white/20 border-b border-white/30 shadow-md"
     >
       <div class="flex justify-between items-center w-full px-6 py-4">
+        <!-- Logo -->
         <a
           href="index.html"
           class="text-2xl font-bold text-black hover:text-[var(--tropical-indigo)] transition"
         >
           CTRL + ALT + HEAL
         </a>
+
         <ul class="hidden md:flex space-x-6 font-medium text-gray-800">
-          <li>
-            <a href="index.html" class="nav-link" style="display: none">Home</a>
-          </li>
+          <li><a href="index.html" class="nav-link" style="display:none;">Home</a></li>
           <li><a href="profile.html" class="nav-link">Profile</a></li>
           <li><a href="analyzer.html" class="nav-link">Analyzer</a></li>
           <li><a href="past_data.html" class="nav-link">Past Reports</a></li>
-          <li id="authNavItem">
-            <a href="login.html" class="nav-link">Login</a>
-          </li>
+          <li id="authNavItem"><a href="login.html" class="nav-link">Login</a></li>
         </ul>
+
+        <!-- Hamburger Menu -->
         <button
           id="hamburger"
           class="md:hidden text-[var(--latte-cream)] text-2xl"
@@ -37,6 +38,8 @@
           ☰
         </button>
       </div>
+<!-- Changes added for change marker for style change-->
+      <!-- Mobile Menu -->
       <ul
         id="mobile-menu"
         class="hidden flex-col space-y-4 bg-white/30 backdrop-blur-lg border border-white/20 rounded-xl shadow-lg mt-2 p-4 mx-6 md:hidden"
@@ -76,109 +79,141 @@
             >About</a
           >
         </li>
+  
+          >
+        </li>
       </ul>
     </nav>
 
     <script>
       const hamburger = document.getElementById("hamburger");
       const mobileMenu = document.getElementById("mobile-menu");
-      hamburger.addEventListener("click", () =>
-        mobileMenu.classList.toggle("hidden")
-      );
-
+      hamburger.addEventListener("click", () => {
+        mobileMenu.classList.toggle("hidden");
+      });
+      // Underline the active page only
       const currentPath = window.location.pathname.split("/").pop();
       document.querySelectorAll(".nav-link").forEach((link) => {
-        if (link.getAttribute("href") === currentPath)
-          link.classList.add("active-page");
+        if (link.getAttribute("href") === currentPath) {
+          link.classList.add("active-page"); // we'll style this in CSS
+        }
       });
       document.querySelectorAll("#mobile-menu a").forEach((link) => {
-        if (link.getAttribute("href") === currentPath)
+        if (link.getAttribute("href") === currentPath) {
           link.classList.add("active-page");
+        }
       });
     </script>
 
     <div class="container mx-auto px-6 pt-24">
       <div class="bg-white border border-gray-200 rounded-lg p-6 shadow mb-6">
-        <!-- PROFILE VIEW -->
-        <div id="profileViewSection">
-          <div class="flex items-start space-x-6 mb-10">
-            <div class="flex flex-col items-center">
-              <div class="w-32 h-32 bg-gray-300 rounded-full"></div>
-              <button id="editProfileBtn" class="mt-2 px-4 py-2 rounded">
-                Edit Profile
-              </button>
-              <a href="analyzer.html">
-                <button id="analyzerBtn" class="mt-2 px-4 py-2 rounded">
-                  Go To Analyzer
-                </button>
-              </a>
-            </div>
-            <div>
-              <h2 class="text-xl font-semibold mb-4">Your Profile</h2>
-              <p class="mb-2">
-                Name: <span id="userName" class="font-medium">Loading...</span>
-              </p>
-              <p class="mb-2">
-                DOB: <span id="userDOB" class="font-medium">Loading...</span>
-              </p>
-            </div>
+      <!-- VIEW MODE -->
+      <div id="profileViewSection">
+        <div class="flex items-start space-x-6 mb-10">
+          <!-- Avatar & Edit Button -->
+          <div class="flex flex-col items-center">
+            <div class="w-32 h-32 bg-gray-300 rounded-full"></div>
+            <button id="editProfileBtn" class="mt-2 px-4 py-2 rounded">
+              Edit Profile
+            </button>
+            <a href="analyzer.html"
+              ><button id="analyzerBtn" class="mt-2 px-4 py-2 rounded">
+                Go To Analyzer
+              </button></a
+            >
+          </div>
+
+          <!-- User Info -->
+          <div>
+            <h2 class="text-xl font-semibold mb-4">Your Profile</h2>
+            <p class="mb-2">
+              Name: <span id="userName" class="font-medium">Loading...</span>
+            </p>
+            <p class="mb-2">
+              DOB: <span id="userDOB" class="font-medium">Loading...</span>
+            </p>
           </div>
         </div>
+      </div>
 
-        <!-- PROFILE EDIT -->
-        <div id="profileEditSection" class="hidden mb-10">
-          <div class="flex flex-col sm:flex-row items-start space-x-6">
-            <div class="flex flex-col items-center mb-4 sm:mb-0">
-              <div class="w-32 h-32 bg-gray-300 rounded-full"></div>
-            </div>
-            <div class="flex-1">
-              <h1 class="text-3xl font-semibold mb-4">Edit Profile</h1>
-              <div class="space-y-4">
-                <div>
-                  <label for="inputName" class="block text-sm font-medium"
-                    >Name</label
-                  >
-                  <input
-                    type="text"
-                    id="inputName"
-                    class="w-full border rounded px-3 py-2 focus:ring-2 focus:ring-[#6B9080] focus:outline-none"
-                  />
-                </div>
-                <div>
-                  <label for="inputDOB" class="block text-sm font-medium"
-                    >Date of Birth</label
-                  >
-                  <input
-                    type="date"
-                    id="inputDOB"
-                    class="w-full border rounded px-3 py-2 focus:ring-2 focus:ring-[#6B9080] focus:outline-none"
-                  />
-                </div>
+      <!-- EDIT MODE -->
+      <div id="profileEditSection" class="hidden mb-10">
+        <div class="flex flex-col sm:flex-row items-start space-x-6">
+          <div class="flex flex-col items-center mb-4 sm:mb-0">
+            <div class="w-32 h-32 bg-gray-300 rounded-full"></div>
+          </div>
+          <div class="flex-1">
+            <h1 class="text-3xl font-semibold mb-4">Edit Profile</h1>
+            <div class="space-y-4">
+              <div>
+                <label for="inputName" class="block text-sm font-medium"
+                  >Name</label
+                >
+                <input
+                  type="text"
+                  id="inputName"
+                  class="w-full border rounded px-3 py-2 focus:ring-2 focus:ring-[#6B9080] focus:outline-none"
+                />
               </div>
-              <div class="flex space-x-2 mt-4">
-                <button id="saveProfileBtn" class="px-4 py-2 rounded">
-                  Save
-                </button>
-                <button id="cancelProfileBtn" class="px-4 py-2 rounded">
-                  Cancel
-                </button>
+              <div>
+                <label for="inputDOB" class="block text-sm font-medium"
+                  >Date of Birth</label
+                >
+                <input
+                  type="date"
+                  id="inputDOB"
+                  class="w-full border rounded px-3 py-2 focus:ring-2 focus:ring-[#6B9080] focus:outline-none"
+                />
               </div>
             </div>
+            <div class="flex space-x-2 mt-4">
+              <button id="saveProfileBtn" class="px-4 py-2 rounded">
+                Save
+              </button>
+              <button id="cancelProfileBtn" class="px-4 py-2 rounded">
+                Cancel
+              </button>
+            </div>
           </div>
         </div>
+      </div>
+    </div>
 
-        <!-- RANGE BARS -->
-        <h2 class="text-xl font-semibold mb-4">Your Current Health Summary</h2>
-        <div class="tabs">
-          <div class="tab active" data-tab="out-range">
-            Out of Range <span class="count-badge">0</span>
+      <!-- Chart Section -->
+      <div class="mt-10" id="chartSection">
+        <div class="bg-white border border-gray-200 rounded-lg p-6 mb-6">
+          <h2 class="text-xl font-semibold mb-4">Health Progress</h2>
+          <div
+            class="flex flex-col sm:flex-row sm:items-center sm:justify-between gap-4 mb-6"
+          >
+            <div class="flex flex-1 gap-2">
+              <input
+                type="date"
+                id="entryDate"
+                class="flex-1 border rounded px-3 py-2 focus:ring-2 focus:ring-[#6B9080] focus:outline-none"
+              />
+              <input
+                type="number"
+                id="entryScore"
+                min="0"
+                max="100"
+                placeholder="Score"
+                class="w-24 border rounded px-3 py-2 focus:ring-2 focus:ring-[#6B9080] focus:outline-none"
+              />
+            </div>
+            <div class="flex gap-2">
+              <button id="addEntryBtn" class="px-4 py-2 rounded">
+                Add Entry
+              </button>
+              <button id="resetChartBtn" class="px-4 py-2 rounded">
+                Reset Chart
+              </button>
+            </div>
           </div>
-          <div class="tab" data-tab="in-range">
-            In Range <span class="count-badge">0</span>
+          <div class="overflow-x-auto">
+            <canvas id="progressChart" class="w-full h-64"></canvas>
           </div>
         </div>
-        <div class="tab-content active" id="out-range"></div>
-        <div class="tab-content" id="in-range"></div>
       </div>
     </div>
 
@@ -194,47 +229,74 @@
         doc,
         getDoc,
         updateDoc,
+        collection,
+        addDoc,
+        serverTimestamp,
       } from "https://www.gstatic.com/firebasejs/9.22.0/firebase-firestore.js";
-
+    
+      // 🔥 Firebase config
       const firebaseConfig = {
-        apiKey: "AIzaSyAKWstCc7HqMgV8DmH2Sy6QwUP3JvZxu9g",
-        authDomain: "appchallenge-c8fe3.firebaseapp.com",
-        projectId: "appchallenge-c8fe3",
-        storageBucket: "appchallenge-c8fe3.firebasestorage.app",
-        messagingSenderId: "943791692455",
-        appId: "1:943791692455:web:ae04d06bf09669b6bdd982",
-        measurementId: "G-HJ7EHW8V4N",
+        apiKey: "AIzaSyAPhM_Ee7cLzyKHs5zyFy8g5ZOk9-pubRI",
+        authDomain: "login-tutorial-7a9e1.firebaseapp.com",
+        projectId: "login-tutorial-7a9e1",
+        storageBucket: "login-tutorial-7a9e1.firebasestorage.app",
+        messagingSenderId: "491093197824",
+        appId: "1:491093197824:web:9f866...",
       };
-
+    
+      // 🔧 Init
       const app = initializeApp(firebaseConfig);
       const auth = getAuth(app);
       const db = getFirestore(app);
-
+    
+      // Expose Firestore helpers if you need them elsewhere
+      window.firebaseAuth = auth;
+      window.onAuthStateChanged = onAuthStateChanged;
+      window.firestoreDb = db;
+      window.firestoreHelpers = { collection, doc, addDoc, serverTimestamp };
+    
       let currentUser = null;
-      const homeNavDesktop = document.querySelector(
-        'ul.md\\:flex li a[href="index.html"]'
-      )?.parentElement;
-      const homeNavMobile = document.querySelector(
-        '#mobile-menu a[href="index.html"]'
-      )?.parentElement;
+    
+      // ✅ Auth state check
+      // ✅ Hide Home button when logged in
+const homeNavDesktop = document.querySelector('ul.md\\:flex li a[href="index.html"]')
+  ?.parentElement; // Desktop <li>
+const homeNavMobile = document.querySelector('#mobile-menu a[href="index.html"]')
+  ?.parentElement; // Mobile <li>
 
-      // ✅ Auth State Handling
-      onAuthStateChanged(auth, async (user) => {
-        const authNavItem = document.getElementById("authNavItem");
-        if (user) {
-          currentUser = user;
-          await loadUserProfile();
-          authNavItem.innerHTML = '<button onclick="logout()">Logout</button>';
-          if (homeNavDesktop) homeNavDesktop.style.display = "none";
-          if (homeNavMobile) homeNavMobile.style.display = "none";
-        } else {
-          authNavItem.innerHTML = '<a href="login.html">Login</a>';
-          if (homeNavDesktop) homeNavDesktop.style.display = "";
-          if (homeNavMobile) homeNavMobile.style.display = "";
-          window.location.href = "login.html";
-        }
-      });
+onAuthStateChanged(auth, async (user) => {
+  const authNavItem = document.getElementById("authNavItem");
 
+  if (user) {
+    currentUser = user;
+    await loadUserProfile();
+
+    // Swap login with logout
+    if (authNavItem) {
+      authNavItem.innerHTML =
+        '<button onclick="logout()" class="hover:text-[#6B9080] text-red-600">Logout</button>';
+    }
+
+    // Hide Home button
+    if (homeNavDesktop) homeNavDesktop.style.display = "none";
+    if (homeNavMobile) homeNavMobile.style.display = "none";
+
+  } else {
+    if (authNavItem) {
+      authNavItem.innerHTML =
+        '<a href="login.html" class="hover:text-[#6B9080]">Login</a>';
+    }
+
+    // Show Home button again
+    if (homeNavDesktop) homeNavDesktop.style.display = "";
+    if (homeNavMobile) homeNavMobile.style.display = "";
+
+    window.location.href = "login.html";
+  }
+});
+
+    
+      // 📄 Load user profile from Firestore
       async function loadUserProfile() {
         try {
           const userDoc = await getDoc(doc(db, "users", currentUser.uid));
@@ -247,33 +309,50 @@
             localStorage.setItem("userName", userData.name || "");
             localStorage.setItem("userDOB", userData.dob || "");
           }
-        } catch (e) {
-          console.error("Error loading user profile:", e);
+        } catch (error) {
+          console.error("Error loading user profile:", error);
         }
       }
-
+    
+      // 💾 Save profile to Firestore
       window.saveProfile = async (name, dob) => {
         try {
-          await updateDoc(doc(db, "users", currentUser.uid), { name, dob });
+          await updateDoc(doc(db, "users", currentUser.uid), {
+            name: name,
+            dob: dob,
+          });
           localStorage.setItem("userName", name);
           localStorage.setItem("userDOB", dob);
           return true;
-        } catch (e) {
-          console.error("Error updating profile:", e);
+        } catch (error) {
+          console.error("Error updating profile:", error);
           return false;
         }
       };
-
+    
+      // 🚪 Logout
       window.logout = async () => {
         try {
           await signOut(auth);
           localStorage.clear();
           window.location.href = "login.html";
-        } catch (e) {
-          console.error("Error signing out:", e);
+        } catch (error) {
+          console.error("Error signing out:", error);
         }
       };
-
+    
+      // 📊 LocalStorage for progress data
+      function loadProgressData() {
+        return JSON.parse(localStorage.getItem("progressData") || "[]");
+      }
+      function saveProgressData(data) {
+        localStorage.setItem("progressData", JSON.stringify(data));
+      }
+      function resetProgressData() {
+        localStorage.removeItem("progressData");
+      }
+    
+      // 🖼️ DOM Content Loaded logic
       document.addEventListener("DOMContentLoaded", () => {
         const profileView = document.getElementById("profileViewSection");
         const profileEdit = document.getElementById("profileEditSection");
@@ -282,18 +361,22 @@
         const cancelBtn = document.getElementById("cancelProfileBtn");
         const inputName = document.getElementById("inputName");
         const inputDOB = document.getElementById("inputDOB");
-
+    
+        // Toggle to edit mode
         editBtn.addEventListener("click", () => {
           inputName.value = document.getElementById("userName").textContent;
           inputDOB.value = document.getElementById("userDOB").textContent;
           profileView.classList.add("hidden");
           profileEdit.classList.remove("hidden");
         });
-
+    
+        // Save profile
         saveBtn.addEventListener("click", async () => {
           const nameVal = inputName.value.trim();
           const dobVal = inputDOB.value;
+    
           const success = await window.saveProfile(nameVal, dobVal);
+    
           if (success) {
             document.getElementById("userName").textContent =
               nameVal || "Name not set";
@@ -305,133 +388,82 @@
             alert("Error saving profile. Please try again.");
           }
         });
-
+    
+        // Cancel editing
         cancelBtn.addEventListener("click", () => {
           profileEdit.classList.add("hidden");
           profileView.classList.remove("hidden");
         });
-
-        // RANGE BARS LOGIC
-        const tabs = document.querySelectorAll(".tab");
-        const contents = document.querySelectorAll(".tab-content");
-        const measurements = [
-          {
-            name: "Blood Sugar",
-            min: 70,
-            max: 110,
-            value: 95,
-            tab: "in-range",
-            impacts: ["Pancreas"],
-          },
-          {
-            name: "Cholesterol",
-            min: 120,
-            max: 200,
-            value: 180,
-            tab: "in-range",
-            impacts: ["Heart", "Arteries"],
-          },
-          {
-            name: "Triglycerides",
-            min: 50,
-            max: 150,
-            value: 180,
-            tab: "out-range",
-            impacts: ["Heart"],
+    
+        // Chart setup
+        const chartSection = document.getElementById("chartSection");
+        const welcomeMessage = document.getElementById("welcomeMessage");
+        const isNewUser = localStorage.getItem("isNewUser") === "true";
+    
+        if (isNewUser) {
+          welcomeMessage.classList.remove("hidden");
+          chartSection.classList.add("hidden");
+        }
+    
+        const stored = loadProgressData();
+        const labels = stored.map((e) => e.date);
+        const ctx = document.getElementById("progressChart").getContext("2d");
+        const progressChart = new Chart(ctx, {
+          type: "line",
+          data: {
+            labels,
+            datasets: [
+              {
+                label: "Health Score",
+                data: stored.map((e) => e.score),
+                borderColor: "#6B9080",
+                fill: true,
+                tension: 0.4,
+              },
+            ],
           },
-          {
-            name: "Blood Pressure",
-            min: 90,
-            max: 120,
-            value: 130,
-            tab: "out-range",
-            impacts: ["Heart", "Kidneys"],
+          options: {
+            scales: { y: { beginAtZero: true, max: 100 } },
           },
-        ];
-
-        const counts = { "in-range": 0, "out-range": 0 };
-
-        measurements.forEach((m) => {
-          counts[m.tab]++;
-          const container = document.getElementById(m.tab);
-          const card = document.createElement("div");
-          card.className = "range-card";
-          const title = document.createElement("h3");
-          title.textContent = m.name;
-          card.appendChild(title);
-          if (m.impacts) {
-            const impactLabel = document.createElement("div");
-            impactLabel.className = "impact-label";
-            impactLabel.textContent = "Impacts: " + m.impacts.join(", ");
-            card.appendChild(impactLabel);
-          }
-          const barContainer = document.createElement("div");
-          barContainer.className = "range-bar-container";
-          const bar = document.createElement("div");
-          bar.className = "range-bar";
-
-          let normalPercent = 100;
-          let overflowPercent = 0;
-          if (m.tab === "out-range" && m.value > m.max) {
-            normalPercent = ((m.max - m.min) / (m.value - m.min)) * 100;
-            overflowPercent = 100 - normalPercent;
+        });
+    
+        // Add Entry
+        document.getElementById("addEntryBtn").addEventListener("click", () => {
+          const date = document.getElementById("entryDate").value;
+          const score = parseInt(document.getElementById("entryScore").value, 10);
+    
+          if (!date || isNaN(score)) {
+            alert("Please select a date and enter a valid score.");
+            return;
           }
-
-          const normalDiv = document.createElement("div");
-          normalDiv.className = "normal-range";
-          normalDiv.style.width = normalPercent + "%";
-          bar.appendChild(normalDiv);
-          if (overflowPercent > 0) {
-            const overflowDiv = document.createElement("div");
-            overflowDiv.className = "overflow-range";
-            overflowDiv.style.left = normalPercent + "%";
-            overflowDiv.style.width = overflowPercent + "%";
-            bar.appendChild(overflowDiv);
+    
+          stored.push({ date, score });
+          saveProgressData(stored);
+          progressChart.data.labels.push(date);
+          progressChart.data.datasets[0].data.push(score);
+          progressChart.update();
+    
+          document.getElementById("entryDate").value = "";
+          document.getElementById("entryScore").value = "";
+    
+          if (isNewUser) {
+            localStorage.setItem("isNewUser", "false");
+            welcomeMessage.classList.add("hidden");
+            chartSection.classList.remove("hidden");
           }
-
-          let valuePercent = ((m.value - m.min) / (m.max - m.min)) * 100;
-          valuePercent = Math.min(Math.max(valuePercent, 0), 100);
-          const marker = document.createElement("div");
-          marker.className = "marker";
-          marker.style.left = valuePercent + "%";
-          bar.appendChild(marker);
-          const valueLabel = document.createElement("div");
-          valueLabel.className = "value-label";
-          valueLabel.style.left = valuePercent + "%";
-          valueLabel.textContent = m.value;
-          bar.appendChild(valueLabel);
-
-          barContainer.appendChild(bar);
-
-          const minMaxDiv = document.createElement("div");
-          minMaxDiv.className = "min-max-labels";
-          const minLabel = document.createElement("span");
-          minLabel.textContent = "Min: " + m.min;
-          const maxLabel = document.createElement("span");
-          maxLabel.textContent = "Max: " + m.max;
-          minMaxDiv.appendChild(minLabel);
-          minMaxDiv.appendChild(maxLabel);
-          barContainer.appendChild(minMaxDiv);
-
-          card.appendChild(barContainer);
-          container.appendChild(card);
         });
-
-        tabs.forEach((tab) => {
-          const t = tab.dataset.tab;
-          const badge = tab.querySelector(".count-badge");
-          badge.textContent = counts[t];
-          tab.addEventListener("click", () => {
-            tabs.forEach((t) => t.classList.remove("active"));
-            tab.classList.add("active");
-            contents.forEach((c) =>
-              c.id === t
-                ? c.classList.add("active")
-                : c.classList.remove("active")
-            );
-          });
+    
+        // Reset Chart
+        document.getElementById("resetChartBtn").addEventListener("click", () => {
+          if (!confirm("Are you sure you want to clear all progress data?")) return;
+          resetProgressData();
+          progressChart.data.labels = [];
+          progressChart.data.datasets[0].data = [];
+          progressChart.update();
         });
       });
+    
     </script>
+    
   </body>
 </html>