Claude-Flow Console

import { getErrorMessage } from '../utils/error-handler.js'; /** * Simple orchestrator implementation for Node.js compatibility */ import { EventEmitter } from 'events'; import express from 'express'; import { WebSocketServer } from 'ws'; import { createServer } from 'http'; import { spawn } from 'child_process'; import path from 'path'; import { fileURLToPath } from 'url'; import cors from 'cors'; const __filename = fileURLToPath(import.meta.url); const __dirname = path.dirname(__filename); // Simple in-memory stores const agents = new Map(); const tasks = new Map(); const memory = new Map(); // Event bus const eventBus = new EventEmitter(); // Component status const componentStatus = { eventBus: false, orchestrator: false, memoryManager: false, terminalPool: false, mcpServer: false, coordinationManager: false, webUI: false }; // Simple MCP server function startMCPServer(port: number) { console.log(`🌐 Starting MCP server on port ${port}...`); // In a real implementation, this would start the actual MCP server componentStatus.mcpServer = true; return true; } // Enhanced web UI with console interface function startWebUI(host: string, port: number) { const app = express(); const server = createServer(app); const wss = new WebSocketServer({ server }); // Add CORS middleware for cross-origin support app.use(cors({ origin: '*', methods: ['GET', 'POST', 'PUT', 'DELETE', 'OPTIONS'], allowedHeaders: ['Content-Type', 'Authorization'], credentials: true })); // Global error handler middleware app.use((err: any, req: express.Request, res: express.Response, next: express.NextFunction) => { console.error('Global error handler:', err); res.status(err.status || 500).json({ error: err.message || 'Internal server error', timestamp: new Date().toISOString() }); }); // Request logging middleware app.use((req, res, next) => { console.log(`${new Date().toISOString()} ${req.method} ${req.path}`); next(); }); // Store CLI output history and active connections const outputHistory: string[] = []; const activeConnections: Set = new Set(); // CLI output capture system let cliProcess: any = null; const consoleHTML = ` Claude-Flow Console

