genbox 1.0.226 → 1.0.227

package/dist/commands/session/watch.js

@@ -119,6 +119,31 @@ function getStateColor(state) {
             return chalk_1.default.dim;
     }
 }
+/**
+ * Render progress bar
+ */
+function renderBar(percent, width = 10) {
+    const filled = Math.round((percent / 100) * width);
+    const empty = width - filled;
+    const bar = '█'.repeat(filled) + '░'.repeat(empty);
+    // Color based on usage level
+    if (percent >= 90)
+        return chalk_1.default.red(bar);
+    if (percent >= 70)
+        return chalk_1.default.yellow(bar);
+    return chalk_1.default.green(bar);
+}
+/**
+ * Format time remaining
+ */
+function formatTimeRemaining(mins) {
+    if (mins >= 60) {
+        const hours = Math.floor(mins / 60);
+        const remainingMins = mins % 60;
+        return remainingMins > 0 ? `${hours}h ${remainingMins}m` : `${hours}h`;
+    }
+    return `${mins} min`;
+}
 /**
  * Format state for display
  */
@@ -352,6 +377,165 @@ fi
     }
     return null;
 }
+/**
+ * Query genbox daemon for session messages via JSONL reading
+ * This reads from ~/.claude/projects/ JSONL files for structured message data
+ */
+async function queryGenboxDaemonMessages(genboxName, sessionId = 'latest', limit = 50) {
+    try {
+        // Try each daemon port
+        const { stdout } = await execAsync(`ssh -o ConnectTimeout=5 -o BatchMode=yes genbox-${genboxName} 'curl -s "http://127.0.0.1:47191/api/sessions/${sessionId}/messages?limit=${limit}" 2>/dev/null || curl -s "http://127.0.0.1:47192/api/sessions/${sessionId}/messages?limit=${limit}" 2>/dev/null || curl -s "http://127.0.0.1:47193/api/sessions/${sessionId}/messages?limit=${limit}" 2>/dev/null' 2>/dev/null`, { encoding: 'utf8', timeout: 15000 });
+        if (stdout && stdout.trim()) {
+            const data = JSON.parse(stdout);
+            return data.messages || [];
+        }
+    }
+    catch {
+        // Fallback if daemon doesn't have messages endpoint yet
+    }
+    return [];
+}
+/**
+ * Format a single message into display lines
+ */
+function formatMessageLine(msg, termWidth) {
+    const lines = [];
+    const maxContentWidth = termWidth - 8;
+    for (const block of msg.content) {
+        if (block.type === 'text' && block.text) {
+            // Assistant text response
+            if (msg.role === 'assistant' && !msg.toolName) {
+                const text = block.text.trim();
+                const preview = text.length > maxContentWidth
+                    ? text.substring(0, maxContentWidth - 12) + '...(truncated)'
+                    : text.split('\n')[0].substring(0, maxContentWidth);
+                lines.push(chalk_1.default.yellow('🤖 ') + chalk_1.default.yellow(preview));
+                // Token info
+                if (msg.inputTokens || msg.outputTokens) {
+                    lines.push(chalk_1.default.dim(`   tokens: ${msg.inputTokens || 0}↓ ${msg.outputTokens || 0}↑`));
+                }
+            }
+            // User message (usually tool result context)
+            else if (msg.role === 'user' && !msg.isToolResult) {
+                const preview = block.text.substring(0, maxContentWidth);
+                lines.push(chalk_1.default.green('👤 ') + chalk_1.default.green(preview));
+            }
+        }
+        else if (block.type === 'tool_use' && block.name) {
+            // Tool call
+            let toolName = block.name
+                .replace(/^mcp__playwright__/, 'pw:')
+                .replace(/^mcp__plugin_playwright_playwright__/, 'pw:');
+            // Extract useful info from input
+            let inputPreview = '';
+            if (block.input) {
+                if (block.input.file_path) {
+                    inputPreview = block.input.file_path;
+                }
+                else if (block.input.pattern) {
+                    inputPreview = JSON.stringify({ pattern: block.input.pattern, path: block.input.path });
+                }
+                else if (block.input.command) {
+                    inputPreview = block.input.command.split('\n')[0].substring(0, 60);
+                }
+                else if (block.input.content) {
+                    inputPreview = `"${block.input.content.substring(0, 40)}..."`;
+                }
+                else {
+                    const preview = JSON.stringify(block.input);
+                    inputPreview = preview.length > 80 ? preview.substring(0, 77) + '...' : preview;
+                }
+            }
+            lines.push(chalk_1.default.cyan('⚙ ') + chalk_1.default.bold(toolName) + ' ' + chalk_1.default.dim(inputPreview));
+        }
+        else if (block.type === 'tool_result') {
+            // Tool result (shown under the tool call that triggered it)
+            const resultText = typeof block.content === 'string' ? block.content : '';
+            const preview = resultText.split('\n')[0].substring(0, maxContentWidth - 5);
+            const icon = msg.isError ? chalk_1.default.red('✗') : chalk_1.default.green('✓');
+            lines.push(`  ${icon} ` + chalk_1.default.dim(preview || '(result)'));
+        }
+    }
+    return lines;
+}
+/**
+ * Render messages view with pagination like logs view
+ */
+function renderMessagesView(session, messages, scrollOffset, termHeight, termWidth) {
+    const lineWidth = Math.min(termWidth - 2, 140);
+    const maxLogLines = Math.max(5, termHeight - 8);
+    if (!session) {
+        console.log(chalk_1.default.dim('\n  No session selected.\n'));
+        return { totalLines: 0, visibleLines: 0 };
+    }
+    // Header with session info
+    const timestamp = new Date().toLocaleTimeString();
+    const stateIcon = session.state === 'thinking' ? '💭' :
+        session.state === 'executing_tool' ? '⚙️' :
+            session.state === 'waiting_for_input' ? '⌛' :
+                session.state === 'responding' ? '📝' : '●';
+    const stateText = session.currentTool || session.state?.replace(/_/g, ' ') || 'running';
+    console.log(chalk_1.default.bold.inverse(` ${session.name} `) + chalk_1.default.dim(` ${session.genbox} • ${stateIcon} ${stateText} • ${timestamp}`));
+    console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
+    if (!messages || messages.length === 0) {
+        console.log(chalk_1.default.dim('\n  Waiting for messages...\n'));
+        return { totalLines: 0, visibleLines: 0 };
+    }
+    // Format all messages into lines
+    const formattedLines = [];
+    for (const msg of messages) {
+        const msgLines = formatMessageLine(msg, termWidth);
+        formattedLines.push(...msgLines);
+    }
+    const totalLines = formattedLines.length;
+    // Calculate visible window with pagination
+    // scrollOffset 0 = show latest (bottom), positive = scroll up (older)
+    const endIndex = totalLines - scrollOffset;
+    const startIndex = Math.max(0, endIndex - maxLogLines);
+    const actualEnd = Math.min(endIndex, totalLines);
+    // Position info
+    const showingStart = startIndex + 1;
+    const showingEnd = actualEnd;
+    const positionInfo = `${showingStart}-${showingEnd} of ${totalLines}`;
+    console.log(chalk_1.default.bold(' Messages') + chalk_1.default.dim(` [${positionInfo}] `) + chalk_1.default.dim(`(${messages.length} turns)`));
+    // Scroll up indicator
+    if (startIndex > 0) {
+        console.log(chalk_1.default.dim(`  ↑ ${startIndex} more above [↑ to scroll]`));
+    }
+    else {
+        console.log('');
+    }
+    // Display visible lines
+    const visibleLines = formattedLines.slice(startIndex, actualEnd);
+    for (const line of visibleLines) {
+        console.log(' ' + line);
+    }
+    // Scroll down indicator
+    if (actualEnd < totalLines) {
+        console.log(chalk_1.default.dim(`  ↓ ${totalLines - actualEnd} more below [↓ to scroll]`));
+    }
+    else if (scrollOffset > 0) {
+        console.log(chalk_1.default.cyan('  ↓ [↓ or End to jump to latest]'));
+    }
+    else {
+        console.log(chalk_1.default.dim('  ─ latest'));
+    }
+    // Fill remaining height
+    const usedLines = 6 + visibleLines.length;
+    const remaining = termHeight - usedLines - 1;
+    for (let i = 0; i < remaining; i++) {
+        console.log('');
+    }
+    // Footer
+    const controls = chalk_1.default.dim('[Esc]') + ' Back  ' +
+        chalk_1.default.dim('[↑/↓]') + ' Scroll  ' +
+        chalk_1.default.dim('[a]') + ' Attach  ' +
+        chalk_1.default.dim('[s]') + ' Send  ' +
+        chalk_1.default.dim('[r]') + ' Refresh  ' +
+        chalk_1.default.dim('[q]') + ' Quit';
+    console.log(chalk_1.default.inverse(' ' + controls + ' '.repeat(Math.max(0, termWidth - stripAnsi(controls).length - 1))));
+    return { totalLines, visibleLines: visibleLines.length };
+}
 /**
  * Query genbox for BOTH socket files AND daemon session data in a SINGLE SSH call
  * This is much faster than making two separate SSH connections
@@ -459,13 +643,18 @@ async function collectSessionStates(options) {
         includeEnded: false,
     });
     debugLog(`collectSessionStates: got ${localSessions.length} local sessions (instant)`);
-    // Step 2: Fetch cloud genboxes from API (single API call)
+    // Step 2: Fetch cloud genboxes from API (single API call) with full details
     const apiStart = Date.now();
     let cloudGenboxes = [];
+    const genboxDetailsMap = new Map(); // Store full genbox details by name
     try {
         const response = await (0, api_1.fetchApi)('/genboxes');
-        cloudGenboxes = (Array.isArray(response) ? response : response?.genboxes || [])
-            .filter((g) => g.status === 'running');
+        const allGenboxes = (Array.isArray(response) ? response : response?.genboxes || []);
+        cloudGenboxes = allGenboxes.filter((g) => g.status === 'running');
+        // Store full genbox details for later use
+        for (const genbox of cloudGenboxes) {
+            genboxDetailsMap.set(genbox.name, genbox);
+        }
     }
     catch {
         // Ignore API errors
@@ -540,6 +729,25 @@ async function collectSessionStates(options) {
             displayStatus = daemonSession.status === 'active' ? 'running' :
                 daemonSession.status === 'idle' ? 'idle' : session.status;
         }
+        // Get full genbox details for cloud sessions
+        let genboxDetails = undefined;
+        if (session.type === 'cloud' && genboxName) {
+            const fullGenbox = genboxDetailsMap.get(genboxName);
+            if (fullGenbox) {
+                genboxDetails = {
+                    size: fullGenbox.size,
+                    creditsPerHour: fullGenbox.creditsPerHour,
+                    totalCreditsUsed: fullGenbox.totalCreditsUsed,
+                    totalHoursUsed: fullGenbox.totalHoursUsed,
+                    currentHourEnd: fullGenbox.currentHourEnd,
+                    lastActivityAt: fullGenbox.lastActivityAt,
+                    autoDestroyOnInactivity: fullGenbox.autoDestroyOnInactivity,
+                    protectedUntil: fullGenbox.protectedUntil,
+                    systemStats: fullGenbox.systemStats,
+                    urls: fullGenbox.urls,
+                };
+            }
+        }
         states.push({
             id: session.id.substring(0, 8),
             name: session.name,
@@ -560,6 +768,7 @@ async function collectSessionStates(options) {
             cost: daemonSession?.estimatedCostUsd,
             toolCalls: daemonSession?.toolUseCount,
             messagesCount: daemonSession?.messageCount,
+            genboxDetails,
         });
     }
     // Process cloud genboxes with combined socket + daemon data
@@ -599,6 +808,20 @@ async function collectSessionStates(options) {
                 displayStatus = daemonSession.status === 'active' ? 'running' :
                     daemonSession.status === 'idle' ? 'idle' : 'running';
             }
+            // Get full genbox details for this genbox
+            const fullGenbox = genboxDetailsMap.get(genbox.name);
+            const genboxDetails = fullGenbox ? {
+                size: fullGenbox.size,
+                creditsPerHour: fullGenbox.creditsPerHour,
+                totalCreditsUsed: fullGenbox.totalCreditsUsed,
+                totalHoursUsed: fullGenbox.totalHoursUsed,
+                currentHourEnd: fullGenbox.currentHourEnd,
+                lastActivityAt: fullGenbox.lastActivityAt,
+                autoDestroyOnInactivity: fullGenbox.autoDestroyOnInactivity,
+                protectedUntil: fullGenbox.protectedUntil,
+                systemStats: fullGenbox.systemStats,
+                urls: fullGenbox.urls,
+            } : undefined;
             states.push({
                 id: sessionName.substring(0, 8),
                 name: sessionName,
@@ -623,12 +846,27 @@ async function collectSessionStates(options) {
                 cost: daemonSession?.estimatedCostUsd,
                 toolCalls: daemonSession?.toolUseCount,
                 messagesCount: daemonSession?.messageCount,
+                genboxDetails,
             });
         }
         // If no sockets found but genbox is running, still show the genbox
         if (sockets.length === 0) {
             const hasSession = states.some(s => s.genbox === genbox.name);
             if (!hasSession && genbox.status === 'running' && options.status !== 'stopped') {
+                // Get full genbox details for this genbox
+                const fullGenbox = genboxDetailsMap.get(genbox.name);
+                const genboxDetails = fullGenbox ? {
+                    size: fullGenbox.size,
+                    creditsPerHour: fullGenbox.creditsPerHour,
+                    totalCreditsUsed: fullGenbox.totalCreditsUsed,
+                    totalHoursUsed: fullGenbox.totalHoursUsed,
+                    currentHourEnd: fullGenbox.currentHourEnd,
+                    lastActivityAt: fullGenbox.lastActivityAt,
+                    autoDestroyOnInactivity: fullGenbox.autoDestroyOnInactivity,
+                    protectedUntil: fullGenbox.protectedUntil,
+                    systemStats: fullGenbox.systemStats,
+                    urls: fullGenbox.urls,
+                } : undefined;
                 states.push({
                     id: genbox.id?.substring(0, 8) || 'unknown',
                     name: genbox.name,
@@ -638,6 +876,7 @@ async function collectSessionStates(options) {
                     status: 'running',
                     duration: formatDuration(genbox.createdAt),
                     createdAt: genbox.createdAt,
+                    genboxDetails,
                 });
             }
         }
@@ -895,8 +1134,8 @@ function renderFooter(termWidth) {
         '[q] Quit',
         '[r] Refresh',
         '[↑↓] Navigate',
-        '[⏎] Live',
-        '[d] Details',
+        '[⏎] Messages',
+        '[t] Terminal',
         '[l] Logs',
         '[a] Attach',
         '[s] Send',
@@ -906,83 +1145,278 @@ function renderFooter(termWidth) {
     console.log(chalk_1.default.dim(' ' + controls.join('  ')));
 }
 /**
- * Render detail view for a session
+ * Render detail view for a session (with scrolling)
  */
