@ebowwa/coder 0.7.63 → 0.7.64

package/packages/src/interfaces/ui/spinner.ts

@@ -0,0 +1,451 @@
+/**
+ * Spinner Component for Coder CLI
+ *
+ * Re-exports spinner frames from tui/spinner.ts for backward compatibility.
+ */
+
+import ora, { type Ora } from "ora";
+import chalk from "chalk";
+
+// Import spinner frames from the single source of truth
+import {
+  spinnerFrames,
+  dotSpinnerFrames,
+  asciiSpinnerFrames,
+  arrowSpinnerFrames,
+  simpleDotFrames,
+} from "./terminal/tui/spinner.js";
+
+// Re-export for external use
+export {
+  spinnerFrames,
+  dotSpinnerFrames,
+  asciiSpinnerFrames,
+  arrowSpinnerFrames,
+  simpleDotFrames,
+};
+
+// Legacy aliases for backward compatibility
+export const defaultFrames = spinnerFrames;
+export const dotFrames = simpleDotFrames;
+export const arrowFrames = arrowSpinnerFrames;
+
+// ============================================
+// TYPES
+// ============================================
+
+export interface SpinnerOptions {
+  /** Tip text shown below spinner */
+  tip?: string;
+  /** Color override */
+  color?: SpinnerColor;
+  /** Show elapsed time */
+  showTime?: boolean;
+  /** Tool activity indicator */
+  hasActiveTools?: boolean;
+  /** Suffix text after spinner */
+  suffix?: string;
+  /** Verbose mode - show more details */
+  verbose?: boolean;
+  /** Spinner text prefix */
+  prefix?: string;
+  /** Disable spinner (for --no-progress) */
+  disabled?: boolean;
+}
+
+export type SpinnerColor =
+  | "cyan"
+  | "green"
+  | "yellow"
+  | "blue"
+  | "magenta"
+  | "red"
+  | "white"
+  | "gray";
+
+export interface SpinnerState {
+  isSpinning: boolean;
+  startTime: number;
+  totalPausedMs: number;
+  pauseStartTime: number | null;
+  currentTip: string;
+  responseLength: number;
+}
+
+// ============================================
+// SPINNER TIPS
+// ============================================
+
+/** Rotating tips shown during loading */
+export const defaultTips = [
+  "Thinking...",
+  "Processing...",
+  "Analyzing...",
+  "Working on it...",
+];
+
+/** Tips shown during tool execution */
+export const toolTips = [
+  "Executing tool...",
+  "Running command...",
+  "Processing request...",
+  "Working...",
+];
+
+/** Tips shown during API streaming */
+export const streamingTips = [
+  "Receiving response...",
+  "Streaming...",
+  "Getting results...",
+];
+
+// ============================================
+// SPINNER CLASS
+// ============================================
+
+export class Spinner {
+  private ora: Ora | null = null;
+  private state: SpinnerState;
+  private options: SpinnerOptions;
+  private tipInterval: Timer | null = null;
+  private tipIndex = 0;
+  private customTips: string[] = [];
+
+  constructor(options: SpinnerOptions = {}) {
+    this.options = {
+      color: "cyan",
+      showTime: true,
+      ...options,
+    };
+
+    this.state = {
+      isSpinning: false,
+      startTime: 0,
+      totalPausedMs: 0,
+      pauseStartTime: null,
+      currentTip: options.tip || "",
+      responseLength: 0,
+    };
+  }
+
+  /**
+   * Start the spinner
+   */
+  start(text?: string): this {
+    if (this.options.disabled || this.state.isSpinning) {
+      return this;
+    }
+
+    this.state.startTime = Date.now();
+    this.state.isSpinning = true;
+
+    const spinnerText = this.buildText(text || this.state.currentTip);
+
+    this.ora = ora({
+      text: spinnerText,
+      spinner: {
+        frames: [...spinnerFrames], // Convert readonly tuple to mutable array
+        interval: 80,
+      },
+      color: this.options.color,
+      prefixText: this.options.prefix,
+    }).start();
+
+    // Start rotating tips if enabled
+    if (!this.options.tip && this.customTips.length === 0) {
+      this.startTipRotation();
+    }
+
+    return this;
+  }
+
+  /**
+   * Stop the spinner
+   */
+  stop(options?: { clear?: boolean; text?: string; symbol?: string }): this {
+    if (!this.ora || !this.state.isSpinning) {
+      return this;
+    }
+
+    this.stopTipRotation();
+
+    if (options?.text) {
+      if (options?.symbol) {
+        this.ora.stopAndPersist({ symbol: options.symbol, text: options.text });
+      } else {
+        this.ora.succeed(options.text);
+      }
+    } else if (options?.clear) {
+      this.ora.stop();
+    } else {
+      this.ora.stop();
+    }
+
+    this.state.isSpinning = false;
+    this.ora = null;
+
+    return this;
+  }
+
+  /**
+   * Stop with success message
+   */
+  succeed(text?: string): this {
+    return this.stop({ text, symbol: chalk.green("✓") });
+  }
+
+  /**
+   * Stop with failure message
+   */
+  fail(text?: string): this {
+    return this.stop({ text, symbol: chalk.red("✗") });
+  }
+
+  /**
+   * Stop with warning message
+   */
+  warn(text?: string): this {
+    return this.stop({ text, symbol: chalk.yellow("⚠") });
+  }
+
+  /**
+   * Stop with info message
+   */
+  info(text?: string): this {
+    return this.stop({ text, symbol: chalk.blue("ℹ") });
+  }
+
+  /**
+   * Update spinner text
+   */
+  update(text: string): this {
+    if (this.ora && this.state.isSpinning) {
+      this.state.currentTip = text;
+      this.ora.text = this.buildText(text);
+    }
+    return this;
+  }
+
+  /**
+   * Update the tip text (shown below main text)
+   */
+  updateTip(tip: string): this {
+    this.stopTipRotation();
+    this.state.currentTip = tip;
+    if (this.ora && this.state.isSpinning) {
+      this.ora.text = this.buildText(this.state.currentTip);
+    }
+    return this;
+  }
+
+  /**
+   * Set custom tips for rotation
+   */
+  setTips(tips: string[]): this {
+    this.customTips = tips;
+    return this;
+  }
+
+  /**
+   * Update response length (for streaming progress)
+   */
+  updateResponseLength(length: number): this {
+    this.state.responseLength = length;
+    if (this.ora && this.state.isSpinning && this.options.verbose) {
+      this.ora.text = this.buildText(this.state.currentTip);
+    }
+    return this;
+  }
+
+  /**
+   * Set tool activity state
+   */
+  setToolActivity(active: boolean): this {
+    this.options.hasActiveTools = active;
+    if (this.ora && this.state.isSpinning) {
+      this.ora.text = this.buildText(this.state.currentTip);
+    }
+    return this;
+  }
+
+  /**
+   * Pause spinner (for user input, etc.)
+   */
+  pause(): this {
+    if (this.state.isSpinning && !this.state.pauseStartTime) {
+      this.state.pauseStartTime = Date.now();
+      if (this.ora) {
+        this.ora.stop();
+      }
+    }
+    return this;
+  }
+
+  /**
+   * Resume spinner after pause
+   */
+  resume(): this {
+    if (this.state.pauseStartTime) {
+      this.state.totalPausedMs += Date.now() - this.state.pauseStartTime;
+      this.state.pauseStartTime = null;
+      if (this.ora) {
+        this.ora.start();
+      }
+    }
+    return this;
+  }
+
+  /**
+   * Get elapsed time in seconds (excluding pauses)
+   */
+  getElapsedSeconds(): number {
+    const now = Date.now();
+    let elapsed = now - this.state.startTime - this.state.totalPausedMs;
+
+    // Subtract current pause if active
+    if (this.state.pauseStartTime) {
+      elapsed -= now - this.state.pauseStartTime;
+    }
+
+    return Math.floor(elapsed / 1000);
+  }
+
+  /**
+   * Get current state
+   */
+  getState(): SpinnerState {
+    return { ...this.state };
+  }
+
+  /**
+   * Check if spinner is active
+   */
+  isActive(): boolean {
+    return this.state.isSpinning;
+  }
+
+  /**
+   * Clear the spinner line
+   */
+  clear(): this {
+    if (this.ora) {
+      this.ora.clear();
+    }
+    return this;
+  }
+
+  /**
+   * Render spinner frame manually (for non-TTY)
+   */
+  renderFrame(): string {
+    const frame = spinnerFrames[this.tipIndex % spinnerFrames.length];
+    return `${frame} ${this.state.currentTip}`;
+  }
+
+  // ============================================
+  // PRIVATE METHODS
+  // ============================================
+
+  private buildText(baseText: string): string {
+    let text = baseText;
+
+    // Add suffix
+    if (this.options.suffix) {
+      text = `${text} ${this.options.suffix}`;
+    }
+
+    // Add elapsed time
+    if (this.options.showTime && this.state.startTime > 0) {
+      const elapsed = this.getElapsedSeconds();
+      if (elapsed > 0) {
+        text = `${text} ${chalk.gray(`[${formatTime(elapsed)}]`)}`;
+      }
+    }
+
+    // Add tool indicator
+    if (this.options.hasActiveTools) {
+      text = `${chalk.yellow("⚙")} ${text}`;
+    }
+
+    // Add response length in verbose mode
+    if (this.options.verbose && this.state.responseLength > 0) {
+      text = `${text} ${chalk.gray(`(${formatBytes(this.state.responseLength)})`)}`;
+    }
+
+    return text;
+  }
+
+  private startTipRotation(): void {
+    const tips = this.customTips.length > 0 ? this.customTips : defaultTips;
+    this.tipIndex = 0;
+
+    this.tipInterval = setInterval(() => {
+      this.tipIndex = (this.tipIndex + 1) % tips.length;
+      if (this.ora && this.state.isSpinning) {
+        this.ora.text = this.buildText(tips[this.tipIndex] ?? "");
+      }
+    }, 2000);
+  }
+
+  private stopTipRotation(): void {
+    if (this.tipInterval) {
+      clearInterval(this.tipInterval);
+      this.tipInterval = null;
+    }
+  }
+}
+
+// ============================================
+// HELPER FUNCTIONS
+// ============================================
+
+/**
+ * Format seconds to human-readable time
+ */
+function formatTime(seconds: number): string {
+  if (seconds < 60) {
+    return `${seconds}s`;
+  }
+  const mins = Math.floor(seconds / 60);
+  const secs = seconds % 60;
+  return `${mins}m${secs}s`;
+}
+
+/**
+ * Format bytes to human-readable size
+ */
+function formatBytes(bytes: number): string {
+  if (bytes < 1024) {
+    return `${bytes}B`;
+  }
+  if (bytes < 1024 * 1024) {
+    return `${(bytes / 1024).toFixed(1)}KB`;
+  }
+  return `${(bytes / (1024 * 1024)).toFixed(1)}MB`;
+}
+
+// ============================================
+// SINGLETON INSTANCE
+// ============================================
+
+let globalSpinner: Spinner | null = null;
+
+/**
+ * Get or create global spinner instance
+ */
+export function getSpinner(options?: SpinnerOptions): Spinner {
+  if (!globalSpinner) {
+    globalSpinner = new Spinner(options);
+  }
+  return globalSpinner;
+}
+
+/**
+ * Reset global spinner (for testing)
+ */
+export function resetSpinner(): void {
+  if (globalSpinner) {
+    globalSpinner.stop({ clear: true });
+    globalSpinner = null;
+  }
+}

