attocode 0.1.7 → 0.1.8

package/dist/src/tui/app.js

@@ -10,9 +10,10 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
  */
 import { useState, useCallback, useEffect, memo, useRef, useMemo } from 'react';
 import { Box, Text, useApp, useInput, Static } from 'ink';
-import { DiffView } from './components/DiffView.js';
 import { ActiveAgentsPanel } from './components/ActiveAgentsPanel.js';
 import { TasksPanel } from './components/TasksPanel.js';
+import { ToolCallItem } from './components/ToolCallItem.js';
+import { DebugPanel, useDebugBuffer } from './components/DebugPanel.js';
 import { getTheme, getThemeNames } from './theme/index.js';
 import { ControlledCommandPalette } from './input/CommandPalette.js';
 import { ApprovalDialog } from './components/ApprovalDialog.js';
@@ -20,6 +21,7 @@ import { TransparencyAggregator } from './transparency-aggregator.js';
 import { handleSkillsCommand } from '../commands/skills-commands.js';
 import { handleAgentsCommand } from '../commands/agents-commands.js';
 import { handleInitCommand } from '../commands/init-commands.js';
+import { createHistoryManager } from '../integrations/history.js';
 // =============================================================================
 // PATTERN GENERATION FOR ALWAYS-ALLOW
 // =============================================================================
@@ -59,98 +61,34 @@ const MessageItem = memo(function MessageItem({ msg, colors }) {
     const label = isUser ? 'You' : isAssistant ? 'Assistant' : isError ? 'Error' : 'System';
     return (_jsxs(Box, { marginBottom: 1, flexDirection: "column", children: [_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: roleColor, bold: true, children: icon }), _jsx(Text, { color: roleColor, bold: true, children: label }), _jsx(Text, { color: colors.textMuted, dimColor: true, children: ` ${msg.ts.toLocaleTimeString('en-US', { hour: '2-digit', minute: '2-digit' })}` })] }), _jsx(Box, { marginLeft: 2, children: _jsx(Text, { wrap: "wrap", color: isError ? colors.error : colors.text, children: msg.content }) })] }));
 });
