@ebowwa/coder 0.7.64 → 0.7.66

package/packages/src/interfaces/ui/terminal/tui/tui-footer.ts

@@ -1,422 +0,0 @@
-/**
- * TUI Footer Component for Coder CLI
- * Provides a persistent status bar at the bottom of the terminal
- *
- * Uses ANSI escape codes for cursor positioning:
- * - ESC[s    Save cursor position
- * - ESC[u    Restore cursor position
- * - ESC[#;#H Move cursor to row, col
- * - ESC[2K   Clear entire line
- * - ESC[J    Clear from cursor to end of screen
- */
-
-import chalk from "chalk";
-import type { PermissionMode } from "../../../../types/index.js";
-import {
-  calculateContextInfo,
-  formatPermissionMode,
-  type StatusLineOptions,
-} from "../shared/status-line.js";
-import { spinnerFrames } from "./spinner.js";
-
-// ============================================
-// ANSI ESCAPE CODES
-// ============================================
-
-const ANSI = {
-  // Cursor
-  SAVE_CURSOR: "\x1b[s",
-  RESTORE_CURSOR: "\x1b[u",
-  MOVE_TO: (row: number, col: number) => `\x1b[${row};${col}H`,
-  MOVE_TO_BOTTOM: (offset = 0) => `\x1b[999;1H\x1b[${offset + 1}A`,
-
-  // Clear
-  CLEAR_LINE: "\x1b[2K",
-  CLEAR_TO_END: "\x1b[J",
-  CLEAR_SCREEN: "\x1b[2J",
-
-  // Scrolling
-  SCROLL_UP: (lines: number) => `\x1b[${lines}S`,
-  SCROLL_DOWN: (lines: number) => `\x1b[${lines}T`,
-
-  // Colors reset
-  RESET: "\x1b[0m",
-
-  // Alternate screen buffer
-  ENTER_ALT_SCREEN: "\x1b[?1049h",
-  EXIT_ALT_SCREEN: "\x1b[?1049l",
-
-  // Cursor visibility
-  HIDE_CURSOR: "\x1b[?25l",
-  SHOW_CURSOR: "\x1b[?25h",
-};
-
-// Export ANSI for external use
-export { ANSI };
-
-// ============================================
-// TYPES
-// ============================================
-
-export interface TUIFooterOptions {
-  /** Permission mode to display */
-  permissionMode: PermissionMode;
-  /** Tokens used in context */
-  tokensUsed: number;
-  /** Current model */
-  model: string;
-  /** Is loading/spinning */
-  isLoading?: boolean;
-  /** Verbose mode */
-  verbose?: boolean;
-  /** Show version */
-  showVersion?: boolean;
-}
-
-export interface TUIFooterState {
-  isEnabled: boolean;
-  lastRender: string;
-  lastOptions: TUIFooterOptions | null;
-  renderInterval: Timer | null;
-  spinnerFrame: number;
-  terminalHeight: number;
-  terminalWidth: number;
-}
-
-// ============================================
-// FOOTER RENDERER
-// ============================================
-
-/**
- * Render footer content (without positioning)
- */
-function renderFooterContent(options: TUIFooterOptions, spinnerFrame?: string): string {
-  const { permissionMode, tokensUsed, model, isLoading, verbose, showVersion } = options;
-  const contextInfo = calculateContextInfo(tokensUsed, model);
-
-  // Build status parts
-  const parts: string[] = [];
-
-  // 1. Loading spinner if active
-  if (isLoading && spinnerFrame) {
-    parts.push(chalk.cyan(spinnerFrame));
-  }
-
-  // 2. Context percentage with color
-  const contextValue = contextInfo.isCritical
-    ? chalk.red(`${contextInfo.percentRemaining.toFixed(0)}%`)
-    : contextInfo.isLow
-      ? chalk.yellow(`${contextInfo.percentRemaining.toFixed(0)}%`)
-      : chalk.dim(`${contextInfo.percentRemaining.toFixed(0)}%`);
-  parts.push(`Context: ${contextValue}`);
-
-  // 3. Permission mode
-  const permDisplay = formatPermissionMode(permissionMode);
-  parts.push(permDisplay);
-
-  // 4. Version (if verbose or showVersion)
-  if (verbose || showVersion) {
-    parts.push(chalk.dim(`v${getVersion()}`));
-  }
-
-  return parts.join(chalk.dim(" | "));
-}
-
-/**
- * Get VERSION dynamically to avoid circular imports
- */
-function getVersion(): string {
-  try {
-    // Dynamic import to avoid circular dependency
-    const statusLine = require("../shared/status-line.js");
-    return statusLine.VERSION || "0.0.0";
-  } catch {
-    return "0.0.0";
-  }
-}
-
-// ============================================
-// TUI FOOTER CLASS
-// ============================================
-
-export class TUIFooter {
-  private state: TUIFooterState;
-  private static instance: TUIFooter | null = null;
-
-  private constructor() {
-    this.state = {
-      isEnabled: false,
-      lastRender: "",
-      lastOptions: null,
-      renderInterval: null,
-      spinnerFrame: 0,
-      terminalHeight: process.stdout.rows || 24,
-      terminalWidth: process.stdout.columns || 80,
-    };
-  }
-
-  /**
-   * Get singleton instance
-   */
-  static getInstance(): TUIFooter {
-    if (!TUIFooter.instance) {
-      TUIFooter.instance = new TUIFooter();
-    }
-    return TUIFooter.instance;
-  }
-
-  /**
-   * Reset singleton (for testing)
-   */
-  static reset(): void {
-    if (TUIFooter.instance) {
-      TUIFooter.instance.disable();
-      TUIFooter.instance = null;
-    }
-  }
-
-  /**
-   * Enable the footer (start tracking terminal size)
-   */
-  enable(): void {
-    if (this.state.isEnabled) return;
-
-    this.state.isEnabled = true;
-    this.updateTerminalSize();
-
-    // Listen for terminal resize
-    process.stdout.on("resize", this.handleResize);
-  }
-
-  /**
-   * Disable the footer and clear it
-   */
-  disable(): void {
-    if (!this.state.isEnabled) return;
-
-    this.stopSpinner();
-    this.clear();
-
-    process.stdout.off("resize", this.handleResize);
-    this.state.isEnabled = false;
-  }
-
-  /**
-   * Check if footer is enabled
-   */
-  isEnabled(): boolean {
-    return this.state.isEnabled;
-  }
-
-  /**
-   * Update terminal dimensions
-   */
-  private updateTerminalSize(): void {
-    this.state.terminalHeight = process.stdout.rows || 24;
-    this.state.terminalWidth = process.stdout.columns || 80;
-  }
-
-  /**
-   * Handle terminal resize
-   */
-  private handleResize = (): void => {
-    this.updateTerminalSize();
-    if (this.state.lastOptions) {
-      this.render(this.state.lastOptions);
-    }
-  };
-
-  /**
-   * Render the footer at the bottom of the screen
-   * Saves cursor position, moves to bottom, renders, restores cursor
-   */
-  render(options: TUIFooterOptions): void {
-    if (!this.state.isEnabled) return;
-
-    this.state.lastOptions = options;
-
-    // Build footer content
-    const content = renderFooterContent(options);
-
-    // Skip if content unchanged (optimization)
-    if (content === this.state.lastRender && !options.isLoading) {
-      return;
-    }
-
-    this.state.lastRender = content;
-
-    // Build ANSI sequence:
-    // 1. Save cursor position
-    // 2. Move to bottom of screen
-    // 3. Clear the line
-    // 4. Render footer content
-    // 5. Restore cursor position
-    const output =
-      ANSI.SAVE_CURSOR +
-      ANSI.MOVE_TO_BOTTOM() +
-      ANSI.CLEAR_LINE +
-      "\r" + // Go to start of line
-      chalk.dim("┌") +
-      content +
-      ANSI.RESTORE_CURSOR;
-
-    process.stdout.write(output);
-  }
-
-  /**
-   * Render with loading spinner animation
-   */
-  renderLoading(options: TUIFooterOptions): void {
-    const frame = spinnerFrames[this.state.spinnerFrame];
-    this.state.spinnerFrame = (this.state.spinnerFrame + 1) % spinnerFrames.length;
-
-    const content = renderFooterContent(options, frame);
-    this.state.lastRender = content;
-
-    if (!this.state.isEnabled) return;
-
-    const output =
-      ANSI.SAVE_CURSOR +
-      ANSI.MOVE_TO_BOTTOM() +
-      ANSI.CLEAR_LINE +
-      "\r" +
-      chalk.dim("┌") +
-      content +
-      ANSI.RESTORE_CURSOR;
-
-    process.stdout.write(output);
-  }
-
-  /**
-   * Start spinner animation for loading state
-   */
-  startSpinner(options: TUIFooterOptions, interval = 80): void {
-    this.stopSpinner();
-
-    this.state.renderInterval = setInterval(() => {
-      this.renderLoading(options);
-    }, interval);
-  }
-
-  /**
-   * Stop spinner animation
-   */
-  stopSpinner(): void {
-    if (this.state.renderInterval) {
-      clearInterval(this.state.renderInterval);
-      this.state.renderInterval = null;
-    }
-  }
-
-  /**
-   * Clear the footer line
-   */
-  clear(): void {
-    if (!this.state.isEnabled) return;
-
-    const output =
-      ANSI.SAVE_CURSOR +
-      ANSI.MOVE_TO_BOTTOM() +
-      ANSI.CLEAR_LINE +
-      ANSI.RESTORE_CURSOR;
-
-    process.stdout.write(output);
-    this.state.lastRender = "";
-  }
-
-  /**
-   * Update just the token count (for incremental updates)
-   */
-  updateTokens(tokensUsed: number): void {
-    if (this.state.lastOptions) {
-      this.render({
-        ...this.state.lastOptions,
-        tokensUsed,
-      });
-    }
-  }
-
-  /**
-   * Update loading state
-   */
-  setLoading(isLoading: boolean): void {
-    if (this.state.lastOptions) {
-      const options = {
-        ...this.state.lastOptions,
-        isLoading,
-      };
-
-      if (isLoading) {
-        this.startSpinner(options);
-      } else {
-        this.stopSpinner();
-        this.render(options);
-      }
-    }
-  }
-
-  /**
-   * Get terminal dimensions
-   */
-  getTerminalSize(): { width: number; height: number } {
-    return {
-      width: this.state.terminalWidth,
-      height: this.state.terminalHeight,
-    };
-  }
-}
-
-// ============================================
-// CONVENIENCE EXPORTS
-// ============================================
-
-/**
- * Get the global TUI footer instance
- */
-export function getTUIFooter(): TUIFooter {
-  return TUIFooter.getInstance();
-}
-
-/**
- * Enable TUI footer
- */
-export function enableTUIFooter(): TUIFooter {
-  const footer = TUIFooter.getInstance();
-  footer.enable();
-  return footer;
-}
-
-/**
- * Disable TUI footer
- */
-export function disableTUIFooter(): void {
-  TUIFooter.getInstance().disable();
-}
-
-/**
- * Render footer status (convenience function)
- */
-export function renderTUIFooter(options: TUIFooterOptions): void {
-  TUIFooter.getInstance().render(options);
-}
-
-/**
- * Clear the footer line
- */
-export function clearTUIFooter(): void {
-  TUIFooter.getInstance().clear();
-}
-
-// ============================================
-// EXPORTS
-// ============================================
-
-export default {
-  TUIFooter,
-  getTUIFooter,
-  enableTUIFooter,
-  disableTUIFooter,
-  renderTUIFooter,
-  clearTUIFooter,
-  ANSI,
-};

