From f7ff02dd22067264d9d19b92f011be2748aaa5fc Mon Sep 17 00:00:00 2001
From: Dmytro Trotsko <dmytro.trotsko@lvimac0084.local>
Date: Wed, 19 Nov 2025 21:00:26 +0200
Subject: [PATCH] Small fix

---
 src/assets/js/alter_dashboard.js              | 36 +++++++++++++++++++
 .../alter_dashboard.html                      |  2 +-
 2 files changed, 37 insertions(+), 1 deletion(-)

diff --git a/src/assets/js/alter_dashboard.js b/src/assets/js/alter_dashboard.js
index 95188be..adcb96a 100644
--- a/src/assets/js/alter_dashboard.js
+++ b/src/assets/js/alter_dashboard.js
@@ -789,6 +789,16 @@ function initGeographyTypingAnimation() {
     
     // Check if geography is selected and update visibility
     function checkSelection() {
+        // Don't show animation if select is disabled (no pathogen selected)
+        if (selectElement.disabled) {
+            typingElement.style.display = 'none';
+            if (timeoutId) {
+                clearTimeout(timeoutId);
+                timeoutId = null;
+            }
+            return;
+        }
+        
         if (selectElement.value && selectElement.value !== '') {
             typingElement.style.display = 'none';
             if (timeoutId) {
@@ -842,12 +852,34 @@ function initGeographyTypingAnimation() {
     }, 500);
 }
 
+// Update geography select enabled/disabled state based on pathogen selection
+function updateGeographySelectState() {
+    const pathogenSelect = document.getElementById('pathogenSelect');
+    const geographySelect = document.getElementById('geographySelect');
+    
+    if (!pathogenSelect || !geographySelect) {
+        return;
+    }
+    
+    const hasPathogen = pathogenSelect.value && pathogenSelect.value !== '';
+    
+    // Enable or disable geography select based on pathogen selection
+    geographySelect.disabled = !hasPathogen;
+    
+    // If pathogen is cleared, also clear geography selection
+    if (!hasPathogen && geographySelect.value) {
+        geographySelect.value = '';
+    }
+}
+
 // Initialize dashboard when DOM is loaded
 let dashboard;
 document.addEventListener('DOMContentLoaded', function() {
     dashboard = new AlterDashboard();
     initPathogenTypingAnimation();
     initGeographyTypingAnimation();
+    // Initialize geography select state based on pathogen selection
+    updateGeographySelectState();
 });
 
 // Handle pathogen change - reset geography select and submit form
@@ -862,6 +894,10 @@ function handlePathogenChange() {
     if (geographySelect) {
         geographySelect.value = '';
     }
+    
+    // Update geography select state before submitting
+    updateGeographySelectState();
+    
     // Show loader before submitting form
     const loader = document.getElementById('pageLoader');
     if (loader) {
diff --git a/src/templates/alternative_interface/alter_dashboard.html b/src/templates/alternative_interface/alter_dashboard.html
index f5070c7..7230a16 100644
--- a/src/templates/alternative_interface/alter_dashboard.html
+++ b/src/templates/alternative_interface/alter_dashboard.html
@@ -91,7 +91,7 @@ <h1 class="hero-title">Respiratory Diseases Dashboard</h1>
                     </div>
                     <span class="filter-label">in</span>
                     <div style="position: relative; display: inline-block; width: 100%;">
-                        <select class="form-select filter-select" id="geographySelect" name="geography" onchange="handleGeographyChange()" style="position: relative;">
+                        <select class="form-select filter-select" id="geographySelect" name="geography" onchange="handleGeographyChange()" style="position: relative;" {% if not selected_pathogen %}disabled{% endif %}>
                             <option value=""></option>
                             {% for geography in available_geos %}
                                 <optgroup label="{{ geography.text }}">