-const ToolCallItem = memo(function ToolCallItem({ tc, expanded, colors }) {
-    const icon = tc.status === 'success' ? '[OK]' : tc.status === 'error' ? '[X]' : tc.status === 'running' ? '[~]' : '[ ]';
-    const statusColor = tc.status === 'success' ? '#98FB98' : tc.status === 'error' ? '#FF6B6B' : tc.status === 'running' ? '#87CEEB' : colors.textMuted;
-    // Compact formatting for collapsed view
-    const formatToolArgsCompact = (args) => {
-        const entries = Object.entries(args);
-        if (entries.length === 0)
-            return '';
-        if (entries.length === 1) {
-            const [key, val] = entries[0];
-            const valStr = typeof val === 'string' ? val : JSON.stringify(val);
-            return valStr.length > 50 ? `${key}: ${valStr.slice(0, 47)}...` : `${key}: ${valStr}`;
-        }
-        return `{${entries.length} args}`;
-    };
-    // Expanded formatting - each arg on its own line with proper handling
-    const formatToolArgsExpanded = (args) => {
-        const entries = Object.entries(args);
-        if (entries.length === 0)
-            return [];
-        return entries.map(([key, val]) => {
-            let valStr;
-            if (typeof val === 'string') {
-                // For strings, show with quotes, handle multiline
-                if (val.includes('\n')) {
-                    const lines = val.split('\n');
-                    if (lines.length > 3) {
-                        valStr = `"${lines.slice(0, 3).join('\\n')}..." (${lines.length} lines)`;
-                    }
-                    else {
-                        valStr = `"${val.replace(/\n/g, '\\n')}"`;
-                    }
-                }
-                else if (val.length > 100) {
-                    valStr = `"${val.slice(0, 97)}..."`;
-                }
-                else {
-                    valStr = `"${val}"`;
-                }
-            }
-            else if (typeof val === 'object' && val !== null) {
-                const json = JSON.stringify(val, null, 2);
-                if (json.length > 200) {
-                    valStr = JSON.stringify(val).slice(0, 197) + '...';
-                }
-                else {
-                    valStr = json;
-                }
-            }
-            else {
-                valStr = String(val);
-            }
-            return `${key}: ${valStr}`;
-        });
-    };
-    const argsStr = formatToolArgsCompact(tc.args);
-    if (expanded) {
-        const expandedArgs = formatToolArgsExpanded(tc.args);
-        return (_jsxs(Box, { marginLeft: 2, flexDirection: "column", children: [_jsxs(Box, { gap: 1, children: [_jsx(Text, { color: statusColor, children: icon }), _jsx(Text, { color: "#DDA0DD", bold: true, children: tc.name }), tc.duration ? _jsxs(Text, { color: colors.textMuted, dimColor: true, children: ["(", tc.duration, "ms)"] }) : null] }), expandedArgs.map((argLine, i) => (_jsx(Box, { marginLeft: 3, children: _jsx(Text, { color: "#87CEEB", dimColor: true, children: argLine }) }, i))), tc.status === 'success' && tc.result !== undefined && tc.result !== null ? (_jsx(Box, { marginLeft: 3, flexDirection: "column", children: (tc.name === 'edit_file' || tc.name === 'write_file') &&
-                        typeof tc.result === 'object' && tc.result !== null &&
-                        'metadata' in tc.result &&
-                        typeof tc.result.metadata?.diff === 'string' ? (_jsx(DiffView, { diff: tc.result.metadata.diff, expanded: true, maxLines: 15 })) : (_jsx(Text, { color: "#98FB98", dimColor: true, children: `-> ${String(tc.result).slice(0, 150)}${String(tc.result).length > 150 ? '...' : ''}` })) })) : null, tc.status === 'error' && tc.error && (_jsx(Box, { marginLeft: 3, children: _jsx(Text, { color: "#FF6B6B", children: `x ${tc.error}` }) }))] }));
-    }
-    // Check if result has diff metadata for collapsed summary
-    const hasDiff = tc.status === 'success' &&
-        (tc.name === 'edit_file' || tc.name === 'write_file') &&
-        typeof tc.result === 'object' && tc.result !== null &&
-        'metadata' in tc.result &&
-        typeof tc.result.metadata?.diff === 'string';
-    return (_jsxs(Box, { marginLeft: 2, gap: 1, children: [_jsx(Text, { color: statusColor, children: icon }), _jsx(Text, { color: "#DDA0DD", bold: true, children: tc.name }), argsStr ? _jsx(Text, { color: colors.textMuted, dimColor: true, children: argsStr }) : null, hasDiff && (_jsx(DiffView, { diff: tc.result.metadata.diff, expanded: false })), tc.duration ? _jsxs(Text, { color: colors.textMuted, dimColor: true, children: ["(", tc.duration, "ms)"] }) : null] }));
-});
-const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled, borderColor, textColor, cursorColor, onCtrlC, onCtrlL, onCtrlP, onEscape, onToggleToolExpand, onToggleThinking, onToggleTransparency, onToggleActiveAgents, onToggleTasks, onPageUp, onPageDown, onHome, onEnd, commandPaletteOpen, onCommandPaletteInput, approvalDialogOpen, approvalDenyReasonMode, onApprovalApprove, onApprovalAlwaysAllow, onApprovalDeny, onApprovalDenyWithReason, onApprovalCancelDenyReason, onApprovalDenyReasonInput, }) {
+const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled, borderColor, textColor, cursorColor, onCtrlC, onCtrlL, onCtrlP, onEscape, onToggleToolExpand, onToggleThinking, onToggleTransparency, onToggleActiveAgents, onToggleTasks, onToggleDebug, onPageUp, onPageDown, onHome, onEnd, commandPaletteOpen, onCommandPaletteInput, approvalDialogOpen, approvalDenyReasonMode, onApprovalApprove, onApprovalAlwaysAllow, onApprovalDeny, onApprovalDenyWithReason, onApprovalCancelDenyReason, onApprovalDenyReasonInput, history = [], onHistorySearch, }) {
     const [value, setValue] = useState('');
     const [cursorPos, setCursorPos] = useState(0);
+    // History navigation state
+    const [historyIndex, setHistoryIndex] = useState(-1); // -1 = current input (not browsing history)
+    const [savedInput, setSavedInput] = useState(''); // Preserve current input when browsing
+    const historyRef = useRef(history);
+    historyRef.current = history;
     // Store callbacks in refs so useInput doesn't re-subscribe on prop changes
     const callbacksRef = useRef({
         onSubmit, onCtrlC, onCtrlL, onCtrlP, onEscape,
-        onToggleToolExpand, onToggleThinking, onToggleTransparency, onToggleActiveAgents, onToggleTasks,
+        onToggleToolExpand, onToggleThinking, onToggleTransparency, onToggleActiveAgents, onToggleTasks, onToggleDebug,
         onPageUp, onPageDown, onHome, onEnd,
         commandPaletteOpen, onCommandPaletteInput,
         approvalDialogOpen, approvalDenyReasonMode,
         onApprovalApprove, onApprovalAlwaysAllow, onApprovalDeny, onApprovalDenyWithReason,
         onApprovalCancelDenyReason, onApprovalDenyReasonInput,
+        onHistorySearch,
     });
     callbacksRef.current = {
         onSubmit, onCtrlC, onCtrlL, onCtrlP, onEscape,
-        onToggleToolExpand, onToggleThinking, onToggleTransparency, onToggleActiveAgents, onToggleTasks,
+        onToggleToolExpand, onToggleThinking, onToggleTransparency, onToggleActiveAgents, onToggleTasks, onToggleDebug,
         onPageUp, onPageDown, onHome, onEnd,
         commandPaletteOpen, onCommandPaletteInput,
         approvalDialogOpen, approvalDenyReasonMode,
         onApprovalApprove, onApprovalAlwaysAllow, onApprovalDeny, onApprovalDenyWithReason,
         onApprovalCancelDenyReason, onApprovalDenyReasonInput,
+        onHistorySearch,
     };
     const disabledRef = useRef(disabled);
     disabledRef.current = disabled;
@@ -198,6 +136,11 @@ const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled,
             cb.onToggleTasks?.();
             return;
         }
