@mrquake/quakecode-cli 0.64.4 → 0.64.6

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

@@ -42,6 +42,7 @@ import { ModelSelectorComponent } from "./components/model-selector.js";
 import { OAuthSelectorComponent } from "./components/oauth-selector.js";
 import { ScopedModelsSelectorComponent } from "./components/scoped-models-selector.js";
 import { SessionSelectorComponent } from "./components/session-selector.js";
+import { SessionTabsComponent } from "./components/session-tabs.js";
 import { SettingsSelectorComponent } from "./components/settings-selector.js";
 import { SkillInvocationMessageComponent } from "./components/skill-invocation-message.js";
 import { ToolExecutionComponent } from "./components/tool-execution.js";
@@ -161,6 +162,8 @@ export class InteractiveMode {
         this.defaultEditor = new CustomEditor(this.ui, getEditorTheme(), this.keybindings, {
             paddingX: editorPaddingX,
             autocompleteMaxVisible,
+            noBorders: true,
+            prompt: theme.bold(theme.fg("accent", "› ")),
         });
         this.editor = this.defaultEditor;
         this.editorContainer = new Container();
@@ -291,14 +294,16 @@ export class InteractiveMode {
         this.fdPath = fdPath;
         // Add header container as first child
         this.ui.addChild(this.headerContainer);
+        this.headerContainer.addChild(new SessionTabsComponent(() => this.getSessionTabLabel(), () => DISPLAY_NAME));
+        this.headerContainer.addChild(new Spacer(1));
         // Add header with keybindings from config (unless silenced)
         if (this.options.verbose || !this.settingsManager.getQuietStartup()) {
             const currentModel = this.session.model?.id ?? "no model";
             const cwd = this.sessionManager.getCwd();
             const owner = os.userInfo().username;
             const title = `${DISPLAY_NAME} v${this.version}`;
-            const leftInner = 34;
-            const maxTotalWidth = Math.max(118, Math.min(this.ui.terminal.columns - 6, 168));
+            const leftInner = 44;
+            const maxTotalWidth = Math.max(128, Math.min(this.ui.terminal.columns - 6, 172));
             const rightInner = maxTotalWidth - leftInner - 7;
             const totalWidth = leftInner + rightInner + 7;
             const border = (s) => theme.fg("borderAccent", s);
@@ -412,17 +417,21 @@ export class InteractiveMode {
         // Initialize available provider count for footer display
         await this.updateAvailableProviderCount();
     }
-    /**
-     * Update terminal title with session name and cwd.
-     */
+    getSessionTabLabel() {
+        return this.sessionManager.getSessionName() || path.basename(this.sessionManager.getCwd()) || "new session";
+    }
     updateTerminalTitle() {
-        const cwdBasename = path.basename(this.sessionManager.getCwd());
         const sessionName = this.sessionManager.getSessionName();
-        if (sessionName) {
-            this.ui.terminal.setTitle(`${DISPLAY_NAME} - ${sessionName} - ${cwdBasename}`);
+        const title = sessionName ? `${DISPLAY_NAME} - ${sessionName}` : DISPLAY_NAME;
+        // Add spinner if agent is thinking or working
+        const isActive = this.session.agent.state.isStreaming || this.session.agent.state.pendingToolCalls.size > 0;
+        if (isActive) {
+            const frames = ["⠋", "⠙", "⠹", "⠸", "⠼", "⠴", "⠦", "⠧", "⠇", "⠏"];
+            const frame = frames[Math.floor(Date.now() / 100) % frames.length];
+            this.ui.terminal.setTitle(`${frame} ${title}`);
         }
         else {
-            this.ui.terminal.setTitle(`${DISPLAY_NAME} - ${cwdBasename}`);
+            this.ui.terminal.setTitle(title);
         }
     }
     /**
@@ -449,6 +458,13 @@ export class InteractiveMode {
                 this.showWarning(warning);
             }
         });
+        // Start thinking/working animation loop for terminal title
+        setInterval(() => {
+            const state = this.session.agent.state;
+            if (state.isStreaming || state.pendingToolCalls.size > 0) {
+                this.updateTerminalTitle();
+            }
+        }, 100);
         // Show startup warnings
         const { migratedProviders, modelFallbackMessage, initialMessage, initialImages, initialMessages } = this.options;
         if (migratedProviders && migratedProviders.length > 0) {
@@ -1895,7 +1911,27 @@ export class InteractiveMode {
                     this.loadingAnimation.stop();
                 }
                 this.statusContainer.clear();
-                this.loadingAnimation = new Loader(this.ui, (spinner) => theme.fg("accent", spinner), (text) => theme.fg("muted", text), this.defaultWorkingMessage);
+                // Create loading animation with "shimmer" effect support
+                this.loadingAnimation = new Loader(this.ui, (spinner) => theme.fg("accent", spinner), (text) => {
+                    // Custom "shimmer" effect for the working message text
+                    const chars = text.split("");
+                    if (chars.length === 0)
+                        return "";
+                    const sweepSeconds = 2.0;
+                    const padding = 10;
+                    const period = chars.length + padding * 2;
+                    const posF = ((Date.now() / 1000) % sweepSeconds) / sweepSeconds * period;
+                    const pos = Math.floor(posF);
+                    const bandHalfWidth = 5;
+                    return chars.map((ch, i) => {
+                        const dist = Math.abs(i + padding - pos);
+                        if (dist <= bandHalfWidth) {
+                            // Glow effect: Bold + Accent color
+                            return theme.bold(theme.fg("accent", ch));
+                        }
+                        return theme.fg("muted", ch);
+                    }).join("");
+                }, this.defaultWorkingMessage);
                 this.statusContainer.addChild(this.loadingAnimation);
                 // Apply any pending working message queued before loader existed
                 if (this.pendingWorkingMessage !== undefined) {