-function renderDetailView(session, termHeight, termWidth) {
+function renderDetailView(session, scrollOffset, termHeight, termWidth) {
     const lineWidth = Math.min(termWidth - 2, 120);
     if (!session) {
         console.log(chalk_1.default.dim('\n  No session selected.\n'));
         return;
     }
-    // Header
+    // Header (not scrollable - always shown at top)
     console.log(chalk_1.default.bold.inverse(' SESSION DETAILS ') + chalk_1.default.dim(' Press [Esc] or [Backspace] to go back'));
     console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
     console.log('');
-    // Session name and ID
-    const statusIcon = session.status === 'running' ? chalk_1.default.green('●') :
-        session.status === 'idle' ? chalk_1.default.yellow('●') :
-            session.status === 'stopped' ? chalk_1.default.red('●') : chalk_1.default.dim('○');
-    const stateIcon = session.state === 'thinking' ? '💭' :
-        session.state === 'executing_tool' ? '⚙️' :
-            session.state === 'waiting_for_input' ? '⌛' :
-                session.state === 'responding' ? '📝' : '';
-    console.log(chalk_1.default.bold(`  ${session.name}`) + chalk_1.default.dim(` (${session.id})`));
-    console.log('');
-    // Two-column layout
-    const col1Width = 30;
-    const col2Width = 40;
-    const rows = [
-        [chalk_1.default.dim('Provider:'), chalk_1.default.magenta(session.provider), chalk_1.default.dim('Status:'), `${statusIcon} ${session.status}`],
-        [chalk_1.default.dim('Type:'), session.type, chalk_1.default.dim('State:'), session.state ? `${stateIcon} ${session.state}` : chalk_1.default.dim('--')],
-        [chalk_1.default.dim('Genbox:'), chalk_1.default.cyan(session.genbox), chalk_1.default.dim('Duration:'), session.duration || '--'],
-        [chalk_1.default.dim('Created:'), session.createdAt ? new Date(session.createdAt).toLocaleString() : '--', '', ''],
-    ];
-    for (const row of rows) {
-        const left = `  ${row[0].padEnd(12)} ${String(row[1]).padEnd(col1Width - 14)}`;
-        const right = row[2] ? `${row[2].padEnd(12)} ${row[3]}` : '';
-        console.log(left + right);
-    }
-    console.log('');
-    console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
-    console.log(chalk_1.default.bold('  Metrics'));
-    console.log('');
-    // Metrics section
-    const metricsRows = [
-        [chalk_1.default.dim('Messages:'), `${session.messagesCount || 0}`, chalk_1.default.dim('Tool Calls:'), `${session.toolCalls || 0}`],
-        [chalk_1.default.dim('Input Tokens:'), session.inputTokens ? session.inputTokens.toLocaleString() : '--', chalk_1.default.dim('Output Tokens:'), session.outputTokens ? session.outputTokens.toLocaleString() : '--'],
-        [chalk_1.default.dim('Total Tokens:'), session.tokens ? `${session.tokens}k` : '--', chalk_1.default.dim('Cost:'), session.cost ? `$${session.cost.toFixed(2)}` : '--'],
-        [chalk_1.default.dim('Files Modified:'), `${session.filesModified || 0}`, '', ''],
-    ];
-    for (const row of metricsRows) {
-        const left = `  ${row[0].padEnd(16)} ${String(row[1]).padEnd(col1Width - 18)}`;
-        const right = row[2] ? `${row[2].padEnd(16)} ${row[3]}` : '';
-        console.log(left + right);
-    }
-    // Current tool if executing
-    if (session.state === 'executing_tool' && session.currentTool) {
+    // Capture all scrollable content to lines array
+    const lines = [];
+    const originalLog = console.log;
+    try {
+        // Override console.log to capture output
+        console.log = (...args) => {
+            lines.push(args.join(' '));
+        };
+        // Session name and ID
+        const statusIcon = session.status === 'running' ? chalk_1.default.green('●') :
+            session.status === 'idle' ? chalk_1.default.yellow('●') :
+                session.status === 'stopped' ? chalk_1.default.red('●') : chalk_1.default.dim('○');
+        const stateIcon = session.state === 'thinking' ? '💭' :
+            session.state === 'executing_tool' ? '⚙️' :
+                session.state === 'waiting_for_input' ? '⌛' :
+                    session.state === 'responding' ? '📝' : '';
+        console.log(chalk_1.default.bold(`  ${session.name}`) + chalk_1.default.dim(` (${session.id})`));
+        console.log('');
+        // Two-column layout
+        const col1Width = 30;
+        const col2Width = 40;
+        const rows = [
+            [chalk_1.default.dim('Provider:'), chalk_1.default.magenta(session.provider), chalk_1.default.dim('Status:'), `${statusIcon} ${session.status}`],
+            [chalk_1.default.dim('Type:'), session.type, chalk_1.default.dim('State:'), session.state ? `${stateIcon} ${session.state}` : chalk_1.default.dim('--')],
+            [chalk_1.default.dim('Genbox:'), chalk_1.default.cyan(session.genbox), chalk_1.default.dim('Duration:'), session.duration || '--'],
+            [chalk_1.default.dim('Created:'), session.createdAt ? new Date(session.createdAt).toLocaleString() : '--', '', ''],
+        ];
+        for (const row of rows) {
+            const left = `  ${row[0].padEnd(12)} ${String(row[1]).padEnd(col1Width - 14)}`;
+            const right = row[2] ? `${row[2].padEnd(12)} ${row[3]}` : '';
+            console.log(left + right);
+        }
         console.log('');
         console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
-        console.log(chalk_1.default.bold('  Current Tool'));
-        console.log(`  ${chalk_1.default.cyan(session.currentTool)}`);
-    }
-    // Last message preview
-    if (session.lastMessage) {
+        console.log(chalk_1.default.bold('  Metrics'));
+        console.log('');
+        // Metrics section
+        const metricsRows = [
+            [chalk_1.default.dim('Messages:'), `${session.messagesCount || 0}`, chalk_1.default.dim('Tool Calls:'), `${session.toolCalls || 0}`],
+            [chalk_1.default.dim('Input Tokens:'), session.inputTokens ? session.inputTokens.toLocaleString() : '--', chalk_1.default.dim('Output Tokens:'), session.outputTokens ? session.outputTokens.toLocaleString() : '--'],
+            [chalk_1.default.dim('Total Tokens:'), session.tokens ? `${session.tokens}k` : '--', chalk_1.default.dim('Cost:'), session.cost ? `$${session.cost.toFixed(2)}` : '--'],
+            [chalk_1.default.dim('Files Modified:'), `${session.filesModified || 0}`, '', ''],
+        ];
+        for (const row of metricsRows) {
+            const left = `  ${row[0].padEnd(16)} ${String(row[1]).padEnd(col1Width - 18)}`;
+            const right = row[2] ? `${row[2].padEnd(16)} ${row[3]}` : '';
+            console.log(left + right);
+        }
+        // Current tool if executing
+        if (session.state === 'executing_tool' && session.currentTool) {
+            console.log('');
+            console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
+            console.log(chalk_1.default.bold('  Current Tool'));
+            console.log(`  ${chalk_1.default.cyan(session.currentTool)}`);
+        }
+        // Last message preview
+        if (session.lastMessage) {
+            console.log('');
+            console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
+            console.log(chalk_1.default.bold('  Last Message'));
+            console.log(chalk_1.default.dim(`  "${session.lastMessage}..."`));
+        }
+        // Genbox details (for cloud sessions)
+        if (session.type === 'cloud' && session.genboxDetails) {
+            const details = session.genboxDetails;
+            // Billing section
+            if (details.size || details.creditsPerHour !== undefined) {
+                console.log('');
+                console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
+                console.log(chalk_1.default.bold('  Billing'));
+                console.log('');
+                if (details.size && details.creditsPerHour !== undefined) {
+                    const plural = details.creditsPerHour > 1 ? 's' : '';
+                    console.log(`  ${chalk_1.default.dim('Size:')} ${details.size} (${details.creditsPerHour} credit${plural}/hr)`);
+                }
+                if (details.currentHourEnd) {
+                    const now = new Date();
+                    const currentHourEnd = new Date(details.currentHourEnd);
+                    const minutesUntilBilling = Math.max(0, Math.ceil((currentHourEnd.getTime() - now.getTime()) / (60 * 1000)));
+                    console.log(`  ${chalk_1.default.dim('Current hour ends in:')} ${chalk_1.default.cyan(formatTimeRemaining(minutesUntilBilling))}`);
+                }
+                if (details.lastActivityAt) {
+                    const now = new Date();
+                    const lastActivity = new Date(details.lastActivityAt);
+                    const minutesInactive = Math.floor((now.getTime() - lastActivity.getTime()) / (60 * 1000));
+                    const activityStr = minutesInactive < 1 ? 'just now' : minutesInactive + ' min ago';
+                    console.log(`  ${chalk_1.default.dim('Last activity:')} ${activityStr}`);
+                }
+                if (details.totalHoursUsed !== undefined && details.totalCreditsUsed !== undefined) {
+                    const hourPlural = details.totalHoursUsed !== 1 ? 's' : '';
+                    const creditPlural = details.totalCreditsUsed !== 1 ? 's' : '';
+                    console.log(`  ${chalk_1.default.dim('Total:')} ${details.totalHoursUsed} hour${hourPlural}, ${details.totalCreditsUsed} credit${creditPlural}`);
+                }
+                // Auto-destroy status
+                if (details.autoDestroyOnInactivity !== undefined) {
+                    const now = new Date();
+                    // Check if protected from auto-destroy
+                    if (details.protectedUntil) {
+                        const protectedTime = new Date(details.protectedUntil);
+                        const minutesUntilProtectionEnds = Math.ceil((protectedTime.getTime() - now.getTime()) / (60 * 1000));
+                        if (minutesUntilProtectionEnds > 0) {
+                            const timeStr = formatTimeRemaining(minutesUntilProtectionEnds);
+                            console.log(`  ${chalk_1.default.green('Protected from auto-destroy for:')} ${timeStr}`);
+                        }
+                    }
+                    // Auto-destroy status (only show if NOT protected and enabled)
+                    if (details.autoDestroyOnInactivity && details.currentHourEnd) {
+                        const isProtected = details.protectedUntil && new Date(details.protectedUntil).getTime() > now.getTime();
+                        if (!isProtected) {
+                            const currentHourEnd = new Date(details.currentHourEnd);
+                            const currentHourStart = new Date(currentHourEnd.getTime() - 60 * 60 * 1000);
+                            const minutesIntoBillingHour = Math.floor((now.getTime() - currentHourStart.getTime()) / (60 * 1000));
+                            const minutesUntilDestroy = Math.max(0, 58 - minutesIntoBillingHour);
+                            // Check if there was activity after the 50 min mark
+                            const fiftyMinMark = new Date(currentHourStart.getTime() + 50 * 60 * 1000);
+                            const lastActivity = details.lastActivityAt ? new Date(details.lastActivityAt) : null;
+                            const wasActiveAfter50Min = lastActivity ? lastActivity.getTime() >= fiftyMinMark.getTime() : false;
+                            // Auto-destroy is paused if we're past 50min mark AND there was activity after 50min
+                            const isAutoDestroyPaused = minutesIntoBillingHour >= 50 && wasActiveAfter50Min;
+                            if (isAutoDestroyPaused) {
+                                console.log(`  ${chalk_1.default.green('Auto-destroy:')} paused`);
+                            }
+                            else {
+                                const lastActivityMinutes = lastActivity ? Math.floor((now.getTime() - lastActivity.getTime()) / (60 * 1000)) : 0;
+                                if (lastActivityMinutes >= 5) {
+                                    console.log(`  ${chalk_1.default.yellow('Auto-destroy in:')} ${minutesUntilDestroy} min (inactive)`);
+                                }
+                                else {
+                                    console.log(`  ${chalk_1.default.dim('Auto-destroy:')} ${minutesUntilDestroy} min`);
+                                }
+                            }
+                        }
+                    }
+                    else if (!details.autoDestroyOnInactivity) {
+                        console.log(`  ${chalk_1.default.dim('Auto-destroy:')} disabled`);
+                    }
+                }
+            }
+            // System Stats section
+            if (details.systemStats) {
+                const stats = details.systemStats;
+                console.log('');
+                console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
+                console.log(chalk_1.default.bold('  System Stats'));
+                console.log('');
+                // Load average
+                if (stats.loadAvg && stats.loadAvg.length >= 3) {
+                    const [load1, load5, load15] = stats.loadAvg;
+                    console.log(`  ${chalk_1.default.dim('Load Avg:')}  ${load1.toFixed(2)}, ${load5.toFixed(2)}, ${load15.toFixed(2)}`);
+                }
+                // Memory
+                if (stats.memoryUsagePercent !== undefined) {
+                    const memUsed = stats.memoryUsedMb ? `${(stats.memoryUsedMb / 1024).toFixed(1)}G` : '?';
+                    const memTotal = stats.memoryTotalMb ? `${(stats.memoryTotalMb / 1024).toFixed(1)}G` : '?';
+                    const memBar = renderBar(stats.memoryUsagePercent);
+                    console.log(`  ${chalk_1.default.dim('Memory:')}    ${memBar} ${stats.memoryUsagePercent}% (${memUsed}/${memTotal})`);
+                }
+                // Disk
+                if (stats.diskUsagePercent !== undefined) {
+                    const diskUsed = stats.diskUsedGb !== undefined ? `${stats.diskUsedGb}G` : '?';
+                    const diskTotal = stats.diskTotalGb !== undefined ? `${stats.diskTotalGb}G` : '?';
+                    const diskBar = renderBar(stats.diskUsagePercent);
+                    console.log(`  ${chalk_1.default.dim('Disk:')}      ${diskBar} ${stats.diskUsagePercent}% (${diskUsed}/${diskTotal})`);
+                }
+                // Uptime
+                if (stats.uptimeSeconds !== undefined) {
+                    const days = Math.floor(stats.uptimeSeconds / 86400);
+                    const hours = Math.floor((stats.uptimeSeconds % 86400) / 3600);
+                    const mins = Math.floor((stats.uptimeSeconds % 3600) / 60);
+                    const uptimeStr = days > 0 ? `${days}d ${hours}h ${mins}m` : hours > 0 ? `${hours}h ${mins}m` : `${mins}m`;
+                    console.log(`  ${chalk_1.default.dim('Uptime:')}    ${uptimeStr}`);
+                }
+                // Process count
+                if (stats.processCount !== undefined) {
+                    console.log(`  ${chalk_1.default.dim('Processes:')} ${stats.processCount}`);
+                }
+                // Stats age
+                if (stats.updatedAt) {
+                    const now = new Date();
+                    const statsAge = Math.floor((now.getTime() - new Date(stats.updatedAt).getTime()) / 1000);
+                    const ageStr = statsAge < 60 ? 'just now' : Math.floor(statsAge / 60) + 'm ago';
+                    console.log(chalk_1.default.dim(`  (updated ${ageStr})`));
+                }
+            }
+            // Docker Services section
+            if (details.systemStats?.dockerServices && details.systemStats.dockerServices.length > 0) {
+                console.log('');
+                console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
+                console.log(chalk_1.default.bold('  Docker Services'));
+                console.log('');
+                console.log('  ' + 'NAME'.padEnd(30) + 'STATUS');
+                for (const svc of details.systemStats.dockerServices) {
+                    const healthBadge = svc.health
+                        ? (svc.health === 'healthy' ? chalk_1.default.green(' ✓') : chalk_1.default.red(` (${svc.health})`))
+                        : '';
+                    console.log(`  ${svc.name.padEnd(30)}${svc.status}${healthBadge}`);
+                }
+            }
+            // PM2 Services section
+            if (details.systemStats?.pm2Services && details.systemStats.pm2Services.length > 0) {
+                console.log('');
+                console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
+                console.log(chalk_1.default.bold('  PM2 Services'));
+                console.log('');
+                console.log('  ' + 'NAME'.padEnd(20) + 'STATUS'.padEnd(16) + 'CPU'.padEnd(8) + 'MEM');
+                for (const app of details.systemStats.pm2Services) {
+                    const statusColor = app.status === 'online' ? chalk_1.default.green :
+                        app.status === 'stopped' ? chalk_1.default.yellow : chalk_1.default.red;
+                    const memoryMb = app.memory ? (app.memory > 10000 ? Math.round(app.memory / (1024 * 1024)) : app.memory) : 0;
+                    console.log(`  ${app.name.padEnd(20)}${statusColor(app.status.padEnd(16))}${(app.cpu || 0) + '%'}`.padEnd(28) + `${memoryMb}MB`);
+                }
+            }
+            // Service URLs section
+            if (details.urls && Object.keys(details.urls).length > 0) {
+                console.log('');
+                console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
+                console.log(chalk_1.default.bold('  Service URLs'));
+                console.log('');
+                for (const [service, url] of Object.entries(details.urls)) {
+                    console.log(`  ${service}: ${chalk_1.default.cyan(url)}`);
+                }
+            }
+        }
+        // Actions
         console.log('');
         console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
-        console.log(chalk_1.default.bold('  Last Message'));
-        console.log(chalk_1.default.dim(`  "${session.lastMessage}..."`));
+        console.log(chalk_1.default.bold('  Quick Actions'));
+        console.log('');
+        console.log(chalk_1.default.dim('  Press: ') +
+            chalk_1.default.cyan('[a]') + chalk_1.default.dim(' Attach  ') +
+            chalk_1.default.cyan('[l]') + chalk_1.default.dim(' Logs  ') +
+            chalk_1.default.cyan('[s]') + chalk_1.default.dim(' Send prompt  ') +
+            chalk_1.default.cyan('[Esc]') + chalk_1.default.dim(' Back'));
+        console.log('');
+    }
+    finally {
+        // Always restore console.log
+        console.log = originalLog;
+    }
+    // Calculate visible area (reserve 5 lines for header/footer)
+    const headerLines = 3;
+    const footerLines = 2;
+    const availableLines = termHeight - headerLines - footerLines;
+    // Calculate total content height and visible window
+    const totalLines = lines.length;
+    const maxScrollOffset = Math.max(0, totalLines - availableLines);
+    // Clamp scroll offset
+    const clampedOffset = Math.min(scrollOffset, maxScrollOffset);
+    // Display visible portion of content
+    const visibleLines = lines.slice(clampedOffset, clampedOffset + availableLines);
+    for (const line of visibleLines) {
+        console.log(line);
+    }
+    // Show scroll indicator if content exceeds visible area
+    if (totalLines > availableLines) {
+        const scrollPercentage = Math.round((clampedOffset / maxScrollOffset) * 100);
+        const scrollIndicator = chalk_1.default.dim(`[${clampedOffset + 1}-${Math.min(clampedOffset + availableLines, totalLines)}/${totalLines}] ${scrollPercentage}% ↑↓ to scroll`);
+        console.log('');
+        console.log(scrollIndicator);
     }
-    // Actions
-    console.log('');
-    console.log(chalk_1.default.dim('─'.repeat(lineWidth)));
-    console.log(chalk_1.default.bold('  Quick Actions'));
-    console.log('');
-    console.log(chalk_1.default.dim('  Press: ') +
-        chalk_1.default.cyan('[a]') + chalk_1.default.dim(' Attach  ') +
-        chalk_1.default.cyan('[l]') + chalk_1.default.dim(' Logs  ') +
-        chalk_1.default.cyan('[s]') + chalk_1.default.dim(' Send prompt  ') +
-        chalk_1.default.cyan('[Esc]') + chalk_1.default.dim(' Back'));
-    console.log('');
 }
 /**
  * Render detail view footer
@@ -1099,8 +1533,8 @@ function processTerminalOutput(output, maxLines) {
     return lines;
 }
 /**
- * Process terminal output for full display - minimal deduplication, preserve all content
- * This is used for live view where we want to show as much as possible
+ * Process terminal output for full display - aggressive deduplication of status lines
+ * This is used for live view where we want clean, readable output
  */
 function processTerminalOutputFull(output, maxLines) {
     // Remove script headers
@@ -1152,48 +1586,100 @@ function processTerminalOutputFull(output, maxLines) {
         .replace(/\[\d*J/g, '')
         .replace(/\r\n/g, '\n')
         .replace(/\r/g, '\n')
-        .replace(/\n{4,}/g, '\n\n\n'); // Keep some blank lines for spacing
+        .replace(/\n{3,}/g, '\n\n'); // Reduce multiple blank lines
     // Split into lines
     const rawLines = lastFrame.split('\n');
-    // Create a signature for deduplication that ignores timestamps and token counts
-    // Status lines like "Computing... (esc to interrupt · 43s · ↓ 1.2k tokens)" should dedupe
+    // Create a signature for deduplication - extract just the core content
+    // Status lines like "* Fixing foo... (esc to interrupt · 14m 54s · ↓ 11.4k tokens · thinking)"
+    // should all dedupe to the same signature
     const getLineSignature = (line) => {
-        return line
+        let sig = line
             // Remove ANSI codes for comparison
             .replace(/\x1B\[[0-9;]*m/g, '')
-            // Remove timing info (43s, 1m 30s, etc.)
-            .replace(/\d+s\b/g, '')
+            // Remove leading spinner characters (*, +, ·, -, etc.)
+            .replace(/^[*+·\-•○●◐◑◒◓⠋⠙⠹⠸⠼⠴⠦⠧⠇⠏]\s*/, '')
+            // Remove everything in parentheses (timing, token counts, state, etc.)
+            .replace(/\([^)]*\)/g, '')
+            // Remove timing info anywhere: 14m 54s, 43s, etc.
             .replace(/\d+m\s*\d*s?/g, '')
-            // Remove token counts (1.2k, 20.0k, etc.)
+            .replace(/\d+s\b/g, '')
+            // Remove token counts: ↓ 11.4k tokens, 1.2k, etc.
+            .replace(/[↓↑]\s*[\d.]+k?\s*tokens?/gi, '')
             .replace(/[\d.]+k\s*tokens?/gi, '')
-            // Remove arrows and special chars used in status
-            .replace(/[↓↑·]/g, '')
+            // Remove special status characters
+            .replace(/[↓↑·│├└─]/g, '')
+            // Remove "timeout: Xm Xs" pattern
+            .replace(/timeout:\s*\d+m?\s*\d*s?/gi, '')
             // Normalize whitespace
             .replace(/\s+/g, ' ')
             .trim();
+        return sig;
     };
-    // Deduplicate similar lines (keep only the last occurrence of each pattern)
-    const seenSignatures = new Map(); // signature -> last index
-    for (let i = 0; i < rawLines.length; i++) {
-        const sig = getLineSignature(rawLines[i]);
-        if (sig.length > 5) { // Only dedupe lines with meaningful content
-            seenSignatures.set(sig, i);
-        }
-    }
-    // Build result keeping only unique lines or last occurrence of duplicates
+    // Check if a line is just noise (empty, only punctuation, or prompt chars)
+    const isNoiseLine = (line) => {
+        const stripped = line
+            .replace(/\x1B\[[0-9;]*m/g, '')
+            .trim();
+        // Empty or just whitespace
+        if (!stripped)
+            return true;
+        // Just prompt characters like ">", "$ ", etc.
+        if (/^[>$%#│├└─\s]*$/.test(stripped))
+            return true;
+        // Just a single character
+        if (stripped.length <= 1)
+            return true;
+        return false;
+    };
+    // Build result keeping only unique meaningful lines (latest occurrence)
     const lines = [];
-    const usedSignatures = new Set();
-    // Process in reverse to keep the LAST occurrence
+    const usedSignatures = []; // Array of signatures we've seen
+    // Process in reverse to keep the LAST occurrence of each unique line
     for (let i = rawLines.length - 1; i >= 0 && lines.length < maxLines; i--) {
         const line = rawLines[i];
+        // Skip noise lines
+        if (isNoiseLine(line))
+            continue;
         const sig = getLineSignature(line);
-        // Keep if: short signature (spacing), empty, or first time seeing this signature
-        if (sig.length <= 5 || !usedSignatures.has(sig)) {
-            lines.unshift(line);
-            if (sig.length > 5) {
-                usedSignatures.add(sig);
+        // Skip completely empty signatures
+        if (!sig || sig.length === 0) {
+            continue;
+        }
+        // Check for exact match or similar prefix (aggressive deduplication)
+        // Use shorter prefix match (30 chars) to catch more duplicates
+        const prefixLen = Math.min(30, sig.length);
+        const shortSig = sig.substring(0, prefixLen);
+        let isDuplicate = false;
+        for (const existingSig of usedSignatures) {
+            // Exact match
+            if (existingSig === sig) {
+                isDuplicate = true;
+                break;
             }
+            // Prefix match - if both sigs are long enough, compare first 30 chars
+            if (existingSig.length >= prefixLen && sig.length >= prefixLen) {
+                if (existingSig.substring(0, prefixLen) === shortSig) {
+                    isDuplicate = true;
+                    break;
+                }
+            }
+            // Fuzzy match - check if one sig contains the other (for very similar lines)
+            if (sig.length > 10 && existingSig.length > 10) {
+                if (existingSig.includes(sig) || sig.includes(existingSig)) {
+                    isDuplicate = true;
+                    break;
+                }
+            }
+        }
+        if (isDuplicate) {
+            continue;
         }
+        lines.unshift(line);
+        usedSignatures.push(sig);
+    }
+    // If we filtered too aggressively and have nothing, return original (limited)
+    if (lines.length === 0 && rawLines.length > 0) {
+        return rawLines.filter(l => !isNoiseLine(l)).slice(-maxLines);
     }
     return lines;
 }
@@ -1262,6 +1748,7 @@ function renderLiveView(session, output, activityLog, termHeight, termWidth) {
     }
     // Footer at bottom - compact status bar
     const controls = chalk_1.default.dim('[Esc]') + ' Back  ' +
+        chalk_1.default.dim('[m]') + ' Messages  ' +
         chalk_1.default.dim('[l]') + ' Logs  ' +
         chalk_1.default.dim('[a]') + ' Attach  ' +
         chalk_1.default.dim('[s]') + ' Send  ' +
@@ -1527,9 +2014,13 @@ async function runTuiMode(options) {
     let liveOutputCache = '';
     let liveActivityCache = '';
     let liveViewPoller = null;
+    let messagesCache = [];
+    let messagesViewPoller = null;
+    let messagesScrollOffset = 0;
     let logsCache = [];
     let logsViewPoller = null;
     let logsScrollOffset = 0; // For pagination - 0 means show latest
+    let detailScrollOffset = 0; // For detail view scrolling - 0 means show from top
     const filters = {
         provider: options.provider,
         status: options.status,
@@ -1575,14 +2066,17 @@ async function runTuiMode(options) {
         const termWidth = process.stdout.columns || 80;
         // Move cursor to home and clear screen
         process.stdout.write('\x1B[H\x1B[J');
-        if (viewMode === 'live') {
+        if (viewMode === 'messages') {
+            renderMessagesView(cachedSessions[selectedIndex], messagesCache, messagesScrollOffset, termHeight, termWidth);
+        }
+        else if (viewMode === 'live') {
             renderLiveView(cachedSessions[selectedIndex], liveOutputCache, liveActivityCache, termHeight, termWidth);
         }
         else if (viewMode === 'logs') {
             renderLogsView(cachedSessions[selectedIndex], logsCache, logsScrollOffset, termHeight, termWidth);
         }
         else if (viewMode === 'detail') {
-            renderDetailView(cachedSessions[selectedIndex], termHeight, termWidth);
+            renderDetailView(cachedSessions[selectedIndex], detailScrollOffset, termHeight, termWidth);
             renderDetailFooter(termWidth);
         }
         else {
@@ -1687,6 +2181,51 @@ async function runTuiMode(options) {
             logsViewPoller = null;
         }
     };
+    // Start messages polling for current session
+    const startMessagesPolling = () => {
+        if (messagesViewPoller)
+            return;
+        const session = cachedSessions[selectedIndex];
+        if (!session || !session.genbox)
+            return;
+        messagesViewPoller = setInterval(async () => {
+            if (viewMode !== 'messages') {
+                stopMessagesPolling();
+                return;
+            }
+            try {
+                const messages = await queryGenboxDaemonMessages(session.genbox, 'latest', 200);
+                if (messages && messages.length > 0) {
+                    // Only update if at latest (not scrolled up) or if new messages
+                    if (messagesScrollOffset === 0 || messages.length > messagesCache.length) {
+                        messagesCache = messages;
+                        quickRender();
+                    }
+                }
+            }
+            catch {
+                // Ignore errors, keep trying
+            }
+        }, 2000);
+        // Fetch immediately
+        (async () => {
+            try {
+                const messages = await queryGenboxDaemonMessages(session.genbox, 'latest', 200);
+                messagesCache = messages || [];
+                quickRender();
+            }
+            catch {
+                // Ignore
+            }
+        })();
+    };
+    // Stop messages polling
+    const stopMessagesPolling = () => {
+        if (messagesViewPoller) {
+            clearInterval(messagesViewPoller);
+            messagesViewPoller = null;
+        }
+    };
     // Quick render: just redraw UI with cached data (instant, for navigation)
     const quickRender = () => {
         // Clamp selected index
@@ -1743,6 +2282,7 @@ async function runTuiMode(options) {
     const cleanup = () => {
         stopLivePolling();
         stopLogsPolling();
+        stopMessagesPolling();
         if (process.stdin.isTTY) {
             process.stdin.setRawMode(false);
         }
@@ -1866,11 +2406,124 @@ async function runTuiMode(options) {
                 quickRender();
                 return;
             }
+            else if (key === 'm') { // Switch to messages view (JSONL based)
+                stopLivePolling();
+                viewMode = 'messages';
+                messagesCache = [];
+                startMessagesPolling();
+                quickRender();
+                return;
+            }
+            return;
+        }
+        // Handle messages view mode
+        if (viewMode === 'messages') {
+            if (key === '\u001b' || key === '\u007f' || key === '\u001b[D') { // Escape, Backspace, or Left arrow
+                stopMessagesPolling();
+                viewMode = 'list';
+                quickRender();
+                return;
+            }
+            else if (key === 'q' || key === '\u0003') { // q or Ctrl+C
+                stopMessagesPolling();
+                running = false;
+                cleanup();
+                process.exit(0);
+            }
+            else if (key === 'r') { // Refresh messages
+                const session = cachedSessions[selectedIndex];
+                if (session && session.genbox) {
+                    messagesScrollOffset = 0; // Reset to latest on refresh
+                    (async () => {
+                        try {
+                            const messages = await queryGenboxDaemonMessages(session.genbox, 'latest', 200);
+                            messagesCache = messages || [];
+                            quickRender();
+                        }
+                        catch {
+                            // Ignore
+                        }
+                    })();
+                }
+                return;
+            }
+            else if (key === '\u001b[A') { // Up arrow - scroll up (older)
+                const totalLines = messagesCache.reduce((acc, msg) => acc + formatMessageLine(msg, process.stdout.columns || 80).length, 0);
+                messagesScrollOffset = Math.min(messagesScrollOffset + 5, Math.max(0, totalLines - 5));
+                quickRender();
+                return;
+            }
+            else if (key === '\u001b[B') { // Down arrow - scroll down (newer)
+                messagesScrollOffset = Math.max(0, messagesScrollOffset - 5);
+                quickRender();
+                return;
+            }
+            else if (key === '\u001b[H' || key === '\u001b[1~') { // Home - jump to oldest
+                const totalLines = messagesCache.reduce((acc, msg) => acc + formatMessageLine(msg, process.stdout.columns || 80).length, 0);
+                messagesScrollOffset = Math.max(0, totalLines - 10);
+                quickRender();
+                return;
+            }
+            else if (key === '\u001b[F' || key === '\u001b[4~') { // End - jump to latest
+                messagesScrollOffset = 0;
+                quickRender();
+                return;
+            }
+            else if (key === 's') { // Send prompt
+                const session = lastSessions[selectedIndex];
+                if (session) {
+                    stopMessagesPolling();
+                    cleanup();
+                    console.log(chalk_1.default.cyan(`\nSending prompt to ${session.name}...`));
+                    try {
+                        (0, child_process_1.execSync)(`gb session send ${session.name} -e`, { stdio: 'inherit' });
+                    }
+                    catch {
+                        // Session might have ended
+                    }
+                    process.exit(0);
+                }
+                return;
+            }
+            else if (key === 'l') { // Switch to logs view from messages view
+                stopMessagesPolling();
+                logsScrollOffset = 0;
+                viewMode = 'logs';
+                logsCache = [];
+                startLogsPolling();
+                quickRender();
+                return;
+            }
+            else if (key === 't') { // Switch to terminal view (live dtach)
+                stopMessagesPolling();
+                viewMode = 'live';
+                liveOutputCache = '';
+                startLivePolling();
+                quickRender();
+                return;
+            }
+            else if (key === 'a') { // Attach from messages view
+                const session = lastSessions[selectedIndex];
+                if (session) {
+                    stopMessagesPolling();
+                    cleanup();
+                    console.log(chalk_1.default.cyan(`\nAttaching to ${session.name}...`));
+                    try {
+                        (0, child_process_1.execSync)(`gb session attach ${session.name}`, { stdio: 'inherit' });
+                    }
+                    catch {
+                        // Session might have ended
+                    }
+                    process.exit(0);
+                }
+                return;
+            }
             return;
         }
         // Handle detail view mode
         if (viewMode === 'detail') {
             if (key === '\u001b' || key === '\u007f' || key === '\u001b[D') { // Escape, Backspace, or Left arrow
+                detailScrollOffset = 0; // Reset scroll on exit
                 viewMode = 'list';
                 quickRender();
                 return;
@@ -1880,7 +2533,40 @@ async function runTuiMode(options) {
                 cleanup();
                 process.exit(0);
             }
+            else if (key === '\u001b[A') { // Up arrow - scroll up
+                detailScrollOffset = Math.max(0, detailScrollOffset - 1);
+                quickRender();
+                return;
+            }
+            else if (key === '\u001b[B') { // Down arrow - scroll down
+                detailScrollOffset = detailScrollOffset + 1;
+                quickRender();
+                return;
+            }
+            else if (key === '\u001b[5~') { // Page Up - scroll up one page
+                const pageSize = Math.max(10, (process.stdout.rows || 24) - 10);
+                detailScrollOffset = Math.max(0, detailScrollOffset - pageSize);
+                quickRender();
+                return;
+            }
+            else if (key === '\u001b[6~') { // Page Down - scroll down one page
+                const pageSize = Math.max(10, (process.stdout.rows || 24) - 10);
+                detailScrollOffset = detailScrollOffset + pageSize;
+                quickRender();
+                return;
+            }
+            else if (key === '\u001b[H' || key === '\u001bOH' || key === '\u001b[1~') { // Home - jump to top
+                detailScrollOffset = 0;
+                quickRender();
+                return;
+            }
+            else if (key === '\u001b[F' || key === '\u001bOF' || key === '\u001b[4~') { // End - jump to bottom
+                detailScrollOffset = 999999; // Will be clamped in renderDetailView
+                quickRender();
+                return;
+            }
             else if (key === 'r') { // Refresh
+                detailScrollOffset = 0;
                 await render(true); // Force refresh
             }
             else if (key === 'a') { // Attach from detail view
@@ -1921,6 +2607,16 @@ async function runTuiMode(options) {
                     process.exit(0);
                 }
             }
+            else if (key === 'm') { // Messages view from detail view
+                const session = cachedSessions[selectedIndex];
+                if (session && session.genbox) {
+                    viewMode = 'messages';
+                    messagesCache = [];
+                    startMessagesPolling();
+                    quickRender();
+                }
+                return;
+            }
             return;
         }
         // Handle logs view mode
@@ -2013,23 +2709,35 @@ async function runTuiMode(options) {
             cleanup();
             process.exit(0);
         }
-        else if (key === '\r') { // Enter - show live terminal output in TUI
+        else if (key === '\r') { // Enter - show messages view (JSONL based)
             const session = cachedSessions[selectedIndex];
             if (session && session.genbox) {
-                viewMode = 'live';
-                liveOutputCache = '';
-                liveActivityCache = '';
-                startLivePolling();
+                viewMode = 'messages';
+                messagesScrollOffset = 0;
+                messagesCache = [];
+                startMessagesPolling();
                 quickRender();
             }
             else if (session) {
                 // Local session - fall back to detail view
+                detailScrollOffset = 0;
                 viewMode = 'detail';
                 quickRender();
             }
         }
+        else if (key === 't') { // 't' for terminal/live view
+            const session = cachedSessions[selectedIndex];
+            if (session && session.genbox) {
+                viewMode = 'live';
+                liveOutputCache = '';
+                liveActivityCache = '';
+                startLivePolling();
+                quickRender();
+            }
+        }
         else if (key === 'd') { // 'd' for detail view
             if (cachedSessions[selectedIndex]) {
+                detailScrollOffset = 0;
                 viewMode = 'detail';
                 quickRender();
             }
@@ -2070,6 +2778,7 @@ async function runTuiMode(options) {
             }
             else if (session) {
                 // Local session without genbox - fall back to detail view
+                detailScrollOffset = 0;
                 viewMode = 'detail';
                 quickRender();
             }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "genbox",
-  "version": "1.0.226",
+  "version": "1.0.227",
   "description": "Genbox CLI - AI-Powered Development Environments",
   "main": "dist/index.js",
   "bin": {