+        // Alt+D / Option+D - Toggle debug panel
+        if (input === '\u2202' || (key.meta && input === 'd')) {
+            cb.onToggleDebug?.();
+            return;
+        }
         // Command palette keyboard handling (when open)
         if (cb.commandPaletteOpen && cb.onCommandPaletteInput) {
             cb.onCommandPaletteInput(input, key);
@@ -261,10 +204,18 @@ const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled,
         // Input handling (only when not disabled)
         if (disabledRef.current)
             return;
+        // Shift+Enter for multiline input (insert newline)
+        if (key.return && key.shift) {
+            setValue(v => v.slice(0, cursorPos) + '\n' + v.slice(cursorPos));
+            setCursorPos(p => p + 1);
+            return;
+        }
         if (key.return && value.trim()) {
             cb.onSubmit(value);
             setValue('');
             setCursorPos(0);
+            setHistoryIndex(-1); // Reset history navigation
+            setSavedInput('');
             return;
         }
         if (key.backspace || key.delete) {
@@ -282,6 +233,54 @@ const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled,
             setCursorPos(p => Math.min(value.length, p + 1));
             return;
         }
+        // History navigation with up/down arrows
+        if (key.upArrow && historyRef.current.length > 0) {
+            setHistoryIndex(prevIndex => {
+                const maxIndex = historyRef.current.length - 1;
+                if (prevIndex === -1) {
+                    // First press - save current input and go to most recent history
+                    setSavedInput(value);
+                    const newValue = historyRef.current[maxIndex] || '';
+                    setValue(newValue);
+                    setCursorPos(newValue.length);
+                    return maxIndex;
+                }
+                else if (prevIndex > 0) {
+                    // Go to older entry
+                    const newIndex = prevIndex - 1;
+                    const newValue = historyRef.current[newIndex] || '';
+                    setValue(newValue);
+                    setCursorPos(newValue.length);
+                    return newIndex;
+                }
+                return prevIndex; // Already at oldest
+            });
+            return;
+        }
+        if (key.downArrow && historyRef.current.length > 0) {
+            setHistoryIndex(prevIndex => {
+                if (prevIndex === -1) {
+                    // Not browsing history, do nothing
+                    return -1;
+                }
+                else if (prevIndex < historyRef.current.length - 1) {
+                    // Go to newer entry
+                    const newIndex = prevIndex + 1;
+                    const newValue = historyRef.current[newIndex] || '';
+                    setValue(newValue);
+                    setCursorPos(newValue.length);
+                    return newIndex;
+                }
+                else {
+                    // At most recent - restore saved input
+                    setValue(savedInput);
+                    setCursorPos(savedInput.length);
+                    setSavedInput('');
+                    return -1;
+                }
+            });
+            return;
+        }
         if (key.ctrl && input === 'a') {
             setCursorPos(0);
             return;
@@ -300,7 +299,10 @@ const MemoizedInputArea = memo(function MemoizedInputArea({ onSubmit, disabled,
             setCursorPos(p => p + input.length);
         }
     });
-    return (_jsxs(Box, { borderStyle: "round", borderColor: disabledRef.current ? '#666' : borderColor, paddingX: 1, children: [_jsxs(Text, { color: textColor, bold: true, children: ['>', " "] }), _jsx(Text, { children: value.slice(0, cursorPos) }), !disabled && (_jsx(Text, { backgroundColor: cursorColor, color: "#1a1a2e", children: value[cursorPos] ?? ' ' })), _jsx(Text, { children: value.slice(cursorPos + 1) })] }));
+    // Check if multiline (for visual indicator)
+    const isMultiline = value.includes('\n');
+    const lineCount = value.split('\n').length;
+    return (_jsx(Box, { borderStyle: "round", borderColor: disabledRef.current ? '#666' : borderColor, paddingX: 1, flexDirection: "column", children: _jsxs(Box, { children: [_jsxs(Text, { color: textColor, bold: true, children: [isMultiline ? '»' : '>', " "] }), _jsx(Text, { children: value.slice(0, cursorPos).replace(/\n/g, '⏎') }), !disabled && (_jsx(Text, { backgroundColor: cursorColor, color: "#1a1a2e", children: value[cursorPos] === '\n' ? '⏎' : (value[cursorPos] ?? ' ') })), _jsx(Text, { children: value.slice(cursorPos + 1).replace(/\n/g, '⏎') }), isMultiline && (_jsxs(Text, { color: "#666", dimColor: true, children: [" (", lineCount, " lines)"] }))] }) }));
 }, (prevProps, nextProps) => {
     // Custom comparison: only re-render if visual props change
     return prevProps.disabled === nextProps.disabled &&
@@ -326,6 +328,14 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
     const [contextTokens, setContextTokens] = useState(0);
     const [elapsedTime, setElapsedTime] = useState(0);
     const processingStartRef = useRef(null);
+    // Command history manager (persistent)
+    const historyManagerRef = useRef(null);
+    if (!historyManagerRef.current) {
+        historyManagerRef.current = createHistoryManager();
+    }
+    const [historyEntries, setHistoryEntries] = useState(() => historyManagerRef.current?.getHistory() || []);
+    // Debug buffer for debug panel
+    const debugBuffer = useDebugBuffer(100);
     const [executionMode, setExecutionMode] = useState('idle');
     const executionModeRef = useRef('idle');
     // Display toggles
@@ -334,6 +344,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
     const [transparencyExpanded, setTransparencyExpanded] = useState(false);
     const [activeAgentsExpanded, setActiveAgentsExpanded] = useState(true);
     const [tasksExpanded, setTasksExpanded] = useState(true);
+    const [debugExpanded, setDebugExpanded] = useState(false);
     // Active agents tracking (for Active Agents Panel)
     const [activeAgents, setActiveAgents] = useState([]);
     // Tasks tracking (for Tasks Panel)
@@ -351,6 +362,9 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
     // Transparency state
     const [transparencyState, setTransparencyState] = useState(null);
     const transparencyAggregatorRef = useRef(null);
+    // Consecutive Ctrl+C tracking for force exit
+    const [ctrlCCount, setCtrlCCount] = useState(0);
+    const ctrlCTimerRef = useRef(null);
     // Refs for stable callbacks
     const isProcessingRef = useRef(isProcessing);
     const messagesLengthRef = useRef(messages.length);
@@ -366,6 +380,22 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
         const uniqueId = `${role}-${Date.now()}-${++messageIdCounter.current}`;
         setMessages(prev => [...prev, { id: uniqueId, role, content, ts: new Date() }]);
     }, []);
