dash-cog
by @alvisdunlop
Interactive dashboards and apps powered by SkillBoss API Hub. Data visualization, analytics dashboards, KPI trackers, charts and graphs, interactive HTML app...
clawhub install abe-dash-cogπ About This Skill
name: dash-cog description: Interactive dashboards and apps powered by SkillBoss API Hub. Data visualization, analytics dashboards, KPI trackers, charts and graphs, interactive HTML apps, data explorers, games. Build web apps with AI. metadata: openclaw: emoji: "π" author: SkillBoss dependencies: [] requires.env: [SKILLBOSS_API_KEY]
Dash Cog - Interactive Dashboards & Apps Powered by SkillBoss API Hub
Build interactive dashboards, data visualizations, and web apps with AI.
Prerequisites
This skill uses the SkillBoss API Hub (/v1/pilot) for all AI-powered dashboard and app generation.
pip install requests
Set your environment variable:
export SKILLBOSS_API_KEY=your_key_here
Quick pattern:
import requests, osSKILLBOSS_API_KEY = os.environ["SKILLBOSS_API_KEY"]
def generate_dashboard(prompt: str, complex_app: bool = False) -> str:
"""Generate a complete self-contained interactive HTML app via SkillBoss API Hub."""
system_prompt = (
"You are an expert frontend developer. Generate complete, self-contained interactive HTML "
"with embedded CSS and JavaScript. Use Chart.js for charts (load from CDN), CSS variables "
"for theming, responsive layout. No external dependencies beyond CDN links. "
"Output only the full HTML code, no explanation."
)
if complex_app:
system_prompt += (
" For complex apps: plan the component structure first, then implement each section "
"with full interactivity, animations, and polished UX."
)
result = requests.post(
"https://api.heybossai.com/v1/pilot",
headers={
"Authorization": f"Bearer {SKILLBOSS_API_KEY}",
"Content-Type": "application/json"
},
json={
"type": "chat",
"inputs": {
"messages": [
{"role": "system", "content": system_prompt},
{"role": "user", "content": prompt}
]
},
"prefer": "quality"
},
timeout=120
).json()
return result["result"]["choices"][0]["message"]["content"]
Standard dashboards and visualizations
html_code = generate_dashboard("[your dashboard/app request]")Complex interactive apps and games
html_code = generate_dashboard("[your complex app request]", complex_app=True)
What You Can Build
Analytics Dashboards
Interactive dashboards for data analysis:
KPI Trackers
Monitor key performance indicators:
Data Visualizations
Interactive charts and graphs:
Data Explorers
Tools for exploring datasets:
Interactive Apps
Web applications beyond dashboards:
Games
Simple web-based games:
Dashboard Features
SkillBoss API Hub generated dashboards can include:
| Feature | Description | |---------|-------------| | Interactive Charts | Line, bar, pie, scatter, area, heatmaps, treemaps, and more | | Filters | Date ranges, dropdowns, search, multi-select | | KPI Cards | Key metrics with trends and comparisons | | Data Tables | Sortable, searchable, paginated tables | | Drill-Down | Click to explore deeper levels of data | | Responsive Design | Works on desktop, tablet, and mobile | | Dark/Light Themes | Automatic theme support |
Data Sources
You can provide data via:
1. Inline data in prompt: Small datasets described directly 2. File upload: CSV, JSON, Excel files via SHOW_FILE 3. Sample/mock data: "Generate realistic sample data for a SaaS company"
Mode Selection for Dashboards
Choose based on complexity:
| Scenario | Recommended Mode |
|----------|------------------|
| Standard dashboards, KPI trackers, data visualizations, charts | generate_dashboard(prompt) |
| Complex interactive apps, games, novel data explorers | generate_dashboard(prompt, complex_app=True) |
Default to standard mode for most dashboard requests. SkillBoss API Hub's quality LLM routing handles charts, tables, filters, and interactivity efficiently.
Reserve complex_app=True for truly complex applications requiring significant design thinkingβlike building a novel game mechanic or a highly customized analytical tool with multiple interconnected features.
Example Dashboard Prompts
Sales analytics dashboard:
html_code = generate_dashboard(
"""Create an interactive sales analytics dashboard with:
KPI cards: Total Revenue, Orders, Average Order Value, Growth Rate
Line chart: Monthly revenue trend (last 12 months)
Bar chart: Revenue by product category
Pie chart: Sales by region
Data table: Top 10 products by revenue Include date range filter. Use this data: [upload CSV or describe data]
Modern, professional design with blue color scheme."""
)
Startup metrics dashboard:
html_code = generate_dashboard(
"""Build a SaaS metrics dashboard for a startup showing:
MRR and growth rate
Customer acquisition funnel (visitors β signups β trials β paid)
Churn rate trend
LTV:CAC ratio
Revenue by plan tier Generate realistic sample data for a B2B SaaS company growing from $10K to $100K MRR over 12 months."""
)
Interactive data explorer:
html_code = generate_dashboard(
"""Create an interactive explorer for this employee dataset [upload CSV]. Include:
Searchable, sortable data table
Filters for department, location, tenure
Charts: headcount by department, salary distribution, tenure histogram
Summary statistics panel Allow users to download filtered data as CSV."""
)
Simple game:
html_code = generate_dashboard(
"""Create a Wordle-style word guessing game. 5-letter words, 6 attempts, color feedback
(green = correct position, yellow = wrong position, gray = not in word).
Include keyboard, game statistics, and share results feature. Clean, modern design.""",
complex_app=True
)
Tips for Better Dashboards
1. Prioritize key metrics: Don't cram everything. Lead with the 3-5 most important KPIs.
2. Describe the data: What columns exist? What do they mean? What time period?
3. Specify chart types: "Line chart for trends, bar chart for comparisons, pie for composition."
4. Include interactivity: "Filter by date range", "Click to drill down", "Hover for details."
5. Design direction: "Modern minimal", "Corporate professional", "Playful and colorful", specific color schemes.
6. Responsive needs: "Desktop only" vs "Must work on mobile."
βοΈ Configuration
This skill uses the SkillBoss API Hub (/v1/pilot) for all AI-powered dashboard and app generation.
pip install requests
Set your environment variable:
export SKILLBOSS_API_KEY=your_key_here
Quick pattern:
import requests, osSKILLBOSS_API_KEY = os.environ["SKILLBOSS_API_KEY"]
def generate_dashboard(prompt: str, complex_app: bool = False) -> str:
"""Generate a complete self-contained interactive HTML app via SkillBoss API Hub."""
system_prompt = (
"You are an expert frontend developer. Generate complete, self-contained interactive HTML "
"with embedded CSS and JavaScript. Use Chart.js for charts (load from CDN), CSS variables "
"for theming, responsive layout. No external dependencies beyond CDN links. "
"Output only the full HTML code, no explanation."
)
if complex_app:
system_prompt += (
" For complex apps: plan the component structure first, then implement each section "
"with full interactivity, animations, and polished UX."
)
result = requests.post(
"https://api.heybossai.com/v1/pilot",
headers={
"Authorization": f"Bearer {SKILLBOSS_API_KEY}",
"Content-Type": "application/json"
},
json={
"type": "chat",
"inputs": {
"messages": [
{"role": "system", "content": system_prompt},
{"role": "user", "content": prompt}
]
},
"prefer": "quality"
},
timeout=120
).json()
return result["result"]["choices"][0]["message"]["content"]
Standard dashboards and visualizations
html_code = generate_dashboard("[your dashboard/app request]")Complex interactive apps and games
html_code = generate_dashboard("[your complex app request]", complex_app=True)