@kenkaiiii/ggcoder 4.3.149 → 4.3.151

package/dist/ui/App.js

@@ -48,7 +48,7 @@ import { estimateConversationTokens } from "../core/compaction/token-estimator.j
 import { PROMPT_COMMANDS, getPromptCommand } from "../core/prompt-commands.js";
 import { loadCustomCommands } from "../core/custom-commands.js";
 import { buildSystemPrompt } from "../system-prompt.js";
-import { extractPlanSteps, findCompletedMarkers, markStepsCompleted, stripDoneMarkers, } from "../utils/plan-steps.js";
+import { extractPlanSteps, findCompletedMarkers, markStepsCompleted, segmentDisplayText, stripDoneMarkers, } from "../utils/plan-steps.js";
 import { getMCPServers } from "../core/mcp/index.js";
 import { trimFlushedItems, flushOnTurnText, flushOnTurnEnd, flushOverflow, } from "./live-item-flush.js";
 import { Buddy } from "./buddy/Buddy.js";
@@ -278,14 +278,17 @@ export function App(props) {
     // Hoisted before terminal title hook so it can reference them
     const [lastUserMessage, setLastUserMessage] = useState("");
     const [exitPending, setExitPending] = useState(false);
-    const [planMode, setPlanMode] = useState(false);
+    // Initialize from planModeRef (lives outside React in cli.ts) so plan
+    // mode survives /clear's unmount/remount, matching the prior behavior
+    // where /clear didn't toggle plan mode off.
+    const [planMode, setPlanMode] = useState(props.planModeRef?.current ?? 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 [titleRunning, setTitleRunning] = useState(false);
-    const [sessionTitle, setSessionTitle] = useState(undefined);
-    const sessionTitleGeneratedRef = useRef(false);
+    const [sessionTitle, setSessionTitle] = useState(() => props.sessionStore?.sessionTitle);
+    const sessionTitleGeneratedRef = useRef(props.sessionStore?.sessionTitleGenerated ?? false);
     useTerminalTitle({
         isRunning: titleRunning,
         sessionTitle,
@@ -296,6 +299,11 @@ export function App(props) {
     // gatsby). Ink's Static (build/components/Static.js) starts with index=0
     // so slice(0) returns the full array regardless of length.
     const [history, setHistory] = useState(() => {
+        // sessionStore wins (lives across remount). Falls back to initialHistory
+        // (loaded from a session file at startup), then a fresh banner-only list.
+        const stored = props.sessionStore?.history;
+        if (stored && stored.length > 0)
+            return stored;
         if (props.initialHistory && props.initialHistory.length > 0) {
             return compactHistory(trimFlushedItems(props.initialHistory));
         }
@@ -303,7 +311,9 @@ export function App(props) {
     });
     // Items from the current/last turn — rendered in the live area so they stay visible
     const [liveItems, setLiveItems] = useState([]);
-    const [overlay, setOverlay] = useState(props.initialOverlay ?? null);
+    // overlay seeded from sessionStore (lives across remount). Falls back to
+    // props.initialOverlay (CLI launched with one), then null.
+    const [overlay, setOverlay] = useState(props.sessionStore?.overlay ?? props.initialOverlay ?? null);
     const [taskCount, setTaskCount] = useState(() => getTaskCount(props.cwd));
     const [eyesCount, setEyesCount] = useState(() => isEyesActive(props.cwd) ? journalCount({ status: "open" }, props.cwd) : undefined);
     const [updatePending, setUpdatePending] = useState(() => getPendingUpdate(props.version) !== null);
@@ -324,14 +334,14 @@ export function App(props) {
     const [currentProvider, setCurrentProvider] = useState(props.provider);
     const [currentTools, setCurrentTools] = useState(props.tools);
     const [thinkingEnabled, setThinkingEnabled] = useState(!!props.thinking);
-    const messagesRef = useRef(props.messages);
-    const [planAutoExpand, setPlanAutoExpand] = useState(false);
-    const approvedPlanPathRef = useRef(undefined);
-    const planStepsRef = useRef([]);
-    const [planSteps, setPlanSteps] = useState([]);
+    const messagesRef = useRef(props.sessionStore?.messages ?? props.messages);
+    const [planAutoExpand, setPlanAutoExpand] = useState(props.sessionStore?.planAutoExpand ?? false);
+    const approvedPlanPathRef = useRef(props.sessionStore?.approvedPlanPath);
+    const planStepsRef = useRef(props.sessionStore?.planSteps ?? []);
+    const [planSteps, setPlanSteps] = useState(props.sessionStore?.planSteps ?? []);
     const nextIdRef = useRef(0);
     const sessionManagerRef = useRef(props.sessionsDir ? new SessionManager(props.sessionsDir) : null);
-    const sessionPathRef = useRef(props.sessionPath);
+    const sessionPathRef = useRef(props.sessionStore?.sessionPath ?? props.sessionPath);
     const persistedIndexRef = useRef(messagesRef.current.length);
     /** Last actual API-reported input token count (from turn_end). */
     const lastActualTokensRef = useRef(0);
@@ -351,6 +361,44 @@ export function App(props) {
         pendingFlushRef.current = [...pendingFlushRef.current, ...items];
         setFlushGeneration((g) => g + 1);
     }, []);
+    // Mirror runtime state choices (model/provider/thinking) into renderApp's
+    // closure so unmount/remount preserves them.
+    const onRuntimeStateChange = props.onRuntimeStateChange;
+    useEffect(() => {
+        onRuntimeStateChange?.({ model: currentModel });
+    }, [currentModel, onRuntimeStateChange]);
+    useEffect(() => {
+        onRuntimeStateChange?.({ provider: currentProvider });
+    }, [currentProvider, onRuntimeStateChange]);
+    useEffect(() => {
+        onRuntimeStateChange?.({
+            thinking: thinkingEnabled ? (props.thinking ?? "medium") : undefined,
+        });
+    }, [thinkingEnabled, props.thinking, onRuntimeStateChange]);
+    // Mirror session state into renderApp's closure so resetUI() can re-seed
+    // the conversation on remount. Each panel that previously did a bare ANSI
+    // screen clear (overlay open/close, plan accept/reject, /clear, startTask)
+    // now goes through resetUI; without these mirrors, the chat would vanish.
+    const sessionStore = props.sessionStore;
+    useEffect(() => {
+        if (sessionStore)
+            sessionStore.history = history;
+    }, [history, sessionStore]);
+    useEffect(() => {
+        if (sessionStore)
+            sessionStore.planSteps = planSteps;
+    }, [planSteps, sessionStore]);
+    useEffect(() => {
+        if (sessionStore)
+            sessionStore.sessionTitle = sessionTitle;
+    }, [sessionTitle, sessionStore]);
+    useEffect(() => {
+        if (sessionStore)
+            sessionStore.overlay = overlay;
+    }, [overlay, sessionStore]);
+    // pendingAction is consumed via a useEffect AFTER agentLoop is created
+    // — see below where useAgentLoop is set up.
+    const pendingActionConsumedRef = useRef(false);
     // Derive credentials for the current provider
     const currentCreds = props.credentialsByProvider?.[currentProvider];
     const activeApiKey = currentCreds?.accessToken ?? props.apiKey;
@@ -422,6 +470,13 @@ export function App(props) {
                 // premature "done" status that fires when the agent loop finishes
                 planOverlayPendingRef.current = true;
                 setTimeout(() => {
+                    // NOTE: this is the one open-overlay path that does NOT remount via
+                    // resetUI. It runs while the agent is still mid-turn (after the
+                    // exit_plan tool returned but before onDone fires), and unmounting
+                    // here would kill the in-flight agent stream. Keep the bare ANSI
+                    // clear; the drift bug is tolerable across just the agent's
+                    // wrap-up turn, and onApprove/onReject both remount cleanly via
+                    // resetUI when the user resolves the plan.
                     stdout?.write("\x1b[2J\x1b[3J\x1b[H");
                     setPlanAutoExpand(true);
                     setOverlay("plan");
@@ -708,17 +763,53 @@ export function App(props) {
                 if (flushed.length > 0) {
                     queueFlush(flushed);
                 }
-                const displayText = planStepsRef.current.length > 0 ? stripDoneMarkers(text) : text;
-                return [
-                    {
+                // Split text on [DONE:N] markers so each marker renders inline as
+                // a styled "✓ Step N: <description>" item at the position the
+                // agent emitted it, instead of vanishing into stripped whitespace.
+                // Falls back to a single assistant item containing the
+                // marker-stripped text when there are no markers (keeps the
+                // common case zero-cost).
+                const segments = segmentDisplayText(text, planStepsRef.current);
+                const items = [];
+                let thinkingAttached = false;
+                for (const seg of segments) {
+                    if (seg.kind === "text") {
+                        items.push({
+                            kind: "assistant",
+                            text: stripDoneMarkers(seg.text),
+                            // Attach thinking only to the first text segment so we
+                            // don't render duplicate ThinkingBlocks when a turn
+                            // contains multiple text chunks split by markers.
+                            thinking: thinkingAttached ? undefined : thinking,
+                            thinkingMs: thinkingAttached ? undefined : thinkingMs,
+                            planMode: planModeLocalRef.current,
+                            id: getId(),
+                        });
+                        thinkingAttached = true;
+                    }
+                    else {
+                        items.push({
+                            kind: "step_done",
+                            stepNum: seg.stepNum,
+                            description: seg.description,
+                            id: getId(),
+                        });
+                    }
+                }
+                // No segments at all (text was empty/whitespace, no markers).
+                // Still emit an assistant item so a thinking block renders if
+                // there was thinking content for this turn.
+                if (items.length === 0) {
+                    items.push({
                         kind: "assistant",
-                        text: displayText,
+                        text: "",
                         thinking,
                         thinkingMs,
                         planMode: planModeLocalRef.current,
                         id: getId(),
-                    },
-                ];
+                    });
+                }
+                return items;
             });
         }, []),
         onToolStart: useCallback((toolCallId, name, args) => {
@@ -1188,6 +1279,33 @@ export function App(props) {
     useEffect(() => {
         setTitleRunning(agentLoop.isRunning);
     }, [agentLoop.isRunning]);
+    // Consume sessionStore.pendingAction once on mount. Set by resetUI options
+    // for paths that remount AND immediately drive the agent (plan accept,
+    // plan reject, startTask, pixel fix). The action survives the unmount
+    // because it lives in renderApp's closure (sessionStore), not React state.
+    useEffect(() => {
+        if (pendingActionConsumedRef.current)
+            return;
+        const action = sessionStore?.pendingAction;
+        if (!action)
+            return;
+        pendingActionConsumedRef.current = true;
+        if (sessionStore)
+            sessionStore.pendingAction = undefined;
+        if (action.infoText) {
+            setLiveItems((prev) => [
+                ...prev,
+                { kind: "info", text: action.infoText, id: getId() },
+            ]);
+        }
+        setDoneStatus(null);
+        void agentLoop.run(action.prompt).catch((err) => {
+            const errMsg = err instanceof Error ? err.message : String(err);
+            log("ERROR", "error", errMsg);
+            setLiveItems((prev) => [...prev, { kind: "error", message: errMsg, id: getId() }]);
+        });
+        // Intentional one-shot: run once on mount, never re-fire on re-render.
+    }, []);
     // Refresh eyes badge count when the agent settles (end of a turn) — a turn
     // may have logged new rough/wish/blocked signals. Also covers the case where
     // /eyes was run for the first time (manifest now exists).
@@ -1229,13 +1347,29 @@ export function App(props) {
         if (trimmed === "/quit" || trimmed === "/q" || trimmed === "/exit") {
             process.exit(0);
         }
-        // Handle /clear — reset session and clear terminal
+        // Handle /clear — tear down the entire Ink instance and rebuild fresh.
+        // Patching Ink's internal frame tracking in place (log-update reset,
+        // lastOutput cleared, fullStaticOutput dropped, staticKey bump) all
+        // looked correct for one frame but left the live area drifting on
+        // subsequent streaming responses — Ink's cursor math depends on
+        // terminal-state assumptions that ANSI clearing breaks. The reliable
+        // fix is unmount + render again. Runtime state (model, provider,
+        // thinking) survives via renderApp's closure-held `runtimeState`,
+        // mirrored from React state via the useEffects above.
         if (trimmed === "/clear") {
-            // Clear terminal screen + scrollback — needed because Ink's <Static>
-            // writes directly to stdout and can't be removed by clearing React state
+            if (props.resetUI) {
+                void (async () => {
+                    const newPrompt = await buildSystemPrompt(props.cwd, props.skills, planMode, undefined);
+                    props.resetUI?.({
+                        wipeSession: true,
+                        messages: [{ role: "system", content: newPrompt }],
+                    });
+                })();
+                return;
+            }
+            // Fallback path (resetUI not wired — e.g. tests). Best-effort: clear
+            // React state in place. The Ink-internal drift bug remains here.
             stdout?.write("\x1b[2J\x1b[3J\x1b[H");
-            // Discard any items queued for two-phase flush so they don't leak
-            // into the new session after the Static remount.
             pendingFlushRef.current = [];
             setHistory([{ kind: "banner", id: "banner" }]);
             setLiveItems([]);
@@ -1243,7 +1377,6 @@ export function App(props) {
             approvedPlanPathRef.current = undefined;
             planStepsRef.current = [];
             setPlanSteps([]);
-            // Rebuild system prompt without the approved plan
             void (async () => {
                 const newPrompt = await buildSystemPrompt(props.cwd, props.skills, planMode, undefined);
                 messagesRef.current = [{ role: "system", content: newPrompt }];
@@ -1252,8 +1385,6 @@ export function App(props) {
             agentLoop.reset();
             setSessionTitle(undefined);
             sessionTitleGeneratedRef.current = false;
-            // Bump staticKey to force Ink's <Static> to remount, discarding its
-            // internal record of previously rendered items so they don't reappear.
             setStaticKey((k) => k + 1);
             setLiveItems([{ kind: "info", text: "Session cleared.", id: getId() }]);
             return;
@@ -1339,9 +1470,16 @@ export function App(props) {
         }
         // Handle /plans — open plan pane
         if (trimmed === "/plans") {
-            stdout?.write("\x1b[2J\x1b[3J\x1b[H");
-            setPlanAutoExpand(false);
-            setOverlay("plan");
+            if (props.resetUI && props.sessionStore) {
+                props.sessionStore.overlay = "plan";
+                props.sessionStore.planAutoExpand = false;
+                props.resetUI();
+            }
+            else {
+                stdout?.write("\x1b[2J\x1b[3J\x1b[H");
+                setPlanAutoExpand(false);
+                setOverlay("plan");
+            }
             return;
         }
         // Handle prompt-template commands (built-in + custom from .gg/commands/)
@@ -1707,6 +1845,8 @@ export function App(props) {
                 return (_jsx(Box, { marginTop: 1, flexShrink: 1, borderStyle: "round", borderColor: theme.success, paddingX: 1, children: _jsxs(Text, { color: theme.success, bold: true, 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));
+            case "step_done":
+                return (_jsx(Box, { marginTop: 1, flexShrink: 1, children: _jsxs(Text, { wrap: "wrap", children: [_jsx(Text, { color: theme.success, bold: true, children: "✓ " }), _jsx(Text, { color: theme.success, bold: true, children: `Step ${item.stepNum} done` }), item.description ? (_jsx(Text, { color: theme.textDim, children: ` — ${item.description}` })) : null] }) }, 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" : ""})`
@@ -1724,7 +1864,42 @@ export function App(props) {
     // ── Start a task (shared by manual "work on it" and run-all) ──
     const startTask = useCallback((title, prompt, taskId) => {
         setTaskCount(getTaskCount(props.cwd));
-        // Reset to a fresh session before sending the task
+        const shortId = taskId.slice(0, 8);
+        const completionHint = `\n\n---\nWhen you have fully completed this task, call the tasks tool to mark it done:\n` +
+            `tasks({ action: "done", id: "${shortId}" })`;
+        const fullPrompt = prompt + completionHint;
+        if (props.resetUI && props.sessionStore) {
+            // Preserve the current system prompt (may differ from the launch
+            // config — e.g. plan mode toggled or skills changed).
+            const sysMsg = messagesRef.current[0];
+            const newMessages = sysMsg && sysMsg.role === "system" ? [sysMsg] : messagesRef.current.slice(0, 1);
+            const taskItem = { kind: "task", title, id: String(nextIdRef.current++) };
+            const sm = sessionManagerRef.current;
+            void (async () => {
+                let newSessionPath;
+                if (sm) {
+                    try {
+                        const s = await sm.create(props.cwd, currentProvider, currentModel);
+                        newSessionPath = s.path;
+                        log("INFO", "tasks", "New session for task", { path: s.path });
+                    }
+                    catch {
+                        // session creation is best-effort
+                    }
+                }
+                if (props.sessionStore)
+                    props.sessionStore.overlay = null;
+                props.resetUI?.({
+                    wipeSession: true,
+                    messages: newMessages,
+                    history: [{ kind: "banner", id: "banner" }, taskItem],
+                    sessionPath: newSessionPath,
+                    pendingAction: { prompt: fullPrompt },
+                });
+            })();
+            return;
+        }
+        // Fallback path (resetUI not wired — tests).
         stdout?.write("\x1b[2J\x1b[3J\x1b[H");
         setHistory([{ kind: "banner", id: "banner" }]);
         setLiveItems([]);
@@ -1738,12 +1913,6 @@ export function App(props) {
                 log("INFO", "tasks", "New session for task", { path: s.path });
             });
         }
-        // Inject completion instruction so the agent marks the task done
-        const shortId = taskId.slice(0, 8);
-        const completionHint = `\n\n---\nWhen you have fully completed this task, call the tasks tool to mark it done:\n` +
-            `tasks({ action: "done", id: "${shortId}" })`;
-        const fullPrompt = prompt + completionHint;
-        // Show the short title in the TUI, but send the full prompt to the agent
         const taskItem = { kind: "task", title, id: getId() };
         setLastUserMessage(title);
         setDoneStatus(null);
@@ -1762,11 +1931,18 @@ export function App(props) {
                         ? { kind: "info", text: "Request was stopped.", id: getId() }
                         : { kind: "error", message: msg, id: getId() },
                 ]);
-                // Stop run-all if a task errors
                 setRunAllTasks(false);
             }
         })();
-    }, [props.cwd, stdout, agentLoop, currentProvider, currentModel]);
+    }, [
+        props.cwd,
+        props.resetUI,
+        props.sessionStore,
+        stdout,
+        agentLoop,
+        currentProvider,
+        currentModel,
+    ]);
     // Keep refs in sync for access from stale closures (onDone)
     startTaskRef.current = startTask;
     useEffect(() => {
@@ -1850,10 +2026,16 @@ export function App(props) {
     const isPixelView = overlay === "pixel";
     const isOverlayView = isTaskView || isSkillsView || isPlanView || isEyesView || isPixelView;
     return (_jsxs(Box, { flexDirection: "column", width: columns, children: [_jsx(Static, { items: isOverlayView ? [] : history, style: { width: "100%" }, children: (item) => (_jsx(Box, { flexDirection: "column", paddingRight: 1, children: renderItem(item) }, item.id)) }, `${resizeKey}-${staticKey}`), isTaskView ? (_jsx(TaskOverlay, { cwd: props.cwd, agentRunning: agentLoop.isRunning, onClose: () => {
-                    stdout?.write("\x1b[2J\x1b[3J\x1b[H");
-                    setTaskCount(getTaskCount(props.cwd));
-                    setStaticKey((k) => k + 1);
-                    setOverlay(null);
+                    if (props.resetUI && props.sessionStore) {
+                        props.sessionStore.overlay = null;
+                        props.resetUI();
+                    }
+                    else {
+                        stdout?.write("\x1b[2J\x1b[3J\x1b[H");
+                        setTaskCount(getTaskCount(props.cwd));
+                        setStaticKey((k) => k + 1);
+                        setOverlay(null);
+                    }
                 }, onWorkOnTask: (title, prompt, taskId) => {
                     setOverlay(null);
                     startTask(title, prompt, taskId);
@@ -1866,9 +2048,15 @@ export function App(props) {
                         startTask(next.title, next.prompt, next.id);
                     }
                 } })) : isPixelView ? (_jsx(PixelOverlay, { version: props.version, agentRunning: agentLoop.isRunning, onClose: () => {
-                    stdout?.write("\x1b[2J\x1b[3J\x1b[H");
-                    setStaticKey((k) => k + 1);
-                    setOverlay(null);
+                    if (props.resetUI && props.sessionStore) {
+                        props.sessionStore.overlay = null;
+                        props.resetUI();
+                    }
+                    else {
+                        stdout?.write("\x1b[2J\x1b[3J\x1b[H");
+                        setStaticKey((k) => k + 1);
+                        setOverlay(null);
+                    }
                 }, onFixOne: (entry) => {
                     setOverlay(null);
                     startPixelFix(entry.errorId);
@@ -1880,57 +2068,95 @@ export function App(props) {
                     setRunAllPixel(true);
                     startPixelFix(first.errorId);
                 } })) : isSkillsView ? (_jsx(SkillsOverlay, { cwd: props.cwd, onClose: () => {
-                    stdout?.write("\x1b[2J\x1b[3J\x1b[H");
-                    setStaticKey((k) => k + 1);
-                    setOverlay(null);
+                    if (props.resetUI && props.sessionStore) {
+                        props.sessionStore.overlay = null;
+                        props.resetUI();
+                    }
+                    else {
+                        stdout?.write("\x1b[2J\x1b[3J\x1b[H");
+                        setStaticKey((k) => k + 1);
+                        setOverlay(null);
+                    }
                 } })) : isEyesView ? (_jsx(EyesOverlay, { cwd: props.cwd, onClose: () => {
-                    stdout?.write("\x1b[2J\x1b[3J\x1b[H");
-                    setEyesCount(isEyesActive(props.cwd) ? journalCount({ status: "open" }, props.cwd) : undefined);
-                    setStaticKey((k) => k + 1);
-                    setOverlay(null);
+                    if (props.resetUI && props.sessionStore) {
+                        props.sessionStore.overlay = null;
+                        props.resetUI();
+                    }
+                    else {
+                        stdout?.write("\x1b[2J\x1b[3J\x1b[H");
+                        setEyesCount(isEyesActive(props.cwd) ? journalCount({ status: "open" }, props.cwd) : undefined);
+                        setStaticKey((k) => k + 1);
+                        setOverlay(null);
+                    }
                 }, onQueueMessage: (msg) => {
                     agentLoop.queueMessage(msg);
                 } })) : 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);
+                    if (props.resetUI && props.sessionStore) {
+                        props.sessionStore.overlay = null;
+                        props.sessionStore.planAutoExpand = false;
+                        props.resetUI();
+                    }
+                    else {
+                        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
-                    void import("node:fs/promises").then(({ readFile }) => readFile(planPath, "utf-8").then((content) => {
-                        const steps = extractPlanSteps(content);
-                        planStepsRef.current = steps;
-                        setPlanSteps(steps);
-                    }));
-                    // Clear session for a fresh context focused on the plan
-                    stdout?.write("\x1b[2J\x1b[3J\x1b[H");
-                    setHistory([{ kind: "banner", id: "banner" }]);
-                    setLiveItems([]);
-                    setStaticKey((k) => k + 1);
-                    setPlanAutoExpand(false);
-                    setOverlay(null);
-                    // Rebuild system prompt with the approved plan, then reset the session
                     void (async () => {
                         try {
+                            // Read plan steps for progress tracking — handed to the new
+                            // mount via sessionStore.planSteps below.
+                            const planContent = await import("node:fs/promises").then(({ readFile }) => readFile(planPath, "utf-8"));
+                            const steps = extractPlanSteps(planContent);
+                            // Build the new system prompt with the approved plan baked in.
                             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
+                            // Create a new session file BEFORE remount so the new tree
+                            // picks it up via sessionStore.sessionPath.
+                            let newSessionPath;
                             const sm = sessionManagerRef.current;
                             if (sm) {
                                 const s = await sm.create(props.cwd, currentProvider, currentModel);
-                                sessionPathRef.current = s.path;
+                                newSessionPath = s.path;
+                            }
+                            if (props.resetUI && props.sessionStore) {
+                                // Clear the overlay so the new mount lands on the chat,
+                                // not back inside the plan pane.
+                                props.sessionStore.overlay = null;
+                                props.sessionStore.planAutoExpand = false;
+                                props.resetUI({
+                                    wipeSession: true,
+                                    messages: [{ role: "system", content: newPrompt }],
+                                    approvedPlanPath: planPath,
+                                    planSteps: steps,
+                                    sessionPath: newSessionPath,
+                                    pendingAction: {
+                                        prompt: "The plan has been approved. Implement it now, following each step in order.",
+                                        infoText: "Plan approved — starting fresh session for implementation",
+                                    },
+                                });
+                                return;
                             }
-                            // Start implementation with a clean context
+                            // Fallback path (resetUI not wired — tests). Mutate in place.
+                            approvedPlanPathRef.current = planPath;
+                            planStepsRef.current = steps;
+                            setPlanSteps(steps);
+                            stdout?.write("\x1b[2J\x1b[3J\x1b[H");
+                            setHistory([{ kind: "banner", id: "banner" }]);
+                            setLiveItems([]);
+                            setStaticKey((k) => k + 1);
+                            setPlanAutoExpand(false);
+                            setOverlay(null);
+                            messagesRef.current = [{ role: "system", content: newPrompt }];
+                            agentLoop.reset();
+                            persistedIndexRef.current = messagesRef.current.length;
+                            if (newSessionPath)
+                                sessionPathRef.current = newSessionPath;
                             setLiveItems([
                                 {
                                     kind: "info",
@@ -1949,19 +2175,31 @@ export function App(props) {
                     })();
                 }, onReject: (planPath, feedback) => {
                     planOverlayPendingRef.current = false;
+                    const rejectionMsg = `The plan at ${planPath} was rejected.\n\nFeedback: ${feedback}\n\n` +
+                        `Please revise the plan based on this feedback.`;
+                    if (props.resetUI && props.sessionStore) {
+                        props.sessionStore.overlay = null;
+                        props.sessionStore.planAutoExpand = false;
+                        // No wipeSession — keep history, messages, plan mode etc. The
+                        // agent picks up the rejection mid-conversation.
+                        props.resetUI({
+                            pendingAction: {
+                                prompt: rejectionMsg,
+                                infoText: `Plan rejected — "${feedback}"`,
+                            },
+                        });
+                        return;
+                    }
                     stdout?.write("\x1b[2J\x1b[3J\x1b[H");
                     setStaticKey((k) => k + 1);
                     setPlanAutoExpand(false);
                     setOverlay(null);
                     setDoneStatus(null);
-                    // Send rejection + feedback to the agent
-                    const msg = `The plan at ${planPath} was rejected.\n\nFeedback: ${feedback}\n\n` +
-                        `Please revise the plan based on this feedback.`;
                     setLiveItems((prev) => [
                         ...prev,
                         { kind: "info", text: `Plan rejected — "${feedback}"`, id: getId() },
                     ]);
-                    void agentLoop.run(msg).catch((err) => {
+                    void agentLoop.run(rejectionMsg).catch((err) => {
                         const errMsg = err instanceof Error ? err.message : String(err);
                         log("ERROR", "error", errMsg);
                         setLiveItems((prev) => [...prev, { kind: "error", message: errMsg, id: getId() }]);
@@ -1970,14 +2208,32 @@ export function App(props) {
                             ? THINKING_BORDER_COLORS[thinkingBorderFrame]
                             : "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");
+                            if (props.resetUI && props.sessionStore) {
+                                props.sessionStore.overlay = "tasks";
+                                props.resetUI();
+                            }
+                            else {
+                                stdout?.write("\x1b[2J\x1b[3J\x1b[H");
+                                setOverlay("tasks");
+                            }
                         }, onToggleSkills: () => {
-                            stdout?.write("\x1b[2J\x1b[3J\x1b[H");
-                            setOverlay("skills");
+                            if (props.resetUI && props.sessionStore) {
+                                props.sessionStore.overlay = "skills";
+                                props.resetUI();
+                            }
+                            else {
+                                stdout?.write("\x1b[2J\x1b[3J\x1b[H");
+                                setOverlay("skills");
+                            }
                         }, onTogglePixel: () => {
-                            stdout?.write("\x1b[2J\x1b[3J\x1b[H");
-                            setOverlay("pixel");
+                            if (props.resetUI && props.sessionStore) {
+                                props.sessionStore.overlay = "pixel";
+                                props.resetUI();
+                            }
+                            else {
+                                stdout?.write("\x1b[2J\x1b[3J\x1b[H");
+                                setOverlay("pixel");
+                            }
                         }, onTogglePlanMode: () => {
                             const next = !planMode;
                             setPlanMode(next);