indusagi-coding-agent 0.1.47 → 0.1.48

package/dist/interfaces/react-ink/components/AppShell.js

@@ -1,33 +1,49 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { spawnSync } from "node:child_process";
+import { readFileSync, unlinkSync, writeFileSync } from "node:fs";
+import { tmpdir } from "node:os";
+import { join } from "node:path";
 import { useEffect, useMemo, useReducer, useRef, useState } from "react";
 import { Box, Text, useApp } from "ink";
-import { getAuthPath } from "../../../config.js";
+import { matchesKey } from "indusagi/tui";
+import { Footer, LoginDialog, MessageList, ModelDialog, OAuthDialog, ScopedModelsDialog, SessionDialog, SettingsDialog, StatusLine, TaskPanel, ThemeDialog, TreeDialog, UserMessageDialog, } from "indusagi/react-ink";
+import { APP_NAME, VERSION, getAuthPath } from "../../../config.js";
+import { extensionForImageMimeType, readClipboardImage } from "../../../helpers/clipboard-image.js";
 import { openAuthUrl } from "../../../helpers/open-auth-url.js";
+import { KeybindingsManager } from "../../../runtime/keybindings.js";
 import { resolveModelScope } from "../../../runtime/model-resolver.js";
-import { getAvailableThemes, setTheme } from "../../theme/theme.js";
-import { flattenSessionTree, listSessions, listUserMessages } from "../adapters/session-history.js";
+import { getAvailableThemes, getAvailableThemesWithPaths, getEditorTheme, getThemeByName, setTheme, setThemeInstance, theme as extensionTheme, Theme, } from "../../theme/theme.js";
+import { flattenSessionTree, listAllSessions, listCurrentSessions, listUserMessages } from "../adapters/session-history.js";
 import { uiReducer } from "../state/reducer.js";
 import { createUiStore } from "../state/store.js";
 import { createThemeAdapter } from "../theme-adapter.js";
+import { deleteSessionAtPath, renameSessionAtPath } from "../utils/session-actions.js";
 import { Header } from "./Header.js";
-import { MessageList } from "./MessageList.js";
 import { PromptInput } from "./PromptInput.js";
-import { StatusLine } from "./StatusLine.js";
-import { TaskPanel } from "./TaskPanel.js";
-import { Footer } from "./Footer.js";
 import { useAgentSession } from "../hooks/use-agent-session.js";
 import { useAppKeybindings } from "../hooks/use-app-keybindings.js";
 import { useFooterData } from "../hooks/use-footer-data.js";
 import { usePromptSubmit } from "../hooks/use-prompt-submit.js";
-import { ModelDialog } from "./dialogs/ModelDialog.js";
-import { ThemeDialog } from "./dialogs/ThemeDialog.js";
-import { SessionDialog } from "./dialogs/SessionDialog.js";
-import { TreeDialog } from "./dialogs/TreeDialog.js";
-import { UserMessageDialog } from "./dialogs/UserMessageDialog.js";
-import { LoginDialog } from "./dialogs/LoginDialog.js";
-import { OAuthDialog } from "./dialogs/OAuthDialog.js";
-import { SettingsDialog } from "./dialogs/SettingsDialog.js";
-import { ScopedModelsDialog } from "./dialogs/ScopedModelsDialog.js";
+import { createExtensionTuiBridge, createHostedExtensionComponent, createHostedExtensionComponentFromParts, ExtensionComponentHost, } from "./extensions/ExtensionComponentHost.js";
+import { ExtensionSelectDialog, ExtensionTextDialog } from "./extensions/ExtensionDialogs.js";
+function truncateWidgetLines(lines, maxLines = 10) {
+    if (lines.length <= maxLines) {
+        return lines;
+    }
+    return [...lines.slice(0, maxLines), `... ${lines.length - maxLines} more line(s)`];
+}
+function renderTextLines(lines, prefix) {
+    if (lines.length === 0) {
+        return null;
+    }
+    return (_jsx(Box, { flexDirection: "column", children: lines.map((line, index) => (_jsx(Text, { children: line.length > 0 ? line : " " }, `${prefix}:${index}`))) }));
+}
+function writeTerminalTitle(title) {
+    if (!process.stdout.isTTY) {
+        return;
+    }
+    process.stdout.write(`\u001B]0;${title}\u0007`);
+}
 function buildSettingsItems(session, state, onRefresh, setError) {
     const booleanValues = ["enabled", "disabled"];
     const visibilityValues = ["visible", "hidden"];
@@ -204,15 +220,33 @@ function buildSettingsItems(session, state, onRefresh, setError) {
         },
     ];
 }
