shell-mirror 1.5.82 → 1.5.84

package/mac-agent/agent.js

@@ -910,12 +910,52 @@ function setupDataChannel(clientId) {
             sessionId: message.sessionId,
             sessionName: newSession.name
           }));
+
+          // Send buffered output for this session
+          const bufferedOutput = newSession.buffer.getAll();
+          if (bufferedOutput) {
+            logToFile(`[AGENT] 📤 Sending ${bufferedOutput.length} chars of buffered output for session switch`);
+            const success = sendLargeMessage(dataChannel, {
+              type: 'output',
+              data: bufferedOutput
+            }, '[AGENT]');
+            if (!success) {
+              logToFile('[AGENT] ❌ Failed to send buffered output');
+            }
+          } else {
+            logToFile('[AGENT] ℹ️ No buffered output for switched session');
+          }
         } else {
           dataChannel.send(JSON.stringify({
             type: 'error',
             message: `Session ${message.sessionId} not found`
           }));
         }
+      } else if (message.type === 'session-create') {
+        // Handle new session creation via data channel
+        logToFile(`[AGENT] Client ${clientId} creating new session`);
+
+        const newSessionId = sessionManager.createSession(null, clientId);
+
+        if (newSessionId) {
+          const newSession = sessionManager.getSession(newSessionId);
+
+          // Send confirmation with updated session list
+          dataChannel.send(JSON.stringify({
+            type: 'session-created',
+            sessionId: newSessionId,
+            sessionName: newSession.name,
+            availableSessions: sessionManager.getAllSessions()
+          }));
+
+          logToFile(`[AGENT] ✅ New session created: ${newSessionId}`);
+        } else {
+          dataChannel.send(JSON.stringify({
+            type: 'error',
+            message: 'Failed to create session - maximum sessions reached'
+          }));
+          logToFile(`[AGENT] ❌ Failed to create session for client ${clientId}`);
+        }
       }
     } catch (err) {
       logToFile(`[AGENT] Error parsing data channel message: ${err.message}`);
@@ -1023,6 +1063,7 @@ function startLocalServer() {
             localWs.send(JSON.stringify({
               type: 'session_created',
               sessionId,
+              sessionName: `Session ${sessionId.slice(0, 8)}`,
               cols: message.cols || 120,
               rows: message.rows || 30
             }));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "shell-mirror",
-  "version": "1.5.82",
+  "version": "1.5.84",
   "description": "Access your Mac shell from any device securely. Perfect for mobile coding with Claude Code CLI, Gemini CLI, and any shell tool.",
   "main": "server.js",
   "bin": {

package/public/app/terminal.html

@@ -178,27 +178,6 @@
         background: #1a1a1a;
       }
 
-      .session-tab-status {
-        width: 8px;
-        height: 8px;
-        border-radius: 50%;
-        flex-shrink: 0;
-      }
-
-      .session-tab-status.connected {
-        background: #44ff44;
-        box-shadow: 0 0 6px rgba(68, 255, 68, 0.5);
-      }
-
-      .session-tab-status.connecting {
-        background: #ffaa44;
-        animation: pulse 1.5s ease-in-out infinite;
-      }
-
-      .session-tab-status.disconnected {
-        background: #ff4444;
-      }
-
       .session-tab-name {
         overflow: hidden;
         text-overflow: ellipsis;
@@ -257,23 +236,6 @@
         }
       }
 
-      /* Dashboard button with status dot */
-      .dashboard-btn {
-        position: relative;
-      }
-
-      .dashboard-btn::before {
-        content: '';
-        position: absolute;
-        top: 4px;
-        right: 4px;
-        width: 8px;
-        height: 8px;
-        border-radius: 50%;
-        background: #44ff44;
-        box-shadow: 0 0 8px rgba(68, 255, 68, 0.5);
-      }
-      
       #terminal {
         padding: 8px;  /* Mac Terminal.app padding */
         background-color: #000000;
@@ -284,31 +246,6 @@
       #connect-container { padding: 2em; text-align: center; }
       #agent-id-input { font-size: 1.2em; padding: 8px; width: 400px; margin-bottom: 1em; }
       #connect-btn { font-size: 1.2em; padding: 10px 20px; }
-      
-      /* Connection Status Indicator */
-      .connection-status {
-        width: 8px;
-        height: 8px;
-        border-radius: 50%;
-        background: #ff4444;
-        margin-right: 4px;
-        transition: all 0.3s ease;
-      }
-      
-      .connection-status.connected {
-        background: #44ff44;
-        box-shadow: 0 0 8px rgba(68, 255, 68, 0.5);
-      }
-      
-      .connection-status.connecting {
-        background: #ffaa44;
-        animation: pulse 1.5s ease-in-out infinite alternate;
-      }
-      
-      @keyframes pulse {
-        from { opacity: 1; }
-        to { opacity: 0.4; }
-      }
 
       /* Help Modal - Tab Navigation */
       .help-tabs {

package/public/app/terminal.js

@@ -157,23 +157,12 @@ function updateConnectionStatus(status) {
     if (!statusElement) return;
 
     statusElement.className = 'connection-status';
-    switch(status) {
-        case 'connecting':
-            statusElement.classList.add('connecting');
-            break;
-        case 'connected':
-            statusElement.classList.add('connected');
-            break;
-        case 'disconnected':
-        default:
-            // Default red styling already applied
-            break;
-    }
-
-    // Update tab status indicators
-    if (currentSession) {
-        renderTabs();
+    if (status === 'connecting') {
+        statusElement.classList.add('connecting');
+    } else if (status === 'connected') {
+        statusElement.classList.add('connected');
     }
+    // else: disconnected (default red)
 }
 
 // Cleanup timer for chunk assembler
@@ -399,8 +388,20 @@ function setupDirectConnection(directWs) {
                 
             case 'session_created':
                 console.log('[CLIENT] ✅ Direct session created:', data.sessionId);
-                currentSession = { id: data.sessionId };
+                currentSession = {
+                    id: data.sessionId,
+                    name: data.sessionName || 'Terminal Session'
+                };
+
+                // Update available sessions
+                if (data.availableSessions) {
+                    availableSessions = data.availableSessions;
+                }
+
                 updateSessionDisplay();
+
+                // Save to localStorage
+                saveSessionToLocalStorage(AGENT_ID, currentSession);
                 break;
                 
             case 'output':
@@ -951,9 +952,6 @@ function renderTabs() {
         return;
     }
 
-    // Get connection status
-    const connectionStatus = getConnectionStatus();
-
     // Ensure we have sessions to display
     let sessionsToRender = [];
 
@@ -968,7 +966,6 @@ function renderTabs() {
     console.log('[CLIENT] 🎨 Rendering tabs:', {
         sessionCount: sessionsToRender.length,
         currentSession: currentSession?.id,
-        connectionStatus,
         source: availableSessions?.length > 0 ? 'agent' : 'fallback'
     });
 
@@ -985,7 +982,6 @@ function renderTabs() {
                         onclick="switchToSession('${session.id}')"
                         ${isActive ? 'disabled' : ''}
                         title="${displayName}">
-                    <span class="session-tab-status ${connectionStatus}"></span>
                     <span class="session-tab-name">${displayName}</span>
                 </button>
             `;
@@ -1000,13 +996,27 @@ function renderTabs() {
 }
 
 function getConnectionStatus() {
+    // Check direct WebSocket connection
+    if (ws && ws.readyState === WebSocket.OPEN) {
+        return 'connected';
+    }
+
+    // Check WebRTC data channel connection
     if (dataChannel && dataChannel.readyState === 'open') {
         return 'connected';
-    } else if (dataChannel && dataChannel.readyState === 'connecting') {
+    }
+
+    // Check connecting states
+    if (ws && ws.readyState === WebSocket.CONNECTING) {
         return 'connecting';
-    } else {
-        return 'disconnected';
     }
+
+    if (dataChannel && dataChannel.readyState === 'connecting') {
+        return 'connecting';
+    }
+
+    // Not connected
+    return 'disconnected';
 }
 
 function formatLastActivity(timestamp) {
@@ -1036,16 +1046,59 @@ function switchToSession(sessionId) {
 }
 
 function createNewSession() {
-    // Navigate to terminal with new session request
-    const url = new URL(window.location.href);
-    url.searchParams.delete('session'); // Remove session param to create new one
-    window.location.href = url.toString();
+    console.log('[CLIENT] 🆕 Creating new session...');
+
+    // Send create session message via active connection
+    const message = {
+        type: 'session-create',
+        cols: term.cols,
+        rows: term.rows
+    };
+
+    if (ws && ws.readyState === WebSocket.OPEN) {
+        // Direct WebSocket connection
+        ws.send(JSON.stringify(message));
+    } else if (dataChannel && dataChannel.readyState === 'open') {
+        // WebRTC data channel connection
+        dataChannel.send(JSON.stringify(message));
+    } else {
+        console.error('[CLIENT] ❌ Cannot create session - no active connection');
+        term.write('\r\n\x1b[31m❌ Cannot create session - not connected\x1b[0m\r\n');
+    }
 }
 
 
 // Handle session-related data channel messages
 function handleSessionMessage(message) {
     switch (message.type) {
+        case 'session-created':
+            console.log('[CLIENT] ✅ New session created:', message.sessionId);
+
+            // Update current session
+            currentSession = {
+                id: message.sessionId,
+                name: message.sessionName || 'Terminal Session'
+            };
+
+            // Update available sessions list
+            if (message.availableSessions) {
+                availableSessions = message.availableSessions;
+            } else {
+                // Add to local list if not provided
+                availableSessions.push(currentSession);
+            }
+
+            // Clear terminal for new session
+            term.clear();
+            term.write(`\r\n\x1b[36m✨ New session created: ${currentSession.name}\x1b[0m\r\n\r\n`);
+
+            // Update UI
+            updateSessionDisplay();
+
+            // Save to localStorage
+            saveSessionToLocalStorage(AGENT_ID, currentSession);
+            break;
+
         case 'session-switched':
             currentSession = {
                 id: message.sessionId,
@@ -1054,7 +1107,7 @@ function handleSessionMessage(message) {
             updateSessionDisplay();
             term.clear(); // Clear terminal for new session
             console.log('[CLIENT] ✅ Switched to session:', currentSession);
-            
+
             // Save updated session info
             saveSessionToLocalStorage(AGENT_ID, currentSession);
             break;