From 1b3911ee9468330dfe9acce096cfb6eb4802846e Mon Sep 17 00:00:00 2001
From: Deep Koluguri <deepkoluguri@gmail.com>
Date: Mon, 25 May 2026 21:55:30 -0400
Subject: [PATCH] feat: wire up dynamic clinic settings in dashboard

---
 dashboard.html |  19 ++++----
 dashboard.js   | 116 +++++++++++++++++++++++++++++++++++++++++++++++++
 2 files changed, 126 insertions(+), 9 deletions(-)

diff --git a/dashboard.html b/dashboard.html
index 6ce2b33..e3c2d38 100644
--- a/dashboard.html
+++ b/dashboard.html
@@ -72,11 +72,11 @@
                     <h2>Clinical Profile</h2>
                     <div class="input-group">
                         <label>Full Name</label>
-                        <input type="text" value="Dr. Sharma">
+                        <input type="text" id="settingsName" value="Dr. Sharma">
                     </div>
                     <div class="input-group">
                         <label>Specialization</label>
-                        <input type="text" value="Cardiologist">
+                        <input type="text" id="settingsSpecialty" value="Cardiologist">
                     </div>
                 </div>
 
@@ -84,7 +84,7 @@
                     <h2>Zen Scribe Preferences</h2>
                     <div class="input-group">
                         <label>Default Scribe Language</label>
-                        <select id="scribeLangPref">
+                        <select id="settingsScribeLang">
                             <option value="en-US">English (US)</option>
                             <option value="hi-IN">Hindi</option>
                             <option value="te-IN">Telugu</option>
@@ -92,9 +92,9 @@
                     </div>
                     <div class="input-group">
                         <label>Auto-Generate Clinical Summary</label>
-                        <select>
-                            <option>Enabled</option>
-                            <option>Disabled</option>
+                        <select id="settingsAutoSummary">
+                            <option value="enabled">Enabled</option>
+                            <option value="disabled">Disabled</option>
                         </select>
                     </div>
                 </div>
@@ -105,13 +105,14 @@
                     <h2>Hospital Configuration</h2>
                     <div class="input-group">
                         <label>Consultation Fee (₹)</label>
-                        <input type="number" value="500">
+                        <input type="number" id="settingsConsultationFee" value="500">
                     </div>
                 </div>
             </div>
             
-            <div style="margin-top: 2rem;">
-                <button class="btn-primary" onclick="alert('Settings saved!')">Save Preferences</button>
+            <div style="margin-top: 2rem; display: flex; align-items: center; gap: 1rem;">
+                <button class="btn-primary" id="saveSettingsBtn" onclick="saveSettings()">Save Preferences</button>
+                <span id="settingsSaveStatus" style="font-size: 0.85rem; font-weight: 500;"></span>
             </div>
         </div>
 
diff --git a/dashboard.js b/dashboard.js
index 990a681..e4b7f43 100644
--- a/dashboard.js
+++ b/dashboard.js
@@ -268,6 +268,7 @@ window.showSection = (sectionId) => {
         const isDoctor = role === 'DOCTOR';
         document.querySelector('#settings-section .doctor-only')?.classList.toggle('hidden', !isDoctor);
         document.querySelector('#settings-section .admin-only')?.classList.toggle('hidden', isDoctor);
+        if (typeof loadSettings === 'function') loadSettings();
     }
 
     const target = resolveSectionTarget(sectionId);
@@ -767,3 +768,118 @@ window.syncVitals = () => {
         objectiveField.dispatchEvent(new Event('input', { bubbles: true }));
     }
 };