package/packages/src/interfaces/ui/terminal/tui/types.ts

@@ -1,186 +0,0 @@
-/**
- * TUI Types
- * Type definitions for the interactive TUI components
- */
-
-import type { PermissionMode, ClaudeModel, Message as ApiMessage, ToolDefinition } from "../../../../types/index.js";
-import type { HookManager } from "../../../../ecosystem/hooks/index.js";
-import type { TerminalHandle } from "../../../../native/index.js";
-import type { LoadedSession, SessionSummary } from "../../../../core/sessions/types.js";
-
-/**
- * Message sub-type for granular categorization
- * - tool_call: Assistant is invoking a tool
- * - tool_result: Tool execution result (success or error)
- * - hook: Hook intercept/decision message
- * - info: General system info (session start, commands, etc.)
- * - error: Error messages
- * - thinking: Extended thinking output
- */
-export type MessageSubType =
-  | "tool_call"
-  | "tool_result"
-  | "hook"
-  | "info"
-  | "error"
-  | "thinking";
-
-/**
- * UI-specific message representation
- */
-export interface UIMessage {
-  id: string;
-  /** Base role: user, assistant, or system */
-  role: "user" | "assistant" | "system";
-  /** Message content for display */
-  content: string;
-  /** Timestamp in milliseconds */
-  timestamp: number;
-  /** Optional sub-type for granular display labels */
-  subType?: MessageSubType;
-  /** For tool messages: the tool name */
-  toolName?: string;
-  /** For tool_result: whether it was an error */
-  isError?: boolean;
-}
-
-/**
- * Props for the main InteractiveTUI component
- */
-export interface InteractiveTUIProps {
-  apiKey: string;
-  model: ClaudeModel;
-  permissionMode: PermissionMode;
-  maxTokens: number;
-  systemPrompt: string;
-  tools: ToolDefinition[];
-  hookManager: HookManager;
-  sessionStore: SessionStore;
-  sessionId: string;
-  setSessionId: (id: string) => void;
-  initialMessages: ApiMessage[];
-  workingDirectory: string;
-  onExit: () => void;
-}
-
-/**
- * Session store interface (subset used by TUI)
- */
-export interface SessionStore {
-  saveMessage(message: ApiMessage): Promise<void>;
-  saveMetrics(metrics: unknown): Promise<void>;
-  exportSession(sessionId: string, format: "jsonl" | "json" | "markdown"): Promise<string>;
-  listSessions(limit?: number): Promise<SessionSummary[]>;
-  resumeSession(sessionId: string): Promise<LoadedSession | null>;
-  createSession(options: {
-    model: string;
-    workingDirectory: string;
-    agentName?: string;
-    agentColor?: string;
-    teamName?: string;
-  }): Promise<string>;
-}
-
-/**
- * Session info for listing
- */
-export interface SessionInfo {
-  id: string;
-  messageCount: number;
-  lastActivity?: number;
-  metadata?: Record<string, unknown>;
-}
-
-/**
- * Message area component props
- */
-export interface MessageAreaProps {
-  messages: UIMessage[];
-  isLoading: boolean;
-  spinnerFrame: string;
-  height: number;
-  scrollOffset: number;
-  contextWarning: string | null;
-  streamingText?: string;
-}
-
-/**
- * Status bar component props
- */
-export interface StatusBarProps {
-  permissionMode: PermissionMode;
-  tokensUsed: number;
-  model: string;
-  isLoading: boolean;
-  spinnerFrame: string;
-}
-
-/**
- * Input field component props
- */
-export interface InputFieldProps {
-  value: string;
-  cursorPos: number;
-  placeholder: string;
-  isActive: boolean;
-}
-
-/**
- * Terminal layout configuration
- */
-export interface TerminalLayout {
-  terminalHeight: number;
-  inputHeight: number;
-  statusHeight: number;
-  messageHeight: number;
-}
-
-/**
- * Command handler context
- */
-export interface CommandContext {
-  sessionId: string;
-  setSessionId: (id: string) => void;
-  model: ClaudeModel;
-  setModel: (model: ClaudeModel) => void;
-  apiMessages: ApiMessage[];
-  setApiMessages: (messages: ApiMessage[]) => void;
-  setMessages: (messages: UIMessage[]) => void;
-  processedCountRef: React.MutableRefObject<number>;
-  totalCost: number;
-  setTotalCost: (cost: number) => void;
-  totalTokens: number;
-  setTotalTokens: (tokens: number) => void;
-  permissionMode: PermissionMode;
-  tools: ToolDefinition[];
-  workingDirectory: string;
-  sessionStore: SessionStore;
-  addSystemMessage: (content: string) => void;
-  messagesLength: number;
-  onExit: () => void;
-  exit: () => void;
-  // Session selection state
-  sessionSelectMode: boolean;
-  setSessionSelectMode: (mode: boolean) => void;
-  setSelectableSessions: (sessions: SessionInfo[]) => void;
-  // Help mode state
-  helpMode: boolean;
-  setHelpMode: (mode: boolean) => void;
-  helpSection: number;
-  setHelpSection: (section: number) => void;
-}
-
-/**
- * Context info from status-line
- */
-export interface ContextInfo {
-  percentRemaining: number;
-  isLow: boolean;
-  isCritical: boolean;
-}
-
-/**
- * Re-export types from parent for convenience
- */
-export type { PermissionMode, ClaudeModel, Message as ApiMessage, ToolDefinition } from "../../../../types/index.js";
-export type { HookManager } from "../../../../ecosystem/hooks/index.js";

