@mariozechner/pi-coding-agent 0.45.7 → 0.47.0

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

@@ -7,9 +7,9 @@ import * as fs from "node:fs";
 import * as os from "node:os";
 import * as path from "node:path";
 import { getOAuthProviders, } from "@mariozechner/pi-ai";
-import { CombinedAutocompleteProvider, Container, fuzzyFilter, getEditorKeybindings, Loader, Markdown, matchesKey, ProcessTerminal, Spacer, Text, TruncatedText, TUI, visibleWidth, } from "@mariozechner/pi-tui";
+import { CombinedAutocompleteProvider, Container, fuzzyFilter, Loader, Markdown, matchesKey, ProcessTerminal, Spacer, Text, TruncatedText, TUI, visibleWidth, } from "@mariozechner/pi-tui";
 import { spawn, spawnSync } from "child_process";
-import { APP_NAME, getAuthPath, getDebugLogPath, isBunBinary, VERSION } from "../../config.js";
+import { APP_NAME, getAuthPath, getDebugLogPath, isBunBinary, isBunRuntime, VERSION } from "../../config.js";
 import { FooterDataProvider } from "../../core/footer-data-provider.js";
 import { KeybindingsManager } from "../../core/keybindings.js";
 import { createCompactionSummaryMessage } from "../../core/messages.js";
@@ -33,6 +33,7 @@ import { ExtensionEditorComponent } from "./components/extension-editor.js";
 import { ExtensionInputComponent } from "./components/extension-input.js";
 import { ExtensionSelectorComponent } from "./components/extension-selector.js";
 import { FooterComponent } from "./components/footer.js";
+import { appKey, appKeyHint, editorKey, keyHint, rawKeyHint } from "./components/keybinding-hints.js";
 import { LoginDialogComponent } from "./components/login-dialog.js";
 import { ModelSelectorComponent } from "./components/model-selector.js";
 import { OAuthSelectorComponent } from "./components/oauth-selector.js";
