ui: major UX polish and bug fixes for dashboard

- Added global loading spinner and page transitions.
- Improved sidebar with tooltips and persistent collapsed state.
- Fixed chart memory leaks by properly destroying instances on page change.
- Unified WebSocket event handling and status indicators.
- Refined stat cards, tables, and modal interactions.
- Added real backend integration for logout and session management.

static/js/websocket.js

@@ -88,37 +88,22 @@ class WebSocketManager {
     }
 
     handleMessage(data) {
-        const { type, channel, payload } = data;
+        // Handle global events
+        if (data.type === 'request' || data.type === 'request') {
+            this.notify('requests', data.payload);
+        }
         
-        // Notify channel subscribers
+        // Notify specific channel subscribers
+        const channel = data.channel || data.type;
         if (channel && this.subscribers.has(channel)) {
             this.subscribers.get(channel).forEach(callback => {
                 try {
-                    callback(payload);
+                    callback(data.payload);
                 } catch (error) {
                     console.error('Error in WebSocket callback:', error);
                 }
             });
         }
-        
-        // Handle specific message types
-        switch (type) {
-            case 'request':
-                this.handleRequest(payload);
-                break;
-            case 'metric':
-                this.handleMetric(payload);
-                break;
-            case 'log':
-                this.handleLog(payload);
-                break;
-            case 'system':
-                this.handleSystem(payload);
-                break;
-            case 'error':
-                this.handleError(payload);
-                break;
-        }
     }
 
     handleRequest(request) {
@@ -263,7 +248,7 @@ class WebSocketManager {
     }
 
     updateStatus(status) {
-        const statusElement = document.getElementById('ws-status');
+        const statusElement = document.getElementById('ws-status-nav');
         if (!statusElement) return;
         
         const dot = statusElement.querySelector('.ws-dot');