@elyracode/coding-agent 0.5.6 → 0.5.8

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

@@ -9,7 +9,7 @@ import * as path from "node:path";
 import { getProviders, } from "@elyracode/ai";
 import { CombinedAutocompleteProvider, Container, fuzzyFilter, Loader, Markdown, matchesKey, ProcessTerminal, Spacer, setKeybindings, Text, TruncatedText, TUI, visibleWidth, } from "@elyracode/tui";
 import { spawn, spawnSync } from "child_process";
-import { APP_NAME, APP_TITLE, getAgentDir, getAuthPath, getDebugLogPath, getDocsPath, getShareViewerUrl, VERSION, } from "../../config.js";
+import { APP_NAME, APP_TITLE, getAgentDir, getAuthPath, getBlueprintsDir, getDebugLogPath, getDocsPath, getProjectBlueprintsDir, getShareViewerUrl, VERSION, } from "../../config.js";
 import { parseSkillBlock } from "../../core/agent-session.js";
 import { SessionImportFileNotFoundError } from "../../core/agent-session-runtime.js";
 import { FooterDataProvider } from "../../core/footer-data-provider.js";
@@ -54,6 +54,7 @@ import { SessionSelectorComponent } from "./components/session-selector.js";
 import { SettingsSelectorComponent } from "./components/settings-selector.js";
 import { SkillInvocationMessageComponent } from "./components/skill-invocation-message.js";
 import { StartupAnimation } from "./components/startup-animation.js";
+import { ThemeSelectorComponent } from "./components/theme-selector.js";
 import { ToolExecutionComponent } from "./components/tool-execution.js";
 import { TreeSelectorComponent } from "./components/tree-selector.js";
 import { UserMessageComponent } from "./components/user-message.js";
@@ -310,6 +311,21 @@ export class InteractiveMode {
                 }));
             };
         }