+    const persistPendingPlanToStore = useCallback(() => {
+        if (!agent.hasPendingPlan())
+            return;
+        if (!('savePendingPlan' in sessionStore) || typeof sessionStore.savePendingPlan !== 'function') {
+            return;
+        }
+        const pendingPlan = agent.getPendingPlan();
+        if (!pendingPlan)
+            return;
+        sessionStore.savePendingPlan(pendingPlan, currentSessionId);
+        persistenceDebug.log('Pending plan saved', {
+            planId: pendingPlan.id,
+            changes: pendingPlan.proposedChanges.length,
+            sessionId: currentSessionId,
+        });
+    }, [agent, sessionStore, currentSessionId, persistenceDebug]);
     // =========================================================================
     // APPROVAL DIALOG HANDLERS
     // =========================================================================
@@ -438,6 +468,10 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
         const mode = executionModeRef.current;
         if (mode === 'idle')
             return; // No active execution, ignore events
+        // Log event to debug buffer
+        if (debugExpanded) {
+            debugBuffer.debug(`Event: ${event.type}`, event);
+        }
         // Extract subagent from event if present (not all events have it)
         const eventWithSubagent = event;
         const subagentPrefix = eventWithSubagent.subagent ? `[${eventWithSubagent.subagent}] ` : '';
