vibecodingmachine-cli 1.0.0

package/src/utils/auto-mode-ansi-ui.js

@@ -0,0 +1,238 @@
+const chalk = require('chalk');
+const ansiEscapes = require('ansi-escapes');
+const stripAnsi = require('strip-ansi');
+
+/**
+ * ANSI-based UI for Auto Mode
+ * Simple, reliable, no module system issues
+ */
+class AutoModeANSIUI {
+  constructor(options = {}) {
+    this.menuContent = options.menuContent || '';
+    this.onExit = options.onExit;
+    this.requirement = 'Loading...';
+    this.step = 'PREPARE';
+    this.chatCount = 0;
+    this.maxChats = null;
+    this.progress = 0;
+    this.outputLines = [];
+    this.maxOutputLines = 15;
+
+    // Hide cursor for cleaner output
+    process.stdout.write(ansiEscapes.cursorHide);
+
+    // Handle exit - just use SIGINT, don't try to capture keys
+    // (stdin might be used by child process like Aider)
+    this.handleExit = () => {
+      this.destroy();
+      if (this.onExit) {
+        this.onExit();
+      }
+      process.exit(0);
+    };
+
+    process.on('SIGINT', this.handleExit);
+    process.on('SIGTERM', this.handleExit);
+
+    // Initial render
+    this.render();
+  }
+
+  updateStatus(status) {
+    if (status.requirement !== undefined) this.requirement = status.requirement;
+    if (status.step !== undefined) this.step = status.step;
+    if (status.chatCount !== undefined) this.chatCount = status.chatCount;
+    if (status.maxChats !== undefined) this.maxChats = status.maxChats;
+    if (status.progress !== undefined) this.progress = status.progress;
+    this.render();
+  }
+
+  appendOutput(line) {
+    // Safety: truncate very long lines to prevent memory issues
+    const maxLineLength = 500;
+    const safeLine = line.length > maxLineLength ? line.substring(0, maxLineLength) + '...' : line;
+
+    this.outputLines.push(safeLine);
+    // Keep only last N lines
+    if (this.outputLines.length > this.maxOutputLines) {
+      this.outputLines = this.outputLines.slice(-this.maxOutputLines);
+    }
+    this.render();
+  }
+
+  clearOutput() {
+    this.outputLines = [];
+    this.render();
+  }
+
+  render() {
+    // Clear screen and move cursor to top
+    process.stdout.write(ansiEscapes.clearScreen);
+    process.stdout.write(ansiEscapes.cursorTo(0, 0));
+
+    let output = '';
+
+    // Header box
+    output += this.drawBox(this.menuContent, { color: 'cyan', style: 'round' });
+    output += '\n';
+
+    // Status card
+    const statusContent = this.buildStatusContent();
+    output += this.drawBox(statusContent, { color: 'magenta', style: 'round', title: ' Auto Mode Status ' });
+    output += '\n';
+
+    // Output log
+    const outputContent = this.buildOutputContent();
+    output += this.drawBox(outputContent, { color: 'green', style: 'single', title: ' Aider Output ' });
+
+    process.stdout.write(output);
+  }
+
+  buildStatusContent() {
+    const stepColors = {
+      'PREPARE': chalk.cyan,
+      'ACT': chalk.yellow,
+      'CLEAN UP': chalk.magenta,
+      'VERIFY': chalk.blue,
+      'DONE': chalk.green,
+      'UNKNOWN': chalk.gray
+    };
+
+    const stepColor = stepColors[this.step] || chalk.gray;
+
+    // Progress bar
+    const barWidth = 40;
+    const filledWidth = Math.round((this.progress / 100) * barWidth);
+    const emptyWidth = barWidth - filledWidth;
+    const progressBar = chalk.green('█'.repeat(filledWidth)) + chalk.gray('░'.repeat(emptyWidth));
+
+    // Chat counter
+    const chatDisplay = this.maxChats
+      ? `Chat ${this.chatCount}/${this.maxChats}`
+      : `Chat ${this.chatCount} (unlimited)`;
+
+    // Truncate requirement if too long
+    const displayReq = this.requirement.length > 70
+      ? this.requirement.substring(0, 67) + '...'
+      : this.requirement;
+
+    return `
+${chalk.bold('📋 Current Requirement')}
+
+${displayReq}
+
+${chalk.bold('🚦 Status:')} ${stepColor.bold(this.step)}
+
+${progressBar} ${this.progress}%
+
+${chalk.gray(chatDisplay)}
+`.trim();
+  }
+
+  buildOutputContent() {
+    if (this.outputLines.length === 0) {
+      return chalk.gray('No output yet...');
+    }
+    return this.outputLines.join('\n');
+  }
+
+  drawBox(content, options = {}) {
+    const { color = 'white', style = 'single', title = '' } = options;
+    const colorFn = chalk[color] || chalk.white;
+
+    // Box drawing characters
+    const chars = {
+      single: {
+        topLeft: '┌',
+        topRight: '┐',
+        bottomLeft: '└',
+        bottomRight: '┘',
+        horizontal: '─',
+        vertical: '│'
+      },
+      round: {
+        topLeft: '╭',
+        topRight: '╮',
+        bottomLeft: '╰',
+        bottomRight: '╯',
+        horizontal: '─',
+        vertical: '│'
+      },
+      double: {
+        topLeft: '╔',
+        topRight: '╗',
+        bottomLeft: '╚',
+        bottomRight: '╝',
+        horizontal: '═',
+        vertical: '║'
+      }
+    };
+
+    const boxChars = chars[style] || chars.single;
+    const lines = content.split('\n');
+
+    // Use fixed width to avoid any width calculation issues
+    const terminalWidth = process.stdout.columns || 80;
+    const width = Math.min(terminalWidth - 4, 60);
+
+    // Top border
+    let box = colorFn(boxChars.topLeft);
+    if (title) {
+      const titleLen = title.length;
+      const leftPad = Math.floor((width - titleLen - 2) / 2);
+      box += colorFn(boxChars.horizontal.repeat(leftPad));
+      box += colorFn(title);
+      box += colorFn(boxChars.horizontal.repeat(width - leftPad - titleLen));
+    } else {
+      box += colorFn(boxChars.horizontal.repeat(width));
+    }
+    box += colorFn(boxChars.topRight) + '\n';
+
+    // Content lines - use fixed padding to avoid width calculations
+    lines.forEach(line => {
+      // Truncate long lines
+      const maxLen = width - 4;
+      const displayLine = line.length > maxLen ? line.substring(0, maxLen - 3) + '...' : line;
+      const padding = Math.max(0, width - displayLine.length - 2);
+      box += colorFn(boxChars.vertical) + ' ' + displayLine + ' '.repeat(padding) + ' ' + colorFn(boxChars.vertical) + '\n';
+    });
+
+    // Bottom border
+    box += colorFn(boxChars.bottomLeft) + colorFn(boxChars.horizontal.repeat(width)) + colorFn(boxChars.bottomRight);
+
+    return box;
+  }
+
+  getStringWidth(str) {
+    // Simple character count - don't try to strip ANSI
+    // This avoids any regex issues entirely
+    return str.length;
+  }
+
+  destroy() {
+    // Clean up listeners
+    if (this.handleExit) {
+      process.removeListener('SIGINT', this.handleExit);
+      process.removeListener('SIGTERM', this.handleExit);
+    }
+
+    // Show cursor again
+    process.stdout.write(ansiEscapes.cursorShow);
+  }
+}
+
+/**
+ * Create and display an ANSI-based UI for Auto Mode
+ * @param {object} options - UI configuration
+ * @param {string} options.menuContent - Menu content to display in header
+ * @param {function} options.onExit - Callback when user presses Ctrl+C
+ * @returns {AutoModeANSIUI} UI instance
+ */
+function createAutoModeUI(options = {}) {
+  return new AutoModeANSIUI(options);
+}
+
+module.exports = {
+  createAutoModeUI,
+  AutoModeANSIUI
+};

