claude-mpm 5.1.9__py3-none-any.whl → 5.4.22__py3-none-any.whl

claude_mpm/dashboard/static/js/components/socket-manager.js

@@ -1,368 +0,0 @@
-/**
- * Socket Manager Module
- *
- * Handles all socket connection management, event dispatching, and connection state.
- * Provides a centralized interface for socket operations across the dashboard.
- *
- * WHY: Extracted from main dashboard to centralize socket connection logic and
- * provide better separation of concerns. This allows for easier testing and
- * maintenance of connection handling code.
- *
- * DESIGN DECISION: Acts as a wrapper around SocketClient to provide dashboard-specific
- * connection management while maintaining the existing SocketClient interface.
- * Uses event dispatching to notify other modules of connection state changes.
- */
-
-// Import SocketClient (assuming it will be converted to ES6 modules too)
-import { SocketClient } from '../socket-client.js';
-class SocketManager {
-    constructor() {
-        this.socketClient = null;
-        this.connectionCallbacks = new Set();
-        this.eventUpdateCallbacks = new Set();
-
-        // Initialize socket client
-        this.socketClient = new SocketClient();
-
-        // Make socketClient globally available (for backward compatibility)
-        window.socketClient = this.socketClient;
-
-        this.setupSocketEventHandlers();
-
-        // Force initial status update after a short delay to ensure DOM is ready
-        setTimeout(() => {
-            this.updateInitialConnectionStatus();
-        }, 100);
-
-        console.log('Socket manager initialized');
-    }
-
-    /**
-     * Set up socket event handlers for connection status and events
-     */
-    setupSocketEventHandlers() {
-        // Listen for connection status changes
-        document.addEventListener('socketConnectionStatus', (e) => {
-            console.log(`SocketManager: Processing connection status update: ${e.detail.status} (${e.detail.type})`);
-            this.handleConnectionStatusChange(e.detail.status, e.detail.type);
-
-            // Notify all registered callbacks
-            this.connectionCallbacks.forEach(callback => {
-                try {
-                    callback(e.detail.status, e.detail.type);
-                } catch (error) {
-                    console.error('Error in connection callback:', error);
-                }
-            });
-        });
-
-        // Set up event update handling
-        if (this.socketClient) {
-            this.socketClient.onEventUpdate((events) => {
-                // Notify all registered callbacks
-                this.eventUpdateCallbacks.forEach(callback => {
-                    try {
-                        callback(events);
-                    } catch (error) {
-                        console.error('Error in event update callback:', error);
-                    }
-                });
-            });
-        }
-    }
-
-    /**
-     * Handle connection status changes
-     * @param {string} status - Connection status text
-     * @param {string} type - Connection type ('connected', 'disconnected', etc.)
-     */
-    handleConnectionStatusChange(status, type) {
-        this.updateConnectionStatus(status, type);
-
-        // Set up git branch listener when connected
-        if (type === 'connected' && this.socketClient && this.socketClient.socket) {
-            // Expose socket globally for components like CodeTree
-            window.socket = this.socketClient.socket;
-            console.log('SocketManager: Exposed socket globally as window.socket');
-
-            this.setupGitBranchListener();
-        }
-    }
-
-    /**
-     * Update initial connection status on dashboard load
-     */
-    updateInitialConnectionStatus() {
-        console.log('SocketManager: Updating initial connection status');
-
-        // Force status check on socket client (uses fallback mechanism)
-        if (this.socketClient && typeof this.socketClient.checkAndUpdateStatus === 'function') {
-            console.log('SocketManager: Using socket client checkAndUpdateStatus method');
-            this.socketClient.checkAndUpdateStatus();
-        } else if (this.socketClient && this.socketClient.socket) {
-            console.log('SocketManager: Checking socket state directly', {
-                connected: this.socketClient.socket.connected,
-                connecting: this.socketClient.socket.connecting,
-                isConnecting: this.socketClient.isConnecting,
-                isConnected: this.socketClient.isConnected
-            });
-
-            if (this.socketClient.socket.connected) {
-                console.log('SocketManager: Socket is already connected, updating status');
-                // Expose socket globally for components like CodeTree
-                window.socket = this.socketClient.socket;
-                console.log('SocketManager: Exposed socket globally as window.socket');
-                this.updateConnectionStatus('Connected', 'connected');
-            } else if (this.socketClient.isConnecting || this.socketClient.socket.connecting) {
-                console.log('SocketManager: Socket is connecting, updating status');
-                this.updateConnectionStatus('Connecting...', 'connecting');
-            } else {
-                console.log('SocketManager: Socket is disconnected, updating status');
-                this.updateConnectionStatus('Disconnected', 'disconnected');
-            }
-        } else {
-            console.log('SocketManager: No socket client or socket found, setting disconnected status');
-            this.updateConnectionStatus('Disconnected', 'disconnected');
-        }
-
-        // Additional fallback - check again after a longer delay in case connection is still establishing
-        setTimeout(() => {
-            console.log('SocketManager: Secondary status check after 1 second');
-            if (this.socketClient && this.socketClient.socket && this.socketClient.socket.connected) {
-                console.log('SocketManager: Socket connected in secondary check, updating status');
-                // Expose socket globally if not already done
-                if (!window.socket) {
-                    window.socket = this.socketClient.socket;
-                    console.log('SocketManager: Exposed socket globally as window.socket (secondary check)');
-                }
-                this.updateConnectionStatus('Connected', 'connected');
-            }
-        }, 1000);
-    }
-
-    /**
-     * Set up git branch response listener for connected socket
-     */
-    setupGitBranchListener() {
-        // Remove any existing listener first
-        this.socketClient.socket.off('git_branch_response');
-
-        // Add the listener
-        this.socketClient.socket.on('git_branch_response', (data) => {
-            if (data.success) {
-                const footerBranch = document.getElementById('footer-git-branch');
-                if (footerBranch) {
-                    footerBranch.textContent = data.branch || 'unknown';
-                }
-                if (footerBranch) {
-                    footerBranch.style.display = 'inline';
-                }
-            } else {
-                console.error('Git branch request failed:', data.error);
-            }
-        });
-    }
-
-    /**
-     * Update connection status display
-     * @param {string} status - Status text to display
-     * @param {string} type - Status type for styling
-     */
-    updateConnectionStatus(status, type) {
-        const statusElement = document.getElementById('connection-status');
-        if (statusElement) {
-            // Check if there's a span indicator first
-            const indicator = statusElement.querySelector('span');
-            if (indicator) {
-                // If there's a span, update the text content after the span
-                const statusIndicator = type === 'connected' ? '●' : '●';
-                statusElement.innerHTML = `<span>${statusIndicator}</span> ${status}`;
-            } else {
-                // If no span, just update text content
-                statusElement.textContent = status;
-            }
-
-            statusElement.className = `status-badge status-${type}`;
-            console.log(`SocketManager: UI updated - status: '${status}' (${type})`);
-        } else {
-            console.error('SocketManager: Could not find connection-status element in DOM');
-        }
-    }
-
-    /**
-     * Connect to socket server
-     * @param {number} port - Port number to connect to
-     */
-    connect(port) {
-        if (this.socketClient) {
-            this.socketClient.connect(port);
-        }
-    }
-
-    /**
-     * Disconnect from socket server
-     */
-    disconnect() {
-        if (this.socketClient) {
-            this.socketClient.disconnect();
-        }
-    }
-
-    /**
-     * Check if socket is connected
-     * @returns {boolean} - True if connected
-     */
-    isConnected() {
-        return this.socketClient && this.socketClient.isConnected;
-    }
-
-    /**
-     * Check if socket is connecting
-     * @returns {boolean} - True if connecting
-     */
-    isConnecting() {
-        return this.socketClient && this.socketClient.isConnecting;
-    }
-
-    /**
-     * Get the underlying socket client
-     * @returns {SocketClient} - The socket client instance
-     */
-    getSocketClient() {
-        return this.socketClient;
-    }
-
-    /**
-     * Get the raw socket connection
-     * @returns {Socket|null} - The raw socket or null
-     */
-    getSocket() {
-        return this.socketClient ? this.socketClient.socket : null;
-    }
-
-    /**
-     * Register a callback for connection status changes
-     * @param {Function} callback - Callback function(status, type)
-     */
-    onConnectionStatusChange(callback) {
-        this.connectionCallbacks.add(callback);
-    }
-
-    /**
-     * Unregister a connection status callback
-     * @param {Function} callback - Callback to remove
-     */
-    offConnectionStatusChange(callback) {
-        this.connectionCallbacks.delete(callback);
-    }
-
-    /**
-     * Register a callback for event updates
-     * @param {Function} callback - Callback function(events)
-     */
-    onEventUpdate(callback) {
-        this.eventUpdateCallbacks.add(callback);
-    }
-
-    /**
-     * Unregister an event update callback
-     * @param {Function} callback - Callback to remove
-     */
-    offEventUpdate(callback) {
-        this.eventUpdateCallbacks.delete(callback);
-    }
-
-    /**
-     * Toggle connection controls visibility
-     */
-    toggleConnectionControls() {
-        const controlsRow = document.getElementById('connection-controls-row');
-        const toggleBtn = document.getElementById('connection-toggle-btn');
-
-        if (controlsRow && toggleBtn) {
-            const isVisible = controlsRow.classList.contains('show');
-
-            if (isVisible) {
-                controlsRow.classList.remove('show');
-                controlsRow.style.display = 'none';
-                toggleBtn.textContent = 'Connection Settings';
-            } else {
-                controlsRow.classList.add('show');
-                controlsRow.style.display = 'block';
-                toggleBtn.textContent = 'Hide Settings';
-            }
-        }
-    }
-
-    /**
-     * Setup connection control event handlers
-     * Called during dashboard initialization
-     */
-    setupConnectionControls() {
-        const connectBtn = document.getElementById('connect-btn');
-        const disconnectBtn = document.getElementById('disconnect-btn');
-        const connectionToggleBtn = document.getElementById('connection-toggle-btn');
-
-        if (connectBtn) {
-            connectBtn.addEventListener('click', () => {
-                const port = document.getElementById('port-input').value || 8765;
-                this.connect(port);
-            });
-        }
-
-        if (disconnectBtn) {
-            disconnectBtn.addEventListener('click', () => {
-                this.disconnect();
-            });
-        }
-
-        if (connectionToggleBtn) {
-            connectionToggleBtn.addEventListener('click', () => {
-                this.toggleConnectionControls();
-            });
-        }
-    }
-
-    /**
-     * Initialize connection from URL parameters
-     * @param {URLSearchParams} params - URL search parameters
-     */
-    initializeFromURL(params) {
-        const port = params.get('port');
-        const portInput = document.getElementById('port-input');
-
-        // Determine the port to use:
-        // 1. URL parameter 'port'
-        // 2. Current page port (if served via HTTP)
-        // 3. Default port value from input field
-        // 4. Fallback to 8765
-        let connectPort = port;
-        if (!connectPort && window.location.protocol === 'http:') {
-            connectPort = window.location.port || '8765';
-        }
-        if (!connectPort) {
-            connectPort = portInput?.value || '8765';
-        }
-
-        // Update the port input field with the determined port
-        if (portInput) {
-            portInput.value = connectPort;
-        }
-
-        // Auto-connect by default unless explicitly disabled
-        // Changed: Always auto-connect by default even without URL params
-        const shouldAutoConnect = params.get('connect') !== 'false';
-        if (shouldAutoConnect && !this.isConnected() && !this.isConnecting()) {
-            console.log(`SocketManager: Auto-connecting to port ${connectPort}`);
-            this.connect(connectPort);
-        }
-    }
-}
-
-// ES6 Module export
-export { SocketManager };
-export default SocketManager;
-
-// Make SocketManager globally available for the dist/dashboard.js
-// This ensures compatibility with the minified version
-window.SocketManager = SocketManager;