Improve scan status indicator reliability on page reload

- Add debug logging to checkActiveScanStatus() for better tracing
- Update status indicator before showing overlay for faster feedback
- Add warning logs when DOM elements are not found
- Ensure idle state is explicitly set when no scan is running
- Add debug logging to AnimeService.get_scan_status()

src/server/web/static/js/app.js

@@ -1361,14 +1361,20 @@ class AniWorldApp {
         try {
             const response = await this.makeAuthenticatedRequest('/api/anime/scan/status');
             if (!response || !response.ok) {
-                console.log('Could not fetch scan status');
+                console.log('Could not fetch scan status, response:', response?.status);
                 return;
             }
             
             const data = await response.json();
-            console.log('Scan status:', data);
+            console.log('Scan status check result:', data);
             
             if (data.is_scanning) {
+                console.log('Scan is active, updating UI indicators');
+                
+                // Update the process status indicator FIRST before showing overlay
+                // This ensures the header icon shows the running state immediately
+                this.updateProcessStatus('rescan', true);
+                
                 // A scan is in progress, show the overlay
                 this.showScanProgressOverlay({
                     directory: data.directory,
@@ -1383,7 +1389,17 @@ class AniWorldApp {
                     total_items: data.total_items
                 });
                 
-                this.updateProcessStatus('rescan', true);
+                // Double-check the status indicator was updated
+                const statusElement = document.getElementById('rescan-status');
+                if (statusElement) {
+                    console.log('Rescan status element classes:', statusElement.className);
+                } else {
+                    console.warn('Rescan status element not found in DOM');
+                }
+            } else {
+                console.log('No active scan detected');
+                // Ensure indicator shows idle state
+                this.updateProcessStatus('rescan', false);
             }
         } catch (error) {
             console.error('Error checking scan status:', error);
@@ -1464,10 +1480,16 @@ class AniWorldApp {
 
     updateProcessStatus(processName, isRunning, hasError = false) {
         const statusElement = document.getElementById(`${processName}-status`);
-        if (!statusElement) return;
+        if (!statusElement) {
+            console.warn(`Process status element not found: ${processName}-status`);
+            return;
+        }
 
         const statusDot = statusElement.querySelector('.status-dot');
-        if (!statusDot) return;
+        if (!statusDot) {
+            console.warn(`Status dot not found in ${processName}-status element`);
+            return;
+        }
 
         // Remove all status classes from both dot and element
         statusDot.classList.remove('idle', 'running', 'error');
@@ -1489,6 +1511,8 @@ class AniWorldApp {
             statusElement.classList.add('idle');
             statusElement.title = `${displayName} is idle`;
         }
+        
+        console.log(`Process status updated: ${processName} = ${isRunning ? 'running' : (hasError ? 'error' : 'idle')}`);
     }
 
     async showConfigModal() {