apex-code 0.0.1-alpha.7 → 0.0.1-alpha.8

package/dist/modes/interactive/interactive-mode.js

@@ -54,6 +54,7 @@ import { EarendilAnnouncementComponent } from "./components/earendil-announcemen
 import { ExtensionEditorComponent } from "./components/extension-editor.js";
 import { ExtensionInputComponent } from "./components/extension-input.js";
 import { ExtensionSelectorComponent } from "./components/extension-selector.js";
+import { FirstUseHints } from "./components/first-use-hints.js";
 import { FooterComponent, formatTokens } from "./components/footer.js";
 import { formatKeyText, keyDisplayText, keyHint, keyText, rawKeyHint } from "./components/keybinding-hints.js";
 import { LoginDialogComponent } from "./components/login-dialog.js";
@@ -72,6 +73,7 @@ import { TrustSelectorComponent } from "./components/trust-selector.js";
 import { UserMessageComponent } from "./components/user-message.js";
 import { UserMessageSelectorComponent } from "./components/user-message-selector.js";
 import { editInExternalEditor } from "./external-editor.js";
+import { refreshModelCatalogs } from "./model-catalog-refresh.js";
 import { getModelSearchText } from "./model-search.js";
 import { getAvailableThemes, getAvailableThemesWithPaths, getEditorTheme, getMarkdownTheme, getThemeByName, onThemeChange, setRegisteredThemes, stopThemeWatcher, Theme, theme, } from "./theme/theme.js";
 import { InteractiveThemeController } from "./theme/theme-controller.js";