package/packages/src/interfaces/ui/terminal/tui/useInputHandler.ts

@@ -1,104 +0,0 @@
-/**
- * TUI Input Handler Hook
- * Custom hook for handling keyboard input in TUI
- */
-
-import { useCallback } from "react";
-import { useInput } from "ink";
-
-interface UseInputHandlerOptions {
-  isLoading: boolean;
-  inputValue: string;
-  cursorPos: number;
-  setInputValue: (value: string | ((prev: string) => string)) => void;
-  setCursorPos: (value: number | ((prev: number) => number)) => void;
-  onSubmit: (value: string) => void;
-  onCommand: (cmd: string) => void;
-}
-
-/**
- * Hook for handling keyboard input in the TUI
- */
-export function useInputHandler({
-  isLoading,
-  inputValue,
-  cursorPos,
-  setInputValue,
-  setCursorPos,
-  onSubmit,
-  onCommand,
-}: UseInputHandlerOptions) {
-  // Main input handler
-  useInput(
-    (input, key) => {
-      if (isLoading) return;
-
-      // Submit on Enter
-      if (key.return) {
-        if (inputValue.trim()) {
-          if (inputValue.startsWith("/")) {
-            onCommand(inputValue);
-          } else {
-            onSubmit(inputValue);
-          }
-          setInputValue("");
-          setCursorPos(0);
-        }
-        return;
-      }
-
-      // Backspace
-      if (key.backspace || key.delete) {
-        if (cursorPos > 0) {
-          setInputValue((v) => v.slice(0, cursorPos - 1) + v.slice(cursorPos));
-          setCursorPos((p) => p - 1);
-        }
-        return;
-      }
-
-      // Arrow keys
-      if (key.leftArrow) {
-        setCursorPos((p) => Math.max(0, p - 1));
-        return;
-      }
-
-      if (key.rightArrow) {
-        setCursorPos((p) => Math.min(inputValue.length, p + 1));
-        return;
-      }
-
-      // Home/End keys (Ctrl+A / Ctrl+E)
-      if (key.ctrl && input === "a") {
-        setCursorPos(0);
-        return;
-      }
-
-      if (key.ctrl && input === "e") {
-        setCursorPos(inputValue.length);
-        return;
-      }
-
-      // Regular character
-      if (input && !key.ctrl && !key.meta) {
-        setInputValue((v) => v.slice(0, cursorPos) + input + v.slice(cursorPos));
-        setCursorPos((p) => p + input.length);
-      }
-    },
-    { isActive: !isLoading }
-  );
-}
-
-/**
- * Hook for handling exit shortcuts (Ctrl+C)
- */
-export function useExitHandler(onExit: () => void, exit: () => void) {
-  useInput(
-    (input, key) => {
-      if (key.ctrl && input === "c") {
-        onExit();
-        exit();
-      }
-    },
-    { isActive: true }
-  );
-}