Create Dashboard with Kopai

Component Schema (auto-generated)

!npx @kopai/cli dashboards schema 2>/dev/null || echo "ERROR: Cannot connect to Kopai backend. If running locally, start it with: npx @kopai/app start — If using a remote backend, check the url in your .kopairc file."

Available Metrics

!npx @kopai/cli metrics discover --json 2>/dev/null || echo "ERROR: Cannot connect to Kopai backend. If running locally, start it with: npx @kopai/app start — If using a remote backend, check the url in your .kopairc file."

Workflow

1. Discover metrics — npx @kopai/cli metrics discover --json
2. Design tree — build a uiTree using components from the schema above
3. Create dashboard — pipe JSON to npx @kopai/cli dashboards create --name "<name>" --tree-version "0.7.0" --json
4. Verify — response contains id (success) or error (failure). On error: re-run metrics discover to check metric names and types match the component compatibility table below, fix the tree, and retry

Quick Example

A single-card dashboard showing CPU usage:

echo '{"uiTree":{"root":"stack-1","elements":{"stack-1":{"key":"stack-1","type":"Stack","props":{"direction":"vertical","gap":"md"},"children":["card-1"],"parentKey":""},"card-1":{"key":"card-1","type":"Card","props":{"title":"CPU Usage"},"children":["ts-1"],"parentKey":"stack-1"},"ts-1":{"key":"ts-1","type":"MetricTimeSeries","props":{"height":300,"unit":"1"},"children":[],"parentKey":"card-1","dataSource":{"method":"searchMetricsPage","params":{"metricType":"Gauge","metricName":"system.cpu.utilization"}}}}},"metadata":{}}' | npx @kopai/cli dashboards create --name "CPU Dashboard" --tree-version "0.7.0" --json

Common Components

Rules

• workflow - Dashboard creation workflow (detailed rules, tree structure, error handling)

Read rules/<rule-name>.md for details.