@prestyj/cli 4.2.77 → 4.3.15

package/dist/ui/App.js

@@ -2,6 +2,8 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
 import React, { useState, useRef, useCallback, useEffect, useMemo } from "react";
 import { Box, Text, Static, useStdout } from "ink";
 import { useTerminalSize } from "./hooks/useTerminalSize.js";
+import { useDoublePress } from "./hooks/useDoublePress.js";
+import { useTaskBarStore, useTaskBarPolling, focusTaskBar, exitTaskBar, expandTaskBar, collapseTaskBar, navigateTaskBar, killTask, } from "./stores/taskbar-store.js";
 import crypto, { createHash } from "node:crypto";
 import { readFileSync, writeFileSync } from "node:fs";
 import { homedir } from "node:os";
@@ -25,8 +27,9 @@ import { PlanOverlay } from "./components/PlanOverlay.js";
 import { ModelSelector } from "./components/ModelSelector.js";
 import { TaskOverlay } from "./components/TaskOverlay.js";
 import { SkillsOverlay } from "./components/SkillsOverlay.js";
+import { ThemeSelector } from "./components/ThemeSelector.js";
 import { BackgroundTasksBar } from "./components/BackgroundTasksBar.js";
-import { useTheme } from "./theme/theme.js";
+import { useTheme, useSetTheme } from "./theme/theme.js";
 import { useAnimationTick, useAnimationActive, deriveFrame, } from "./components/AnimationContext.js";
 import { useTerminalTitle } from "./hooks/useTerminalTitle.js";
 import { useTerminalProgress } from "./hooks/useTerminalProgress.js";
@@ -34,6 +37,7 @@ import { getGitBranch } from "../utils/git.js";
 import { getModel, getContextWindow } from "../core/model-registry.js";
 import { SessionManager } from "../core/session-manager.js";
 import { log } from "../core/logger.js";
+import { generateSessionTitle } from "../utils/session-title.js";
 import { SettingsManager } from "../core/settings-manager.js";
 import { shouldCompact, compact } from "../core/compaction/compactor.js";
 import { estimateConversationTokens } from "../core/compaction/token-estimator.js";
@@ -42,7 +46,7 @@ import { loadCustomCommands } from "../core/custom-commands.js";
 import { buildSystemPrompt } from "../system-prompt.js";
 import { extractPlanSteps, findCompletedMarkers, markStepsCompleted, stripDoneMarkers, } from "../utils/plan-steps.js";
 import { getMCPServers } from "../core/mcp/index.js";
-import { trimFlushedItems, flushOnTurnText, flushOnTurnEnd } from "./live-item-flush.js";
+import { trimFlushedItems, flushOnTurnText, flushOnTurnEnd, flushOverflow, } from "./live-item-flush.js";
 import { Buddy } from "./buddy/Buddy.js";
 // ── Provider Error Hints ──────────────────────────────────
 /** Detect provider-side errors and return a user-facing hint. */
