feat: OpenCode-style session management implementation

public/claude-ide/chat-functions.js

@@ -21,6 +21,22 @@ function resetChatState() {
 async function loadChatView() {
     console.log('[loadChatView] Loading chat view...');
 
+    // Check if there's a pending session from Sessions view
+    if (window.pendingSessionId) {
+        console.log('[loadChatView] Detected pending session:', window.pendingSessionId);
+
+        const sessionId = window.pendingSessionId;
+        const sessionData = window.pendingSessionData;
+
+        // Clear pending session (consume it)
+        window.pendingSessionId = null;
+        window.pendingSessionData = null;
+
+        // Load the session
+        await loadSessionIntoChat(sessionId, sessionData);
+        return;
+    }
+
     // Preserve attached session ID if it exists (for auto-session workflow)
     const preservedSessionId = attachedSessionId;
 
@@ -153,6 +169,83 @@ async function loadChatView() {
     }
 }
 
+/**
+ * Load a specific session into Chat view
+ * Called when continuing from Sessions view
+ */
+async function loadSessionIntoChat(sessionId, sessionData = null) {
+    try {
+        appendSystemMessage('📂 Loading session...');
+
+        // If no session data provided, fetch it
+        if (!sessionData) {
+            const res = await fetch(`/claude/api/claude/sessions/${sessionId}`);
+            if (!res.ok) {
+                throw new Error(`HTTP ${res.status}`);
+            }
+            const data = await res.json();
+            sessionData = data.session;
+        }
+
+        if (!sessionData) {
+            throw new Error('Session not found');
+        }
+
+        // Set session IDs
+        attachedSessionId = sessionId;
+        chatSessionId = sessionId;
+
+        // Update UI
+        document.getElementById('current-session-id').textContent = sessionId;
+
+        // Clear chat display
+        clearChatDisplay();
+
+        // Load session messages (both user and assistant)
+        if (sessionData.outputBuffer && sessionData.outputBuffer.length > 0) {
+            sessionData.outputBuffer.forEach(entry => {
+                if (entry.role) {
+                    appendMessage(entry.role, entry.content, false);
+                } else {
+                    // Legacy format - default to assistant
+                    appendMessage('assistant', entry.content, false);
+                }
+            });
+        }
+
+        // Show success message
+        const isRunning = sessionData.status === 'running';
+        const statusText = isRunning ? 'Active session' : 'Historical session';
+        appendSystemMessage(`✅ Loaded ${statusText} from ${new Date(sessionData.createdAt).toLocaleString()}`);
+
+        if (!isRunning) {
+            appendSystemMessage('ℹ️ This is a historical session. Messages are read-only.');
+        }
+
+        // Update chat history sidebar to highlight this session
+        if (typeof loadChatHistory === 'function') {
+            loadChatHistory();
+        }
+
+        // Subscribe to session for live updates (if running)
+        if (isRunning) {
+            subscribeToSession(sessionId);
+        }
+
+        // Focus input for active sessions
+        if (isRunning) {
+            setTimeout(() => {
+                const input = document.getElementById('chat-input');
+                if (input) input.focus();
+            }, 100);
+        }
+
+    } catch (error) {
+        console.error('[loadSessionIntoChat] Error:', error);
+        appendSystemMessage('❌ Failed to load session: ' + error.message);
+    }
+}
+
 // Start New Chat
 async function startNewChat() {
     // Reset all state first
@@ -675,6 +768,32 @@ function isShellCommand(message) {
     return commandPatterns.some(pattern => pattern.test(trimmed));
 }
 
+// Send shell command to active Claude CLI session
+async function sendShellCommand(sessionId, command) {
+    try {
+        const response = await fetch('/claude/api/shell-command', {
+            method: 'POST',
+            headers: { 'Content-Type': 'application/json' },
+            body: JSON.stringify({ sessionId, command })
+        });
+
+        if (!response.ok) {
+            throw new Error(`HTTP ${response.status}: ${await response.text()}`);
+        }
+
+        const data = await response.json();
+
+        if (!data.success) {
+            throw new Error(data.error || 'Command execution failed');
+        }
+
+        return data;
+    } catch (error) {
+        console.error('[Shell Command] Error:', error);
+        throw error;
+    }
+}
+
 // Handle command execution in Full Stack mode (via Claude CLI session's stdin)
 async function handleWebContainerCommand(message) {
     const sessionId = attachedSessionId || chatSessionId;