package/src/utils/auto-mode-simple-ui.js

@@ -0,0 +1,161 @@
+const chalk = require('chalk');
+const boxen = require('boxen');
+
+/**
+ * Simple status-line UI for Auto Mode with persistent workflow card
+ * Shows a purple card similar to Electron app that stays visible
+ */
+class AutoModeSimpleUI {
+  constructor(options = {}) {
+    this.menuContent = options.menuContent || '';
+    this.requirement = 'Loading...';
+    this.step = 'PREPARE';
+    this.chatCount = 0;
+    this.maxChats = null;
+    this.progress = 0;
+    this.outputLineCount = 0; // Track output lines for periodic re-render
+    this.lastCardPrintTime = Date.now(); // Track when we last printed the card
+    this.lastCardPrintLine = 0; // Track line count when we last printed the card
+
+    // Print header once
+    console.log('\n' + chalk.bold.cyan('═══════════════════════════════════════════════════════════'));
+    console.log(this.menuContent);
+    console.log(chalk.bold.cyan('═══════════════════════════════════════════════════════════') + '\n');
+
+    // Initial workflow card
+    this.printWorkflowCard();
+  }
+
+  updateStatus(status) {
+    if (status.requirement !== undefined) this.requirement = status.requirement;
+    if (status.step !== undefined) this.step = status.step;
+    if (status.chatCount !== undefined) this.chatCount = status.chatCount;
+    if (status.maxChats !== undefined) this.maxChats = status.maxChats;
+    if (status.progress !== undefined) this.progress = status.progress;
+
+    this.printWorkflowCard();
+  }
+
+  /**
+   * Get icon for each workflow stage based on current step
+   */
+  getStepIcon(stage, currentStage) {
+    const stageOrder = ['PREPARE', 'ACT', 'CLEAN UP', 'VERIFY', 'DONE'];
+    const currentIndex = stageOrder.indexOf(currentStage);
+    const stepIndex = stageOrder.indexOf(stage);
+
+    if (stepIndex < currentIndex) {
+      return '✅'; // Completed steps
+    } else if (stepIndex === currentIndex) {
+      if (currentStage === 'DONE') {
+        return '✅'; // Done is always checked
+      } else {
+        return '🔨'; // Current step
+      }
+    } else {
+      return '⏳'; // Pending steps
+    }
+  }
+
+  /**
+   * Render the persistent workflow card (similar to Electron app's purple card)
+   */
+  printWorkflowCard() {
+    // Step color mapping
+    const stepColors = {
+      'PREPARE': chalk.cyan,
+      'ACT': chalk.yellow,
+      'CLEAN UP': chalk.magenta,
+      'VERIFY': chalk.blue,
+      'DONE': chalk.green,
+      'UNKNOWN': chalk.gray
+    };
+
+    const currentStepColor = stepColors[this.step] || chalk.gray;
+
+    // Build workflow states line: PREPARE ⏳ ACT ⏳ CLEAN UP ⏳ VERIFY ⏳ DONE
+    const stages = [
+      { name: 'PREPARE', color: chalk.cyan },
+      { name: 'ACT', color: chalk.yellow },
+      { name: 'CLEAN UP', color: chalk.magenta },
+      { name: 'VERIFY', color: chalk.blue },
+      { name: 'DONE', color: chalk.green }
+    ];
+
+    const workflowLine = stages.map((stage, index) => {
+      const icon = this.getStepIcon(stage.name, this.step);
+      const isCurrent = stage.name === this.step;
+      const stageColor = isCurrent ? currentStepColor.bold : stage.color;
+      return `${icon} ${stageColor(stage.name)}`;
+    }).join(` ${chalk.gray('⏳')} `);
+
+    // Truncate requirement if too long
+    const displayReq = this.requirement.length > 70
+      ? this.requirement.substring(0, 67) + '...'
+      : this.requirement;
+
+    // Build card content
+    const cardContent = [
+      workflowLine,
+      '',
+      chalk.bold.white(`🎯 Working on: ${displayReq}`)
+    ].join('\n');
+
+    // Render card with purple/magenta border (matching Electron app)
+    const card = boxen(cardContent, {
+      padding: { left: 1, right: 1, top: 1, bottom: 1 },
+      margin: { top: 0, right: 0, bottom: 1, left: 0 },
+      borderStyle: 'round',
+      borderColor: 'magenta',
+      backgroundColor: 'black'
+    });
+    
+    // Print the card with a separator line before it for visibility
+    if (this.outputLineCount > 0) {
+      // Add separator when re-printing after output
+      console.log(chalk.gray('─'.repeat(80)));
+    }
+    console.log(card);
+    this.lastCardPrintTime = Date.now();
+    this.lastCardPrintLine = this.outputLineCount;
+  }
+
+  appendOutput(line) {
+    // Periodically re-print the workflow card to keep it visible
+    // Re-print every 20 lines of output, or if more than 5 seconds have passed
+    const linesSinceLastCard = this.outputLineCount - this.lastCardPrintLine;
+    const timeSinceLastCard = Date.now() - this.lastCardPrintTime;
+    
+    if (linesSinceLastCard >= 20 || timeSinceLastCard > 5000) {
+      this.printWorkflowCard();
+    }
+    
+    // Increment output line counter
+    if (line && line.trim()) {
+      this.outputLineCount++;
+      console.log(line);
+    }
+  }
+
+  clearOutput() {
+    // No-op for simple UI
+  }
+
+  destroy() {
+    console.log('\n' + chalk.bold.green('Auto mode exited.') + '\n');
+  }
+}
+
+/**
+ * Create and display a simple status UI for Auto Mode
+ * @param {object} options - UI configuration
+ * @returns {AutoModeSimpleUI} UI instance
+ */
+function createAutoModeUI(options = {}) {
+  return new AutoModeSimpleUI(options);
+}
+
+module.exports = {
+  createAutoModeUI,
+  AutoModeSimpleUI
+};