@@ -264,22 +268,23 @@ function markTaskInProgress(cwd, taskId) {
 // ── App Component ──────────────────────────────────────────
 export function App(props) {
     const theme = useTheme();
+    const switchTheme = useSetTheme();
     const { stdout } = useStdout();
     const { columns, resizeKey } = useTerminalSize();
     // Hoisted before terminal title hook so it can reference them
     const [lastUserMessage, setLastUserMessage] = useState("");
+    const [exitPending, setExitPending] = useState(false);
     const [planMode, setPlanMode] = useState(false);
+    const planModeLocalRef = useRef(false);
+    planModeLocalRef.current = planMode;
     // Terminal title — updated later after agentLoop is created
     // (hoisted here so the hook is always called in the same order)
-    const [titlePhase, setTitlePhase] = useState("idle");
     const [titleRunning, setTitleRunning] = useState(false);
-    const [titleToolNames, setTitleToolNames] = useState([]);
+    const [sessionTitle, setSessionTitle] = useState(undefined);
+    const sessionTitleGeneratedRef = useRef(false);
     useTerminalTitle({
-        phase: titlePhase,
         isRunning: titleRunning,
-        userMessage: lastUserMessage,
-        activeToolNames: titleToolNames,
-        planMode,
+        sessionTitle,
     });
     // Items scrolled into Static (history).  For restored sessions, skip the
     // banner and add restored items via useEffect so Ink's <Static> treats them
@@ -328,10 +333,19 @@ export function App(props) {
     // Two-phase flush: items waiting to be moved to Static history after the
     // live area has been cleared and Ink has committed the smaller output.
     const pendingFlushRef = useRef([]);
+    const [flushGeneration, setFlushGeneration] = useState(0);
+    /** Queue items for two-phase flush and signal the drain effect. */
+    const queueFlush = useCallback((items) => {
+        if (items.length === 0)
+            return;
+        pendingFlushRef.current = [...pendingFlushRef.current, ...items];
+        setFlushGeneration((g) => g + 1);
+    }, []);
     // Derive credentials for the current provider
     const currentCreds = props.credentialsByProvider?.[currentProvider];
     const activeApiKey = currentCreds?.accessToken ?? props.apiKey;
     const activeAccountId = currentCreds?.accountId ?? props.accountId;
+    const activeBaseUrl = currentCreds?.baseUrl ?? props.baseUrl;
     // Load git branch
     useEffect(() => {
         getGitBranch(props.cwd).then(setGitBranch);
@@ -392,7 +406,11 @@ export function App(props) {
                     stdout?.write("\x1b[2J\x1b[3J\x1b[H");
                     setPlanAutoExpand(true);
                     setOverlay("plan");
-                    planOverlayPendingRef.current = false;
+                    // Don't clear planOverlayPendingRef here — keep it true until
+                    // the user actually approves/rejects the plan. Clearing it on a
+                    // timer causes a race where agent_done fires after the 300ms
+                    // timeout but before the user interacts, triggering a premature
+                    // completion sound.
                 }, 300);
                 return ("Plan submitted. Exiting plan mode.\n" +
                     "The plan pane is opening for user review.\n" +
@@ -523,63 +541,23 @@ export function App(props) {
         }
         return messages;
     }, [currentModel, compactConversation]);
-    // ── Background task bar state ───────────────────────────
-    const [bgTasks, setBgTasks] = useState([]);
-    const [taskBarFocused, setTaskBarFocused] = useState(false);
-    const [taskBarExpanded, setTaskBarExpanded] = useState(false);
-    const [selectedTaskIndex, setSelectedTaskIndex] = useState(0);
-    // Poll ProcessManager every 2s for running tasks
-    useEffect(() => {
-        if (!props.processManager)
-            return;
-        const pm = props.processManager;
-        const poll = () => {
-            const running = pm.list().filter((p) => p.exitCode === null);
-            setBgTasks(running);
-        };
-        poll();
-        const interval = setInterval(poll, 2000);
-        return () => clearInterval(interval);
-    }, [props.processManager]);
-    // Auto-exit task panel when all tasks gone
-    useEffect(() => {
-        if (bgTasks.length === 0) {
-            setTaskBarFocused(false);
-            setTaskBarExpanded(false);
-        }
-        // Clamp selected index
-        const maxIdx = Math.min(bgTasks.length, 5) - 1;
-        if (selectedTaskIndex > maxIdx && maxIdx >= 0) {
-            setSelectedTaskIndex(maxIdx);
-        }
-    }, [bgTasks.length, selectedTaskIndex]);
-    const handleFocusTaskBar = useCallback(() => {
-        if (bgTasks.length > 0) {
-            setTaskBarFocused(true);
-        }
-    }, [bgTasks.length]);
-    const handleTaskBarExit = useCallback(() => {
-        setTaskBarFocused(false);
-        setTaskBarExpanded(false);
-    }, []);
-    const handleTaskBarExpand = useCallback(() => {
-        setTaskBarExpanded(true);
-        setSelectedTaskIndex(0);
-    }, []);
-    const handleTaskBarCollapse = useCallback(() => {
-        setTaskBarExpanded(false);
-    }, []);
+    // ── Background task bar state (external store) ──────────
+    const { bgTasks, focused: taskBarFocused, expanded: taskBarExpanded, selectedIndex: selectedTaskIndex, } = useTaskBarStore();
+    useTaskBarPolling(props.processManager);
+    const handleFocusTaskBar = useCallback(() => focusTaskBar(), []);
+    const handleTaskBarExit = useCallback(() => exitTaskBar(), []);
+    const handleTaskBarExpand = useCallback(() => expandTaskBar(), []);
+    const handleTaskBarCollapse = useCallback(() => collapseTaskBar(), []);
     const handleTaskKill = useCallback((id) => {
-        props.processManager?.stop(id);
+        if (props.processManager)
+            killTask(props.processManager, id);
     }, [props.processManager]);
-    const handleTaskNavigate = useCallback((index) => {
-        setSelectedTaskIndex(index);
-    }, []);
+    const handleTaskNavigate = useCallback((index) => navigateTaskBar(index), []);
     // Resolve fresh OAuth credentials before each agent loop run.
     // Falls back to the static props when authStorage is not available.
-    const resolveCredentials = useCallback(async () => {
+    const resolveCredentials = useCallback(async (opts) => {
         if (props.authStorage) {
-            const creds = await props.authStorage.resolveCredentials(currentProvider);
+            const creds = await props.authStorage.resolveCredentials(currentProvider, opts);
             return { apiKey: creds.accessToken, accountId: creds.accountId };
         }
         return { apiKey: activeApiKey, accountId: activeAccountId };
@@ -592,7 +570,7 @@ export function App(props) {
         maxTokens: props.maxTokens,
         thinking: thinkingEnabled ? (props.thinking ?? "medium") : undefined,
         apiKey: activeApiKey,
-        baseUrl: props.baseUrl,
+        baseUrl: activeBaseUrl,
         accountId: activeAccountId,
         resolveCredentials,
         transformContext,
@@ -613,7 +591,57 @@ export function App(props) {
                     }
                 })();
             }
-        }, [persistNewMessages, planMode, props.cwd, props.skills]),
+            // Generate session title after the first turn (background, best-effort)
+            if (!sessionTitleGeneratedRef.current) {
+                sessionTitleGeneratedRef.current = true;
+                const msgs = messagesRef.current;
+                // Find the first user message and first assistant text
+                const userMsg = msgs.find((m) => m.role === "user");
+                const assistantMsg = msgs.find((m) => m.role === "assistant");
+                const userText = typeof userMsg?.content === "string"
+                    ? userMsg.content
+                    : Array.isArray(userMsg?.content)
+                        ? userMsg.content
+                            .filter((c) => c.type === "text")
+                            .map((c) => c.text)
+                            .join(" ")
+                        : "";
+                const assistantText = typeof assistantMsg?.content === "string"
+                    ? assistantMsg.content
+                    : Array.isArray(assistantMsg?.content)
+                        ? assistantMsg.content
+                            .filter((c) => c.type === "text")
+                            .map((c) => c.text)
+                            .join(" ")
+                        : "";
+                if (userText) {
+                    generateSessionTitle({
+                        provider: currentProvider,
+                        userMessage: userText,
+                        assistantPreview: assistantText.slice(0, 200),
+                        apiKey: activeApiKey,
+                        baseUrl: activeBaseUrl,
+                        accountId: activeAccountId,
+                        resolveCredentials,
+                    }).then((title) => {
+                        setSessionTitle(title);
+                        log("INFO", "title", `Session title generated: ${title}`);
+                    }, () => {
+                        // Best-effort — silently ignore failures
+                    });
+                }
+            }
+        }, [
+            persistNewMessages,
+            planMode,
+            props.cwd,
+            props.skills,
+            currentProvider,
+            activeApiKey,
+            activeAccountId,
+            activeBaseUrl,
+            resolveCredentials,
+        ]),
         onTurnText: useCallback((text, thinking, thinkingMs) => {
             // Track [DONE:n] markers for plan step progress
             if (planStepsRef.current.length > 0) {
@@ -629,13 +657,28 @@ export function App(props) {
             // Flush all completed items from the previous turn to Static history.
             // This keeps liveItems bounded per-turn, preventing Ink's live area from
             // growing unbounded, which makes Ink's live-area re-renders expensive.
+            //
+            // Items are queued in pendingFlushRef (not sent to setHistory directly)
+            // so the Static write happens in a SEPARATE render cycle from the
+            // live-area change — avoiding both Ink cursor-math clipping and the
+            // brief duplicate that occurred when setHistory was nested inside the
+            // setLiveItems updater.
             setLiveItems((prev) => {
                 const flushed = flushOnTurnText(prev);
                 if (flushed.length > 0) {
-                    setHistory((h) => compactHistory([...h, ...trimFlushedItems(flushed)]));
+                    queueFlush(flushed);
                 }
                 const displayText = planStepsRef.current.length > 0 ? stripDoneMarkers(text) : text;
-                return [{ kind: "assistant", text: displayText, thinking, thinkingMs, id: getId() }];
+                return [
+                    {
+                        kind: "assistant",
+                        text: displayText,
+                        thinking,
+                        thinkingMs,
+                        planMode: planModeLocalRef.current,
+                        id: getId(),
+                    },
+                ];
             });
         }, []),
         onToolStart: useCallback((toolCallId, name, args) => {
@@ -646,7 +689,7 @@ export function App(props) {
             setLiveItems((prev) => {
                 const { flushed, remaining } = partitionCompleted(prev);
                 if (flushed.length > 0) {
-                    setHistory((h) => compactHistory([...h, ...trimFlushedItems(flushed)]));
+                    queueFlush(flushed);
                 }
                 return remaining;
             });
@@ -707,6 +750,24 @@ export function App(props) {
             }
         }, []),
         onToolUpdate: useCallback((toolCallId, update) => {
+            const u = update;
+            // Bash progress streaming — append output to tool_start item
+            if (u.type === "bash_progress") {
+                setLiveItems((prev) => {
+                    const idx = prev.findIndex((item) => item.kind === "tool_start" && item.toolCallId === toolCallId);
+                    if (idx === -1)
+                        return prev;
+                    const item = prev[idx];
+                    const next = [...prev];
+                    next[idx] = {
+                        ...item,
+                        progressOutput: (item.progressOutput ?? "") + String(u.output ?? ""),
+                    };
+                    return next;
+                });
+                return;
+            }
+            // Subagent updates
             setLiveItems((prev) => {
                 const groupIdx = prev.findIndex((item) => item.kind === "subagent_group");
                 if (groupIdx === -1)
@@ -759,7 +820,7 @@ export function App(props) {
                     // Flush completed items to Static to keep the live area small
                     const { flushed, remaining } = partitionCompleted(next);
                     if (flushed.length > 0) {
-                        setHistory((h) => compactHistory([...h, ...trimFlushedItems(flushed)]));
+                        queueFlush(flushed);
                     }
                     return remaining;
                 });
@@ -818,7 +879,14 @@ export function App(props) {
                     // Flush completed items to Static to keep the live area small
                     const { flushed, remaining } = partitionCompleted(updated);
                     if (flushed.length > 0) {
-                        setHistory((h) => compactHistory([...h, ...trimFlushedItems(flushed)]));
+                        queueFlush(flushed);
+                        return remaining;
+                    }
+                    // Overflow flush: if live area is still large, flush aggressively
+                    const overflow = flushOverflow(updated);
+                    if (overflow.flushed.length > 0) {
+                        queueFlush(overflow.flushed);
+                        return overflow.remaining;
                     }
                     return remaining;
                 });
@@ -831,7 +899,7 @@ export function App(props) {
             setLiveItems((prev) => {
                 const { flushed, remaining } = partitionCompleted(prev);
                 if (flushed.length > 0) {
-                    setHistory((h) => compactHistory([...h, ...trimFlushedItems(flushed)]));
+                    queueFlush(flushed);
                 }
                 return [
                     ...remaining,
@@ -882,7 +950,7 @@ export function App(props) {
                 // Flush completed items to Static
                 const { flushed, remaining } = partitionCompleted(updated);
                 if (flushed.length > 0) {
-                    setHistory((h) => compactHistory([...h, ...trimFlushedItems(flushed)]));
+                    queueFlush(flushed);
                 }
                 return remaining;
             });
@@ -895,15 +963,18 @@ export function App(props) {
                 ...(usage.cacheRead != null && { cacheRead: String(usage.cacheRead) }),
                 ...(usage.cacheWrite != null && { cacheWrite: String(usage.cacheWrite) }),
             });
-            // Track actual token count for compaction decisions
+            // Track actual token count for compaction decisions.
+            // Anthropic has separate input/output limits — only count input.
+            // All other providers share the context window — count both.
+            const inputContext = usage.inputTokens + (usage.cacheRead ?? 0) + (usage.cacheWrite ?? 0);
             lastActualTokensRef.current =
-                usage.inputTokens + (usage.cacheRead ?? 0) + (usage.cacheWrite ?? 0);
+                currentProvider === "anthropic" ? inputContext : inputContext + usage.outputTokens;
             // For tool-only turns (no text), flush completed items to Static so
             // liveItems doesn't grow unbounded across consecutive tool-only turns.
             setLiveItems((prev) => {
                 const { flushed, remaining } = flushOnTurnEnd(prev, stopReason);
                 if (flushed.length > 0) {
-                    setHistory((h) => compactHistory([...h, ...trimFlushedItems(flushed)]));
+                    queueFlush(flushed);
                 }
                 return remaining;
             });
@@ -926,9 +997,8 @@ export function App(props) {
             // separate render cycle so the Static write never coincides with
             // a live-area height change in the same frame.
             setLiveItems((prev) => {
-                if (prev.length > 0) {
-                    pendingFlushRef.current = prev;
-                }
+                if (prev.length > 0)
+                    queueFlush(prev);
                 return [];
             });
             // Run-all: auto-start next pending task after a short delay
@@ -1007,9 +1077,8 @@ export function App(props) {
                 ? undefined
                 : content.filter((c) => c.type === "image").length || undefined;
             setLiveItems((prev) => {
-                if (prev.length > 0) {
-                    setHistory((h) => compactHistory([...h, ...trimFlushedItems(prev)]));
-                }
+                if (prev.length > 0)
+                    queueFlush(prev);
                 return [];
             });
             const userItem = {
@@ -1036,14 +1105,11 @@ export function App(props) {
             pendingFlushRef.current = [];
             setHistory((h) => compactHistory([...h, ...trimFlushedItems(items)]));
         }
-    });
+    }, [flushGeneration]);
     // Sync terminal title with agent loop state
-    const activeToolNamesKey = agentLoop.activeToolCalls.map((tc) => tc.name).join(",");
     useEffect(() => {
-        setTitlePhase(agentLoop.activityPhase);
         setTitleRunning(agentLoop.isRunning);
-        setTitleToolNames(agentLoop.activeToolCalls.map((tc) => tc.name));
-    }, [agentLoop.activityPhase, agentLoop.isRunning, activeToolNamesKey]);
+    }, [agentLoop.isRunning]);
     // Terminal progress bar (OSC 9;4) — pulsing bar in supported terminals
     useTerminalProgress(agentLoop.isRunning, agentLoop.activeToolCalls.length > 0);
     // Animated thinking border — derived from global animation tick
@@ -1096,9 +1162,16 @@ export function App(props) {
                 messagesRef.current = [{ role: "system", content: newPrompt }];
             })();
             agentLoop.reset();
+            setSessionTitle(undefined);
+            sessionTitleGeneratedRef.current = false;
             setLiveItems([{ kind: "info", text: "Session cleared.", id: getId() }]);
             return;
         }
+        // Handle /theme — open theme selector overlay
+        if (trimmed === "/theme" || trimmed === "/t") {
+            setOverlay("theme");
+            return;
+        }
         // Handle /plan — toggle plan mode
         if (trimmed === "/plan" || trimmed === "/plan on") {
             setPlanMode(true);
@@ -1175,7 +1248,7 @@ export function App(props) {
                 // Move live items into history before starting
                 setLiveItems((prev) => {
                     if (prev.length > 0) {
-                        setHistory((h) => compactHistory([...h, ...trimFlushedItems(prev)]));
+                        pendingFlushRef.current = [...pendingFlushRef.current, ...prev];
                     }
                     return [];
                 });
@@ -1281,7 +1354,7 @@ export function App(props) {
         // Move any remaining live items into history (Static) before starting new turn
         setLiveItems((prev) => {
             if (prev.length > 0) {
-                setHistory((h) => compactHistory([...h, ...trimFlushedItems(prev)]));
+                pendingFlushRef.current = [...pendingFlushRef.current, ...prev];
             }
             return [];
         });
@@ -1323,15 +1396,16 @@ export function App(props) {
             ]);
         }
     }, [agentLoop, props.onSlashCommand, compactConversation]);
+    const handleDoubleExit = useDoublePress(setExitPending, () => process.exit(0));
     const handleAbort = useCallback(() => {
         if (agentLoop.isRunning) {
             agentLoop.clearQueue();
             agentLoop.abort();
         }
         else {
-            process.exit(0);
+            handleDoubleExit();
         }
-    }, [agentLoop]);
+    }, [agentLoop, handleDoubleExit]);
     const handleToggleThinking = useCallback(() => {
         setThinkingEnabled((prev) => {
             const next = !prev;
@@ -1408,12 +1482,28 @@ export function App(props) {
             });
         }
     }, [props.settingsFile, props.mcpManager, props.credentialsByProvider, props.authStorage]);