`; app.get('/', (req, res) => { res.send(consoleHTML); }); // API endpoints app.get('/api/status', (req, res) => { res.json({ components: componentStatus, metrics: { agents: agents.size, tasks: tasks.size, memory: memory.size, connectedClients: activeConnections.size } }); }); app.get('/api/history', (req, res) => { const limit = parseInt(req.query.limit as string) || 100; res.json({ history: outputHistory.slice(-limit), total: outputHistory.length }); }); app.post('/api/command', express.json(), (req, res) => { const { command } = req.body; if (!command) { return res.status(400).json({ error: 'Command is required' }); } // Execute command and return immediately // Output will be sent via WebSocket try { broadcastToClients({ type: 'output', data: `API> ${command}\\n` }); executeCliCommand(command, null); res.json({ success: true, message: 'Command executed' }); } catch (error) { res.status(500).json({ error: (error instanceof Error ? error.message : String(error)) }); } }); app.get('/api/agents', (req, res) => { const agentList = Array.from(agents.entries()).map(([id, agent]) => ({ id, ...agent })); res.json(agentList); }); app.get('/api/tasks', (req, res) => { const taskList = Array.from(tasks.entries()).map(([id, task]) => ({ id, ...task })); res.json(taskList); }); app.get('/api/memory', (req, res) => { const memoryList = Array.from(memory.entries()).map(([key, value]) => ({ key, value, type: typeof value, size: JSON.stringify(value).length })); res.json(memoryList); }); // Health check endpoint app.get('/health', (req, res) => { res.json({ status: 'healthy', timestamp: new Date().toISOString(), uptime: process.uptime(), components: componentStatus }); }); // WebSocket for real-time CLI interaction wss.on('connection', (ws, req) => { const clientIp = req.headers['x-forwarded-for'] || req.socket.remoteAddress; console.log(`🔌 WebSocket client connected from ${clientIp}`); activeConnections.add(ws); // Send initial status and history ws.send(JSON.stringify({ type: 'status', data: { ...componentStatus, cliActive: true } })); // Send recent output history outputHistory.slice(-50).forEach(line => { ws.send(JSON.stringify({ type: 'output', data: line })); }); // Handle incoming commands ws.on('message', (message) => { try { const data = JSON.parse(message.toString()); console.log(`Received command from client: ${data.type}`); if (data.type === 'command') { handleCliCommand(data.data, ws); } else if (data.type === 'ping') { // Handle ping/pong for connection keepalive ws.send(JSON.stringify({ type: 'pong', timestamp: Date.now() })); } } catch (error) { console.error('Failed to handle WebSocket message:', error); ws.send(JSON.stringify({ type: 'error', data: `Invalid message format: ${(error instanceof Error ? error.message : String(error))}`, timestamp: new Date().toISOString() })); } }); ws.on('close', () => { console.log('🔌 WebSocket client disconnected'); activeConnections.delete(ws); }); ws.on('error', (error) => { console.error('WebSocket client error:', error); // Send detailed error information to client before closing try { ws.send(JSON.stringify({ type: 'error', data: `Server WebSocket error: ${(error instanceof Error ? error.message : String(error)) || 'Unknown error'}`, timestamp: new Date().toISOString() })); } catch (sendError) { console.error('Failed to send error to client:', sendError); } activeConnections.delete(ws); }); }); // Helper function to send response to specific client or broadcast function sendResponse(ws: any, data: any) { if (ws) { ws.send(JSON.stringify(data)); } else { broadcastToClients(data); } } // CLI command execution handler function handleCliCommand(command: string, ws: any) { try { // Add timestamp and format output const timestamp = new Date().toLocaleTimeString(); const logEntry = `[${timestamp}] Executing: ${command}`; outputHistory.push(logEntry); // Broadcast to all connected clients broadcastToClients({ type: 'output', data: `[${timestamp}] Executing: ${command}\\n` }); // Execute the command executeCliCommand(command, ws); } catch (error) { const errorMsg = `Error executing command: ${(error instanceof Error ? error.message : String(error))}`; outputHistory.push(errorMsg); sendResponse(ws, { type: 'error', data: errorMsg }); } } // Execute CLI commands and capture output function executeCliCommand(command: string, ws: any) { // Handle built-in commands first if (command === 'help') { const helpText = `Available Commands: • help - Show this help message • status - Show system status • agent list - List all agents • agent spawn [type] - Spawn a new agent • task list - List all tasks • memory list - List memory entries • config show - Show configuration • clear - Clear console • version - Show version information Note: This is a web console interface for claude-flow CLI commands. `; sendResponse(ws, { type: 'output', data: helpText }); sendResponse(ws, { type: 'command_complete' }); return; } if (command === 'clear') { sendResponse(ws, { type: 'output', data: '\\x1b[2J\\x1b[H' // ANSI clear screen }); sendResponse(ws, { type: 'command_complete' }); return; } if (command === 'status') { const statusText = `System Status: • Event Bus: ${componentStatus.eventBus ? 'Active' : 'Inactive'} • Orchestrator: ${componentStatus.orchestrator ? 'Active' : 'Inactive'} • Memory Manager: ${componentStatus.memoryManager ? 'Active' : 'Inactive'} • Terminal Pool: ${componentStatus.terminalPool ? 'Active' : 'Inactive'} • MCP Server: ${componentStatus.mcpServer ? 'Active' : 'Inactive'} • Coordination Manager: ${componentStatus.coordinationManager ? 'Active' : 'Inactive'} • Web UI: ${componentStatus.webUI ? 'Active' : 'Inactive'} Metrics: • Active Agents: ${agents.size} • Pending Tasks: ${tasks.size} • Memory Entries: ${memory.size} `; sendResponse(ws, { type: 'output', data: statusText }); sendResponse(ws, { type: 'command_complete' }); return; } // For other commands, spawn a subprocess const args = command.split(' '); const cmd = args[0]; const cmdArgs = args.slice(1); // Determine the correct claude-flow executable path const rootDir = path.resolve(__dirname, '../..'); const cliPath = path.join(rootDir, 'bin', 'claude-flow'); // Spawn the command const child = spawn('node', [path.join(rootDir, 'src/cli/simple-cli.js'), ...cmdArgs], { stdio: ['pipe', 'pipe', 'pipe'], env: { ...process.env, CLAUDE_FLOW_WEB_MODE: 'true' } }); // Handle stdout child.stdout.on('data', (data) => { const output = data.toString(); outputHistory.push(output); // Convert ANSI colors to HTML spans const htmlOutput = convertAnsiToHtml(output); broadcastToClients({ type: 'output', data: htmlOutput }); }); // Handle stderr child.stderr.on('data', (data) => { const error = data.toString(); outputHistory.push(error); broadcastToClients({ type: 'error', data: convertAnsiToHtml(error) }); }); // Handle process exit child.on('close', (code) => { const exitMsg = code === 0 ? `Command completed successfully` : `Command failed with exit code ${code}`; broadcastToClients({ type: 'output', data: `\\n${exitMsg}\\n` }); sendResponse(ws, { type: 'command_complete' }); }); child.on('error', (error) => { const errorMsg = `Failed to execute command: ${(error instanceof Error ? error.message : String(error))}`; outputHistory.push(errorMsg); sendResponse(ws, { type: 'error', data: errorMsg }); sendResponse(ws, { type: 'command_complete' }); }); } // Broadcast message to all connected clients function broadcastToClients(message: any) { const messageStr = JSON.stringify(message); activeConnections.forEach(client => { if (client.readyState === 1) { // WebSocket.OPEN client.send(messageStr); } }); } // Convert ANSI escape codes to HTML function convertAnsiToHtml(text: string): string { return text .replace(/\x1b\[0m/g, '') .replace(/\x1b\[1m/g, '') .replace(/\x1b\[31m/g, '') .replace(/\x1b\[32m/g, '') .replace(/\x1b\[33m/g, '') .replace(/\x1b\[34m/g, '') .replace(/\x1b\[35m/g, '') .replace(/\x1b\[36m/g, '') .replace(/\x1b\[37m/g, '') .replace(/\x1b\[90m/g, '') .replace(/\x1b\[[0-9;]*m/g, '') // Remove any remaining ANSI codes .replace(/\n/g, '\\n') .replace(//g, '>') .replace(/<span/g, ''); } return new Promise((resolve, reject) => { server.on('error', (err: any) => { if (err.code === 'EADDRINUSE') { console.error(`\n❌ Port ${port} is already in use`); console.log(`💡 Try a different port: claude-flow start --ui --port ${port + 1}`); console.log(`💡 Or stop the process using port ${port}: lsof -ti:${port} | xargs kill -9`); componentStatus.webUI = false; reject(err); } else { console.error('❌ Web UI server error:', err.message, err.stack); reject(err); } }); server.listen(port, host, () => { console.log(`🌐 Web UI available at http://${host}:${port}`); componentStatus.webUI = true; resolve(server); }); }); } // Start all components export async function startOrchestrator(options: any) { console.log('\n🚀 Starting orchestration components...\n'); // Start Event Bus console.log('⚡ Starting Event Bus...'); componentStatus.eventBus = true; eventBus.emit('system:start'); console.log('✅ Event Bus started'); // Start Orchestrator Engine console.log('🧠 Starting Orchestrator Engine...'); componentStatus.orchestrator = true; console.log('✅ Orchestrator Engine started'); // Start Memory Manager console.log('💾 Starting Memory Manager...'); componentStatus.memoryManager = true; console.log('✅ Memory Manager started'); // Start Terminal Pool console.log('🖥️ Starting Terminal Pool...'); componentStatus.terminalPool = true; console.log('✅ Terminal Pool started'); // Start MCP Server const mcpPort = options.mcpPort || 3001; startMCPServer(mcpPort); console.log('✅ MCP Server started'); // Start Coordination Manager console.log('🔄 Starting Coordination Manager...'); componentStatus.coordinationManager = true; console.log('✅ Coordination Manager started'); // Start Web UI if requested if (options.ui && !options.noUi) { const host = options.host || 'localhost'; const port = options.port || 3000; try { await startWebUI(host, port); } catch (err: any) { if (err.code === 'EADDRINUSE') { console.log('\n⚠️ Web UI could not start due to port conflict'); console.log(' Orchestrator is running without Web UI'); } else { console.error('\n⚠️ Web UI failed to start:', err.message); } } } console.log('\n✅ All components started successfully!'); console.log('\n📊 System Status:'); console.log(' • Event Bus: Active'); console.log(' • Orchestrator: Active'); console.log(' • Memory Manager: Active'); console.log(' • Terminal Pool: Active'); console.log(' • MCP Server: Active'); console.log(' • Coordination Manager: Active'); if (options.ui && !options.noUi) { console.log(` • Web UI: Active at http://${options.host || 'localhost'}:${options.port || 3000}`); } console.log('\n💡 Use "claude-flow status" to check system status'); console.log('💡 Use "claude-flow stop" to stop the orchestrator'); // Keep the process running if (!options.daemon) { console.log('\n📌 Press Ctrl+C to stop the orchestrator...\n'); // Handle graceful shutdown process.on('SIGINT', () => { console.log('\n\n🛑 Shutting down orchestrator...'); process.exit(0); }); } } // Export component status for other commands export function getComponentStatus() { return componentStatus; } // Export stores for other commands export function getStores() { return { agents, tasks, memory }; }