indusagi-coding-agent 0.1.46 → 0.1.48

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

@@ -0,0 +1,1465 @@
+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 { 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, 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 { PromptInput } from "./PromptInput.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 { 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"];
+    return [
+        {
+            id: "autocompact",
+            label: "Auto-compact",
+            description: "Automatically compact conversation context when it grows too large.",
+            value: session.autoCompactionEnabled ? "enabled" : "disabled",
+            values: booleanValues,
+            onChange: (value) => {
+                session.setAutoCompactionEnabled(value === "enabled");
+                onRefresh();
+            },
+        },
+        {
+            id: "images",
+            label: "Show images",
+            description: "Render inline image placeholders and image content in the UI.",
+            value: state.showImages ? "enabled" : "disabled",
+            values: booleanValues,
+            onChange: (value) => {
+                session.settingsManager.setShowImages(value === "enabled");
+                onRefresh();
+            },
+        },
+        {
+            id: "image-resize",
+            label: "Auto-resize images",
+            description: "Resize large images before sending them to providers.",
+            value: session.settingsManager.getImageAutoResize() ? "enabled" : "disabled",
+            values: booleanValues,
+            onChange: (value) => {
+                session.settingsManager.setImageAutoResize(value === "enabled");
+                onRefresh();
+            },
+        },
+        {
+            id: "block-images",
+            label: "Block images",
+            description: "Prevent images from being sent to model providers.",
+            value: session.settingsManager.getBlockImages() ? "enabled" : "disabled",
+            values: booleanValues,
+            onChange: (value) => {
+                session.settingsManager.setBlockImages(value === "enabled");
+                onRefresh();
+            },
+        },
+        {
+            id: "skills",
+            label: "Skill commands",
+            description: "Register skills as /skill:name slash commands.",
+            value: session.settingsManager.getEnableSkillCommands() ? "enabled" : "disabled",
+            values: booleanValues,
+            onChange: (value) => {
+                session.settingsManager.setEnableSkillCommands(value === "enabled");
+                onRefresh();
+            },
+        },
+        {
+            id: "steering-mode",
+            label: "Steering mode",
+            description: "Choose whether queued steering messages are delivered one-by-one or all at once.",
+            value: session.steeringMode,
+            values: ["one-at-a-time", "all"],
+            onChange: (value) => {
+                session.setSteeringMode(value);
+                onRefresh();
+            },
+        },
+        {
+            id: "follow-up-mode",
+            label: "Follow-up mode",
+            description: "Choose whether queued follow-up messages are delivered one-by-one or all at once.",
+            value: session.followUpMode,
+            values: ["one-at-a-time", "all"],
+            onChange: (value) => {
+                session.setFollowUpMode(value);
+                onRefresh();
+            },
+        },
+        {
+            id: "thinking-level",
+            label: "Thinking level",
+            description: "Control reasoning depth for models that support thinking.",
+            value: session.thinkingLevel,
+            values: session.getAvailableThinkingLevels(),
+            onChange: (value) => {
+                session.setThinkingLevel(value);
+                onRefresh();
+            },
+        },
+        {
+            id: "theme",
+            label: "Theme",
+            description: "Choose the color theme for the interface.",
+            value: session.settingsManager.getTheme() ?? state.themeName,
+            values: getAvailableThemes(),
+            onChange: (value) => {
+                const result = setTheme(value, true);
+                if (!result.success) {
+                    setError(result.error ?? `Unable to load theme "${value}".`);
+                    return;
+                }
+                session.settingsManager.setTheme(value);
+                onRefresh();
+            },
+        },
+        {
+            id: "thinking-blocks",
+            label: "Thinking blocks",
+            description: "Show or hide thinking blocks inside assistant responses.",
+            value: state.showThinking ? "visible" : "hidden",
+            values: visibilityValues,
+            onChange: (value) => {
+                session.settingsManager.setHideThinkingBlock(value === "hidden");
+                onRefresh();
+            },
+        },
+        {
+            id: "collapse-changelog",
+            label: "Collapse changelog",
+            description: "Prefer a condensed changelog after updates.",
+            value: session.settingsManager.getCollapseChangelog() ? "enabled" : "disabled",
+            values: booleanValues,
+            onChange: (value) => {
+                session.settingsManager.setCollapseChangelog(value === "enabled");
+                onRefresh();
+            },
+        },
+        {
+            id: "quiet-startup",
+            label: "Quiet startup",
+            description: "Reduce startup noise and status output when the app launches.",
+            value: session.settingsManager.getQuietStartup() ? "enabled" : "disabled",
+            values: booleanValues,
+            onChange: (value) => {
+                session.settingsManager.setQuietStartup(value === "enabled");
+                onRefresh();
+            },
+        },
+        {
+            id: "double-escape",
+            label: "Double-escape action",
+            description: "Choose what happens when Escape is pressed twice with an empty prompt.",
+            value: session.settingsManager.getDoubleEscapeAction(),
+            values: ["tree", "fork"],
+            onChange: (value) => {
+                session.settingsManager.setDoubleEscapeAction(value);
+                onRefresh();
+            },
+        },
+        {
+            id: "cursor",
+            label: "Hardware cursor",
+            description: "Show the terminal cursor while keeping IME-friendly positioning.",
+            value: session.settingsManager.getShowHardwareCursor() ? "enabled" : "disabled",
+            values: booleanValues,
+            onChange: (value) => {
+                session.settingsManager.setShowHardwareCursor(value === "enabled");
+                onRefresh();
+            },
+        },
+        {
+            id: "editor-padding",
+            label: "Editor padding",
+            description: "Horizontal padding for the prompt editor.",
+            value: String(session.settingsManager.getEditorPaddingX()),
+            values: ["0", "1", "2", "3"],
+            onChange: (value) => {
+                session.settingsManager.setEditorPaddingX(Number.parseInt(value, 10));
+                onRefresh();
+            },
+        },
+    ];
+}
+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 } });
+    };
+    const setError = (text) => {
+        dispatch({ type: "set-status", status: { text, kind: "error" } });
+    };
+    const clearStatus = () => {
+        dispatch({ type: "set-status", status: undefined });
+    };
+    const setOverlay = (overlay) => {
+        dispatch({ type: "set-overlay", overlay });
+    };
+    const closeOverlay = () => {
+        oauthResolverRef.current = null;
+        dispatch({ type: "close-overlay" });
+    };
+    const setInput = (value, cursorOffset) => {
+        dispatch({ type: "set-input", value, cursorOffset });
+    };
+    inputRef.current = state.input;
+    const appendDisplayBlock = (block) => {
+        const timestamp = Date.now();
+        displayBlockIdRef.current += 1;
+        setDisplayBlocks((current) => [
+            ...current,
+            {
+                ...block,
+                id: `${block.kind}:${timestamp}:${displayBlockIdRef.current}`,
+                timestamp,
+            },
+        ]);
+    };
+    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(() => {
+        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);
+        };
+    }, []);
+    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")
+            return;
+        setOverlay({ ...current, ...partial });
+    }
+    async function startOAuthLogin(provider) {
+        setOverlay({
+            kind: "oauth",
+            providerId: provider.id,
+            providerName: provider.label,
+            mode: "oauth",
+            inputLabel: "Authorization code",
+            inputValue: "",
+            accountId: "default",
+            accountName: "Default",
+            progress: `Credentials will be saved to ${getAuthPath()}.`,
+        });
+        try {
+            await context.session.modelRegistry.authStorage.login(provider.id, {
+                onAuth: (authInfo) => {
+                    const opened = openAuthUrl(authInfo.url);
+                    handleOAuthOverlayChange({
+                        authInfo,
+                        progress: opened
+                            ? "Opened the login URL in Chrome. Complete login there, then paste the code if prompted."
+                            : "Open the URL in your browser, then paste the code.",
+                    });
+                },
+                onPrompt: (prompt) => new Promise((resolve) => {
+                    oauthResolverRef.current = resolve;
+                    handleOAuthOverlayChange({ prompt, inputLabel: prompt.message, inputValue: "" });
+                }),
+                onManualCodeInput: () => new Promise((resolve) => {
+                    oauthResolverRef.current = resolve;
+                    handleOAuthOverlayChange({
+                        prompt: { message: "Paste the authorization code:" },
+                        inputLabel: "Authorization code",
+                        inputValue: "",
+                    });
+                }),
+                onProgress: (message) => {
+                    handleOAuthOverlayChange({ progress: message });
+                },
+            }, "default", "Default");
+            context.session.modelRegistry.refresh();
+            closeOverlay();
+            refresh();
+            setStatus(`Logged in to ${provider.id}.`, "success");
+        }
+        catch (error) {
+            closeOverlay();
+            setError(error instanceof Error ? error.message : String(error));
+        }
+    }
+    const { submitPrompt } = usePromptSubmit({
+        session: context.session,
+        dispatch,
+        routerContext: {
+            setStatus,
+            setError,
+            clearStatus,
+            setOverlay,
+            closeOverlay,
+            setInput,
+            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;
+        startupRanRef.current = true;
+        void (async () => {
+            try {
+                if (initialMessage) {
+                    setStatus("Sending startup prompt...", "busy");
+                    await context.session.prompt(initialMessage, { images: initialImages });
+                }
+                if (initialMessages) {
+                    for (const message of initialMessages) {
+                        await context.session.prompt(message);
+                    }
+                }
+                if (initialMessage || (initialMessages && initialMessages.length > 0)) {
+                    setStatus("Startup prompt completed.", "success");
+                }
+            }
+            catch (error) {
+                setError(error instanceof Error ? error.message : String(error));
+            }
+            finally {
+                refresh();
+            }
+        })();
+    }, [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" || extensionUiActive,
+        onExit: handleExit,
+        onOpenSettings: () => setOverlay({ kind: "settings" }),
+        onOpenResume: () => {
+            setOverlay({ kind: "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 }));
+            break;
+        case "model":
+            overlay = (_jsx(ModelDialog, { models: context.session.modelRegistry.getAvailable(), onClose: closeOverlay, onSelect: async (model) => {
+                    try {
+                        await context.session.setModel(model);
+                        closeOverlay();
+                        refresh();
+                        setStatus(`Model set to ${model.provider}/${model.id}.`, "success");
+                    }
+                    catch (error) {
+                        setError(error instanceof Error ? error.message : String(error));
+                    }
+                }, search: state.overlay.search }));
+            break;
+        case "scopedModels":
+            const scopedModelsOverlay = state.overlay;
+            overlay = (_jsx(ScopedModelsDialog, { models: scopedModelsOverlay.models, onClose: closeOverlay, onSave: async (selectedIds) => {
+                    try {
+                        const allIds = scopedModelsOverlay.models.map((model) => `${model.provider}/${model.id}`);
+                        if (selectedIds.length === 0 || selectedIds.length === allIds.length) {
+                            context.session.settingsManager.setEnabledModels(undefined);
+                            context.session.setScopedModels([]);
+                            closeOverlay();
+                            refresh();
+                            setStatus("Scoped model filter cleared. Ctrl+P will cycle all available models.", "success");
+                            return;
+                        }
+                        const resolved = await resolveModelScope(selectedIds, context.session.modelRegistry);
+                        context.session.settingsManager.setEnabledModels(selectedIds);
+                        context.session.setScopedModels(resolved.map((entry) => ({
+                            model: entry.model,
+                            thinkingLevel: entry.thinkingLevel ?? context.session.thinkingLevel,
+                        })));
+                        closeOverlay();
+                        refresh();
+                        setStatus(`Scoped model cycling to ${selectedIds.length} model(s).`, "success");
+                    }
+                    catch (error) {
+                        setError(error instanceof Error ? error.message : String(error));
+                    }
+                }, selectedIds: scopedModelsOverlay.selectedIds }));
+            break;
+        case "theme":
+            overlay = (_jsx(ThemeDialog, { themes: getAvailableThemes(), onClose: closeOverlay, onSelect: (themeName) => {
+                    const result = setTheme(themeName, true);
+                    if (!result.success) {
+                        setError(result.error ?? `Unable to load theme "${themeName}".`);
+                        return;
+                    }
+                    context.session.settingsManager.setTheme(themeName);
+                    dispatch({ type: "set-theme-name", themeName });
+                    dispatch({ type: "footer-tick" });
+                    closeOverlay();
+                    setStatus(`Theme set to ${themeName}.`, "success");
+                } }));
+            break;
+        case "session":
+            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();
+                        resetSessionView();
+                        setStatus("Resumed session.", "success");
+                    }
+                    catch (error) {
+                        setError(error instanceof Error ? error.message : String(error));
+                    }
+                }, currentSessions: currentSessions }));
+            break;
+        case "tree":
+            overlay = (_jsx(TreeDialog, { items: state.overlay.items, onClose: closeOverlay, onSelect: async (item) => {
+                    if (!item.id) {
+                        setError("Navigation before the first message is not supported yet.");
+                        return;
+                    }
+                    try {
+                        const result = await context.session.navigateTree(item.id);
+                        closeOverlay();
+                        resetSessionView();
+                        if (result.editorText) {
+                            setInput(result.editorText);
+                        }
+                        setStatus("Navigated to the selected point.", "success");
+                    }
+                    catch (error) {
+                        setError(error instanceof Error ? error.message : String(error));
+                    }
+                } }));
+            break;
+        case "userMessage":
+            overlay = (_jsx(UserMessageDialog, { items: state.overlay.items, onClose: closeOverlay, onSelect: async (item) => {
+                    try {
+                        const result = await context.session.fork(item.entryId);
+                        closeOverlay();
+                        resetSessionView();
+                        if (!result.cancelled) {
+                            setInput(result.selectedText);
+                            setStatus("Forked to a new session branch.", "success");
+                        }
+                    }
+                    catch (error) {
+                        setError(error instanceof Error ? error.message : String(error));
+                    }
+                } }));
+            break;
+        case "login":
+            overlay = (_jsx(LoginDialog, { mode: "login", onClose: closeOverlay, onSelect: async (provider) => {
+                    if (provider.authKind === "oauth") {
+                        await startOAuthLogin(provider);
+                        return;
+                    }
+                    setOverlay({
+                        kind: "oauth",
+                        providerId: provider.id,
+                        providerName: provider.label,
+                        mode: "apiKey",
+                        inputLabel: `API key for ${provider.id}`,
+                        inputValue: "",
+                        accountId: "default",
+                        accountName: "Default",
+                        progress: `Credentials will be saved to ${getAuthPath()}.`,
+                    });
+                }, providers: state.overlay.providers }));
+            break;
+        case "logout":
+            overlay = (_jsx(LoginDialog, { mode: "logout", accounts: state.overlay.accounts, onClose: closeOverlay, onSelect: (account) => {
+                    context.session.modelRegistry.authStorage.logout(account.provider, account.accountId);
+                    context.session.modelRegistry.refresh();
+                    closeOverlay();
+                    refresh();
+                    setStatus(`Removed saved credential ${account.label}.`, "success");
+                } }));
+            break;
+        case "oauth":
+            const oauthState = state.overlay;
+            overlay = (_jsx(OAuthDialog, { state: oauthState, onChange: handleOAuthOverlayChange, onClose: closeOverlay, onSubmit: async () => {
+                    if (oauthResolverRef.current) {
+                        const resolve = oauthResolverRef.current;
+                        oauthResolverRef.current = null;
+                        const value = oauthState.inputValue;
+                        handleOAuthOverlayChange({ inputValue: "", prompt: undefined });
+                        resolve(value);
+                        return;
+                    }
+                    if (oauthState.mode === "apiKey") {
+                        const value = oauthState.inputValue.trim();
+                        if (!value) {
+                            setError("API key cannot be empty.");
+                            return;
+                        }
+                        context.session.modelRegistry.authStorage.set(oauthState.providerId, "default", {
+                            type: "api_key",
+                            key: value,
+                            accountId: "default",
+                            accountName: "Default",
+                        });
+                        context.session.modelRegistry.refresh();
+                        closeOverlay();
+                        refresh();
+                        setStatus(`Saved API key for ${oauthState.providerId}.`, "success");
+                    }
+                } }));
+            break;
+        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();
+        const nextThemeName = context.session.settingsManager.getTheme() ?? "dark";
+        if (state.showThinking !== nextShowThinking) {
+            dispatch({ type: "set-show-thinking", value: nextShowThinking });
+        }
+        if (state.showImages !== nextShowImages) {
+            dispatch({ type: "set-show-images", value: nextShowImages });
+        }
+        if (state.themeName !== nextThemeName) {
+            dispatch({ type: "set-theme-name", themeName: nextThemeName });
+        }
+    }, [context.session, state.footerTick, state.showImages, state.showThinking, state.themeName]);
+    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;
+                    }
+                    if (context.session.isCompacting) {
+                        context.session.abortCompaction();
+                        setStatus("Cancelling compaction...", "warning");
+                        return;
+                    }
+                    const restored = restoreQueuedMessagesToPrompt({ abort: true });
+                    refresh();
+                    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");
+                }, 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