@@ -478,41 +512,44 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
         if (event.type === 'agent.complete') {
             const e = event;
             const statusText = e.success ? 'completed' : 'failed';
-            addMessage('system', `[AGENT] ${e.agentId} ${statusText}`);
-            // Show output preview if substantive
+            const displayName = e.agentType || e.agentId;
+            addMessage('system', `[AGENT] ${displayName} ${statusText}`);
+            // Show output preview if substantive (increased from 300 to 1000 chars)
             if (e.output && e.output.length > 50) {
-                const preview = e.output.slice(0, 300);
-                addMessage('system', `[AGENT OUTPUT]\n${preview}${e.output.length > 300 ? '\n...(truncated)' : ''}`);
+                const preview = e.output.slice(0, 1000);
+                const truncated = e.output.length > 1000;
+                addMessage('system', `[AGENT OUTPUT]\n${preview}${truncated ? `\n...(full output: ${e.output.length} chars)` : ''}`);
             }
-            // Update active agents panel
-            setActiveAgents(prev => prev.map(a => a.type === e.agentId || a.id.includes(e.agentId)
+            // Update active agents panel - use strict ID matching
+            setActiveAgents(prev => prev.map(a => a.id === e.agentId
                 ? { ...a, status: e.success ? 'completed' : 'error' }
                 : a));
             return;
         }
         if (event.type === 'agent.error') {
             const e = event;
-            addMessage('system', `[AGENT] ${e.agentId} error: ${e.error}`);
+            const displayName = e.agentType || e.agentId;
+            addMessage('system', `[AGENT] ${displayName} error: ${e.error}`);
             // For timeout errors, use 'timing_out' status first to indicate the agent
             // is in the process of stopping. Then transition to 'timeout' after a delay.
             // This provides better UX than immediately showing "failed" while tokens accumulate.
             const isTimeout = e.error.includes('timed out') || e.error.includes('Timed out');
             if (isTimeout) {
-                // First, mark as timing_out
-                setActiveAgents(prev => prev.map(a => a.type === e.agentId || a.id.includes(e.agentId)
+                // First, mark as timing_out - use strict ID matching
+                setActiveAgents(prev => prev.map(a => a.id === e.agentId
                     ? { ...a, status: 'timing_out' }
                     : a));
                 // After 3 seconds, transition to final timeout status
                 // (agent should have stopped by then due to cancellation token check)
                 setTimeout(() => {
-                    setActiveAgents(prev => prev.map(a => (a.type === e.agentId || a.id.includes(e.agentId)) && a.status === 'timing_out'
+                    setActiveAgents(prev => prev.map(a => a.id === e.agentId && a.status === 'timing_out'
                         ? { ...a, status: 'timeout' }
                         : a));
                 }, 3000);
             }
             else {
-                // Regular error - set immediately
-                setActiveAgents(prev => prev.map(a => a.type === e.agentId || a.id.includes(e.agentId)
+                // Regular error - set immediately with strict ID matching
+                setActiveAgents(prev => prev.map(a => a.id === e.agentId
                     ? { ...a, status: 'error' }
                     : a));
             }
@@ -595,9 +632,14 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
             // These agents should have stopped, and any lingering events are from
             // zombie processes that we don't want to count.
             if (e.subagent || eventWithSubagent.subagent) {
+                const subagentId = e.subagentId || eventWithSubagent.subagentId;
                 const agentName = e.subagent || eventWithSubagent.subagent;
                 setActiveAgents(prev => prev.map(a => {
-                    const matchesAgent = a.type === agentName || a.id.includes(agentName || '');
+                    // Use strict ID matching when subagentId is available (prevents duplicate counting
+                    // when multiple agents of the same type run in parallel)
+                    const matchesAgent = subagentId
+                        ? a.id === subagentId
+                        : (a.type === agentName || a.id.includes(agentName || ''));
                     const isStillRunning = a.status === 'running';
                     // Only update tokens if agent is still running
                     if (matchesAgent && isStillRunning) {
@@ -624,18 +666,26 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
             const e = event;
             setStatus(s => ({ ...s, mode: `${e.agentId} iter ${e.iteration}/${e.maxIterations}` }));
             // Update active agents panel with iteration info
-            setActiveAgents(prev => prev.map(a => a.type === e.agentId || a.id.includes(e.agentId)
-                ? { ...a, iteration: e.iteration, maxIterations: e.maxIterations }
-                : a));
+            // Use subagentId for strict matching when available (parallel same-type agents)
+            setActiveAgents(prev => prev.map(a => {
+                const matches = e.subagentId
+                    ? a.id === e.subagentId
+                    : (a.type === e.agentId || a.id.includes(e.agentId));
+                return matches ? { ...a, iteration: e.iteration, maxIterations: e.maxIterations } : a;
+            }));
             return;
         }
         if (event.type === 'subagent.phase') {
             const e = event;
             setStatus(s => ({ ...s, mode: `${e.agentId} ${e.phase}` }));
             // Update active agents panel with phase info
-            setActiveAgents(prev => prev.map(a => a.type === e.agentId || a.id.includes(e.agentId)
-                ? { ...a, currentPhase: e.phase }
-                : a));
+            // Use subagentId for strict matching when available (parallel same-type agents)
+            setActiveAgents(prev => prev.map(a => {
+                const matches = e.subagentId
+                    ? a.id === e.subagentId
+                    : (a.type === e.agentId || a.id.includes(e.agentId));
+                return matches ? { ...a, currentPhase: e.phase } : a;
+            }));
             return;
         }
         // Task events - update Tasks Panel
@@ -825,6 +875,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                     '  Alt+O       Toggle thinking',
                     '  Alt+I       Toggle transparency panel',
                     '  Alt+K       Toggle tasks panel',
+                    '  Alt+D       Toggle debug panel',
                     '========================',
                 ].join('\n'));
                 return;
@@ -848,6 +899,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                         plan: agentState.plan,
                         memoryContext: agentState.memoryContext,
                     });
+                    persistPendingPlanToStore();
                     addMessage('system', `Session saved: ${currentSessionId} (checkpoint: ${ckptId})`);
                 }
                 catch (e) {
@@ -1559,7 +1611,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
             default:
                 addMessage('system', `Unknown: /${cmd}. Try /help`);
         }
-    }, [addMessage, exit, agent, mcpClient, lspManager, sessionStore, compactor, model, currentThemeName, currentSessionId, formatSessionsTable, saveCheckpointToStore, showThinking]);
+    }, [addMessage, exit, agent, mcpClient, lspManager, sessionStore, compactor, model, currentThemeName, currentSessionId, formatSessionsTable, saveCheckpointToStore, showThinking, persistPendingPlanToStore]);
     // =========================================================================
     // SUBMIT HANDLER
     // =========================================================================
@@ -1567,6 +1619,11 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
         const trimmed = input.trim();
         if (!trimmed)
             return;
+        // Add to history (persistent)
+        if (historyManagerRef.current) {
+            historyManagerRef.current.addEntry(trimmed);
+            setHistoryEntries(historyManagerRef.current.getHistory());
+        }
         addMessage('user', trimmed);
         if (trimmed.startsWith('/')) {
             const parts = trimmed.slice(1).split(/\s+/);
@@ -1578,6 +1635,8 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
         executionModeRef.current = 'processing';
         setExecutionMode('processing');
         setStatus(s => ({ ...s, mode: 'thinking' }));
+        // Reset CPU time counter for per-prompt resource limits (prevents session-wide timeout)
+        agent.resetResourceTimer();
         try {
             const result = await agent.run(trimmed);
             const metrics = agent.getMetrics();
@@ -1620,6 +1679,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                         plan: checkpoint.state.plan,
                         memoryContext: checkpoint.state.memoryContext,
                     });
+                    persistPendingPlanToStore();
                 }
                 catch (e) {
                     persistenceDebug.error('[TUI] Checkpoint failed', e);
@@ -1635,7 +1695,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
             setIsProcessing(false);
             setToolCalls([]);
         }
-    }, [addMessage, handleCommand, agent, sessionStore, saveCheckpointToStore, persistenceDebug]);
+    }, [addMessage, handleCommand, agent, sessionStore, saveCheckpointToStore, persistenceDebug, persistPendingPlanToStore]);
     // =========================================================================
     // COMMAND PALETTE ITEMS
     // =========================================================================