package/src/utils/auto-mode-ui.js.bak.blessed

@@ -0,0 +1,207 @@
+const blessed = require('blessed');
+const chalk = require('chalk');
+
+/**
+ * Create and display a blessed-based UI for Auto Mode
+ * Shows: persistent menu header, status card, and scrolling output
+ * @param {object} options - UI configuration
+ * @param {string} options.menuContent - Menu content to display in header
+ * @param {function} options.onExit - Callback when user presses Ctrl+C or q
+ * @returns {object} UI interface with methods to update status and append output
+ */
+function createAutoModeUI(options = {}) {
+  const { menuContent = '', onExit } = options;
+
+  // Create screen
+  const screen = blessed.screen({
+    smartCSR: true,
+    title: 'AllNightAI Auto Mode',
+    fullUnicode: true,
+    forceUnicode: true
+  });
+
+  // Clear screen and render immediately
+  screen.clearRegion(0, screen.width, 0, screen.height);
+
+  // Header box (menu) - use fixed height instead of shrink
+  const headerHeight = 11; // Fixed height for header
+  const header = blessed.box({
+    top: 0,
+    left: 0,
+    width: '100%',
+    height: headerHeight,
+    content: menuContent,
+    tags: true,
+    border: {
+      type: 'line'
+    },
+    style: {
+      border: {
+        fg: 'cyan'
+      }
+    }
+  });
+
+  // Status card (purple/magenta border like GUI)
+  const statusCardHeight = 12;
+  const statusCard = blessed.box({
+    top: headerHeight,
+    left: 0,
+    width: '100%',
+    height: statusCardHeight,
+    tags: true,
+    border: {
+      type: 'round'
+    },
+    style: {
+      border: {
+        fg: 'magenta'
+      }
+    },
+    label: ' Auto Mode Status '
+  });
+
+  // Output log (scrollable)
+  const totalHeaderHeight = headerHeight + statusCardHeight;
+  const outputLog = blessed.log({
+    top: totalHeaderHeight,
+    left: 0,
+    width: '100%',
+    height: `100%-${totalHeaderHeight}`,
+    tags: true,
+    border: {
+      type: 'line'
+    },
+    style: {
+      border: {
+        fg: 'green'
+      }
+    },
+    label: ' Aider Output ',
+    scrollable: true,
+    alwaysScroll: true,
+    mouse: true,
+    keys: true,
+    vi: true,
+    scrollbar: {
+      ch: ' ',
+      track: {
+        bg: 'cyan'
+      },
+      style: {
+        inverse: true
+      }
+    }
+  });
+
+  // Append all elements to screen
+  screen.append(header);
+  screen.append(statusCard);
+  screen.append(outputLog);
+
+  // Focus the output log for scrolling
+  outputLog.focus();
+
+  // Key bindings
+  screen.key(['escape', 'q', 'C-c'], () => {
+    if (onExit) {
+      onExit();
+    }
+    screen.destroy();
+    process.exit(0);
+  });
+
+  // Initial render
+  screen.render();
+
+  /**
+   * Update the status card with new status information
+   * @param {object} status - Status object
+   * @param {string} status.requirement - Current requirement
+   * @param {string} status.step - Current step (PREPARE, ACT, CLEAN UP, VERIFY, DONE)
+   * @param {number} status.chatCount - Current chat count
+   * @param {number|null} status.maxChats - Max chats or null for unlimited
+   * @param {number} status.progress - Progress percentage (0-100)
+   */
+  function updateStatus(status) {
+    const {
+      requirement = 'No requirement loaded',
+      step = 'UNKNOWN',
+      chatCount = 0,
+      maxChats = null,
+      progress = 0
+    } = status;
+
+    // Step color mapping
+    const stepColors = {
+      'PREPARE': '{cyan-fg}',
+      'ACT': '{yellow-fg}',
+      'CLEAN UP': '{magenta-fg}',
+      'VERIFY': '{blue-fg}',
+      'DONE': '{green-fg}',
+      'UNKNOWN': '{gray-fg}'
+    };
+
+    const stepColor = stepColors[step] || '{gray-fg}';
+
+    // Progress bar
+    const barWidth = 40;
+    const filledWidth = Math.round((progress / 100) * barWidth);
+    const emptyWidth = barWidth - filledWidth;
+    const progressBar = '{green-fg}' + '█'.repeat(filledWidth) + '{/green-fg}' +
+                        '{gray-fg}' + '░'.repeat(emptyWidth) + '{/gray-fg}';
+
+    // Chat counter
+    const chatDisplay = maxChats
+      ? `Chat ${chatCount}/${maxChats}`
+      : `Chat ${chatCount} (unlimited)`;
+
+    // Build card content
+    const content = `
+  {bold}📋 Current Requirement{/bold}
+
+  ${requirement.length > 70 ? requirement.substring(0, 67) + '...' : requirement}
+
+  {bold}🚦 Status:{/bold} ${stepColor}{bold}${step}{/bold}{/}
+
+  ${progressBar} ${progress}%
+
+  {gray-fg}${chatDisplay}{/gray-fg}
+`;
+
+    statusCard.setContent(content);
+    screen.render();
+  }
+
+  /**
+   * Append a line to the output log
+   * @param {string} line - Line to append
+   */
+  function appendOutput(line) {
+    outputLog.log(line);
+    screen.render();
+  }
+
+  /**
+   * Clear the output log
+   */
+  function clearOutput() {
+    outputLog.setContent('');
+    screen.render();
+  }
+
+  return {
+    screen,
+    header,
+    statusCard,
+    outputLog,
+    updateStatus,
+    appendOutput,
+    clearOutput,
+    destroy: () => screen.destroy()
+  };
+}
+
+module.exports = {
+  createAutoModeUI
+};