-export function AppShell({ context, footerDataProvider, initialImages, initialMessage, initialMessages, startupChangelog, startupNotices, verbose, }) {
+export function AppShell({ context, footerDataProvider, initialImages, initialMessage, initialMessages, startupChangelog, startupDiagnostics, startupNotices, verbose, }) {
     const { exit } = useApp();
+    const keybindings = useMemo(() => KeybindingsManager.create(), []);
     const [state, dispatch] = useReducer(uiReducer, context.session, createUiStore);
     const overlayRef = useRef(state.overlay);
     const oauthResolverRef = useRef(null);
     const startupRanRef = useRef(false);
     const displayBlockIdRef = useRef(0);
     const [terminalRows, setTerminalRows] = useState(process.stdout.rows ?? 40);
+    const [terminalColumns, setTerminalColumns] = useState(process.stdout.columns ?? 80);
     const [displayBlocks, setDisplayBlocks] = useState([]);
+    const [extensionHeader, setExtensionHeader] = useState(null);
+    const [extensionFooter, setExtensionFooter] = useState(null);
+    const [extensionWidgetsAbove, setExtensionWidgetsAbove] = useState(() => new Map());
+    const [extensionWidgetsBelow, setExtensionWidgetsBelow] = useState(() => new Map());
+    const [extensionOverlayState, setExtensionOverlayState] = useState({ kind: "none" });
+    const [extensionEditor, setExtensionEditor] = useState(null);
+    const [extensionWorkingMessage, setExtensionWorkingMessage] = useState();
+    const [toolOutputExpanded, setToolOutputExpanded] = useState(false);
+    const [compactionQueuedMessages, setCompactionQueuedMessages] = useState([]);
+    const [currentSessions, setCurrentSessions] = useState([]);
+    const [layoutEpoch, setLayoutEpoch] = useState(0);
+    const [startupDismissed, setStartupDismissed] = useState(context.session.messages.length > 0);
+    const extensionOverlayRef = useRef({ kind: "none" });
+    const extensionUiContextRef = useRef(undefined);
+    const inputRef = useRef(state.input);
+    const customTerminalTitleRef = useRef(null);
     const setStatus = (text, kind = "info") => {
         dispatch({ type: "set-status", status: { text, kind } });
     };
@@ -232,6 +266,7 @@ export function AppShell({ context, footerDataProvider, initialImages, initialMe
     const setInput = (value, cursorOffset) => {
         dispatch({ type: "set-input", value, cursorOffset });
     };
+    inputRef.current = state.input;
     const appendDisplayBlock = (block) => {
         const timestamp = Date.now();
         displayBlockIdRef.current += 1;
@@ -244,26 +279,289 @@ export function AppShell({ context, footerDataProvider, initialImages, initialMe
             },
         ]);
     };
-    const resetSessionView = () => {
-        setDisplayBlocks([]);
-        dispatch({ type: "set-tool-executions", toolExecutions: {} });
-        refresh();
-    };
     const handleExit = () => {
         context.requestExit();
         exit();
     };
+    const isExtensionCommand = (text) => {
+        if (!text.startsWith("/")) {
+            return false;
+        }
+        const extensionRunner = context.session.extensionRunner;
+        if (!extensionRunner) {
+            return false;
+        }
+        const spaceIndex = text.indexOf(" ");
+        const commandName = spaceIndex === -1 ? text.slice(1) : text.slice(1, spaceIndex);
+        return Boolean(extensionRunner.getCommand(commandName));
+    };
+    const flushCompactionQueueRef = useRef(null);
     const { snapshot, toolExecutions, refresh } = useAgentSession(context.session, (status) => {
         dispatch({ type: "set-status", status });
+    }, (event) => {
+        if (event.type === "session_compact") {
+            void flushCompactionQueueRef.current?.();
+        }
+        if (event.type === "auto_compaction_end" && !event.aborted && event.result) {
+            void flushCompactionQueueRef.current?.();
+        }
     });
     useEffect(() => {
         dispatch({ type: "set-tool-executions", toolExecutions });
     }, [toolExecutions]);
+    const refreshSessionView = () => {
+        dispatch({ type: "set-tool-executions", toolExecutions: {} });
+        refresh();
+    };
+    const resetSessionView = () => {
+        setDisplayBlocks([]);
+        refreshSessionView();
+    };
+    const triggerFooterRefresh = () => {
+        dispatch({ type: "footer-tick" });
+    };
+    const pendingMessages = [
+        ...context.session.getSteeringMessages().map((text, index) => ({
+            id: `session-steer-${index}-${text}`,
+            mode: "steer",
+            text,
+            source: "session",
+        })),
+        ...context.session.getFollowUpMessages().map((text, index) => ({
+            id: `session-follow-${index}-${text}`,
+            mode: "followUp",
+            text,
+            source: "session",
+        })),
+        ...compactionQueuedMessages.map((message) => ({
+            id: message.id,
+            mode: message.mode,
+            text: message.text,
+            source: "compaction",
+        })),
+    ];
+    const restoreQueuedMessagesToPrompt = (options) => {
+        const { steering, followUp } = context.session.clearQueue();
+        const queuedMessages = [
+            ...steering,
+            ...followUp,
+            ...compactionQueuedMessages.map((message) => message.text),
+        ];
+        setCompactionQueuedMessages([]);
+        if (queuedMessages.length === 0) {
+            if (options?.abort) {
+                void context.session.abort();
+            }
+            return 0;
+        }
+        const combinedText = [...queuedMessages, options?.currentText ?? state.input]
+            .filter((value) => value.trim().length > 0)
+            .join("\n\n");
+        setInput(combinedText);
+        if (options?.abort) {
+            void context.session.abort();
+        }
+        return queuedMessages.length;
+    };
+    const queueCompactionMessage = (text, mode) => {
+        setCompactionQueuedMessages((current) => [
+            ...current,
+            {
+                id: `${mode}:${Date.now()}:${current.length}`,
+                text,
+                mode,
+            },
+        ]);
+    };
+    const flushCompactionQueue = async () => {
+        if (compactionQueuedMessages.length === 0) {
+            return;
+        }
+        const queuedMessages = [...compactionQueuedMessages];
+        setCompactionQueuedMessages([]);
+        const restoreQueue = (error) => {
+            setCompactionQueuedMessages(queuedMessages);
+            setError(`Failed to send queued message${queuedMessages.length === 1 ? "" : "s"}: ${error instanceof Error ? error.message : String(error)}`);
+        };
+        try {
+            const firstPromptIndex = queuedMessages.findIndex((message) => !isExtensionCommand(message.text));
+            if (firstPromptIndex === -1) {
+                for (const message of queuedMessages) {
+                    await context.session.prompt(message.text);
+                }
+                return;
+            }
+            for (const message of queuedMessages.slice(0, firstPromptIndex)) {
+                await context.session.prompt(message.text);
+            }
+            const firstPrompt = queuedMessages[firstPromptIndex];
+            const rest = queuedMessages.slice(firstPromptIndex + 1);
+            await context.session.prompt(firstPrompt.text);
+            for (const message of rest) {
+                if (isExtensionCommand(message.text)) {
+                    await context.session.prompt(message.text);
+                    continue;
+                }
+                await context.session.prompt(message.text, {
+                    streamingBehavior: message.mode === "followUp" ? "followUp" : "steer",
+                });
+            }
+            setStatus(`Flushed ${queuedMessages.length} queued message${queuedMessages.length === 1 ? "" : "s"} after compaction.`, "success");
+        }
+        catch (error) {
+            restoreQueue(error);
+        }
+    };
+    flushCompactionQueueRef.current = flushCompactionQueue;
+    const cycleModel = async (direction) => {
+        try {
+            const result = await context.session.cycleModel(direction);
+            if (!result) {
+                setStatus(context.session.scopedModels.length > 0 ? "Only one model in scope." : "Only one model available.", "warning");
+                return;
+            }
+            refresh();
+            setStatus(`Switched to ${result.model.provider}/${result.model.id}.`, "success");
+        }
+        catch (error) {
+            setError(error instanceof Error ? error.message : String(error));
+        }
+    };
+    const toggleThinkingVisibility = () => {
+        const nextShowThinking = !state.showThinking;
+        context.session.settingsManager.setHideThinkingBlock(!nextShowThinking);
+        dispatch({ type: "set-show-thinking", value: nextShowThinking });
+        setStatus(`Thinking blocks ${nextShowThinking ? "visible" : "hidden"}.`, "success");
+    };
+    const toggleToolOutputExpansion = () => {
+        setToolOutputExpanded((current) => {
+            const next = !current;
+            setStatus(`Tool outputs ${next ? "expanded" : "collapsed"}.`, "success");
+            return next;
+        });
+    };
+    const openExternalEditor = async () => {
+        const editorCommand = process.env.VISUAL || process.env.EDITOR;
+        if (!editorCommand) {
+            setStatus("Set $VISUAL or $EDITOR to use the external editor shortcut.", "warning");
+            return;
+        }
+        const tempFile = join(tmpdir(), `indusagi-editor-${Date.now()}.md`);
+        const currentText = state.input;
+        try {
+            writeFileSync(tempFile, currentText, "utf-8");
+            process.stdout.write("\u001B[?25h");
+            const [editor, ...editorArgs] = editorCommand.split(" ").filter(Boolean);
+            const result = spawnSync(editor, [...editorArgs, tempFile], {
+                stdio: "inherit",
+            });
+            if (result.status === 0) {
+                const nextText = readFileSync(tempFile, "utf-8").replace(/\n$/, "");
+                setInput(nextText, nextText.length);
+                setStatus("Updated prompt from external editor.", "success");
+            }
+        }
+        catch (error) {
+            setError(`External editor failed: ${error instanceof Error ? error.message : String(error)}`);
+        }
+        finally {
+            try {
+                unlinkSync(tempFile);
+            }
+            catch { }
+            process.stdout.write("\u001B[?25l");
+        }
+    };
+    const dequeueQueuedMessages = () => {
+        const restored = restoreQueuedMessagesToPrompt();
+        if (restored === 0) {
+            setStatus("No queued messages to restore.", "warning");
+            return;
+        }
+        setStatus(`Restored ${restored} queued message${restored === 1 ? "" : "s"} to the prompt.`, "success");
+    };
+    const pasteClipboardImage = async () => {
+        try {
+            const image = await readClipboardImage();
+            if (!image) {
+                setStatus("No image was found in the clipboard.", "warning");
+                return;
+            }
+            const extension = extensionForImageMimeType(image.mimeType) ?? "png";
+            const filePath = join(tmpdir(), `indusagi-clipboard-${crypto.randomUUID()}.${extension}`);
+            writeFileSync(filePath, Buffer.from(image.bytes));
+            const nextValue = state.input.length > 0 && !/\s$/.test(state.input)
+                ? `${state.input} ${filePath}`
+                : `${state.input}${filePath}`;
+            setInput(nextValue, nextValue.length);
+            setStatus("Inserted clipboard image path into the prompt.", "success");
+        }
+        catch (error) {
+            setStatus(`Unable to paste clipboard image: ${error instanceof Error ? error.message : String(error)}`, "warning");
+        }
+    };
+    const suspendTerminal = () => {
+        if (process.platform === "win32") {
+            setStatus("Suspend is not available on Windows terminals.", "warning");
+            return;
+        }
+        process.once("SIGCONT", () => {
+            refresh();
+            triggerFooterRefresh();
+            setStatus("Resumed terminal session.", "success");
+        });
+        process.stdout.write("\u001B[?25h");
+        process.kill(0, "SIGTSTP");
+    };
+    const restoreDefaultTerminalTitle = () => {
+        customTerminalTitleRef.current = null;
+        const sessionName = context.session.sessionManager.getSessionName();
+        writeTerminalTitle(sessionName ? `${APP_NAME} ${VERSION} - ${sessionName}` : `${APP_NAME} ${VERSION}`);
+    };
+    const cancelExtensionOverlay = () => {
+        const current = extensionOverlayRef.current;
+        switch (current.kind) {
+            case "select":
+                current.resolve(undefined);
+                break;
+            case "confirm":
+                current.resolve(false);
+                break;
+            case "input":
+            case "editor":
+                current.resolve(undefined);
+                break;
+            case "custom":
+                current.cancel();
+                break;
+            case "none":
+                break;
+        }
+        setExtensionOverlayState({ kind: "none" });
+    };
+    const resetExtensionUi = () => {
+        cancelExtensionOverlay();
+        setExtensionEditor(null);
+        setExtensionHeader(null);
+        setExtensionFooter(null);
+        setExtensionWidgetsAbove(new Map());
+        setExtensionWidgetsBelow(new Map());
+        setExtensionWorkingMessage(undefined);
+        footerDataProvider.clearExtensionStatuses();
+        triggerFooterRefresh();
+        restoreDefaultTerminalTitle();
+    };
     useEffect(() => {
         overlayRef.current = state.overlay;
     }, [state.overlay]);
     useEffect(() => {
-        const onResize = () => setTerminalRows(process.stdout.rows ?? 40);
+        extensionOverlayRef.current = extensionOverlayState;
+    }, [extensionOverlayState]);
+    useEffect(() => {
+        const onResize = () => {
+            setTerminalRows(process.stdout.rows ?? 40);
+            setTerminalColumns(process.stdout.columns ?? 80);
+        };
         process.stdout.on("resize", onResize);
         return () => {
             process.stdout.off("resize", onResize);
@@ -271,6 +569,8 @@ export function AppShell({ context, footerDataProvider, initialImages, initialMe
     }, []);
     const footerData = useFooterData(footerDataProvider, state.footerTick);
     const theme = createThemeAdapter(state.themeName);
+    const showStartupDiagnostics = !startupDismissed;
+    const previousStartupDiagnosticsRef = useRef(showStartupDiagnostics);
     function handleOAuthOverlayChange(partial) {
         const current = overlayRef.current;
         if (current.kind !== "oauth")
@@ -339,10 +639,492 @@ export function AppShell({ context, footerDataProvider, initialImages, initialMe
             appendDisplayBlock,
             startOAuthLogin,
             resetSessionView,
+            refreshSessionView,
+            onBeforeReload: resetExtensionUi,
             onExit: handleExit,
         },
         onAfterSubmit: refresh,
+        onQueueDuringCompaction: queueCompactionMessage,
+        onShouldRunDuringCompaction: isExtensionCommand,
     });
+    const submitPromptRef = useRef(submitPrompt);
+    const submitPromptWithStartupDismiss = async (input, mode = "followUp") => {
+        if (!startupDismissed && input.trim().length > 0) {
+            setStartupDismissed(true);
+        }
+        await submitPrompt(input, mode);
+    };
+    submitPromptRef.current = submitPromptWithStartupDismiss;
+    const handleExtensionShortcutKeyData = async (data) => {
+        const extensionRunner = context.session.extensionRunner;
+        if (!extensionRunner) {
+            return false;
+        }
+        const shortcuts = extensionRunner.getShortcuts(keybindings.getEffectiveConfig());
+        if (shortcuts.size === 0) {
+            return false;
+        }
+        const shortcutContext = {
+            ui: extensionUiContextRef.current ?? {
+                select: async () => undefined,
+                confirm: async () => false,
+                input: async () => undefined,
+                notify: () => { },
+                setStatus: () => { },
+                setWorkingMessage: () => { },
+                setWidget: () => { },
+                setFooter: () => { },
+                setHeader: () => { },
+                setTitle: () => { },
+                custom: async () => undefined,
+                setEditorText: () => { },
+                getEditorText: () => inputRef.current,
+                editor: async () => undefined,
+                setEditorComponent: () => { },
+                get theme() {
+                    return extensionTheme;
+                },
+                getAllThemes: () => [],
+                getTheme: () => undefined,
+                setTheme: () => ({ success: false, error: "Extension UI is not ready yet." }),
+            },
+            hasUI: true,
+            cwd: process.cwd(),
+            sessionManager: context.session.sessionManager,
+            modelRegistry: context.session.modelRegistry,
+            model: context.session.model,
+            isIdle: () => !context.session.isStreaming,
+            abort: () => {
+                void context.session.abort();
+            },
+            hasPendingMessages: () => context.session.pendingMessageCount > 0,
+            shutdown: handleExit,
+            getContextUsage: () => context.session.getContextUsage(),
+            compact: (options) => {
+                void (async () => {
+                    try {
+                        const result = await context.session.compact(options?.customInstructions);
+                        refreshSessionView();
+                        options?.onComplete?.(result);
+                    }
+                    catch (error) {
+                        const resolvedError = error instanceof Error ? error : new Error(String(error));
+                        options?.onError?.(resolvedError);
+                    }
+                })();
+            },
+        };
+        for (const [shortcutKey, shortcut] of shortcuts) {
+            if (!matchesKey(data, shortcutKey)) {
+                continue;
+            }
+            try {
+                await Promise.resolve(shortcut.handler(shortcutContext));
+            }
+            catch (error) {
+                setError(`Shortcut handler error: ${error instanceof Error ? error.message : String(error)}`);
+            }
+            return true;
+        }
+        return false;
+    };
+    useEffect(() => {
+        if (customTerminalTitleRef.current) {
+            return;
+        }
+        restoreDefaultTerminalTitle();
+    }, [snapshot.sessionName]);
+    useEffect(() => {
+        if (extensionOverlayState.kind === "none") {
+            return;
+        }
+        const timeoutAt = extensionOverlayState.kind === "select" ||
+            extensionOverlayState.kind === "confirm" ||
+            extensionOverlayState.kind === "input" ||
+            extensionOverlayState.kind === "editor"
+            ? extensionOverlayState.timeoutAt
+            : undefined;
+        if (!timeoutAt) {
+            return;
+        }
+        const remaining = timeoutAt - Date.now();
+        if (remaining <= 0) {
+            cancelExtensionOverlay();
+            return;
+        }
+        const timer = setTimeout(() => {
+            cancelExtensionOverlay();
+        }, remaining);
+        return () => {
+            clearTimeout(timer);
+        };
+    }, [extensionOverlayState]);
+    useEffect(() => {
+        if (!extensionEditor) {
+            return;
+        }
+        if (extensionEditor.component.getText() !== state.input) {
+            extensionEditor.component.setText(state.input);
+            extensionEditor.bridge.requestRender?.();
+        }
+    }, [extensionEditor, state.input]);
+    useEffect(() => {
+        const buildExtensionUiContext = () => ({
+            select: (title, options, opts) => new Promise((resolve) => {
+                if (opts?.signal?.aborted) {
+                    resolve(undefined);
+                    return;
+                }
+                const finalize = (() => {
+                    let settled = false;
+                    return (value) => {
+                        if (settled) {
+                            return;
+                        }
+                        settled = true;
+                        opts?.signal?.removeEventListener("abort", onAbort);
+                        setExtensionOverlayState({ kind: "none" });
+                        resolve(value);
+                    };
+                })();
+                const onAbort = () => {
+                    finalize(undefined);
+                };
+                cancelExtensionOverlay();
+                opts?.signal?.addEventListener("abort", onAbort, { once: true });
+                setExtensionOverlayState({
+                    kind: "select",
+                    title,
+                    options,
+                    timeoutAt: opts?.timeout ? Date.now() + opts.timeout : undefined,
+                    resolve: finalize,
+                });
+            }),
+            confirm: (title, message, opts) => new Promise((resolve) => {
+                if (opts?.signal?.aborted) {
+                    resolve(false);
+                    return;
+                }
+                const finalize = (() => {
+                    let settled = false;
+                    return (value) => {
+                        if (settled) {
+                            return;
+                        }
+                        settled = true;
+                        opts?.signal?.removeEventListener("abort", onAbort);
+                        setExtensionOverlayState({ kind: "none" });
+                        resolve(value);
+                    };
+                })();
+                const onAbort = () => {
+                    finalize(false);
+                };
+                cancelExtensionOverlay();
+                opts?.signal?.addEventListener("abort", onAbort, { once: true });
+                setExtensionOverlayState({
+                    kind: "confirm",
+                    title,
+                    message,
+                    timeoutAt: opts?.timeout ? Date.now() + opts.timeout : undefined,
+                    resolve: finalize,
+                });
+            }),
+            input: (title, placeholder, opts) => new Promise((resolve) => {
+                if (opts?.signal?.aborted) {
+                    resolve(undefined);
+                    return;
+                }
+                const finalize = (() => {
+                    let settled = false;
+                    return (value) => {
+                        if (settled) {
+                            return;
+                        }
+                        settled = true;
+                        opts?.signal?.removeEventListener("abort", onAbort);
+                        setExtensionOverlayState({ kind: "none" });
+                        resolve(value);
+                    };
+                })();
+                const onAbort = () => {
+                    finalize(undefined);
+                };
+                cancelExtensionOverlay();
+                opts?.signal?.addEventListener("abort", onAbort, { once: true });
+                setExtensionOverlayState({
+                    kind: "input",
+                    title,
+                    placeholder,
+                    timeoutAt: opts?.timeout ? Date.now() + opts.timeout : undefined,
+                    resolve: finalize,
+                });
+            }),
+            notify: (message, type) => {
+                if (type === "error") {
+                    setError(message);
+                    return;
+                }
+                if (type === "warning") {
+                    setStatus(message, "warning");
+                    return;
+                }
+                setStatus(message, "info");
+            },
+            setStatus: (key, text) => {
+                footerDataProvider.setExtensionStatus(key, text);
+                triggerFooterRefresh();
+            },
+            setWorkingMessage: (message) => {
+                setExtensionWorkingMessage(message);
+            },
+            setWidget: (key, content, options) => {
+                const placement = options?.placement ?? "aboveEditor";
+                const updateMap = placement === "belowEditor" ? setExtensionWidgetsBelow : setExtensionWidgetsAbove;
+                const clearOtherMap = placement === "belowEditor" ? setExtensionWidgetsAbove : setExtensionWidgetsBelow;
+                clearOtherMap((current) => {
+                    if (!current.has(key)) {
+                        return current;
+                    }
+                    const next = new Map(current);
+                    next.delete(key);
+                    return next;
+                });
+                updateMap((current) => {
+                    const next = new Map(current);
+                    if (content === undefined) {
+                        next.delete(key);
+                        return next;
+                    }
+                    if (Array.isArray(content)) {
+                        next.set(key, { kind: "lines", lines: truncateWidgetLines(content) });
+                        return next;
+                    }
+                    try {
+                        next.set(key, {
+                            kind: "component",
+                            hosted: createHostedExtensionComponent((tui) => content(tui, extensionTheme)),
+                        });
+                    }
+                    catch (error) {
+                        setError(`Failed to render extension widget "${key}": ${error instanceof Error ? error.message : String(error)}`);
+                    }
+                    return next;
+                });
+            },
+            setFooter: (factory) => {
+                if (!factory) {
+                    setExtensionFooter(null);
+                    return;
+                }
+                try {
+                    setExtensionFooter(createHostedExtensionComponent((tui) => factory(tui, extensionTheme, footerDataProvider)));
+                }
+                catch (error) {
+                    setError(`Failed to render extension footer: ${error instanceof Error ? error.message : String(error)}`);
+                }
+            },
+            setHeader: (factory) => {
+                if (!factory) {
+                    setExtensionHeader(null);
+                    return;
+                }
+                try {
+                    setExtensionHeader(createHostedExtensionComponent((tui) => factory(tui, extensionTheme)));
+                }
+                catch (error) {
+                    setError(`Failed to render extension header: ${error instanceof Error ? error.message : String(error)}`);
+                }
+            },
+            setTitle: (title) => {
+                customTerminalTitleRef.current = title;
+                writeTerminalTitle(title);
+            },
+            custom: async (factory, options) => new Promise((resolve, reject) => {
+                let overlayHandleHidden = false;
+                const finish = (() => {
+                    let settled = false;
+                    return (value) => {
+                        if (settled) {
+                            return;
+                        }
+                        settled = true;
+                        setExtensionOverlayState({ kind: "none" });
+                        resolve(value);
+                    };
+                })();
+                const cancel = () => {
+                    setExtensionOverlayState({ kind: "none" });
+                    resolve(undefined);
+                };
+                cancelExtensionOverlay();
+                const bridge = createExtensionTuiBridge();
+                Promise.resolve(factory(bridge, extensionTheme, keybindings, finish))
+                    .then((component) => {
+                    const hosted = createHostedExtensionComponentFromParts(component, bridge);
+                    const handle = {
+                        hide: () => {
+                            overlayHandleHidden = true;
+                            setExtensionOverlayState((current) => current.kind === "custom"
+                                ? { ...current, hidden: true }
+                                : current);
+                        },
+                        setHidden: (hidden) => {
+                            overlayHandleHidden = hidden;
+                            setExtensionOverlayState((current) => current.kind === "custom"
+                                ? { ...current, hidden }
+                                : current);
+                        },
+                        isHidden: () => overlayHandleHidden,
+                    };
+                    options?.onHandle?.(handle);
+                    setExtensionOverlayState({
+                        kind: "custom",
+                        hosted,
+                        mode: options?.overlay === true ? "overlay" : "inline",
+                        hidden: false,
+                        cancel: () => {
+                            cancel();
+                        },
+                    });
+                })
+                    .catch((error) => {
+                    setExtensionOverlayState({ kind: "none" });
+                    reject(error);
+                });
+            }),
+            setEditorText: (text) => {
+                setInput(text);
+            },
+            getEditorText: () => inputRef.current,
+            editor: (title, prefill) => new Promise((resolve) => {
+                const finalize = (() => {
+                    let settled = false;
+                    return (value) => {
+                        if (settled) {
+                            return;
+                        }
+                        settled = true;
+                        setExtensionOverlayState({ kind: "none" });
+                        resolve(value);
+                    };
+                })();
+                cancelExtensionOverlay();
+                setExtensionOverlayState({
+                    kind: "editor",
+                    title,
+                    prefill,
+                    resolve: finalize,
+                });
+            }),
+            setEditorComponent: (factory) => {
+                if (!factory) {
+                    setExtensionEditor(null);
+                    return;
+                }
+                try {
+                    const hosted = createHostedExtensionComponent((tui) => {
+                        const editor = factory(tui, getEditorTheme(), keybindings);
+                        editor.onSubmit = (text) => {
+                            void submitPromptRef.current(text, "steer");
+                        };
+                        editor.onChange = (text) => {
+                            dispatch({ type: "set-input", value: text, cursorOffset: text.length });
+                        };
+                        editor.setText(inputRef.current);
+                        return editor;
+                    });
+                    setExtensionEditor(hosted);
+                }
+                catch (error) {
+                    setError(`Failed to enable extension editor: ${error instanceof Error ? error.message : String(error)}`);
+                }
+            },
+            get theme() {
+                return extensionTheme;
+            },
+            getAllThemes: () => getAvailableThemesWithPaths(),
+            getTheme: (name) => getThemeByName(name),
+            setTheme: (themeOrName) => {
+                if (themeOrName instanceof Theme) {
+                    setThemeInstance(themeOrName);
+                    if (themeOrName.name) {
+                        context.session.settingsManager.setTheme(themeOrName.name);
+                        dispatch({ type: "set-theme-name", themeName: themeOrName.name });
+                    }
+                    triggerFooterRefresh();
+                    refresh();
+                    return { success: true };
+                }
+                const result = setTheme(themeOrName, true);
+                if (result.success) {
+                    context.session.settingsManager.setTheme(themeOrName);
+                    dispatch({ type: "set-theme-name", themeName: themeOrName });
+                    triggerFooterRefresh();
+                    refresh();
+                }
+                return result;
+            },
+        });
+        const uiContext = buildExtensionUiContext();
+        extensionUiContextRef.current = uiContext;
+        void context.session.bindExtensions({
+            uiContext,
+            commandContextActions: {
+                waitForIdle: () => context.session.agent.waitForIdle(),
+                newSession: async (options) => {
+                    const started = await context.session.newSession({ parentSession: options?.parentSession });
+                    if (!started) {
+                        return { cancelled: true };
+                    }
+                    if (options?.setup) {
+                        await options.setup(context.session.sessionManager);
+                    }
+                    resetSessionView();
+                    setInput("");
+                    setStatus("New session started.", "success");
+                    return { cancelled: false };
+                },
+                fork: async (entryId) => {
+                    const result = await context.session.fork(entryId);
+                    if (result.cancelled) {
+                        return { cancelled: true };
+                    }
+                    resetSessionView();
+                    setInput(result.selectedText);
+                    setStatus("Forked to new session.", "success");
+                    return { cancelled: false };
+                },
+                navigateTree: async (targetId, options) => {
+                    const result = await context.session.navigateTree(targetId, {
+                        summarize: options?.summarize,
+                        customInstructions: options?.customInstructions,
+                        replaceInstructions: options?.replaceInstructions,
+                        label: options?.label,
+                    });
+                    if (result.cancelled) {
+                        return { cancelled: true };
+                    }
+                    resetSessionView();
+                    if (result.editorText) {
+                        setInput(result.editorText);
+                    }
+                    setStatus("Navigated to selected point.", "success");
+                    return { cancelled: false };
+                },
+            },
+            shutdownHandler: handleExit,
+            onError: (error) => {
+                setError(`Extension error in ${error.extensionPath}: ${error.error}`);
+            },
+            onHookError: (error) => {
+                setError(`Hook error in ${error.hookPath}: ${error.error}`);
+            },
+        });
+        return () => {
+            resetExtensionUi();
+        };
+    }, [context.session, footerDataProvider, keybindings]);
     useEffect(() => {
         if (startupRanRef.current)
             return;
@@ -370,35 +1152,48 @@ export function AppShell({ context, footerDataProvider, initialImages, initialMe
             }
         })();
     }, [context.session, initialImages, initialMessage, initialMessages, refresh]);
+    const extensionUiActive = Boolean(extensionEditor) ||
+        (extensionOverlayState.kind !== "none" &&
+            !(extensionOverlayState.kind === "custom" && extensionOverlayState.hidden));
     useAppKeybindings({
         session: context.session,
-        overlayActive: state.overlay.kind !== "none",
+        overlayActive: state.overlay.kind !== "none" || extensionUiActive,
         onExit: handleExit,
-        onRefresh: refresh,
         onOpenSettings: () => setOverlay({ kind: "settings" }),
         onOpenResume: () => {
-            void (async () => {
-                setOverlay({ kind: "session", sessions: [], loading: true });
-                try {
-                    const sessions = await listSessions(context.session);
-                    setOverlay({ kind: "session", sessions, loading: false });
-                }
-                catch (error) {
-                    setOverlay({
-                        kind: "session",
-                        sessions: [],
-                        loading: false,
-                        error: error instanceof Error ? error.message : String(error),
-                    });
-                }
-            })();
+            setOverlay({ kind: "session" });
         },
-        onOpenTree: () => setOverlay({ kind: "tree", items: flattenSessionTree(context.session) }),
         onStatus: setStatus,
     });
+    useEffect(() => {
+        if (state.overlay.kind !== "session") {
+            return;
+        }
+        let cancelled = false;
+        void listCurrentSessions(context.session)
+            .then((sessions) => {
+            if (!cancelled) {
+                setCurrentSessions(sessions);
+            }
+        })
+            .catch((error) => {
+            if (!cancelled) {
+                setError(error instanceof Error ? error.message : String(error));
+            }
+        });
+        return () => {
+            cancelled = true;
+        };
+    }, [context.session, state.overlay.kind]);
     const settingsItems = useMemo(() => buildSettingsItems(context.session, state, () => dispatch({ type: "footer-tick" }), setError), [context.session, state]);
     const maxItems = Math.max(10, terminalRows - (state.overlay.kind === "none" ? 14 : 24));
+    const effectiveStatus = state.status ??
+        (extensionWorkingMessage &&
+            (snapshot.isStreaming || snapshot.isCompacting || snapshot.isBashRunning || snapshot.pendingToolCallCount > 0)
+            ? { kind: "busy", text: extensionWorkingMessage }
+            : undefined);
     let overlay = null;
+    let extensionOverlay = null;
     switch (state.overlay.kind) {
         case "settings":
             overlay = (_jsx(SettingsDialog, { items: settingsItems, onClose: closeOverlay }));
@@ -459,7 +1254,33 @@ export function AppShell({ context, footerDataProvider, initialImages, initialMe
                 } }));
             break;
         case "session":
-            overlay = (_jsx(SessionDialog, { error: state.overlay.error, loading: state.overlay.loading, onClose: closeOverlay, onSelect: async (item) => {
+            overlay = (_jsx(SessionDialog, { onClose: closeOverlay, currentSessionPath: context.session.sessionFile, onDeleteSession: async (item) => {
+                    try {
+                        if (item.path === context.session.sessionFile) {
+                            setStatus("Cannot delete the current active session from the picker.", "warning");
+                            return;
+                        }
+                        await deleteSessionAtPath(item.path);
+                        setCurrentSessions((sessions) => sessions.filter((session) => session.path !== item.path));
+                        setStatus("Deleted session.", "success");
+                    }
+                    catch (error) {
+                        setError(error instanceof Error ? error.message : String(error));
+                    }
+                }, onLoadAllSessions: (onProgress) => listAllSessions(onProgress), onRenameSession: async (item, name) => {
+                    try {
+                        const resolvedName = await renameSessionAtPath(item.path, name);
+                        setCurrentSessions((sessions) => sessions.map((session) => session.path === item.path
+                            ? { ...session, name: resolvedName, modified: new Date(), lastModified: Date.now() }
+                            : session));
+                        if (item.path === context.session.sessionFile)
+                            refresh();
+                        setStatus(`Renamed session to ${resolvedName}.`, "success");
+                    }
+                    catch (error) {
+                        setError(error instanceof Error ? error.message : String(error));
+                    }
+                }, onSelect: async (item) => {
                     try {
                         await context.session.switchSession(item.path);
                         closeOverlay();
@@ -469,7 +1290,7 @@ export function AppShell({ context, footerDataProvider, initialImages, initialMe
                     catch (error) {
                         setError(error instanceof Error ? error.message : String(error));
                     }
-                }, sessions: state.overlay.sessions }));
+                }, currentSessions: currentSessions }));
             break;
         case "tree":
             overlay = (_jsx(TreeDialog, { items: state.overlay.items, onClose: closeOverlay, onSelect: async (item) => {
@@ -568,6 +1389,32 @@ export function AppShell({ context, footerDataProvider, initialImages, initialMe
         case "none":
             break;
     }
+    switch (extensionOverlayState.kind) {
+        case "select":
+            extensionOverlay = (_jsx(ExtensionSelectDialog, { onClose: () => extensionOverlayState.resolve(undefined), onSelect: (value) => extensionOverlayState.resolve(value), options: extensionOverlayState.options, timeoutAt: extensionOverlayState.timeoutAt, title: extensionOverlayState.title }));
+            break;
+        case "confirm":
+            extensionOverlay = (_jsx(ExtensionSelectDialog, { onClose: () => extensionOverlayState.resolve(false), onSelect: (value) => extensionOverlayState.resolve(value === "Yes"), options: ["Yes", "No"], timeoutAt: extensionOverlayState.timeoutAt, title: `${extensionOverlayState.title}\n${extensionOverlayState.message}` }));
+            break;
+        case "input":
+            extensionOverlay = (_jsx(ExtensionTextDialog, { onClose: () => extensionOverlayState.resolve(undefined), onSubmit: (value) => extensionOverlayState.resolve(value), placeholder: extensionOverlayState.placeholder, timeoutAt: extensionOverlayState.timeoutAt, title: extensionOverlayState.title }));
+            break;
+        case "editor":
+            extensionOverlay = (_jsx(ExtensionTextDialog, { multiline: true, onClose: () => extensionOverlayState.resolve(undefined), onSubmit: (value) => extensionOverlayState.resolve(value), prefill: extensionOverlayState.prefill, timeoutAt: extensionOverlayState.timeoutAt, title: extensionOverlayState.title }));
+            break;
+        case "custom":
+            if (extensionOverlayState.mode === "overlay" && !extensionOverlayState.hidden) {
+                extensionOverlay = (_jsx(ExtensionComponentHost, { active: true, hosted: extensionOverlayState.hosted, width: terminalColumns }));
+            }
+            break;
+        case "none":
+            break;
+    }
+    useEffect(() => {
+        if (!startupDismissed && snapshot.messages.length > 0) {
+            setStartupDismissed(true);
+        }
+    }, [snapshot.messages.length, startupDismissed]);
     useEffect(() => {
         const nextShowThinking = !context.session.settingsManager.getHideThinkingBlock();
         const nextShowImages = context.session.settingsManager.getShowImages();
@@ -582,18 +1429,37 @@ export function AppShell({ context, footerDataProvider, initialImages, initialMe
             dispatch({ type: "set-theme-name", themeName: nextThemeName });
         }
     }, [context.session, state.footerTick, state.showImages, state.showThinking, state.themeName]);
-    return (_jsxs(Box, { flexDirection: "column", children: [_jsx(Header, { collapseChangelog: context.session.settingsManager.getCollapseChangelog(), sessionName: snapshot.sessionName, showBranding: Boolean(verbose) || !context.session.settingsManager.getQuietStartup(), startupChangelog: startupChangelog, startupNotices: startupNotices, theme: theme }), _jsx(MessageList, { displayBlocks: displayBlocks, maxItems: maxItems, messages: snapshot.messages, showImages: state.showImages, showThinking: state.showThinking, theme: theme }), _jsx(TaskPanel, { snapshot: snapshot, theme: theme, toolExecutions: state.toolExecutions }), _jsx(StatusLine, { snapshot: snapshot, status: state.status, theme: theme }), _jsx(PromptInput, { cursorOffset: state.cursorOffset, disabled: state.overlay.kind !== "none", dispatch: dispatch, input: state.input, onCancelActiveWork: async (kind) => {
+    useEffect(() => {
+        if (previousStartupDiagnosticsRef.current && !showStartupDiagnostics && process.stdout.isTTY) {
+            process.stdout.write("\u001B[2J\u001B[3J\u001B[H");
+            setLayoutEpoch((current) => current + 1);
+        }
+        previousStartupDiagnosticsRef.current = showStartupDiagnostics;
+    }, [showStartupDiagnostics]);
+    return (_jsxs(Box, { flexDirection: "column", children: [extensionHeader ? (_jsx(Box, { flexDirection: "column", marginBottom: 1, children: _jsx(ExtensionComponentHost, { hosted: extensionHeader, width: terminalColumns }) })) : (_jsx(Header, { collapseChangelog: context.session.settingsManager.getCollapseChangelog(), sessionName: snapshot.sessionName, showBranding: Boolean(verbose) || !context.session.settingsManager.getQuietStartup(), startupChangelog: startupChangelog, startupDiagnostics: showStartupDiagnostics ? startupDiagnostics : undefined, startupNotices: startupNotices, theme: theme })), _jsx(MessageList, { displayBlocks: displayBlocks, expandToolOutputs: toolOutputExpanded, maxItems: maxItems, messages: snapshot.messages, showImages: state.showImages, showThinking: state.showThinking, theme: theme }), _jsx(TaskPanel, { expandToolOutputs: toolOutputExpanded, pendingMessages: pendingMessages, snapshot: snapshot, theme: theme, toolExecutions: state.toolExecutions }), _jsx(StatusLine, { snapshot: snapshot, status: effectiveStatus, theme: theme }), Array.from(extensionWidgetsAbove.entries()).map(([key, widget]) => widget.kind === "lines" ? (_jsx(Box, { marginTop: 1, children: renderTextLines(widget.lines, `widget-above:${key}`) }, `widget-above:${key}`)) : (_jsx(Box, { marginTop: 1, children: _jsx(ExtensionComponentHost, { hosted: widget.hosted, maxLines: 10, width: terminalColumns }) }, `widget-above:${key}`))), extensionEditor ? (_jsx(Box, { marginTop: 1, children: _jsx(ExtensionComponentHost, { active: true, hosted: extensionEditor, onKeyData: handleExtensionShortcutKeyData, width: terminalColumns }) })) : extensionOverlayState.kind === "custom" &&
+                extensionOverlayState.mode === "inline" &&
+                !extensionOverlayState.hidden ? (_jsx(Box, { marginTop: 1, children: _jsx(ExtensionComponentHost, { active: true, hosted: extensionOverlayState.hosted, width: terminalColumns }) })) : (_jsx(PromptInput, { cursorOffset: state.cursorOffset, disabled: state.overlay.kind !== "none" || extensionUiActive, dispatch: dispatch, input: state.input, keybindings: keybindings, onCancelActiveWork: async (kind) => {
                     if (kind === "bash") {
                         context.session.abortBash();
                         setStatus("Cancelled bash command.", "warning");
                         return;
                     }
-                    await context.session.abort();
+                    if (context.session.isCompacting) {
+                        context.session.abortCompaction();
+                        setStatus("Cancelling compaction...", "warning");
+                        return;
+                    }
+                    const restored = restoreQueuedMessagesToPrompt({ abort: true });
                     refresh();
-                    setStatus("Cancelled active work.", "warning");
-                }, onOpenFork: () => setOverlay({ kind: "userMessage", items: listUserMessages(context.session) }), onOpenTree: () => setOverlay({ kind: "tree", items: flattenSessionTree(context.session) }), onSubmit: (value) => submitPrompt(value ?? state.input, "followUp"), onSubmitSteer: (value) => submitPrompt(value ?? state.input, "steer"), onThinkingLevelChange: (level) => {
+                    if (restored > 0) {
+                        setStatus(`Cancelled active work and restored ${restored} queued message${restored === 1 ? "" : "s"}.`, "warning");
+                    }
+                    else {
+                        setStatus("Cancelled active work.", "warning");
+                    }
+                }, onCycleModel: cycleModel, onDequeue: dequeueQueuedMessages, onExit: handleExit, onExternalEditor: openExternalEditor, onKeyData: handleExtensionShortcutKeyData, onOpenModelSelector: () => setOverlay({ kind: "model" }), onOpenFork: () => setOverlay({ kind: "userMessage", items: listUserMessages(context.session) }), onOpenTree: () => setOverlay({ kind: "tree", items: flattenSessionTree(context.session) }), onPasteClipboardImage: pasteClipboardImage, onStatus: setStatus, onSubmit: (value) => submitPromptWithStartupDismiss(value ?? state.input, "steer"), onSubmitFollowUp: (value) => submitPromptWithStartupDismiss(value ?? state.input, "followUp"), onSubmitSteer: (value) => submitPromptWithStartupDismiss(value ?? state.input, "steer"), onSuspend: suspendTerminal, onThinkingLevelChange: (level) => {
                     refresh();
                     setStatus(`Thinking level: ${level}`, "success");
-                }, session: context.session, theme: theme }), _jsx(Footer, { availableProviderCount: footerData.availableProviderCount, branch: footerData.branch, snapshot: snapshot, theme: theme }), overlay, state.overlay.kind === "none" ? null : _jsx(Text, { children: theme.muted("Dialogs pause typing in the main prompt until they close.") })] }));
+                }, onToggleThinkingVisibility: toggleThinkingVisibility, onToggleToolExpansion: toggleToolOutputExpansion, session: context.session, theme: theme })), Array.from(extensionWidgetsBelow.entries()).map(([key, widget]) => widget.kind === "lines" ? (_jsx(Box, { marginTop: 1, children: renderTextLines(widget.lines, `widget-below:${key}`) }, `widget-below:${key}`)) : (_jsx(Box, { marginTop: 1, children: _jsx(ExtensionComponentHost, { hosted: widget.hosted, maxLines: 10, width: terminalColumns }) }, `widget-below:${key}`))), extensionFooter ? (_jsx(ExtensionComponentHost, { hosted: extensionFooter, width: terminalColumns })) : (_jsx(Footer, { availableProviderCount: footerData.availableProviderCount, branch: footerData.branch, extensionStatuses: footerData.extensionStatuses, snapshot: snapshot, theme: theme })), overlay, extensionOverlay, state.overlay.kind === "none" && extensionOverlayState.kind === "none" ? null : (_jsx(Text, { children: theme.muted("Dialogs pause typing in the main prompt until they close.") }))] }, layoutEpoch));
 }
 //# sourceMappingURL=AppShell.js.map