@@ -1729,8 +1789,33 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
     // KEYBOARD CALLBACKS
     // =========================================================================
     const handleCtrlC = useCallback(() => {
-        agent.cleanup().then(() => mcpClient.cleanup()).then(() => lspManager.cleanup()).then(() => exit());
-    }, [agent, mcpClient, lspManager, exit]);
+        // Clear any existing timer
+        if (ctrlCTimerRef.current) {
+            clearTimeout(ctrlCTimerRef.current);
+            ctrlCTimerRef.current = null;
+        }
+        setCtrlCCount(prevCount => {
+            const newCount = prevCount + 1;
+            if (newCount >= 2) {
+                // Second Ctrl+C within timeout window - force exit immediately
+                process.exit(1);
+            }
+            // First Ctrl+C - show warning and start graceful cleanup
+            addMessage('system', '[CTRL+C] Press again within 1s to force exit...');
+            // Start graceful cleanup in background
+            agent.cleanup()
+                .then(() => mcpClient.cleanup())
+                .then(() => lspManager.cleanup())
+                .then(() => exit())
+                .catch(() => exit()); // Exit even if cleanup fails
+            // Reset counter after 1 second
+            ctrlCTimerRef.current = setTimeout(() => {
+                setCtrlCCount(0);
+                ctrlCTimerRef.current = null;
+            }, 1000);
+            return newCount;
+        });
+    }, [agent, mcpClient, lspManager, exit, addMessage]);
     const handleCtrlL = useCallback(() => {
         setMessages([]);
         setToolCalls([]);
@@ -1740,7 +1825,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
         setCommandPaletteQuery('');
         setCommandPaletteIndex(0);
     }, []);