+
+// ==========================================
+// Settings UI Logic
+// ==========================================
+
+async function loadSettings() {
+    // 1. Load local preferences (Doctor profile & Scribe prefs)
+    const nameEl = document.getElementById("settingsName");
+    const specialtyEl = document.getElementById("settingsSpecialty");
+    const scribeLangEl = document.getElementById("settingsScribeLang");
+    const autoSummaryEl = document.getElementById("settingsAutoSummary");
+
+    if (nameEl) nameEl.value = localStorage.getItem("userName") || localStorage.getItem("userEmail") || "";
+    if (specialtyEl) specialtyEl.value = localStorage.getItem("userSpecialty") || "";
+    if (scribeLangEl) scribeLangEl.value = localStorage.getItem("scribeLangPref") || "en-US";
+    if (autoSummaryEl) autoSummaryEl.value = localStorage.getItem("autoSummaryPref") || "enabled";
+
+    // 2. Fetch remote clinic config (Admin config)
+    const tenantId = localStorage.getItem("Curio_tenant") || "default";
+    try {
+        const res = await fetch(`/api/config/${tenantId}`);
+        if (res.ok) {
+            const config = await res.json();
+            const feeEl = document.getElementById("settingsConsultationFee");
+            if (feeEl && config.consultationFee) {
+                feeEl.value = config.consultationFee;
+            }
+            if (specialtyEl && !specialtyEl.value && config.specialty) {
+                specialtyEl.value = config.specialty;
+            }
+        }
+    } catch (err) {
+        console.error("Failed to load clinic settings from server:", err);
+    }
+}
+
+window.saveSettings = async () => {
+    const btn = document.getElementById("saveSettingsBtn");
+    const status = document.getElementById("settingsSaveStatus");
+    
+    if (btn) {
+        btn.disabled = true;
+        btn.textContent = "Saving...";
+    }
+    if (status) {
+        status.textContent = "";
+        status.style.color = "inherit";
+    }
+
+    try {
+        // 1. Save local preferences
+        const nameVal = document.getElementById("settingsName")?.value.trim();
+        const specVal = document.getElementById("settingsSpecialty")?.value.trim();
+        const scribeLangVal = document.getElementById("settingsScribeLang")?.value;
+        const autoSumVal = document.getElementById("settingsAutoSummary")?.value;
+
+        if (nameVal) localStorage.setItem("userName", nameVal);
+        if (specVal) localStorage.setItem("userSpecialty", specVal);
+        if (scribeLangVal) localStorage.setItem("scribeLangPref", scribeLangVal);
+        if (autoSumVal) localStorage.setItem("autoSummaryPref", autoSumVal);
+
+        // 2. Save remote config if user is OWNER
+        const role = getUserRole();
+        if (role === "OWNER") {
+            const feeVal = document.getElementById("settingsConsultationFee")?.value;
+            const payload = {};
+            if (feeVal) payload.consultationFee = parseInt(feeVal);
+            
+            const token = localStorage.getItem("curio_token");
+            if (token) {
+                const res = await fetch('/api/clinic/settings', {
+                    method: 'PATCH',
+                    headers: {
+                        'Authorization': `Bearer ${token}`,
+                        'Content-Type': 'application/json'
+                    },
+                    body: JSON.stringify(payload)
+                });
+                
+                if (!res.ok) {
+                    const err = await res.json();
+                    throw new Error(err.error || "Failed to update clinic settings");
+                }
+            }
+        }
+
+        if (status) {
+            status.textContent = "✅ Settings saved successfully!";
+            status.style.color = "#10B981"; // Success green
+        }
+
+        // Apply any real-time UI updates
+        const roleDisplay = document.querySelector(".user-profile .info strong");
+        if (roleDisplay && nameVal && role === "DOCTOR") {
+            roleDisplay.innerText = nameVal;
+        }
+
+    } catch (err) {
+        console.error("Error saving settings:", err);
+        if (status) {
+            status.textContent = "❌ " + err.message;
+            status.style.color = "#EF4444"; // Error red
+        }
+    } finally {
+        if (btn) {
+            btn.disabled = false;
+            btn.textContent = "Save Preferences";
+        }
+        
+        // Hide status message after 3 seconds
+        setTimeout(() => {
+            if (status) status.textContent = "";
+        }, 3000);
+    }
+};