@@ -66,7 +67,7 @@ export class InteractiveMode {
     isInitialized = false;
     onInputCallback;
     loadingAnimation = undefined;
-    defaultWorkingMessage = "Working... (esc to interrupt)";
+    defaultWorkingMessage = "Working...";
     lastSigintTime = 0;
     lastEscapeTime = 0;
     changelogMarkdown = undefined;
@@ -135,7 +136,7 @@ export class InteractiveMode {
         this.statusContainer = new Container();
         this.widgetContainer = new Container();
         this.keybindings = KeybindingsManager.create();
-        this.defaultEditor = new CustomEditor(getEditorTheme(), this.keybindings);
+        this.defaultEditor = new CustomEditor(this.ui, getEditorTheme(), this.keybindings);
         this.editor = this.defaultEditor;
         this.editorContainer = new Container();
         this.editorContainer.addChild(this.editor);
@@ -231,82 +232,30 @@ export class InteractiveMode {
         this.setupAutocomplete(this.fdPath);
         // Add header with keybindings from config
         const logo = theme.bold(theme.fg("accent", APP_NAME)) + theme.fg("dim", ` v${this.version}`);
-        // Format keybinding for startup display (lowercase, compact)
-        const formatStartupKey = (keys) => {
-            const keyArray = Array.isArray(keys) ? keys : [keys];
-            return keyArray.join("/");
-        };
+        // Build startup instructions using keybinding hint helpers
         const kb = this.keybindings;
-        const interrupt = formatStartupKey(kb.getKeys("interrupt"));
-        const clear = formatStartupKey(kb.getKeys("clear"));
-        const exit = formatStartupKey(kb.getKeys("exit"));
-        const suspend = formatStartupKey(kb.getKeys("suspend"));
-        const deleteToLineEnd = formatStartupKey(getEditorKeybindings().getKeys("deleteToLineEnd"));
-        const cycleThinkingLevel = formatStartupKey(kb.getKeys("cycleThinkingLevel"));
-        const cycleModelForward = formatStartupKey(kb.getKeys("cycleModelForward"));
-        const cycleModelBackward = formatStartupKey(kb.getKeys("cycleModelBackward"));
-        const selectModel = formatStartupKey(kb.getKeys("selectModel"));
-        const expandTools = formatStartupKey(kb.getKeys("expandTools"));
-        const toggleThinking = formatStartupKey(kb.getKeys("toggleThinking"));
-        const externalEditor = formatStartupKey(kb.getKeys("externalEditor"));
-        const followUp = formatStartupKey(kb.getKeys("followUp"));
-        const dequeue = formatStartupKey(kb.getKeys("dequeue"));
-        const instructions = theme.fg("dim", interrupt) +
-            theme.fg("muted", " to interrupt") +
-            "\n" +
-            theme.fg("dim", clear) +
-            theme.fg("muted", " to clear") +
-            "\n" +
-            theme.fg("dim", `${clear} twice`) +
-            theme.fg("muted", " to exit") +
-            "\n" +
-            theme.fg("dim", exit) +
-            theme.fg("muted", " to exit (empty)") +
-            "\n" +
-            theme.fg("dim", suspend) +
-            theme.fg("muted", " to suspend") +
-            "\n" +
-            theme.fg("dim", deleteToLineEnd) +
-            theme.fg("muted", " to delete to end") +
-            "\n" +
-            theme.fg("dim", cycleThinkingLevel) +
-            theme.fg("muted", " to cycle thinking") +
-            "\n" +
-            theme.fg("dim", `${cycleModelForward}/${cycleModelBackward}`) +
-            theme.fg("muted", " to cycle models") +
-            "\n" +
-            theme.fg("dim", selectModel) +
-            theme.fg("muted", " to select model") +
-            "\n" +
-            theme.fg("dim", expandTools) +
-            theme.fg("muted", " to expand tools") +
-            "\n" +
-            theme.fg("dim", toggleThinking) +
-            theme.fg("muted", " to toggle thinking") +
-            "\n" +
-            theme.fg("dim", externalEditor) +
-            theme.fg("muted", " for external editor") +
-            "\n" +
-            theme.fg("dim", "/") +
-            theme.fg("muted", " for commands") +
-            "\n" +
-            theme.fg("dim", "!") +
-            theme.fg("muted", " to run bash") +
-            "\n" +
-            theme.fg("dim", "!!") +
-            theme.fg("muted", " to run bash (no context)") +
-            "\n" +
-            theme.fg("dim", followUp) +
-            theme.fg("muted", " to queue follow-up") +
-            "\n" +
-            theme.fg("dim", dequeue) +
-            theme.fg("muted", " to edit all queued messages") +
-            "\n" +
-            theme.fg("dim", "ctrl+v") +
-            theme.fg("muted", " to paste image") +
-            "\n" +
-            theme.fg("dim", "drop files") +
-            theme.fg("muted", " to attach");
+        const hint = (action, desc) => appKeyHint(kb, action, desc);
+        const instructions = [
+            hint("interrupt", "to interrupt"),
+            hint("clear", "to clear"),
+            rawKeyHint(`${appKey(kb, "clear")} twice`, "to exit"),
+            hint("exit", "to exit (empty)"),
+            hint("suspend", "to suspend"),
+            keyHint("deleteToLineEnd", "to delete to end"),
+            hint("cycleThinkingLevel", "to cycle thinking"),
+            rawKeyHint(`${appKey(kb, "cycleModelForward")}/${appKey(kb, "cycleModelBackward")}`, "to cycle models"),
+            hint("selectModel", "to select model"),
+            hint("expandTools", "to expand tools"),
+            hint("toggleThinking", "to toggle thinking"),
+            hint("externalEditor", "for external editor"),
+            rawKeyHint("/", "for commands"),
+            rawKeyHint("!", "to run bash"),
+            rawKeyHint("!!", "to run bash (no context)"),
+            hint("followUp", "to queue follow-up"),
+            hint("dequeue", "to edit all queued messages"),
+            hint("pasteImage", "to paste image"),
+            rawKeyHint("drop files", "to attach"),
+        ].join("\n");
         this.builtInHeader = new Text(`${logo}\n${instructions}`, 1, 0);
         // Setup UI layout
         this.ui.addChild(new Spacer(1));
@@ -493,6 +442,13 @@ export class InteractiveMode {
             this.chatContainer.addChild(new Text(theme.fg("warning", "Skill warnings:\n") + warningList, 0, 0));
             this.chatContainer.addChild(new Spacer(1));
         }
+        // Show loaded prompt templates
+        const templates = this.session.promptTemplates;
+        if (templates.length > 0) {
+            const templateList = templates.map((t) => theme.fg("dim", `  /${t.name} ${t.source}`)).join("\n");
+            this.chatContainer.addChild(new Text(theme.fg("muted", "Loaded prompt templates:\n") + templateList, 0, 0));
+            this.chatContainer.addChild(new Spacer(1));
+        }
         const extensionRunner = this.session.extensionRunner;
         if (!extensionRunner) {
             return; // No extensions loaded
@@ -793,7 +749,12 @@ export class InteractiveMode {
             setStatus: (key, text) => this.setExtensionStatus(key, text),
             setWorkingMessage: (message) => {
                 if (this.loadingAnimation) {
-                    this.loadingAnimation.setMessage(message ?? this.defaultWorkingMessage);
+                    if (message) {
+                        this.loadingAnimation.setMessage(message);
+                    }
+                    else {
+                        this.loadingAnimation.setMessage(`${this.defaultWorkingMessage} (${appKey(this.keybindings, "interrupt")} to interrupt)`);
+                    }
                 }
             },
             setWidget: (key, content) => this.setExtensionWidget(key, content),
@@ -916,7 +877,7 @@ export class InteractiveMode {
      */
     showExtensionEditor(title, prefill) {
         return new Promise((resolve) => {
-            this.extensionEditor = new ExtensionEditorComponent(this.ui, title, prefill, (value) => {
+            this.extensionEditor = new ExtensionEditorComponent(this.ui, this.keybindings, title, prefill, (value) => {
                 this.hideExtensionEditor();
                 resolve(value);
             }, () => {
@@ -1280,19 +1241,6 @@ export class InteractiveMode {
                 await this.shutdown();
                 return;
             }
-            // Handle skill commands (/skill:name [args])
-            if (text.startsWith("/skill:")) {
-                const spaceIndex = text.indexOf(" ");
-                const commandName = spaceIndex === -1 ? text.slice(1) : text.slice(1, spaceIndex);
-                const args = spaceIndex === -1 ? "" : text.slice(spaceIndex + 1).trim();
-                const skillPath = this.skillCommands.get(commandName);
-                if (skillPath) {
-                    this.editor.addToHistory?.(text);
-                    this.editor.setText("");
-                    await this.handleSkillCommand(skillPath, args);
-                    return;
-                }
-            }
             // Handle bash command (! for normal, !! for excluded from context)
             if (text.startsWith("!")) {
                 const isExcluded = text.startsWith("!!");
@@ -1508,7 +1456,7 @@ export class InteractiveMode {
                 // Show compacting indicator with reason
                 this.statusContainer.clear();
                 const reasonText = event.reason === "overflow" ? "Context overflow detected, " : "";
-                this.autoCompactionLoader = new Loader(this.ui, (spinner) => theme.fg("accent", spinner), (text) => theme.fg("muted", text), `${reasonText}Auto-compacting... (esc to cancel)`);
+                this.autoCompactionLoader = new Loader(this.ui, (spinner) => theme.fg("accent", spinner), (text) => theme.fg("muted", text), `${reasonText}Auto-compacting... (${appKey(this.keybindings, "interrupt")} to cancel)`);
                 this.statusContainer.addChild(this.autoCompactionLoader);
                 this.ui.requestRender();
                 break;
@@ -1555,7 +1503,7 @@ export class InteractiveMode {
                 // Show retry indicator
                 this.statusContainer.clear();
                 const delaySeconds = Math.round(event.delayMs / 1000);
-                this.retryLoader = new Loader(this.ui, (spinner) => theme.fg("warning", spinner), (text) => theme.fg("muted", text), `Retrying (${event.attempt}/${event.maxAttempts}) in ${delaySeconds}s... (esc to cancel)`);
+                this.retryLoader = new Loader(this.ui, (spinner) => theme.fg("warning", spinner), (text) => theme.fg("muted", text), `Retrying (${event.attempt}/${event.maxAttempts}) in ${delaySeconds}s... (${appKey(this.keybindings, "interrupt")} to cancel)`);
                 this.statusContainer.addChild(this.retryLoader);
                 this.ui.requestRender();
                 break;
@@ -1789,6 +1737,9 @@ export class InteractiveMode {
                 type: "session_shutdown",
             });
         }
+        // Wait for any pending renders to complete
+        // requestRender() uses process.nextTick(), so we wait one tick
+        await new Promise((resolve) => process.nextTick(resolve));
         this.stop();
         process.exit(0);
     }
@@ -1971,11 +1922,10 @@ export class InteractiveMode {
         this.ui.requestRender();
     }
     showNewVersionNotification(newVersion) {
-        const updateInstruction = isBunBinary
-            ? theme.fg("muted", `New version ${newVersion} is available. Download from: `) +
-                theme.fg("accent", "https://github.com/badlogic/pi-mono/releases/latest")
-            : theme.fg("muted", `New version ${newVersion} is available. Run: `) +
-                theme.fg("accent", "npm install -g @mariozechner/pi-coding-agent");
+        const action = isBunBinary
+            ? `Download from: ${theme.fg("accent", "https://github.com/badlogic/pi-mono/releases/latest")}`
+            : `Run: ${theme.fg("accent", `${isBunRuntime ? "bun" : "npm"} install -g @mariozechner/pi-coding-agent`)}`;
+        const updateInstruction = theme.fg("muted", `New version ${newVersion} is available. `) + action;
         this.chatContainer.addChild(new Spacer(1));
         this.chatContainer.addChild(new DynamicBorder((text) => theme.fg("warning", text)));
         this.chatContainer.addChild(new Text(`${theme.bold(theme.fg("warning", "Update Available"))}\n${updateInstruction}`, 1, 0));
@@ -2503,7 +2453,7 @@ export class InteractiveMode {
                         this.session.abortBranchSummary();
                     };
                     this.chatContainer.addChild(new Spacer(1));
-                    summaryLoader = new Loader(this.ui, (spinner) => theme.fg("accent", spinner), (text) => theme.fg("muted", text), "Summarizing branch... (esc to cancel)");
+                    summaryLoader = new Loader(this.ui, (spinner) => theme.fg("accent", spinner), (text) => theme.fg("muted", text), `Summarizing branch... (${appKey(this.keybindings, "interrupt")} to cancel)`);
                     this.statusContainer.addChild(summaryLoader);
                     this.ui.requestRender();
                 }
@@ -2863,18 +2813,6 @@ export class InteractiveMode {
         this.chatContainer.addChild(new Text(info, 1, 0));
         this.ui.requestRender();
     }
-    async handleSkillCommand(skillPath, args) {
-        try {
-            const content = fs.readFileSync(skillPath, "utf-8");
-            // Strip YAML frontmatter if present
-            const body = content.replace(/^---\n[\s\S]*?\n---\n/, "").trim();
-            const message = args ? `${body}\n\n---\n\nUser: ${args}` : body;
-            await this.session.prompt(message);
-        }
-        catch (err) {
-            this.showError(`Failed to load skill: ${err instanceof Error ? err.message : String(err)}`);
-        }
-    }
     handleChangelogCommand() {
         const changelogPath = getChangelogPath();
         const allEntries = parseChangelog(changelogPath);
@@ -2893,30 +2831,28 @@ export class InteractiveMode {
         this.ui.requestRender();
     }
     /**
-     * Format keybindings for display (e.g., "ctrl+c" -> "Ctrl+C").
+     * Capitalize keybinding for display (e.g., "ctrl+c" -> "Ctrl+C").
      */
-    formatKeyDisplay(keys) {
-        const keyArray = Array.isArray(keys) ? keys : [keys];
-        return keyArray
-            .map((key) => key
+    capitalizeKey(key) {
+        return key
+            .split("/")
+            .map((k) => k
             .split("+")
             .map((part) => part.charAt(0).toUpperCase() + part.slice(1))
             .join("+"))
             .join("/");
     }
     /**
-     * Get display string for an app keybinding action.
+     * Get capitalized display string for an app keybinding action.
      */
     getAppKeyDisplay(action) {
-        const display = this.keybindings.getDisplayString(action);
-        return this.formatKeyDisplay(display);
+        return this.capitalizeKey(appKey(this.keybindings, action));
     }
     /**
-     * Get display string for an editor keybinding action.
+     * Get capitalized display string for an editor keybinding action.
      */
     getEditorKeyDisplay(action) {
-        const keys = getEditorKeybindings().getKeys(action);
-        return this.formatKeyDisplay(keys);
+        return this.capitalizeKey(editorKey(action));
     }
     handleHotkeysCommand() {
         // Navigation keybindings
@@ -3146,7 +3082,8 @@ export class InteractiveMode {
         };
         // Show compacting status
         this.chatContainer.addChild(new Spacer(1));
-        const label = isAuto ? "Auto-compacting context... (esc to cancel)" : "Compacting context... (esc to cancel)";
+        const cancelHint = `(${appKey(this.keybindings, "interrupt")} to cancel)`;
+        const label = isAuto ? `Auto-compacting context... ${cancelHint}` : `Compacting context... ${cancelHint}`;
         const compactingLoader = new Loader(this.ui, (spinner) => theme.fg("accent", spinner), (text) => theme.fg("muted", text), label);
         this.statusContainer.addChild(compactingLoader);
         this.ui.requestRender();