+    const handleThemeSelect = useCallback((name) => {
+        setOverlay(null);
+        if (switchTheme) {
+            switchTheme(name);
+        }
+        // Persist to settings
+        if (props.settingsFile) {
+            const sm = new SettingsManager(props.settingsFile);
+            sm.load().then(() => sm.set("theme", name));
+        }
+        setLiveItems((prev) => [
+            ...prev,
+            { kind: "info", text: `Theme switched to: ${name}`, id: getId() },
+        ]);
+    }, [switchTheme, props.settingsFile]);
     // All available slash commands for the command palette
     const allCommands = useMemo(() => [
         { name: "model", aliases: ["m"], description: "Switch model" },
         { name: "compact", aliases: ["c"], description: "Compact conversation" },
         { name: "clear", aliases: [], description: "Clear session and terminal" },
         { name: "quit", aliases: ["q", "exit"], description: "Exit the agent" },
+        { name: "theme", aliases: ["t"], description: "Switch theme" },
         { name: "plan", aliases: [], description: "Toggle plan mode (on/off)" },
         { name: "plans", aliases: [], description: "Open plans pane" },
         ...PROMPT_COMMANDS.map((cmd) => ({
@@ -1432,15 +1522,15 @@ export function App(props) {
             case "tombstone":
                 return null;
             case "banner":
-                return (_jsx(Banner, { version: props.version, model: props.model, provider: props.provider, cwd: props.cwd, taskCount: taskCount }, item.id));
+                return (_jsx(Banner, { version: props.version, model: currentModel, provider: currentProvider, cwd: props.cwd, taskCount: taskCount }, item.id));
             case "user":
                 return (_jsx(UserMessage, { text: item.text, imageCount: item.imageCount, pasteInfo: item.pasteInfo }, item.id));
             case "task":
                 return (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { wrap: "wrap", children: [_jsx(Text, { color: theme.success, bold: true, children: "▶ " }), _jsx(Text, { color: theme.textDim, children: "Task: " }), _jsx(Text, { color: theme.success, children: item.title })] }) }, item.id));
             case "assistant":
-                return (_jsx(AssistantMessage, { text: item.text, thinking: item.thinking, thinkingMs: item.thinkingMs, showThinking: props.showThinking }, item.id));
+                return (_jsx(AssistantMessage, { text: item.text, thinking: item.thinking, thinkingMs: item.thinkingMs, showThinking: props.showThinking, planMode: item.planMode }, item.id));
             case "tool_start":
-                return _jsx(ToolExecution, { status: "running", name: item.name, args: item.args }, item.id);
+                return (_jsx(ToolExecution, { status: "running", name: item.name, args: item.args, progressOutput: item.progressOutput }, item.id));
             case "tool_done":
                 return (_jsx(ToolExecution, { status: "done", name: item.name, args: item.args, result: item.result, isError: item.isError, details: item.details }, item.id));
             case "tool_group":
@@ -1456,7 +1546,7 @@ export function App(props) {
             case "info":
                 return (_jsx(Box, { marginTop: 1, flexShrink: 1, children: _jsx(Text, { color: theme.textDim, wrap: "wrap", children: item.text }) }, item.id));
             case "plan_transition":
-                return (_jsx(Box, { marginTop: 1, flexShrink: 1, children: _jsxs(Text, { color: theme.planPrimary, bold: true, wrap: "wrap", children: [item.active ? "⊞ " : "⊟ ", item.text] }) }, item.id));
+                return (_jsx(Box, { marginTop: 1, flexShrink: 1, children: _jsxs(Text, { color: theme.planPrimary, bold: true, wrap: "wrap", children: [item.active ? "● " : "● ", item.text] }) }, item.id));
             case "queued":
                 return (_jsxs(Box, { marginTop: 1, children: [_jsx(Text, { color: theme.accent, bold: true, children: "⏳ Queued: " }), _jsxs(Text, { color: theme.text, wrap: "wrap", children: [item.text, item.imageCount
                                     ? ` (+${item.imageCount} image${item.imageCount > 1 ? "s" : ""})`
@@ -1547,11 +1637,17 @@ export function App(props) {
                     setStaticKey((k) => k + 1);
                     setOverlay(null);
                 } })) : isPlanView ? (_jsx(PlanOverlay, { cwd: props.cwd, autoExpandNewest: planAutoExpand, onClose: () => {
+                    planOverlayPendingRef.current = false;
                     stdout?.write("\x1b[2J\x1b[3J\x1b[H");
                     setStaticKey((k) => k + 1);
                     setPlanAutoExpand(false);
                     setOverlay(null);
                 }, onApprove: (planPath) => {
+                    log("INFO", "plan", "Plan approved — transitioning to implementation", {
+                        planPath,
+                    });
+                    // Plan overlay dismissed — allow future onDone to fire normally
+                    planOverlayPendingRef.current = false;
                     // Store approved plan path — will be injected into the new system prompt
                     approvedPlanPathRef.current = planPath;
                     // Extract plan steps for progress tracking
@@ -1569,28 +1665,36 @@ export function App(props) {
                     setOverlay(null);
                     // Rebuild system prompt with the approved plan, then reset the session
                     void (async () => {
-                        const newPrompt = await buildSystemPrompt(props.cwd, props.skills, false, planPath);
-                        messagesRef.current = [{ role: "system", content: newPrompt }];
-                        agentLoop.reset();
-                        persistedIndexRef.current = messagesRef.current.length;
-                        // Create a new session file
-                        const sm = sessionManagerRef.current;
-                        if (sm) {
-                            const s = await sm.create(props.cwd, currentProvider, currentModel);
-                            sessionPathRef.current = s.path;
+                        try {
+                            const newPrompt = await buildSystemPrompt(props.cwd, props.skills, false, planPath);
+                            messagesRef.current = [{ role: "system", content: newPrompt }];
+                            agentLoop.reset();
+                            persistedIndexRef.current = messagesRef.current.length;
+                            // Create a new session file
+                            const sm = sessionManagerRef.current;
+                            if (sm) {
+                                const s = await sm.create(props.cwd, currentProvider, currentModel);
+                                sessionPathRef.current = s.path;
+                            }
+                            // Start implementation with a clean context
+                            setLiveItems([
+                                {
+                                    kind: "info",
+                                    text: "Plan approved — starting fresh session for implementation",
+                                    id: getId(),
+                                },
+                            ]);
+                            setDoneStatus(null);
+                            await agentLoop.run("The plan has been approved. Implement it now, following each step in order.");
+                        }
+                        catch (err) {
+                            const errMsg = err instanceof Error ? err.message : String(err);
+                            log("ERROR", "error", errMsg);
+                            setLiveItems((prev) => [...prev, { kind: "error", message: errMsg, id: getId() }]);
                         }
-                        // Start implementation with a clean context
-                        setLiveItems([
-                            {
-                                kind: "info",
-                                text: "Plan approved — starting fresh session for implementation",
-                                id: getId(),
-                            },
-                        ]);
-                        setDoneStatus(null);
-                        await agentLoop.run("The plan has been approved. Implement it now, following each step in order.");
                     })();
                 }, onReject: (planPath, feedback) => {
+                    planOverlayPendingRef.current = false;
                     stdout?.write("\x1b[2J\x1b[3J\x1b[H");
                     setStaticKey((k) => k + 1);
                     setPlanAutoExpand(false);
@@ -1603,10 +1707,15 @@ export function App(props) {
                         ...prev,
                         { kind: "info", text: `Plan rejected — "${feedback}"`, id: getId() },
                     ]);
-                    void agentLoop.run(msg);
+                    void agentLoop.run(msg).catch((err) => {
+                        const errMsg = err instanceof Error ? err.message : String(err);
+                        log("ERROR", "error", errMsg);
+                        setLiveItems((prev) => [...prev, { kind: "error", message: errMsg, id: getId() }]);
+                    });
                 } })) : (_jsxs(_Fragment, { children: [_jsxs(Box, { flexDirection: "column", flexGrow: 1, paddingRight: 1, children: [liveItems.map((item) => renderItem(item)), _jsx(StreamingArea, { isRunning: agentLoop.isRunning, streamingText: agentLoop.streamingText, streamingThinking: agentLoop.streamingThinking, showThinking: props.showThinking, thinkingMs: agentLoop.thinkingMs, planMode: planMode })] }), agentLoop.isRunning && agentLoop.activityPhase !== "idle" ? (_jsx(Box, { marginTop: 1, borderStyle: "round", borderColor: agentLoop.activityPhase === "thinking"
                             ? THINKING_BORDER_COLORS[thinkingBorderFrame]
-                            : "transparent", paddingLeft: 1, paddingRight: 1, width: columns, children: _jsx(ActivityIndicator, { phase: agentLoop.activityPhase, elapsedMs: agentLoop.elapsedMs, thinkingMs: agentLoop.thinkingMs, isThinking: agentLoop.isThinking, tokenEstimate: agentLoop.streamedTokenEstimate, charCountRef: agentLoop.charCountRef, realTokensAccumRef: agentLoop.realTokensAccumRef, userMessage: lastUserMessage, activeToolNames: agentLoop.activeToolCalls.map((tc) => tc.name), planMode: planMode, retryInfo: agentLoop.retryInfo, planDone: planSteps.filter((s) => s.completed).length, planTotal: planSteps.length }) })) : (doneStatus && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: theme.success, children: ["✻ ", doneStatus.verb, " ", formatDuration(doneStatus.durationMs)] }) }))), agentLoop.queuedCount > 0 && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: theme.accent, children: ["⏳ ", agentLoop.queuedCount, " message", agentLoop.queuedCount > 1 ? "s" : "", " queued"] }) })), _jsx(InputArea, { onSubmit: handleSubmit, onAbort: handleAbort, disabled: agentLoop.isRunning, isActive: !taskBarFocused && !overlay, onDownAtEnd: handleFocusTaskBar, onShiftTab: handleToggleThinking, onToggleTasks: () => {
+                            : "transparent", paddingLeft: 1, paddingRight: 1, width: columns, children: _jsx(ActivityIndicator, { phase: agentLoop.activityPhase, elapsedMs: agentLoop.elapsedMs, runStartRef: agentLoop.runStartRef, thinkingMs: agentLoop.thinkingMs, isThinking: agentLoop.isThinking, tokenEstimate: agentLoop.streamedTokenEstimate, charCountRef: agentLoop.charCountRef, realTokensAccumRef: agentLoop.realTokensAccumRef, userMessage: lastUserMessage, activeToolNames: agentLoop.activeToolCalls.map((tc) => tc.name), planMode: planMode, retryInfo: agentLoop.retryInfo, planDone: planSteps.filter((s) => s.completed).length, planTotal: planSteps.length }) })) : agentLoop.stallError ? (_jsxs(Box, { marginTop: 1, flexDirection: "column", children: [_jsx(Text, { color: theme.warning, children: "⚠ API provider stream interrupted — retries exhausted." }), _jsx(Text, { color: theme.textDim, children: "  Your conversation is preserved. Send a message to continue." })] })) : (doneStatus &&
+                        !agentLoop.isRunning && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: theme.success, children: ["✻ ", doneStatus.verb, " ", formatDuration(doneStatus.durationMs)] }) }))), agentLoop.queuedCount > 0 && (_jsx(Box, { marginTop: 1, children: _jsxs(Text, { color: theme.accent, children: ["⏳ ", agentLoop.queuedCount, " message", agentLoop.queuedCount > 1 ? "s" : "", " queued"] }) })), _jsx(InputArea, { onSubmit: handleSubmit, onAbort: handleAbort, disabled: agentLoop.isRunning, isActive: !taskBarFocused && !overlay, onDownAtEnd: handleFocusTaskBar, onShiftTab: handleToggleThinking, onToggleTasks: () => {
                             stdout?.write("\x1b[2J\x1b[3J\x1b[H");
                             setOverlay("tasks");
                         }, onToggleSkills: () => {
@@ -1625,6 +1734,6 @@ export function App(props) {
                                     id: getId(),
                                 },
                             ]);
-                        }, cwd: props.cwd, commands: allCommands }), overlay === "model" ? (_jsx(ModelSelector, { onSelect: handleModelSelect, onCancel: () => setOverlay(null), loggedInProviders: props.loggedInProviders ?? [currentProvider], currentModel: currentModel, currentProvider: currentProvider })) : (_jsx(Footer, { model: currentModel, tokensIn: agentLoop.contextUsed, linesAdded: agentLoop.linesChanged.added, linesRemoved: agentLoop.linesChanged.removed, cwd: props.cwd, gitBranch: gitBranch, thinkingEnabled: thinkingEnabled, planMode: planMode })), buddyEnabled && _jsx(Buddy, { phase: agentLoop.activityPhase }), bgTasks.length > 0 && (_jsx(BackgroundTasksBar, { tasks: bgTasks, focused: taskBarFocused, expanded: taskBarExpanded, selectedIndex: selectedTaskIndex, onExpand: handleTaskBarExpand, onCollapse: handleTaskBarCollapse, onKill: handleTaskKill, onExit: handleTaskBarExit, onNavigate: handleTaskNavigate }))] }))] }));
+                        }, cwd: props.cwd, commands: allCommands }), overlay === "model" ? (_jsx(ModelSelector, { onSelect: handleModelSelect, onCancel: () => setOverlay(null), loggedInProviders: props.loggedInProviders ?? [currentProvider], currentModel: currentModel, currentProvider: currentProvider })) : overlay === "theme" ? (_jsx(ThemeSelector, { onSelect: handleThemeSelect, onCancel: () => setOverlay(null), currentTheme: theme.name })) : (_jsx(Footer, { model: currentModel, tokensIn: agentLoop.contextUsed, cwd: props.cwd, gitBranch: gitBranch, thinkingEnabled: thinkingEnabled, planMode: planMode, exitPending: exitPending })), buddyEnabled && _jsx(Buddy, { phase: agentLoop.activityPhase }), bgTasks.length > 0 && (_jsx(BackgroundTasksBar, { tasks: bgTasks, focused: taskBarFocused, expanded: taskBarExpanded, selectedIndex: selectedTaskIndex, onExpand: handleTaskBarExpand, onCollapse: handleTaskBarCollapse, onKill: handleTaskKill, onExit: handleTaskBarExit, onNavigate: handleTaskNavigate }))] }))] }));
 }
 //# sourceMappingURL=App.js.map