package/src/utils/auto-mode.js

@@ -0,0 +1,65 @@
+const path = require('path');
+const fs = require('fs-extra');
+const { getRepoPath } = require('./config');
+const { logAutoModeStart, logAutoModeStop } = require('@vibecodingmachine/core');
+
+function getStatusPath(repoPath) {
+  return path.join(repoPath, '.vibecodingmachine', 'temp', 'auto-status.json');
+}
+
+async function checkAutoModeStatus() {
+  const repoPath = await getRepoPath();
+  if (!repoPath) return { running: false };
+  const statusPath = getStatusPath(repoPath);
+  if (!await fs.pathExists(statusPath)) return { running: false };
+  try {
+    const status = await fs.readJson(statusPath);
+    return status;
+  } catch {
+    return { running: false };
+  }
+}
+
+async function startAutoMode(repoPath, config) {
+  const statusPath = getStatusPath(repoPath);
+  await fs.ensureDir(path.dirname(statusPath));
+  const status = {
+    running: true,
+    startedAt: new Date().toISOString(),
+    chatCount: 0,
+    ide: config.ide || 'cline'
+  };
+  await fs.writeJson(statusPath, status, { spaces: 2 });
+
+  // Log to audit log
+  logAutoModeStart(config.ide || 'cline', config.maxChats || 0);
+}
+
+async function stopAutoMode(reason = 'manual') {
+  const repoPath = await getRepoPath();
+  if (!repoPath) return;
+  const statusPath = getStatusPath(repoPath);
+  if (!await fs.pathExists(statusPath)) return;
+  const current = await fs.readJson(statusPath).catch(() => ({}));
+  await fs.writeJson(statusPath, { ...current, running: false }, { spaces: 2 });
+
+  // Log to audit log
+  logAutoModeStop(reason);
+}
+
+async function updateAutoModeStatus(repoPath, updates) {
+  const statusPath = getStatusPath(repoPath);
+  if (!await fs.pathExists(statusPath)) return;
+  const current = await fs.readJson(statusPath).catch(() => ({ running: true }));
+  await fs.writeJson(statusPath, { ...current, ...updates }, { spaces: 2 });
+}
+
+module.exports = {
+  checkAutoModeStatus,
+  startAutoMode,
+  stopAutoMode,
+  updateAutoModeStatus
+};
+
+
+