-    const handleEscape = useCallback(() => {
+    const handleEscape = useCallback(async () => {
         // Close command palette first if open
         if (commandPaletteOpen) {
             setCommandPaletteOpen(false);
@@ -1750,11 +1835,30 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
         }
         // Otherwise cancel processing
         if (isProcessingRef.current) {
+            // Immediate visual feedback
+            addMessage('system', '[ESC] Stopping agent...');
+            // Autosave checkpoint before cancel (async, don't block)
+            try {
+                const agentState = agent.getState();
+                saveCheckpointToStore(sessionStore, {
+                    sessionId: currentSessionId,
+                    reason: 'user_cancel',
+                    messages: agentState.messages,
+                    iteration: agentState.iteration,
+                    timestamp: Date.now(),
+                });
+                persistPendingPlanToStore();
+                persistenceDebug.log('Checkpoint saved before cancel');
+            }
+            catch (e) {
+                persistenceDebug.error('Failed to save checkpoint before cancel', e);
+            }
+            // Cancel the agent
             agent.cancel('Cancelled by ESC');
             setIsProcessing(false);
-            addMessage('system', '[STOP] Cancelled');
+            addMessage('system', '[STOP] Cancelled (checkpoint saved)');
         }
-    }, [agent, addMessage, commandPaletteOpen]);
+    }, [agent, addMessage, commandPaletteOpen, sessionStore, currentSessionId, saveCheckpointToStore, persistenceDebug, persistPendingPlanToStore]);
     const handleToggleToolExpand = useCallback(() => {
         setToolCallsExpanded(prev => {
             addMessage('system', !prev ? '[*] Tool details: expanded' : '[ ] Tool details: collapsed');
@@ -1785,6 +1889,12 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
             return !prev;
         });
     }, [addMessage]);
