claude-os/frontend/src
Claude 98908541a7
✨ FEATURE: Add real-time Service Dashboard
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)
2025-11-04 19:24:03 +00:00
..
assets Major updates to use react and agent os profiles 2025-10-23 19:23:05 -05:00
components ✨ FEATURE: Add real-time Service Dashboard 2025-11-04 19:24:03 +00:00
pages ✨ FEATURE: Add real-time Service Dashboard 2025-11-04 19:24:03 +00:00
App.tsx Add simple email/password authentication to frontend 2025-10-30 21:07:53 -05:00
index.css Almost got the mosnter finished 2025-10-27 17:41:44 -05:00
main.tsx Major updates to use react and agent os profiles 2025-10-23 19:23:05 -05:00