4.4 KiB
4.4 KiB
name, description, metadata
| name | description | metadata | ||||||||||
|---|---|---|---|---|---|---|---|---|---|---|---|---|
| dashboard | Web dashboard for managing skills, memory, and system status |
|
Dashboard Skill
Web-based control panel for the VibeStack agent machine.
Features
- Skills Overview: View all installed skills, their status, and capabilities
- Memory Browser: Search and browse agent memory (conversations, findings, etc.)
- Backup Management: View backup status, trigger manual backups, restore
- Logs Viewer: Real-time log tailing with filtering
- System Stats: Disk, memory, CPU usage
- Skill Discovery: Browse and install new skills (via skill-downloader)
Awareness
This dashboard is aware of:
Caddy Configuration
- Reads
/skills/caddy/Caddyfileandsnippets.d/*.caddy - Shows which domains/routes are configured
- Displays TLS certificate status
Installed Skills
- Scans
/skills/*/SKILL.mdfor all installed skills - Parses YAML frontmatter for metadata (name, version, requires, etc.)
- Shows skill dependencies and relationships
- Reads skill documentation for capabilities
Extensibility
- skill-downloader (planned): Install new skills from git repositories
- skill-creator (planned): Create new skills from templates or AI generation
Configuration
Environment Variables
| Variable | Default | Description |
|---|---|---|
DASHBOARD_PORT |
3000 |
Dashboard port |
DASHBOARD_DOMAIN |
(none) | Domain for Caddy auto-config |
SUPERVISOR_URL |
http://localhost:9001 |
Supervisor XML-RPC URL |
MEMORY_URL |
http://localhost:8081 |
Memory API URL |
Tech Stack
- Vite - Build tool
- React 18 - UI framework
- TypeScript - Type safety
- Tailwind CSS - Styling
- Lucide React - Icons
- React Query - Data fetching
API Endpoints
The dashboard backend provides:
GET /api/skills # List all skills with metadata
GET /api/skills/:name # Get skill details
GET /api/supervisor/status # Process status from supervisor
POST /api/supervisor/:name/restart # Restart a process
GET /api/caddy/config # Caddy configuration
GET /api/system/stats # System resource usage
GET /api/logs/:skill # Tail logs for a skill
Pages
| Route | Description |
|---|---|
/ |
Overview dashboard with quick stats |
/skills |
All skills with status and controls |
/skills/:name |
Skill detail with docs and logs |
/memory |
Memory browser with search |
/backups |
Backup status and controls |
/logs |
Multi-skill log viewer |
/settings |
Caddy config, system settings |
Caddy Integration
If DASHBOARD_DOMAIN is set, auto-registers with Caddy:
dashboard.example.com {
reverse_proxy localhost:3000
}
Development
# Start in dev mode
cd /skills/dashboard/ui
npm run dev
# Build for production
npm run build
Screenshots
┌─────────────────────────────────────────────────────────┐
│ VibeStack Dashboard [user] [⚙] │
├─────────┬───────────────────────────────────────────────┤
│ │ │
│ Overview│ Skills: 8 running, 1 stopped │
│ Skills │ Memory: 1,234 entries │
│ Memory │ Last Backup: 2h ago ✓ │
│ Backups │ Disk: 45% used │
│ Logs │ │
│ Settings│ ┌─────────┐ ┌─────────┐ ┌─────────┐ │
│ │ │ postgres│ │ redis │ │ caddy │ │
│ │ │ ● run │ │ ● run │ │ ● run │ │
│ │ └─────────┘ └─────────┘ └─────────┘ │
│ │ │
└─────────┴───────────────────────────────────────────────┘