+    const handleToggleDebug = useCallback(() => {
+        setDebugExpanded(prev => {
+            addMessage('system', !prev ? '[v] Debug panel: visible (Alt+D)' : '[^] Debug panel: hidden');
+            return !prev;
+        });
+    }, [addMessage]);
     // Update context tokens
     useEffect(() => {
         const agentState = agent.getState();
@@ -1826,7 +1936,7 @@ export function TUIApp({ agent, sessionStore, mcpClient, compactor, lspManager,
                             args: pendingApproval.args || {},
                             risk: pendingApproval.risk,
                             context: pendingApproval.context,
-                        }, onApprove: handleApprove, onDeny: handleDeny, colors: colors, denyReasonMode: denyReasonMode, denyReason: denyReason })), _jsx(TasksPanel, { tasks: tasks, colors: colors, expanded: tasksExpanded }), _jsx(ActiveAgentsPanel, { agents: activeAgents, colors: colors, expanded: activeAgentsExpanded }), _jsx(MemoizedInputArea, { onSubmit: handleSubmit, disabled: isProcessing || !!pendingApproval, borderColor: pendingApproval ? '#FFD700' : '#87CEEB', textColor: "#98FB98", cursorColor: "#87CEEB", onCtrlC: handleCtrlC, onCtrlL: handleCtrlL, onCtrlP: handleCtrlP, onEscape: handleEscape, onToggleToolExpand: handleToggleToolExpand, onToggleThinking: handleToggleThinking, onToggleTransparency: handleToggleTransparency, onToggleActiveAgents: handleToggleActiveAgents, onToggleTasks: handleToggleTasks, commandPaletteOpen: commandPaletteOpen, onCommandPaletteInput: handleCommandPaletteInput, approvalDialogOpen: !!pendingApproval, approvalDenyReasonMode: denyReasonMode, onApprovalApprove: handleApprove, onApprovalAlwaysAllow: handleAlwaysAllow, onApprovalDeny: handleDeny, onApprovalDenyWithReason: handleDenyWithReason, onApprovalCancelDenyReason: handleCancelDenyReason, onApprovalDenyReasonInput: handleApprovalDenyReasonInput }), commandPaletteOpen && (_jsx(ControlledCommandPalette, { theme: selectedTheme, items: filteredCommandItems, visible: commandPaletteOpen, query: commandPaletteQuery, selectedIndex: commandPaletteIndex, onQueryChange: setCommandPaletteQuery, onSelectItem: (item) => {
+                        }, onApprove: handleApprove, onDeny: handleDeny, colors: colors, denyReasonMode: denyReasonMode, denyReason: denyReason })), _jsx(DebugPanel, { entries: debugBuffer.entries, expanded: debugExpanded, colors: colors }), _jsx(TasksPanel, { tasks: tasks, colors: colors, expanded: tasksExpanded }), _jsx(ActiveAgentsPanel, { agents: activeAgents, colors: colors, expanded: activeAgentsExpanded }), _jsx(MemoizedInputArea, { onSubmit: handleSubmit, disabled: isProcessing || !!pendingApproval, borderColor: pendingApproval ? '#FFD700' : '#87CEEB', textColor: "#98FB98", cursorColor: "#87CEEB", onCtrlC: handleCtrlC, onCtrlL: handleCtrlL, onCtrlP: handleCtrlP, onEscape: handleEscape, onToggleToolExpand: handleToggleToolExpand, onToggleThinking: handleToggleThinking, onToggleTransparency: handleToggleTransparency, onToggleActiveAgents: handleToggleActiveAgents, onToggleTasks: handleToggleTasks, onToggleDebug: handleToggleDebug, commandPaletteOpen: commandPaletteOpen, onCommandPaletteInput: handleCommandPaletteInput, approvalDialogOpen: !!pendingApproval, approvalDenyReasonMode: denyReasonMode, onApprovalApprove: handleApprove, onApprovalAlwaysAllow: handleAlwaysAllow, onApprovalDeny: handleDeny, onApprovalDenyWithReason: handleDenyWithReason, onApprovalCancelDenyReason: handleCancelDenyReason, onApprovalDenyReasonInput: handleApprovalDenyReasonInput, history: historyEntries }), commandPaletteOpen && (_jsx(ControlledCommandPalette, { theme: selectedTheme, items: filteredCommandItems, visible: commandPaletteOpen, query: commandPaletteQuery, selectedIndex: commandPaletteIndex, onQueryChange: setCommandPaletteQuery, onSelectItem: (item) => {
                             setCommandPaletteOpen(false);
                             setCommandPaletteQuery('');
                             setCommandPaletteIndex(0);