+        const themeCommand = slashCommands.find((command) => command.name === "theme");
+        if (themeCommand) {
+            themeCommand.getArgumentCompletions = (prefix) => {
+                const themes = getAvailableThemes();
+                const currentTheme = this.settingsManager.getTheme() || "dark";
+                const filtered = themes.filter((t) => t.toLowerCase().includes(prefix.toLowerCase()));
+                if (filtered.length === 0)
+                    return null;
+                return filtered.map((t) => ({
+                    value: t,
+                    label: t,
+                    description: t === currentTheme ? "(current)" : undefined,
+                }));
+            };
+        }
         // Convert prompt templates to SlashCommand format for autocomplete
         const templateCommands = this.session.promptTemplates.map((cmd) => ({
             name: cmd.name,
@@ -1930,6 +1946,42 @@ export class InteractiveMode {
                 this.editor.setText("");
                 return;
             }
+            if (text === "/cost") {
+                this.editor.setText("");
+                this.handleCostCommand();
+                return;
+            }
+            if (text === "/diff") {
+                this.editor.setText("");
+                await this.handleDiffCommand();
+                return;
+            }
+            if (text === "/pin" || text.startsWith("/pin ")) {
+                this.editor.setText("");
+                this.handlePinCommand(text.startsWith("/pin ") ? text.slice(5).trim() : undefined);
+                return;
+            }
+            if (text === "/unpin" || text.startsWith("/unpin ")) {
+                this.editor.setText("");
+                this.handleUnpinCommand(text.startsWith("/unpin ") ? text.slice(7).trim() : undefined);
+                return;
+            }
+            if (text === "/pins") {
+                this.editor.setText("");
+                this.handlePinsCommand();
+                return;
+            }
+            if (text === "/blueprint" || text.startsWith("/blueprint ")) {
+                this.editor.setText("");
+                this.handleBlueprintCommand(text.startsWith("/blueprint ") ? text.slice(11).trim() : undefined);
+                return;
+            }
+            if (text === "/theme" || text.startsWith("/theme ")) {
+                const themeName = text.startsWith("/theme ") ? text.slice(7).trim() : undefined;
+                this.editor.setText("");
+                this.handleThemeCommand(themeName);
+                return;
+            }
             if (text === "/scoped-models") {
                 this.editor.setText("");
                 await this.showModelsSelector();
@@ -3237,6 +3289,222 @@ export class InteractiveMode {
             return { component: selector, focus: selector.getSettingsList() };
         });
     }
+    handleCostCommand() {
+        const stats = this.session.getSessionStats();
+        const fmt = (n) => n.toLocaleString();
+        const cost = stats.cost > 0 ? `$${stats.cost.toFixed(4)}` : "$0.00";
+        let info = `${theme.bold("Session Cost")}\n\n`;
+        info += `${theme.fg("dim", "Input:")}     ${fmt(stats.tokens.input)} tokens\n`;
+        info += `${theme.fg("dim", "Output:")}    ${fmt(stats.tokens.output)} tokens\n`;
+        info += `${theme.fg("dim", "Cache read:")} ${fmt(stats.tokens.cacheRead)} tokens\n`;
+        info += `${theme.fg("dim", "Cache write:")} ${fmt(stats.tokens.cacheWrite)} tokens\n`;
+        info += `${theme.fg("dim", "Total:")}     ${fmt(stats.tokens.total)} tokens\n\n`;
+        info += `${theme.fg("dim", "Estimated cost:")} ${theme.fg("accent", cost)}\n`;
+        if (stats.contextUsage) {
+            const ctxTokens = stats.contextUsage.tokens ?? 0;
+            const pct = stats.contextUsage.contextWindow > 0 ? Math.round((ctxTokens / stats.contextUsage.contextWindow) * 100) : 0;
+            info += `${theme.fg("dim", "Context:")}   ${fmt(ctxTokens)} / ${fmt(stats.contextUsage.contextWindow)} (${pct}%)`;
+        }
+        this.chatContainer.addChild(new Spacer(1));
+        this.chatContainer.addChild(new Text(info, 1, 0));
+        this.ui.requestRender();
+    }
+    async handleDiffCommand() {
+        const cwd = this.sessionManager.getCwd();
+        try {
+            const { execSync } = await import("node:child_process");
+            const diff = execSync("git diff", { cwd, encoding: "utf-8", maxBuffer: 1024 * 1024 });
+            if (!diff.trim()) {
+                this.showStatus("No uncommitted changes");
+                return;
+            }
+            this.chatContainer.addChild(new Spacer(1));
+            this.chatContainer.addChild(new DynamicBorder());
+            this.chatContainer.addChild(new Text(theme.bold(theme.fg("accent", "Uncommitted Changes")), 1, 0));
+            this.chatContainer.addChild(new Spacer(1));
+            this.chatContainer.addChild(new Markdown(`\`\`\`diff\n${diff}\n\`\`\``, 1, 1, this.getMarkdownThemeWithSettings()));
+            this.chatContainer.addChild(new DynamicBorder());
+            this.ui.requestRender();
+        }
+        catch {
+            this.showError("Failed to run git diff. Is this a git repository?");
+        }
+    }
+    handlePinCommand(filePath) {
+        if (!filePath) {
+            this.showError("Usage: /pin <file-path>");
+            return;
+        }
+        const cwd = this.sessionManager.getCwd();
+        const resolved = path.resolve(cwd, filePath);
+        if (!fs.existsSync(resolved)) {
+            this.showError(`File not found: ${filePath}`);
+            return;
+        }
+        const rel = path.relative(cwd, resolved);
+        this.settingsManager.addPinnedFile(rel);
+        this.showStatus(`Pinned: ${rel}`);
+    }
+    handleUnpinCommand(filePath) {
+        if (!filePath) {
+            this.showError("Usage: /unpin <file-path>");
+            return;
+        }
+        const cwd = this.sessionManager.getCwd();
+        const rel = path.relative(cwd, path.resolve(cwd, filePath));
+        const pinned = this.settingsManager.getPinnedFiles();
+        if (!pinned.includes(rel)) {
+            this.showError(`Not pinned: ${rel}`);
+            return;
+        }
+        this.settingsManager.removePinnedFile(rel);
+        this.showStatus(`Unpinned: ${rel}`);
+    }
+    handlePinsCommand() {
+        const pinned = this.settingsManager.getPinnedFiles();
+        if (pinned.length === 0) {
+            this.showStatus("No pinned files");
+            return;
+        }
+        let info = `${theme.bold("Pinned Files")}\n\n`;
+        for (const file of pinned) {
+            info += `  ${theme.fg("accent", file)}\n`;
+        }
+        info += `\n${theme.fg("dim", `${pinned.length} file(s) pinned to context`)}`;
+        this.chatContainer.addChild(new Spacer(1));
+        this.chatContainer.addChild(new Text(info, 1, 0));
+        this.ui.requestRender();
+    }
+    handleBlueprintCommand(name) {
+        const cwd = this.sessionManager.getCwd();
+        const dirs = [getProjectBlueprintsDir(cwd), getBlueprintsDir()];
+        const blueprints = new Map();
+        for (const dir of dirs) {
+            if (!fs.existsSync(dir))
+                continue;
+            for (const entry of fs.readdirSync(dir, { withFileTypes: true })) {
+                if (!entry.isFile() || !entry.name.endsWith(".md"))
+                    continue;
+                const bpName = entry.name.slice(0, -3);
+                if (!blueprints.has(bpName)) {
+                    blueprints.set(bpName, path.resolve(dir, entry.name));
+                }
+            }
+        }
+        if (!name) {
+            if (blueprints.size === 0) {
+                this.showStatus("No blueprints found. Add .md files to .elyra/blueprints/ or ~/.elyra/agent/blueprints/");
+                return;
+            }
+            let info = `${theme.bold("Available Blueprints")}\n\n`;
+            for (const [bpName] of blueprints) {
+                info += `  ${theme.fg("accent", bpName)}\n`;
+            }
+            info += `\n${theme.fg("dim", "Usage: /blueprint <name>")}`;
+            this.chatContainer.addChild(new Spacer(1));
+            this.chatContainer.addChild(new Text(info, 1, 0));
+            this.ui.requestRender();
+            return;
+        }
+        const bpPath = blueprints.get(name);
+        if (!bpPath) {
+            const available = Array.from(blueprints.keys()).join(", ");
+            this.showError(`Blueprint not found: "${name}". Available: ${available || "none"}`);
+            return;
+        }
+        try {
+            const content = fs.readFileSync(bpPath, "utf-8");
+            // Parse optional YAML frontmatter
+            let body = content;
+            const pins = [];
+            if (content.startsWith("---\n")) {
+                const endIdx = content.indexOf("\n---\n", 4);
+                if (endIdx !== -1) {
+                    const frontmatter = content.slice(4, endIdx);
+                    body = content.slice(endIdx + 5);
+                    for (const line of frontmatter.split("\n")) {
+                        const pinMatch = line.match(/^pin:\s*(.+)$/);
+                        if (pinMatch) {
+                            pins.push(...pinMatch[1]
+                                .split(",")
+                                .map((s) => s.trim())
+                                .filter(Boolean));
+                        }
+                        const pinsMatch = line.match(/^pins:\s*\[(.+)\]$/);
+                        if (pinsMatch) {
+                            pins.push(...pinsMatch[1]
+                                .split(",")
+                                .map((s) => s.trim().replace(/^["']|["']$/g, ""))
+                                .filter(Boolean));
+                        }
+                    }
+                }
+            }
+            // Apply pins from frontmatter
+            for (const pin of pins) {
+                const resolved = path.resolve(cwd, pin);
+                if (fs.existsSync(resolved)) {
+                    const rel = path.relative(cwd, resolved);
+                    this.settingsManager.addPinnedFile(rel);
+                }
+            }
+            // Send blueprint content as user message to the agent
+            this.session.prompt(body.trim());
+            const pinMsg = pins.length > 0 ? ` (pinned ${pins.length} file(s))` : "";
+            this.showStatus(`Blueprint: ${name}${pinMsg}`);
+        }
+        catch {
+            this.showError(`Failed to read blueprint: ${bpPath}`);
+        }
+    }
+    handleThemeCommand(themeName) {
+        if (!themeName) {
+            this.showThemeSelector();
+            return;
+        }
+        const available = getAvailableThemes();
+        if (!available.includes(themeName)) {
+            this.showError(`Unknown theme: "${themeName}". Available: ${available.join(", ")}`);
+            return;
+        }
+        const result = setTheme(themeName, true);
+        this.settingsManager.setTheme(themeName);
+        this.ui.invalidate();
+        if (result.success) {
+            this.showStatus(`Theme: ${themeName}`);
+        }
+        else {
+            this.showError(`Failed to load theme "${themeName}": ${result.error}\nFell back to dark theme.`);
+        }
+    }
+    showThemeSelector() {
+        const currentTheme = this.settingsManager.getTheme() || "dark";
+        const previousTheme = currentTheme;
+        this.showSelector((done) => {
+            const selector = new ThemeSelectorComponent(currentTheme, (themeName) => {
+                const result = setTheme(themeName, true);
+                this.settingsManager.setTheme(themeName);
+                this.ui.invalidate();
+                done();
+                if (!result.success) {
+                    this.showError(`Failed to load theme "${themeName}": ${result.error}\nFell back to dark theme.`);
+                }
+            }, () => {
+                // Cancel: restore previous theme
+                setTheme(previousTheme, true);
+                this.ui.invalidate();
+                done();
+            }, (themeName) => {
+                // Preview on hover
+                const result = setTheme(themeName, true);
+                if (result.success) {
+                    this.ui.invalidate();
+                    this.ui.requestRender();
+                }
+            });
+            return { component: selector, focus: selector.getSelectList() };
+        });
+    }
     async handleModelCommand(searchTerm) {
         if (!searchTerm) {
             this.showModelSelector();