π¦ ClawHub
Dashboard
by @ivangdavila
Build custom dashboards from any data source with local hosting and visual QA loops.
TERMINAL
clawhub install dashboardπ About This Skill
name: Dashboard slug: dashboard version: 1.0.1 description: Build custom dashboards from any data source with local hosting and visual QA loops. changelog: User-driven data source model, explicit credential handling metadata: {"clawdbot":{"emoji":"π","requires":{"bins":[]},"os":["linux","darwin","win32"]}}
Data Storage
~/dashboard/
βββ registry.json # Dashboard index
βββ {name}/
β βββ config.json # Layout, widgets
β βββ data.json # Current data
β βββ index.html # Dashboard page
Create on first use: mkdir -p ~/dashboard
Scope
This skill:
User-driven model:
This skill does NOT:
Quick Reference
| Topic | File |
|-------|------|
| Data source patterns | sources.md |
| Visual design rules | design.md |
| Widget templates | widgets.md |
Core Rules
1. User Provides Data
When creating a dashboard:User: "Dashboard for my Stripe revenue"
Agent: "I'll create a fetch script. Set STRIPE_API_KEY
in your environment, then run the script."
β Generates: ~/dashboard/stripe/fetch.sh
β User adds to cron: */15 * * * * ~/dashboard/stripe/fetch.sh
2. Architecture
[User's Cron] β [fetch.sh] β [data.json] β [index.html]
β
Uses $API_KEY from env
Agent generates scripts. User runs them.
3. Fetch Script Template
#!/bin/bash
Requires: STRIPE_API_KEY in environment
curl -s -u "$STRIPE_API_KEY:" \
https://api.stripe.com/v1/balance \
| jq '.' > ~/dashboard/stripe/data.json
4. Visual QA (Before Delivery)
5. Design Defaults
| Element | Value | |---------|-------| | Background |#0f172a (dark) / #f8fafc (light) |
| Text | #e2e8f0 (dark) / #1e293b (light) |
| Spacing | 16px, 24px, 32px |
| Corners | 8px |
| KPI | 48-72px number, 14px label |6. Security
127.0.0.1 by default