erosolar-cli 1.7.195 → 1.7.197

package/dist/ui/ShellUIAdapter.js

@@ -0,0 +1,680 @@
+/**
+ * ShellUIAdapter - Bridges the UnifiedUIController with the existing shell infrastructure
+ * Provides compatibility layer and migration path from old to new UI system
+ */
+import { UnifiedUIController } from './UnifiedUIController.js';
+import { InterruptPriority } from './interrupts/InterruptManager.js';
+import { getTerminalColumns } from './layout.js';
+import { formatToolResultSummary } from './toolDisplay.js';
+import { theme } from './theme.js';
+export class ShellUIAdapter {
+    uiController;
+    legacyStatusTracker;
+    display;
+    config;
+    isProcessing = false;
+    contextUsage = 0;
+    fileChangeCallback;
+    _toolStatusCallback;
+    profileSwitcherTimeout;
+    constructor(writeStream, display, config = {}) {
+        this.display = display;
+        this.config = {
+            useUnifiedUI: true,
+            preserveCompatibility: true,
+            enableTelemetry: true,
+            debugMode: false,
+            ...config,
+        };
+        // Initialize unified UI controller
+        this.uiController = new UnifiedUIController(writeStream, {
+            enableOverlay: true,
+            enableAnimations: true,
+            enableTelemetry: this.config.enableTelemetry,
+            adaptivePerformance: true,
+            debugMode: this.config.debugMode,
+        });
+        // Legacy components are optional and should be passed in if needed
+        // They require a readline.Interface which we don't have here
+        this.setupDisplayIntegration();
+    }
+    /**
+     * Setup display integration
+     */
+    setupDisplayIntegration() {
+        // Register output interceptor to coordinate with overlay
+        this.display.registerOutputInterceptor({
+            beforeWrite: () => {
+                if (this.config.useUnifiedUI) {
+                    this.uiController.beginOutput();
+                }
+            },
+            afterWrite: () => {
+                if (this.config.useUnifiedUI) {
+                    this.uiController.endOutput();
+                }
+            },
+        });
+    }
+    /**
+     * Create a tool observer for the agent
+     * Claude Code style: Display each tool call clearly with ⏺ prefix and results with ⎿ prefix
+     */
+    createToolObserver() {
+        return {
+            onToolStart: (call) => {
+                // Claude Code style: Display tool call with ⏺ prefix
+                this.displayToolCallStart(call);
+                // Update status bar
+                if (this._toolStatusCallback) {
+                    const actionDesc = this.getToolActionDescription(call);
+                    this._toolStatusCallback(actionDesc);
+                }
+                if (this.config.useUnifiedUI) {
+                    this.uiController.onToolStart(call);
+                }
+            },
+            onToolProgress: (call, progress) => {
+                if (this.config.useUnifiedUI) {
+                    this.uiController.onToolProgress(call.id, {
+                        current: progress.current,
+                        total: progress.total ?? progress.current,
+                        message: progress.message,
+                    });
+                }
+                // Update status bar with progress
+                if (this._toolStatusCallback) {
+                    const description = this.getToolActionDescription(call, progress);
+                    if (description) {
+                        this._toolStatusCallback(description);
+                    }
+                }
+            },
+            onToolWarning: (call, warning) => {
+                const toolName = theme.tool(call.name);
+                const warningText = typeof warning === 'string'
+                    ? warning
+                    : `[${warning.code}] ${warning.message}${warning.suggestion ? ` — ${warning.suggestion}` : ''}`;
+                const line = `${theme.warning('⚠')} ${toolName} ${theme.ui.muted('preflight')} ${warningText}`;
+                // Use display.stream() to work with scroll regions
+                this.display.stream(`\n${line}\n`);
+                if (this._toolStatusCallback) {
+                    this._toolStatusCallback(`Warning: ${this.getToolActionDescription(call)}`);
+                }
+            },
+            onToolResult: (call, output) => {
+                // Track file changes for Edit/Write tools
+                if (this.fileChangeCallback && (call.name === 'Edit' || call.name === 'Write')) {
+                    const fileChange = this.parseFileChange(call, output);
+                    if (fileChange) {
+                        this.fileChangeCallback(fileChange.path, fileChange.type, fileChange.additions, fileChange.removals);
+                    }
+                }
+                // Claude Code style: Display tool result with ⎿ prefix
+                this.displayToolResultSummary(call, output, true);
+                // Clear status bar after showing result
+                if (this._toolStatusCallback) {
+                    this._toolStatusCallback(null);
+                }
+                if (this.config.useUnifiedUI) {
+                    this.uiController.onToolComplete(call.id, output);
+                }
+            },
+            onToolError: (call, message) => {
+                // Claude Code style: Display error with ⎿ prefix (error color)
+                this.displayToolResultSummary(call, message, false);
+                // Clear status bar after showing error
+                if (this._toolStatusCallback) {
+                    this._toolStatusCallback(null);
+                }
+                if (this.config.useUnifiedUI) {
+                    this.uiController.onToolError(call.id, { message });
+                }
+            },
+            onCacheHit: (call) => {
+                // Claude Code style: Show cache hit briefly
+                this.displayToolCallStart(call, true);
+                if (this.config.useUnifiedUI) {
+                    this.uiController.onToolStart(call);
+                    this.uiController.onToolComplete(call.id, 'cache-hit');
+                }
+            },
+        };
+    }
+    /**
+     * Display tool call start with Claude Code style ⏺ prefix
+     * Routes through display module to work with scroll regions
+     */
+    displayToolCallStart(call, isCacheHit = false) {
+        const args = call.arguments || {};
+        const toolName = theme.tool(call.name);
+        // Format args inline (compact)
+        const argsStr = this.formatToolArgsInline(call.name, args);
+        const cacheHint = isCacheHit ? theme.ui.muted(' (cached)') : '';
+        // Claude Code style: ⏺ ToolName(args)
+        const line = `${theme.info('⏺')} ${toolName}${argsStr}${cacheHint}`;
+        // Use display.stream() to work with scroll regions
+        this.display.stream(`\n${line}\n`);
+    }
+    /**
+     * Format tool arguments inline for display
+     */
+    formatToolArgsInline(toolName, args) {
+        // Get the most relevant arg based on tool type
+        let mainArg = '';
+        switch (toolName) {
+            case 'Read':
+            case 'read_file':
+            case 'Write':
+            case 'write_file':
+            case 'Edit':
+            case 'edit_file': {
+                const filePath = args['file_path'] || args['path'];
+                if (filePath)
+                    mainArg = this.truncatePath(String(filePath), 60);
+                break;
+            }
+            case 'Bash':
+            case 'bash': {
+                const cmd = args['command'];
+                if (cmd) {
+                    const shortCmd = String(cmd).split('\n')[0]?.trim() || String(cmd);
+                    mainArg = shortCmd.length > 50 ? `${shortCmd.slice(0, 47)}...` : shortCmd;
+                }
+                break;
+            }
+            case 'Grep':
+            case 'grep': {
+                const pattern = args['pattern'];
+                if (pattern) {
+                    mainArg = `"${String(pattern).length > 30 ? `${String(pattern).slice(0, 27)}...` : pattern}"`;
+                }
+                break;
+            }
+            case 'Glob':
+            case 'glob': {
+                const pattern = args['pattern'];
+                if (pattern)
+                    mainArg = String(pattern);
+                break;
+            }
+            case 'WebFetch':
+            case 'web_fetch': {
+                const url = args['url'];
+                if (url) {
+                    try {
+                        mainArg = new URL(String(url)).hostname;
+                    }
+                    catch {
+                        mainArg = String(url).slice(0, 40);
+                    }
+                }
+                break;
+            }
+            case 'WebSearch':
+            case 'web_search': {
+                const query = args['query'];
+                if (query)
+                    mainArg = `"${String(query).slice(0, 40)}"`;
+                break;
+            }
+            case 'Task':
+            case 'task': {
+                const desc = args['description'];
+                if (desc)
+                    mainArg = String(desc);
+                break;
+            }
+            case 'TodoWrite':
+            case 'todo_write': {
+                const todos = args['todos'];
+                if (Array.isArray(todos))
+                    mainArg = `${todos.length} items`;
+                break;
+            }
+            default: {
+                // For unknown tools, show first relevant arg
+                const firstArg = Object.entries(args).find(([k, v]) => v && typeof v === 'string' && !['description', 'dangerouslyDisableSandbox'].includes(k));
+                if (firstArg) {
+                    mainArg = String(firstArg[1]).slice(0, 40);
+                }
+            }
+        }
+        return mainArg ? `(${mainArg})` : '';
+    }
+    /**
+     * Start processing a request
+     */
+    startProcessing(message = 'Working on your request') {
+        this.isProcessing = true;
+        if (this.config.useUnifiedUI) {
+            this.uiController.startProcessing();
+            this.uiController.setBaseStatus(message, 'info');
+        }
+        else {
+            if (this.legacyStatusTracker) {
+                this.legacyStatusTracker.setBase(message, { tone: 'info' });
+            }
+        }
+    }
+    /**
+     * End processing
+     */
+    endProcessing(message = 'Ready for prompts') {
+        this.isProcessing = false;
+        if (this.config.useUnifiedUI) {
+            this.uiController.endProcessing();
+            this.uiController.setBaseStatus(message, 'success');
+        }
+        else {
+            if (this.legacyStatusTracker) {
+                this.legacyStatusTracker.setBase(message, { tone: 'success' });
+            }
+        }
+    }
+    /**
+     * Update context usage
+     * NOTE: This only tracks the value internally. The actual context display
+     * is handled by display.showStatusLine() which shows "Session Xm • Context Y% used • Ready"
+     * We don't push a status override here to avoid duplicate context lines.
+     */
+    updateContextUsage(percentage) {
+        this.contextUsage = percentage;
+        // Don't push status override - display.showStatusLine() already shows context
+    }
+    /**
+     * Show a user interrupt
+     */
+    showInterrupt(message, type = 'alert', handler) {
+        if (this.config.useUnifiedUI) {
+            const priority = type === 'alert'
+                ? InterruptPriority.HIGH
+                : InterruptPriority.NORMAL;
+            return this.uiController.queueInterrupt(type, message, priority, handler ? async () => handler() : undefined);
+        }
+        else {
+            // For legacy, just show the message immediately
+            this.display.showWarning(message);
+            if (handler) {
+                setTimeout(() => handler(), 0);
+            }
+            return 'legacy-interrupt';
+        }
+    }
+    /**
+     * Complete an interrupt
+     */
+    completeInterrupt(id) {
+        if (this.config.useUnifiedUI) {
+            this.uiController.completeInterrupt(id);
+        }
+    }
+    /**
+     * Show slash command preview with dynamic overlay
+     */
+    showSlashCommandPreview(commands) {
+        if (this.config.useUnifiedUI) {
+            // Build a Claude Code-style command menu without duplicate separators
+            // Build command lines with proper indentation
+            const commandLines = commands.map(cmd => {
+                return `  ${cmd.command}\n      ${cmd.description}`;
+            }).join('\n');
+            // Create command content
+            const content = commandLines;
+            // Use the unified UI overlay system
+            this.uiController.updateCommandsOverlay(content);
+        }
+        else if (this.legacyStatusTracker) {
+            // Legacy fallback - just show command names
+            const preview = commands.map(c => c.command).join(' | ');
+            this.legacyStatusTracker.pushOverride('slash-preview', `Commands: ${preview}`, {
+                tone: 'info',
+            });
+        }
+    }
+    /**
+     * Hide slash command preview
+     */
+    hideSlashCommandPreview() {
+        if (this.config.useUnifiedUI) {
+            this.uiController.hideCommandsOverlay();
+        }
+        else if (this.legacyStatusTracker) {
+            this.legacyStatusTracker.clearOverride('slash-preview');
+        }
+    }
+    /**
+     * Show profile switcher (Shift+Tab)
+     */
+    showProfileSwitcher(profiles, currentProfile) {
+        if (this.config.useUnifiedUI) {
+            // Build profile switcher overlay
+            const terminalWidth = getTerminalColumns();
+            const separator = '─'.repeat(terminalWidth - 1);
+            // Build profile lines
+            const profileLines = profiles.map(profile => {
+                return `  ${profile.command}\n      ${profile.description}`;
+            }).join('\n');
+            // Create overlay content
+            const header = `Switch Profile (Shift+Tab)`;
+            const content = `${separator}\n${header}\n${separator}\n${profileLines}\n\nPress number to switch or Esc to cancel`;
+            // Use the unified UI overlay system
+            this.uiController.updateCommandsOverlay(content);
+            // Auto-hide after 5 seconds (track timeout to allow cleanup)
+            if (this.profileSwitcherTimeout) {
+                clearTimeout(this.profileSwitcherTimeout);
+            }
+            this.profileSwitcherTimeout = setTimeout(() => {
+                this.uiController.hideCommandsOverlay();
+                this.profileSwitcherTimeout = undefined;
+            }, 5000);
+        }
+        else if (this.legacyStatusTracker) {
+            // Legacy fallback
+            const preview = `Current: ${currentProfile} | Press Shift+Tab to switch`;
+            this.legacyStatusTracker.pushOverride('profile-switch', preview, {
+                tone: 'info',
+            });
+        }
+    }
+    /**
+     * Enable or disable overlay
+     */
+    setOverlayEnabled(enabled) {
+        if (this.config.useUnifiedUI) {
+            this.uiController.updateConfig({ enableOverlay: enabled });
+        }
+    }
+    /**
+     * Get telemetry data (only available in unified mode)
+     */
+    getTelemetry() {
+        if (this.config.useUnifiedUI) {
+            return {
+                snapshot: this.uiController.getTelemetrySnapshot(),
+                performance: this.uiController.getPerformanceSummary(),
+            };
+        }
+        return null;
+    }
+    /**
+     * Switch between UI modes
+     */
+    switchUIMode(useUnified) {
+        this.config.useUnifiedUI = useUnified;
+        if (useUnified) {
+            // Clear legacy status tracker if it exists
+            if (this.legacyStatusTracker) {
+                this.legacyStatusTracker.reset();
+            }
+        }
+        else {
+            // Hide unified UI overlays
+            this.uiController.updateConfig({ enableOverlay: false });
+        }
+    }
+    /**
+     * Get action description for tool execution (Claude Code style)
+     * Returns a human-readable description of what the tool is doing
+     * Includes the actual file path, command, or search target when available
+     */
+    getToolActionDescription(call, progress) {
+        const args = call.arguments;
+        let description;
+        switch (call.name) {
+            case 'Read':
+            case 'read_file': {
+                const filePath = this.extractPath(args, ['file_path', 'path']);
+                description = filePath ? `Reading ${this.truncatePath(filePath)}` : 'Reading file...';
+                break;
+            }
+            case 'Write':
+            case 'write_file': {
+                const filePath = this.extractPath(args, ['file_path', 'path']);
+                description = filePath ? `Writing ${this.truncatePath(filePath)}` : 'Writing file...';
+                break;
+            }
+            case 'Edit':
+            case 'edit_file': {
+                const filePath = this.extractPath(args, ['file_path', 'path']);
+                description = filePath ? `Editing ${this.truncatePath(filePath)}` : 'Editing file...';
+                break;
+            }
+            case 'Bash':
+            case 'bash': {
+                const command = args?.['command'];
+                if (command) {
+                    // Show first meaningful part of command (truncated)
+                    const shortCmd = command.split('\n')[0]?.trim() || command;
+                    const truncated = shortCmd.length > 40 ? `${shortCmd.slice(0, 37)}...` : shortCmd;
+                    description = `Running: ${truncated}`;
+                }
+                else {
+                    description = 'Executing command...';
+                }
+                break;
+            }
+            case 'Grep':
+            case 'grep': {
+                const pattern = args?.['pattern'];
+                const path = this.extractPath(args, ['path', 'directory']);
+                if (pattern) {
+                    const truncPattern = pattern.length > 20 ? `${pattern.slice(0, 17)}...` : pattern;
+                    description = path
+                        ? `Searching "${truncPattern}" in ${this.truncatePath(path)}`
+                        : `Searching for "${truncPattern}"`;
+                }
+                else {
+                    description = 'Searching code...';
+                }
+                break;
+            }
+            case 'Glob':
+            case 'glob': {
+                const pattern = args?.['pattern'];
+                description = pattern ? `Finding files: ${pattern}` : 'Finding files...';
+                break;
+            }
+            case 'WebFetch':
+            case 'web_fetch': {
+                const url = args?.['url'];
+                if (url) {
+                    try {
+                        const hostname = new URL(url).hostname;
+                        description = `Fetching ${hostname}`;
+                    }
+                    catch {
+                        description = 'Fetching web content...';
+                    }
+                }
+                else {
+                    description = 'Fetching web content...';
+                }
+                break;
+            }
+            case 'WebSearch':
+            case 'web_search': {
+                const query = args?.['query'];
+                if (query) {
+                    const truncQuery = query.length > 30 ? `${query.slice(0, 27)}...` : query;
+                    description = `Searching: "${truncQuery}"`;
+                }
+                else {
+                    description = 'Searching web...';
+                }
+                break;
+            }
+            case 'Task':
+            case 'task': {
+                const taskDesc = args?.['description'];
+                description = taskDesc ? `Task: ${taskDesc}` : 'Running task...';
+                break;
+            }
+            default:
+                description = `Executing ${call.name}...`;
+        }
+        if (progress) {
+            const details = [];
+            if (progress.message?.trim()) {
+                details.push(progress.message.trim());
+            }
+            if (typeof progress.total === 'number' && progress.total > 0) {
+                const pct = Math.max(0, Math.min(100, Math.round((progress.current / progress.total) * 100)));
+                details.push(`${pct}%`);
+            }
+            if (details.length) {
+                return `${description} (${details.join(' ')})`;
+            }
+        }
+        return description;
+    }
+    /**
+     * Extract a path from tool arguments, checking multiple possible keys
+     */
+    extractPath(args, keys) {
+        if (!args)
+            return undefined;
+        for (const key of keys) {
+            const value = args[key];
+            if (typeof value === 'string' && value.trim()) {
+                return value.trim();
+            }
+        }
+        return undefined;
+    }
+    /**
+     * Truncate a file path to show just the filename or last path segments
+     * e.g., "/Users/bo/GitHub/project/src/ui/display.ts" -> "src/ui/display.ts"
+     */
+    truncatePath(fullPath, maxLen = 50) {
+        if (fullPath.length <= maxLen)
+            return fullPath;
+        const parts = fullPath.split('/').filter(Boolean);
+        if (parts.length <= 2)
+            return fullPath;
+        // Start from the end and build up until we exceed maxLen
+        let result = parts[parts.length - 1] || '';
+        for (let i = parts.length - 2; i >= 0; i--) {
+            const candidate = `${parts[i]}/${result}`;
+            if (candidate.length > maxLen - 3) {
+                return `.../${result}`;
+            }
+            result = candidate;
+        }
+        return result;
+    }
+    /**
+     * Set file change tracking callback
+     */
+    setFileChangeCallback(callback) {
+        this.fileChangeCallback = callback;
+    }
+    /**
+     * Set tool status callback - called when tools start/complete to update dynamic status
+     */
+    setToolStatusCallback(callback) {
+        this._toolStatusCallback = callback;
+    }
+    /**
+     * Parse file changes from Edit/Write tool output
+     */
+    parseFileChange(call, output) {
+        const args = call.arguments;
+        const path = args.file_path || args.path;
+        if (!path)
+            return null;
+        // Parse additions and removals from output
+        let additions = 0;
+        let removals = 0;
+        // For Edit tool: parse "Lines changed: +X / -Y" or "+X addition -Y removal"
+        const editMatch = output.match(/\+(\d+).*-(\d+)/);
+        if (editMatch) {
+            additions = parseInt(editMatch[1] || '0', 10);
+            removals = parseInt(editMatch[2] || '0', 10);
+        }
+        // Alternative format: "X addition" and "Y removal"
+        const addMatch = output.match(/(\d+)\s+addition/);
+        const remMatch = output.match(/(\d+)\s+removal/);
+        if (addMatch)
+            additions = parseInt(addMatch[1] || '0', 10);
+        if (remMatch)
+            removals = parseInt(remMatch[1] || '0', 10);
+        // For Write tool: estimate as all additions (new file or full rewrite)
+        if (call.name === 'Write' && additions === 0 && removals === 0) {
+            const lines = (args.content || '').split('\n').length;
+            additions = lines;
+        }
+        return {
+            path,
+            type: call.name === 'Edit' ? 'edit' : 'write',
+            additions,
+            removals
+        };
+    }
+    /**
+     * Display tool result summary using the centralized formatter.
+     * Claude Code style: ⎿ prefix for all results
+     * Routes through display module to work with scroll regions
+     */
+    displayToolResultSummary(call, output, success) {
+        const args = call.arguments || {};
+        const summary = formatToolResultSummary({
+            toolName: call.name,
+            args,
+            output,
+            success,
+            // durationMs could be tracked if we store start times
+        });
+        if (summary && summary.trim()) {
+            // Claude Code style: prefix each line with ⎿
+            const prefix = success ? theme.success('⎿') : theme.error('⎿');
+            const lines = summary.split('\n');
+            const prefixedLines = lines.map((line, i) => {
+                // First line gets the ⎿ prefix, subsequent lines get indentation
+                if (i === 0) {
+                    return `${prefix}  ${line}`;
+                }
+                return `   ${line}`;
+            });
+            // Add blank line after result for visual separation between events
+            // Use display.stream() to work with scroll regions
+            this.display.stream(`${prefixedLines.join('\n')}\n\n`);
+        }
+    }
+    /**
+     * Get current UI mode
+     */
+    getCurrentMode() {
+        return this.config.useUnifiedUI ? 'unified' : 'legacy';
+    }
+    /**
+     * Get UI state
+     */
+    getState() {
+        if (this.config.useUnifiedUI) {
+            return this.uiController.getState();
+        }
+        else {
+            return {
+                isProcessing: this.isProcessing,
+                contextUsage: this.contextUsage,
+            };
+        }
+    }
+    /**
+     * Dispose of resources
+     */
+    dispose() {
+        // Clear any pending timeouts to prevent process hang
+        if (this.profileSwitcherTimeout) {
+            clearTimeout(this.profileSwitcherTimeout);
+            this.profileSwitcherTimeout = undefined;
+        }
+        this.uiController.dispose();
+        if (this.legacyStatusTracker) {
+            // Clear all status
+            this.legacyStatusTracker.reset();
+        }
+    }
+}
+//# sourceMappingURL=ShellUIAdapter.js.map