@@ -172,9 +174,21 @@ function formatLoginProviderCompletionDescription(provider) {
 export function createInteractiveTui(options) {
     const terminal = options.terminal ?? new ProcessTerminal();
     if (options.tuiMode === "fullscreen") {
+        const styleSearchMatch = (text) => theme.bg("searchMatchBg", theme.fg("searchMatchText", text));
         return new TuiAltScreen(terminal, options.showHardwareCursor, options.logDirectory, {
+            searchMatchStyle: (text) => theme.underline(styleSearchMatch(text)),
+            searchCurrentMatchStyle: (text) => theme.bold(theme.inverse(styleSearchMatch(text))),
             openUrl: openBrowser,
             onRightClickPaste: options.onRightClickPaste,
+            copySelection: async (text) => {
+                try {
+                    await copyToClipboard(text);
+                    return true;
+                }
+                catch {
+                    return false;
+                }
+            },
         });
     }
     return new TuiMainScreen(terminal, options.showHardwareCursor, options.logDirectory);
@@ -236,6 +250,14 @@ export class InteractiveMode {
     footer;
     footerContainer;
     footerDataProvider;
+    /**
+     * Whether the startup screen is showing its counted inventory line.
+     *
+     * Warnings are only allowed to collapse into that count when the count is
+     * actually on screen. Under a quiet startup there is no splash header, so
+     * collapsing them would hide conflicts entirely rather than summarise them.
+     */
+    startupInventoryVisible = false;
     // Stored so the same manager can be injected into custom editors, selectors, and extension UI.
     keybindings;
     version;
@@ -258,6 +280,7 @@ export class InteractiveMode {
     // Status line tracking (for mutating immediately-sequential status updates)
     lastStatusSpacer = undefined;
     lastStatusText = undefined;
+    managedToolStatusStarted = false;
     // Streaming message tracking
     streamingComponent = undefined;
     streamingMessage = undefined;
@@ -279,6 +302,7 @@ export class InteractiveMode {
     signalCleanupHandlers = [];
     // Track if editor is in bash mode (text starts with !)
     isBashMode = false;
+    firstUseHints;
     // Track current bash execution component
     bashComponent = undefined;
     // Track pending bash components (shown in pending area, moved to chat on submit)
@@ -328,6 +352,14 @@ export class InteractiveMode {
     get settingsManager() {
         return this.session.settingsManager;
     }
+    offerFirstUseHint(id) {
+        this.firstUseHints ??= new FirstUseHints(this.settingsManager.getFirstUseHints());
+        const hint = this.firstUseHints.offer(id);
+        if (!hint)
+            return;
+        this.settingsManager.setFirstUseHints(this.firstUseHints.getSeen());
+        this.chatContainer.addChild(new Text(theme.fg("dim", hint), this.outputPad, 0));
+    }
     constructor(runtimeHost, options = {}) {
         this.runtimeHost = runtimeHost;
         const tuiMode = options.tuiMode ?? this.settingsManager.getTuiMode();
@@ -338,6 +370,7 @@ export class InteractiveMode {
         });
         this.runtimeHost.setRebindSession(async () => {
             await this.rebindCurrentSession({ renderBeforeBind: true });
+            await this.themeController.applyFromSettings();
         });
         this.version = VERSION;
         this.renderer = createInteractiveTui({
@@ -366,11 +399,14 @@ export class InteractiveMode {
         this.defaultEditor = new CustomEditor(this.ui, getEditorTheme(), this.keybindings, {
             paddingX: editorPaddingX,
             autocompleteMaxVisible,
-            promptPrefix: "> ",
+            promptPrefix: "› ",
             promptColor: (text) => theme.fg("accent", text),
-            placeholder: "Ask anything, / for commands, ! for bash",
+            placeholder: "Ask anything",
             placeholderColor: (text) => theme.fg("dim", text),
             commandColor: (text) => theme.fg("accent", text),
+            surfaceColor: (text) => theme.bg("userMessageBg", text),
+            autocompleteRule: (width) => theme.fg("borderMuted", (this.settingsManager.getSymbolPreset() === "ascii" ? "-" : "┄").repeat(Math.max(1, width))),
+            autocompleteFooter: () => this.buildAutocompleteFooter(),
         });
         this.editor = this.defaultEditor;
         this.editorContainer = new Container();
@@ -385,7 +421,12 @@ export class InteractiveMode {
         this.outputPad = this.settingsManager.getOutputPad();
         // Register themes from resource loader and initialize
         setRegisteredThemes(this.session.resourceLoader.getThemes().themes);
-        this.themeController = new InteractiveThemeController(this.ui, this.settingsManager, (message) => this.showError(message), () => this.updateEditorBorderColor());
+        this.themeController = new InteractiveThemeController(this.ui, {
+            getSettingsManager: () => this.settingsManager,
+            showError: (message) => this.showError(message),
+            onChanged: () => this.updateEditorBorderColor(),
+            initialThemeSetting: options.initialThemeSetting,
+        });
     }
     getAutocompleteSourceTag(sourceInfo) {
         if (!sourceInfo) {
@@ -548,14 +589,14 @@ export class InteractiveMode {
             tui.setLayoutRoot(this.fullscreenLayoutRoot);
         }
     }
-    stopInteractiveTui() {
-        if (this.renderer.mode === "fullscreen") {
+    stopInteractiveTui(fullscreenExitOutput) {
+        if (this.renderer.mode === "fullscreen" && fullscreenExitOutput === "transcript") {
             while (this.renderer.hasOverlayEntries)
                 this.renderer.hideOverlay();
             this.switchTuiMode("regular", false, false);
             this.renderer.renderNow();
         }
-        this.ui.stop();
+        this.ui.stop({ preserveScreen: this.renderer.mode === "fullscreen" });
     }
     switchTuiMode(mode, restoreProgress = true, startRenderer = true) {
         const previousUi = this.renderer;
@@ -612,10 +653,9 @@ export class InteractiveMode {
         this.registerSignalHandlers();
         // Load changelog (only show new entries, skip for resumed sessions)
         this.changelogMarkdown = this.getChangelogForDisplay();
-        // Ensure fd and rg are available (downloads if missing, adds to PATH via getBinDir)
-        // Both are needed: fd for autocomplete, rg for grep tool and bash commands
-        const [fdPath] = await Promise.all([ensureTool("fd"), ensureTool("rg")]);
-        this.fdPath = fdPath;
+        // Resolve the effective mode before mounting or focusing components. Both
+        // operations can schedule a frame even before the renderer is started.
+        await this.refreshFooterPermissionMode();
         if (this.session.scopedModels.length > 0 && (this.options.verbose || !this.settingsManager.getQuietStartup())) {
             const modelList = this.session.scopedModels
                 .map((sm) => {
@@ -659,9 +699,11 @@ export class InteractiveMode {
             this.widgetContainerBelow,
             this.footerContainer,
         ]);
+        // Accept text while startup completes, but only enable interrupt, exit, and submission feedback.
+        this.defaultEditor.onAction("app.clear", () => this.handleCtrlC());
+        this.defaultEditor.onCtrlD = () => this.handleCtrlD();
+        this.defaultEditor.onSubmit = (text) => this.handleStartupSubmit(text);
         this.ui.setFocus(this.editor);
-        this.setupKeyHandlers();
-        this.setupEditorSubmitHandler();
         // Start the UI before initializing extensions so session_start handlers can use interactive dialogs
         this.ui.start();
         this.isInitialized = true;
@@ -698,18 +740,42 @@ export class InteractiveMode {
             this.builtInHeader = new ApexSplashHeader(this.version, () => this.session.state.model?.id, () => this.session.sessionManager.getCwd(), this.options.verbose ? expandedInstructions : undefined, {
                 topPadding: true,
                 getSymbolPreset: () => this.settingsManager.getSymbolPreset(),
+                getExtraMetadata: () => {
+                    // Which branch the session is rooted on differs between launches
+                    // and is not derivable from the prompt, so it belongs here. The
+                    // tray carries it too, but drops it first when space is tight.
+                    const branch = this.footerDataProvider.getGitBranch();
+                    return branch ? [{ label: "branch", value: branch }] : [];
+                },
+                getInventory: () => this.buildStartupInventory(),
+                inventoryHint: "/resources",
+                getShortcuts: () => this.buildStartupShortcuts(),
                 getHint: () => "Apex Code can explain its own features and look up its docs.",
             });
             // Setup UI layout
+            this.startupInventoryVisible = true;
             this.headerContainer.addChild(this.builtInHeader);
             this.headerContainer.addChild(new Spacer(1));
         }
         else {
             // Minimal header when silenced
+            this.startupInventoryVisible = false;
             this.builtInHeader = new Text("", 0, 0);
             this.headerContainer.addChild(this.builtInHeader);
         }
         this.ui.requestRender();
+        // Ensure fd and rg are available after mounting the TUI (downloads if missing, adds to PATH via getBinDir)
+        // so slow downloads do not make startup appear frozen.
+        // Both are needed: fd for autocomplete, rg for grep tool and bash commands.
+        const [fdPath] = await Promise.all([
+            ensureTool("fd", (status) => this.showManagedToolStatus(status)),
+            ensureTool("rg", (status) => this.showManagedToolStatus(status)),
+        ]);
+        this.fdPath = fdPath;
+        // Enable the remaining input handlers only after managed-tool setup completes.
+        this.setupKeyHandlers();
+        this.setupEditorSubmitHandler();
+        this.ui.requestRender();
         // Initialize extensions first so resources are shown before messages
         await this.rebindCurrentSession();
         // Render initial messages AFTER showing loaded resources
@@ -749,8 +815,7 @@ export class InteractiveMode {
         if (!getApexEnvironment("APEX_CODE_OFFLINE")) {
             const controller = new AbortController();
             const timeout = setTimeout(() => controller.abort(), 15_000);
-            void this.session.modelRuntime
-                .refresh({ signal: controller.signal })
+            void refreshModelCatalogs(this.session.modelRuntime, controller.signal)
                 .then(() => this.updateAvailableProviderCount())
                 .catch(() => { })
                 .finally(() => clearTimeout(timeout));
@@ -1205,7 +1270,7 @@ export class InteractiveMode {
     showLoadedResources(options) {
         // Resource rendering is idempotent; chat clears no longer clear this separate container.
         this.loadedResourcesContainer.clear();
-        const showListing = options?.force || this.options.verbose || !this.settingsManager.getQuietStartup();
+        const showListing = options?.force || this.options.verbose;
         const showDiagnostics = showListing || options?.showDiagnosticsWhenQuiet === true;
         if (!showListing && !showDiagnostics) {
             return;
@@ -1322,43 +1387,105 @@ export class InteractiveMode {
                 addLoadedSection("Themes", themeCompactList, themeList);
             }
         }
+        // Warnings collapse into the counted line when that line is on screen; the
+        // full trace lives behind /resources. Errors always surface inline,
+        // because an error means a resource did not load at all.
         if (showDiagnostics) {
-            const skillDiagnostics = skillsResult.diagnostics;
-            if (skillDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(skillDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Skill conflicts]")}\n${warningLines}`, 0, 0));
-                this.loadedResourcesContainer.addChild(new Spacer(1));
-            }
-            const promptDiagnostics = promptsResult.diagnostics;
-            if (promptDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(promptDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Prompt conflicts]")}\n${warningLines}`, 0, 0));
-                this.loadedResourcesContainer.addChild(new Spacer(1));
-            }
-            const extensionDiagnostics = [];
-            const extensionErrors = this.session.resourceLoader.getExtensions().errors;
-            if (extensionErrors.length > 0) {
-                for (const error of extensionErrors) {
-                    extensionDiagnostics.push({ type: "error", message: error.error, path: error.path });
-                }
-            }
-            const commandDiagnostics = this.session.extensionRunner.getCommandDiagnostics();
-            extensionDiagnostics.push(...commandDiagnostics);
-            extensionDiagnostics.push(...this.getBuiltInCommandConflictDiagnostics(this.session.extensionRunner));
-            const shortcutDiagnostics = this.session.extensionRunner.getShortcutDiagnostics();
-            extensionDiagnostics.push(...shortcutDiagnostics);
-            if (extensionDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(extensionDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Extension issues]")}\n${warningLines}`, 0, 0));
-                this.loadedResourcesContainer.addChild(new Spacer(1));
-            }
-            const themeDiagnostics = themesResult.diagnostics;
-            if (themeDiagnostics.length > 0) {
-                const warningLines = this.formatDiagnostics(themeDiagnostics, sourceInfos);
-                this.loadedResourcesContainer.addChild(new Text(`${theme.fg("warning", "[Theme conflicts]")}\n${warningLines}`, 0, 0));
+            const collapseWarnings = !showListing && this.startupInventoryVisible;
+            for (const group of this.collectDiagnosticGroups()) {
+                const visible = collapseWarnings
+                    ? group.diagnostics.filter((diagnostic) => diagnostic.type === "error")
+                    : group.diagnostics;
+                if (visible.length === 0)
+                    continue;
+                const severity = visible.some((diagnostic) => diagnostic.type === "error") ? "error" : "warning";
+                const body = this.formatDiagnostics(visible, sourceInfos);
+                this.loadedResourcesContainer.addChild(new Text(`${theme.fg(severity, `[${group.label}]`)}\n${body}`, 0, 0));
                 this.loadedResourcesContainer.addChild(new Spacer(1));
             }
         }
+        // Counts on the startup screen are read at render time, so they fill in
+        // once resources finish loading without an explicit refresh here.
+        this.builtInHeader?.invalidate?.();
+    }
+    /**
+     * Every startup diagnostic, grouped by the resource kind that produced it.
+     *
+     * One list feeds both the counted line in the header and the detailed
+     * listing, so the two can never disagree about how many issues exist.
+     */
+    collectDiagnosticGroups() {
+        const extensionDiagnostics = [
+            ...this.session.resourceLoader
+                .getExtensions()
+                .errors.map((error) => ({ type: "error", message: error.error, path: error.path })),
+            ...this.session.extensionRunner.getCommandDiagnostics(),
+            ...this.getBuiltInCommandConflictDiagnostics(this.session.extensionRunner),
+            ...this.session.extensionRunner.getShortcutDiagnostics(),
+        ];
+        return [
+            { label: "Skill conflicts", diagnostics: this.session.resourceLoader.getSkills().diagnostics },
+            { label: "Prompt conflicts", diagnostics: this.session.resourceLoader.getPrompts().diagnostics },
+            { label: "Extension issues", diagnostics: extensionDiagnostics },
+            { label: "Theme conflicts", diagnostics: this.session.resourceLoader.getThemes().diagnostics },
+        ].filter((group) => group.diagnostics.length > 0);
+    }
+    /**
+     * The counted line in the ruled band under the mark.
+     *
+     * The startup screen used to print all 152 skill names across fifteen rows.
+     * A count answers the only question that screen can usefully answer, which
+     * is what got loaded; the names live behind /resources now.
+     */
+    /**
+     * The sigil row under the hint: how to reach commands, bash, and files.
+     *
+     * These are the only three characters that change what the composer does, so
+     * they take the accent and everything around them stays quiet.
+     */
+    /** Live keybindings under the autocomplete dropdown. */
+    buildAutocompleteFooter() {
+        const separator = theme.fg("borderMuted", this.settingsManager.getSymbolPreset() === "ascii" ? " - " : " · ");
+        return [
+            rawKeyHint(`${keyText("tui.select.up")}/${keyText("tui.select.down")}`, "move"),
+            keyHint("tui.select.confirm", "select"),
+            keyHint("tui.input.tab", "complete"),
+            keyHint("tui.select.cancel", "dismiss"),
+        ].join(separator);
+    }
+    buildStartupShortcuts() {
+        const entry = (sigil, label) => `${theme.fg("accent", sigil)} ${theme.fg("muted", label)}`;
+        return [
+            entry("/", "commands"),
+            entry("!", "bash"),
+            entry("@", "files"),
+            `${theme.fg("dim", keyText("app.interrupt"))} ${theme.fg("muted", "interrupt")}`,
+        ].join("    ");
+    }
+    buildStartupInventory() {
+        const counted = (total, singular) => `${total} ${singular}${total === 1 ? "" : "s"}`;
+        const parts = [];
+        const skills = this.session.resourceLoader.getSkills().skills.length;
+        const extensions = this.session.resourceLoader.getExtensions().extensions.filter((e) => !e.hidden).length;
+        const prompts = this.session.resourceLoader.getPrompts().prompts.length;
+        if (skills > 0)
+            parts.push(theme.fg("muted", counted(skills, "skill")));
+        if (extensions > 0)
+            parts.push(theme.fg("muted", counted(extensions, "extension")));
+        if (prompts > 0)
+            parts.push(theme.fg("muted", counted(prompts, "prompt")));
+        const diagnostics = this.collectDiagnosticGroups().flatMap((group) => group.diagnostics);
+        const errors = diagnostics.filter((diagnostic) => diagnostic.type === "error").length;
+        const conflicts = diagnostics.length - errors;
+        if (errors > 0)
+            parts.push(theme.fg("error", counted(errors, "error")));
+        if (conflicts > 0)
+            parts.push(theme.fg("warning", counted(conflicts, "conflict")));
+        if (parts.length === 0)
+            return undefined;
+        const ascii = this.settingsManager.getSymbolPreset() === "ascii";
+        const separator = theme.fg("borderMuted", ascii ? " - " : " · ");
+        return parts.join(separator);
     }
     /**
      * Initialize the extension system with TUI-based UI context.
@@ -1446,7 +1573,7 @@ export class InteractiveMode {
         this.applyFullscreenScrollbarSetting();
         this.footer.setSession(this.session);
         this.footer.setAutoCompactEnabled(this.session.autoCompactionEnabled);
-        this.refreshFooterPermissionMode();
+        void this.refreshFooterPermissionMode();
         this.footerDataProvider.setCwd(this.sessionManager.getCwd());
         this.hideThinkingBlock = this.settingsManager.getHideThinkingBlock();
         this.outputPad = this.settingsManager.getOutputPad();
@@ -1489,7 +1616,7 @@ export class InteractiveMode {
         const message = error instanceof Error ? error.message : String(error);
         this.showError(`${prefix}: ${message}`);
         stopThemeWatcher();
-        this.stop();
+        this.stop("transcript");
         process.exit(1);
     }
     renderCurrentSessionState() {
@@ -1499,9 +1626,14 @@ export class InteractiveMode {
         this.compactionQueuedMessages = [];
         this.streamingComponent = undefined;
         this.streamingMessage = undefined;
-        this.pendingTools.clear();
+        this.clearPendingTools();
         this.renderInitialMessages();
     }
+    clearPendingTools() {
+        for (const component of this.pendingTools.values())
+            component.dispose();
+        this.pendingTools.clear();
+    }
     /**
      * Get a registered tool definition by name (for custom rendering).
      */
@@ -1884,7 +2016,7 @@ export class InteractiveMode {
     /**
      * Show a selector for extensions.
      */
-    showExtensionSelector(title, options, opts) {
+    showExtensionSelector(title, options, opts, enableSearch = false) {
         return new Promise((resolve) => {
             if (opts?.signal?.aborted) {
                 resolve(undefined);
@@ -1903,7 +2035,12 @@ export class InteractiveMode {
                 opts?.signal?.removeEventListener("abort", onAbort);
                 this.hideExtensionSelector();
                 resolve(undefined);
-            }, { tui: this.ui, timeout: opts?.timeout, onToggleToolsExpanded: () => this.toggleToolOutputExpansion() });
+            }, {
+                tui: this.ui,
+                timeout: opts?.timeout,
+                onToggleToolsExpanded: () => this.toggleToolOutputExpansion(),
+                enableSearch,
+            });
             this.disposeActiveSelector();
             this.editorContainer.clear();
             this.editorContainer.addChild(this.extensionSelector);
@@ -1922,6 +2059,40 @@ export class InteractiveMode {
         this.ui.setFocus(this.editor);
         this.ui.requestRender();
     }
+    async showConfigurationIndex() {
+        const choice = await this.showExtensionSelector("Configuration", [
+            "Settings",
+            "Model",
+            "Model cycling",
+            "Provider login",
+            "Provider logout",
+            "Project trust",
+            "Resources, extensions, and MCP adapters",
+        ], undefined, true);
+        switch (choice) {
+            case "Settings":
+                await this.showSettingsSelector();
+                break;
+            case "Model":
+                this.showModelSelector();
+                break;
+            case "Model cycling":
+                await this.showModelsSelector();
+                break;
+            case "Provider login":
+                await this.handleLoginCommand();
+                break;
+            case "Provider logout":
+                this.showOAuthSelector("logout");
+                break;
+            case "Project trust":
+                this.showTrustSelector();
+                break;
+            case "Resources, extensions, and MCP adapters":
+                this.showStatus("Run apex-code config to manage resources, extensions, and MCP adapters.");
+                break;
+        }
+    }
     /**
      * Show a confirmation dialog for extensions.
      */
@@ -2233,6 +2404,8 @@ export class InteractiveMode {
             const wasBashMode = this.isBashMode;
             this.isBashMode = text.trimStart().startsWith("!");
             if (wasBashMode !== this.isBashMode) {
+                if (this.isBashMode)
+                    this.offerFirstUseHint("bash");
                 this.updateEditorBorderColor();
             }
         };
@@ -2281,6 +2454,10 @@ export class InteractiveMode {
             // Silently ignore clipboard errors (may not have permission, etc.)
         }
     }
+    handleStartupSubmit(text) {
+        this.editor.setText(text);
+        this.showStatus("Startup is still in progress");
+    }
     setupEditorSubmitHandler() {
         this.defaultEditor.onSubmit = async (text) => {
             text = text.trim();
@@ -2294,6 +2471,11 @@ export class InteractiveMode {
                 this.pendingPermissionModeWrite = undefined;
             }
             // Handle commands
+            if (text === "/config") {
+                this.editor.setText("");
+                await this.showConfigurationIndex();
+                return;
+            }
             if (text === "/settings") {
                 this.editor.setText("");
                 await this.showSettingsSelector();
@@ -2345,6 +2527,11 @@ export class InteractiveMode {
                 this.editor.setText("");
                 return;
             }
+            if (text === "/resources") {
+                this.showLoadedResources({ force: true });
+                this.editor.setText("");
+                return;
+            }
             if (text === "/hotkeys") {
                 this.handleHotkeysCommand();
                 this.editor.setText("");
@@ -2485,7 +2672,7 @@ export class InteractiveMode {
         this.footer.invalidate();
         switch (event.type) {
             case "agent_start":
-                this.pendingTools.clear();
+                this.clearPendingTools();
                 if (this.settingsManager.getShowTerminalProgress()) {
                     this.ui.terminal.setProgress(true);
                 }
@@ -2537,6 +2724,7 @@ export class InteractiveMode {
                     this.streamingMessage = event.message;
                     this.chatContainer.addChild(this.streamingComponent);
                     this.streamingComponent.updateContent(this.streamingMessage, true);
+                    this.updateEditorBorderColor();
                     this.ui.requestRender();
                 }
                 break;
@@ -2554,6 +2742,7 @@ export class InteractiveMode {
                                 component.setExpanded(this.toolOutputExpanded);
                                 this.chatContainer.addChild(component);
                                 this.pendingTools.set(content.id, component);
+                                this.offerFirstUseHint("tool-expand");
                             }
                             else {
                                 const component = this.pendingTools.get(content.id);
@@ -2591,7 +2780,7 @@ export class InteractiveMode {
                                 isError: true,
                             });
                         }
-                        this.pendingTools.clear();
+                        this.clearPendingTools();
                     }
                     else {
                         // Args are now complete - trigger diff computation for edit tools
@@ -2603,6 +2792,7 @@ export class InteractiveMode {
                     this.streamingComponent = undefined;
                     this.streamingMessage = undefined;
                     this.footer.invalidate();
+                    this.updateEditorBorderColor();
                 }
                 this.ui.requestRender();
                 break;
@@ -2651,7 +2841,7 @@ export class InteractiveMode {
                     this.streamingComponent = undefined;
                     this.streamingMessage = undefined;
                 }
-                this.pendingTools.clear();
+                this.clearPendingTools();
                 this.ui.requestRender();
                 break;
             case "agent_settled":
@@ -2763,6 +2953,19 @@ export class InteractiveMode {
             : message.content.filter((c) => c.type === "text");
         return textBlocks.map((c) => c.text).join("");
     }
+    /** Show a managed-tool status update in the chat. */
+    showManagedToolStatus(status) {
+        if (!this.managedToolStatusStarted) {
+            this.chatContainer.addChild(new Spacer(1));
+            this.managedToolStatusStarted = true;
+        }
+        const message = status.type === "warning" ? `Warning: ${status.message}` : status.message;
+        const color = status.type === "warning" ? "warning" : "dim";
+        this.chatContainer.addChild(new Text(theme.fg(color, message), 1, 0));
+        this.lastStatusSpacer = undefined;
+        this.lastStatusText = undefined;
+        this.ui.requestRender();
+    }
     /**
      * Show a status message in the chat.
      *
@@ -2883,7 +3086,7 @@ export class InteractiveMode {
         }
     }
     renderSessionItems(items, options = {}) {
-        this.pendingTools.clear();
+        this.clearPendingTools();
         const renderedPendingTools = new Map();
         // Cache-miss notices are not persisted; re-derive them from the full entry
         // list and re-inject them after the assistant messages that paid for them.
@@ -3241,6 +3444,7 @@ export class InteractiveMode {
             this.editor.addToHistory?.(text);
             this.editor.setText("");
             await this.session.prompt(text, { streamingBehavior: "followUp" });
+            this.offerFirstUseHint("queue");
             this.updatePendingMessagesDisplay();
             this.ui.requestRender();
         }
@@ -3260,6 +3464,7 @@ export class InteractiveMode {
         }
     }
     updateEditorBorderColor() {
+        this.defaultEditor.setModeLabel(this.isBashMode ? "bash" : this.session.isStreaming ? "busy" : undefined);
         if (this.isBashMode) {
             this.editor.borderColor = theme.getBashModeBorderColor();
         }
@@ -3320,6 +3525,7 @@ export class InteractiveMode {
         this.showStatus(`Tool output: ${expanded ? "expanded" : "collapsed"}`);
     }
     toggleThinkingBlockVisibility() {
+        this.offerFirstUseHint("thinking");
         this.hideThinkingBlock = !this.hideThinkingBlock;
         this.settingsManager.setHideThinkingBlock(this.hideThinkingBlock);
         // Rebuild chat from session messages
@@ -3610,11 +3816,12 @@ export class InteractiveMode {
      * between two sessions in one process. A footer left showing the old value
      * would under-report bypassPermissions, which is the one direction that matters.
      */
-    refreshFooterPermissionMode() {
-        void this.session.getPermissionMode().then((resolution) => {
-            this.footer.setPermissionMode(resolution?.mode ?? "default");
+    async refreshFooterPermissionMode() {
+        const resolution = await this.session.getPermissionMode();
+        this.footer.setPermissionMode(resolution?.mode ?? "default");
+        if (this.isInitialized) {
             this.ui.requestRender();
-        });
+        }
     }
     /**
      * Writes the mode to user scope, then reports what is actually in force. The
@@ -3664,7 +3871,7 @@ export class InteractiveMode {
                 httpIdleTimeoutMs: this.settingsManager.getHttpIdleTimeoutMs(),
                 thinkingLevel: this.session.thinkingLevel,
                 availableThinkingLevels: this.session.getAvailableThinkingLevels(),
-                currentTheme: this.settingsManager.getThemeSetting() || "dark",
+                currentTheme: this.themeController.getThemeSelection() || "dark",
                 terminalTheme: this.themeController.getTerminalTheme(),
                 availableThemes: getAvailableThemes(),
                 hideThinkingBlock: this.hideThinkingBlock,
@@ -3684,6 +3891,7 @@ export class InteractiveMode {
                 clearOnShrink: this.settingsManager.getClearOnShrink(),
                 showTerminalProgress: this.settingsManager.getShowTerminalProgress(),
                 tuiMode: this.ui.mode,
+                fullscreenExitOutput: this.settingsManager.getFullscreenExitOutput(),
                 fullscreenScrollbar: this.settingsManager.getFullscreenScrollbar(),
                 warnings: this.settingsManager.getWarnings(),
             }, {
@@ -3739,7 +3947,7 @@ export class InteractiveMode {
                 },
                 onThemeChange: (themeSetting) => {
                     this.settingsManager.setTheme(themeSetting);
-                    void this.themeController.applyFromSettings();
+                    void this.themeController.setThemeSetting(themeSetting);
                 },
                 onThemePreview: (themeName) => this.themeController.preview(themeName),
                 onHideThinkingBlockChange: (hidden) => {
@@ -3841,6 +4049,9 @@ export class InteractiveMode {
                         this.statusContainer.clear();
                     this.showStatus(`TUI mode: ${mode}`);
                 },
+                onFullscreenExitOutputChange: (output) => {
+                    this.settingsManager.setFullscreenExitOutput(output);
+                },
                 onFullscreenScrollbarChange: (mode) => {
                     this.settingsManager.setFullscreenScrollbar(mode);
                     this.applyFullscreenScrollbarSetting();
@@ -3893,7 +4104,7 @@ export class InteractiveMode {
             controller.abort();
         }, 15_000);
         try {
-            const result = await this.session.modelRuntime.refresh({ signal: controller.signal });
+            const result = await refreshModelCatalogs(this.session.modelRuntime, controller.signal);
             if (result.aborted && timedOut) {
                 this.showWarning("Model refresh timed out; searching cached models.");
             }
@@ -3981,7 +4192,7 @@ export class InteractiveMode {
                 onSelect: (selection) => {
                     trustStore.setMany(selection.updates);
                     done();
-                    this.showStatus(`Saved trust decision: ${selection.trusted ? "trusted" : "untrusted"}. Restart pi for this to take effect.`);
+                    this.showStatus(`Saved trust decision: ${selection.trusted ? "trusted" : "untrusted"}. Restart ${APP_NAME} for this to take effect.`);
                 },
                 onCancel: () => {
                     done();
@@ -4081,8 +4292,7 @@ export class InteractiveMode {
                     this.ui.requestRender();
                 },
             });
-            void this.session.modelRuntime
-                .refresh({ signal: controller.signal })
+            void refreshModelCatalogs(this.session.modelRuntime, controller.signal)
                 .then((result) => {
                 if (disposed)
                     return;
@@ -4873,7 +5083,9 @@ export class InteractiveMode {
                 this.showStatus(`Session exported to: ${filePath}`);
             }
             else {
-                const filePath = await this.session.exportToHtml(outputPath);
+                const filePath = await this.session.exportToHtml(outputPath, {
+                    themeName: theme.name,
+                });
                 this.showStatus(`Session exported to: ${filePath}`);
             }
         }
@@ -5415,7 +5627,7 @@ export class InteractiveMode {
             // Ignore, will be emitted as an event
         }
     }
-    stop() {
+    stop(fullscreenExitOutput = this.settingsManager.getFullscreenExitOutput()) {
         this.disposeActiveSelector();
         if (this.settingsManager.getShowTerminalProgress()) {
             this.ui.terminal.setProgress(false);
@@ -5429,7 +5641,7 @@ export class InteractiveMode {
             this.unsubscribe();
         }
         if (this.isInitialized) {
-            this.stopInteractiveTui();
+            this.stopInteractiveTui(fullscreenExitOutput);
             this.isInitialized = false;
         }
         this.unregisterSignalHandlers();