Dashboard

The cliq dashboard is a standalone web application for monitoring and controlling pipelines. It communicates with a cliq server over its REST + WebSocket API via CORS. Real-time updates flow via WebSocket, so you see pipeline progress as it happens.

---

Running the Dashboard

The dashboard lives in the dashboard/ directory. Start it with Vite during development:

cd dashboard
npm install
npm run dev          # http://localhost:5173

By default the dashboard connects to http://localhost:4100 (set via VITE_CLIQ_SERVER_URL in dashboard/.env). Override it for other environments:

VITE_CLIQ_SERVER_URL=https://cliq.example.com npm run dev

If VITE_CLIQ_SERVER_URL is not set, the login screen shows a “Server URL” field so you can point it at any cliq server.

Production Build

cd dashboard
npm run build        # outputs to dashboard/dist/

Deploy the dist/ directory to any static hosting (Nginx, S3, Cloudflare Pages, etc.). Set VITE_CLIQ_SERVER_URL at build time to bake in the server address.

Server CORS

The cliq server must allow the dashboard’s origin. By default all origins are allowed ("*"). To restrict:

{
    "server": {
        "cors_origins": ["https://dashboard.example.com"]
    }
}

---

What It Does

• Instance overview — shows all registered cliq instances with live status badges. Click any instance to see its pipeline.
• Pipeline visualization — renders the workflow DAG with color-coded phase status, gate iteration counts, and animated indicators for active phases. Includes zoom, pan, and fit-to-view controls.
• Live log streaming — orchestrator log entries stream in real time as the pipeline runs.
• Team browser — browse installed teams across all scopes, inspect roles and workflow phases, and run validation.
• Settings viewer — view resolved (merged) or global settings, and test integration connectivity (GitHub, Bitbucket, Slack, Jira).

---

Authentication

The dashboard uses Bearer token authentication. Enter a token on the login screen — either the ephemeral session token printed by cliq server start, or a database-provisioned token (see Server — Authentication). You can also pass a token as a URL parameter for auto-login: http://localhost:5173?token=<your-token>.

The token is stored in sessionStorage and cleared when you close the tab. Use the “Disconnect” button in the nav bar to end the session manually.

---

Workflow Streaming

By default, workflow output is only captured when the server or an A2A task is active. To monitor output via the dashboard even without A2A, set server.workflow_streaming.enabled to true in settings:

{
    "server": {
        "workflow_streaming": {
            "enabled": true
        }
    }
}

See Settings — server.workflow_streaming for details.