package/packages/src/interfaces/ui/terminal/cli/index.ts

@@ -0,0 +1,228 @@
+#!/usr/bin/env bun
+/**
+ * Coder - CLI Entry Point
+ * AI-powered terminal coding assistant
+ *
+ * This is a thin orchestrator that:
+ * 1. Parses arguments
+ * 2. Sets up session (config, MCP, hooks)
+ * 3. Dispatches to TUI or single-query mode
+ */
+
+import type { Message } from "../../../../types/index.js";
+import type { ToolDefinition, PermissionMode } from "../../../../types/index.js";
+import type { builtInTools } from "../../../../ecosystem/tools/index.js";
+import type { HookManager } from "../../../../ecosystem/hooks/index.js";
+import type { SkillManager } from "../../../../ecosystem/skills/index.js";
+import type { MCPClientImpl } from "../../../mcp/client.js";
+import { SessionStore, printSessionsList } from "../../../../core/session-store.js";
+import { getGitStatus } from "../../../../core/git-status.js";
+import { renderStatusLine, getContextWindow, VERSION, type StatusLineOptions } from "../shared/status-line.js";
+import { runInteractiveTUI } from "../tui/index.js";
+
+// Shared modules
+import {
+  parseArgs,
+  requireApiKey,
+  setupSession,
+  buildCompleteSystemPrompt,
+  runSingleQuery,
+} from "../shared/index.js";
+
+// ============================================
+// MAIN ENTRY POINT
+// ============================================
+
+async function main(): Promise<void> {
+  const args = parseArgs();
+
+  // Handle --version flag
+  if (args.showVersion) {
+    console.log(`Coder v${VERSION}`);
+    console.log(`Model: ${args.model}`);
+    console.log(`Node: ${process.version}`);
+    console.log(`Platform: ${process.platform} ${process.arch}`);
+    process.exit(0);
+  }
+
+  // Initialize session store
+  const sessionStore = new SessionStore();
+  await sessionStore.init();
+
+  // Handle --sessions flag
+  if (args.listSessions) {
+    const sessions = await sessionStore.listSessions(20);
+    printSessionsList(sessions);
+    process.exit(0);
+  }
+
+  // Get API key
+  const apiKey = requireApiKey();
+
+  // Setup session (config, MCP, hooks, skills)
+  const setup = await setupSession({
+    args,
+    apiKey,
+    workingDirectory: process.cwd(),
+  });
+
+  // Get git status for system prompt
+  const gitStatus = await getGitStatus(process.cwd());
+
+  // Build system prompt
+  const systemPrompt = await buildCompleteSystemPrompt(process.cwd(), {
+    systemPrompt: args.systemPrompt,
+    appendSystemPrompt: args.appendSystemPrompt,
+    teammateMode: args.teammateMode,
+    agentId: args.agentId,
+    agentName: args.agentName,
+    teamName: args.teamName,
+  });
+
+  // Handle session resume
+  let messages: Message[] = [];
+  let sessionId: string;
+
+  if (args.resumeSession) {
+    const loadedSession = await sessionStore.resumeSession(args.resumeSession);
+    if (!loadedSession) {
+      console.error(`Error: Session not found: ${args.resumeSession}`);
+      process.exit(1);
+    }
+
+    messages = loadedSession.messages;
+    sessionId = args.resumeSession;
+
+    // Update args from session metadata
+    args.model = loadedSession.metadata.model as typeof args.model;
+    args.agentName = loadedSession.metadata.agentName;
+    args.agentColor = loadedSession.metadata.agentColor;
+    args.teamName = loadedSession.metadata.teamName;
+
+    console.log(`\x1b[90mResumed session: ${args.resumeSession}\x1b[0m`);
+    console.log(`\x1b[90mModel: ${args.model} | Messages: ${messages.length}\x1b[0m\n`);
+  } else {
+    // Create new session
+    sessionId = await sessionStore.createSession({
+      model: args.model,
+      workingDirectory: process.cwd(),
+      agentName: args.agentName,
+      agentColor: args.agentColor,
+      teamName: args.teamName,
+    });
+  }
+
+  // Get initial query
+  let query = args.query;
+  const firstArg = process.argv[2];
+  if (!query && process.argv.length > 2 && firstArg && !firstArg.startsWith("-")) {
+    query = process.argv.slice(2).join(" ");
+  }
+
+  if (!query) {
+    // Show initial status line
+    const initialStatusOptions: StatusLineOptions = {
+      permissionMode: setup.permissionMode,
+      tokensUsed: 0,
+      maxTokens: getContextWindow(args.model),
+      model: args.model,
+      isLoading: false,
+    };
+    console.log(`\x1b[90m${renderStatusLine(initialStatusOptions)}\x1b[0m`);
+    console.log(`\x1b[90mSession: ${sessionId}\x1b[0m`);
+    console.log("\x1b[90mType your message, ? for help, or /help for commands.\x1b[0m\n");
+
+    // Interactive mode
+    await runInteractiveMode(
+      apiKey,
+      args,
+      systemPrompt,
+      setup.tools,
+      setup.hookManager,
+      setup.skillManager,
+      sessionStore,
+      messages,
+      sessionId,
+      setup.mcpClients,
+      setup.permissionMode
+    );
+  } else {
+    // Single query mode
+    await runSingleQuery({
+      apiKey,
+      args,
+      systemPrompt,
+      tools: setup.tools,
+      query,
+      sessionStore,
+      sessionId,
+      hookManager: setup.hookManager,
+      workingDirectory: process.cwd(),
+      gitStatus,
+    });
+  }
+}
+
+// ============================================
+// INTERACTIVE MODE
+// ============================================
+
+async function runInteractiveMode(
+  apiKey: string,
+  args: Awaited<ReturnType<typeof parseArgs>>,
+  systemPrompt: string,
+  tools: ToolDefinition[],
+  hookManager: HookManager,
+  skillManager: SkillManager,
+  sessionStore: SessionStore,
+  messages: Message[],
+  sessionId: string,
+  mcpClients: Map<string, MCPClientImpl>,
+  permissionMode: PermissionMode
+): Promise<void> {
+  // Check if stdin is a TTY (interactive terminal)
+  const isInteractive = process.stdin.isTTY;
+
+  // Allow force-interactive mode for testing
+  const forceInteractive = process.env.CLAUDE_FORCE_INTERACTIVE === "true";
+
+  if (!isInteractive && !forceInteractive) {
+    console.error("Error: Interactive mode requires a TTY. Use -q for single query mode.");
+    console.error("       Or set CLAUDE_FORCE_INTERACTIVE=true for testing.");
+    return;
+  }
+
+  // Create a mutable session ID holder for the TUI
+  let currentSessionId = sessionId;
+  const setSessionId = (newId: string) => {
+    currentSessionId = newId;
+  };
+
+  // Run the Ink-based React TUI
+  await runInteractiveTUI({
+    apiKey,
+    model: args.model,
+    permissionMode,
+    maxTokens: args.maxTokens,
+    systemPrompt,
+    tools,
+    hookManager,
+    sessionStore,
+    sessionId: currentSessionId,
+    setSessionId,
+    initialMessages: messages,
+    workingDirectory: process.cwd(),
+    onExit: () => {
+      console.log("\n\x1b[90mGoodbye!\x1b[0m");
+    },
+  });
+}
+
+// ============================================
+// RUN MAIN
+// ============================================
+
+main().catch((error) => {
+  console.error("Fatal error:", error);
+  process.exit(1);
+});