NEW FEATURE: Service Dashboard
- Real-time monitoring of all Claude OS services
- Visual status indicators (running/stopped/unknown)
- CPU and memory usage tracking
- Auto-refresh every 5 seconds (toggleable)
- Service health summary (healthy/degraded/critical)
BACKEND (mcp_server/server.py):
- Added /api/services/status endpoint
- Monitors 6 services: MCP Server, Frontend, Redis, RQ Worker, Ollama, File Watcher
- Returns real-time status, PID, CPU%, Memory%, ports
- Includes health summary (total/running/stopped)
- Added /api/services/{service_type}/control endpoint
- Placeholder for future service control
- Returns manual commands for start/stop/restart
- Implemented process monitoring utilities:
- check_process_running() - uses pgrep and ps for stats
- check_port_listening() - uses lsof/netstat/ss for port checks
FRONTEND (ServiceDashboard.tsx):
- Beautiful dashboard with animated cards
- Service grid with 6 service cards
- Summary cards: Total, Running, Stopped, Health
- Auto-refresh toggle with visual indicator
- Manual refresh button
- Status badges with color coding:
- 🟢 Green = Running
- ⚪ Gray = Stopped
- 🟡 Yellow = Unknown
- CPU/Memory usage display
- Port and PID information
- Clickable service URLs
- Help section with management commands
INTEGRATION (MainApp.tsx):
- Added "Services" tab to main navigation
- Imported ServiceDashboard component
- Updated tab state type to include 'services'
- Activity icon for services tab
FEATURES:
✅ Real-time status monitoring
✅ Auto-refresh every 5s
✅ Manual refresh button
✅ Health summary dashboard
✅ Service details (port, PID, CPU, memory)
✅ Visual status indicators
✅ Responsive grid layout
✅ Beautiful animations
USER EXPERIENCE:
- Auto-refresh can be toggled on/off
- Last updated timestamp shown
- Help text for service management
- Clean, professional UI matching Claude OS design
Files:
- mcp_server/server.py (+300 lines)
- frontend/src/components/ServiceDashboard.tsx (new file, 350 lines)
- frontend/src/pages/MainApp.tsx (+20 lines)