Dashboard Overview

The Curate-Me Dashboard is the core product of the platform — a B2B SaaS dashboard purpose-built for managing, monitoring, and deploying AI agent pipelines. It provides engineering teams with full observability into their agent operations, cost governance, and pipeline orchestration from a single interface.

Production URL: https://dashboard.curate-me.ai

Key Features

Feature	Description
Agent Health Monitoring	Real-time status dashboards tracking latency, throughput, error rates, and anomalies across all agents
Cost Governance	LLM spend tracking by provider, agent, and pipeline with budget alerts and projections
Visual Workflow Builder	Drag-and-drop multi-agent pipeline design with conditional routing and parallel branches
Human-in-the-Loop Approvals	Configurable approval gates for sensitive or high-cost operations with role-based routing
Time-Travel Debugging	Replay any agent execution step-by-step, inspect inputs/outputs, and compare runs side-by-side
Gateway Monitoring	Real-time view of gateway requests, governance policy enforcement, and provider health
Managed Runners	OpenClaw runner lifecycle management — create, start, stop, monitor sessions

Architecture

The dashboard communicates with both the B2B API (port 8001) and the Gateway API (port 8002). Authentication uses JWT tokens, and multi-tenant data isolation is enforced through the X-Org-ID header and TenantIsolationMiddleware.


Dashboard (port 3001) ──────► B2B API (port 8001)
   │                              │
   ├─ JWT Authentication          ├─ TenantIsolationMiddleware
   ├─ X-Org-ID Header             ├─ Role-based access control
   └─ Organization context        └─ Per-org data isolation
   │
   └────────────────────────► Gateway API (port 8002)
                                  │
                                  ├─ Gateway request monitoring
                                  ├─ Runner management endpoints
                                  └─ Provider health + governance stats

Every API request from the dashboard includes the organization context:


// apps/dashboard/lib/api.ts
const headers = {
  'Authorization': `Bearer ${token}`,
  'X-Org-ID': organizationId,
  'Content-Type': 'application/json',
};

Design System

The dashboard uses a professional B2B design system built around a deep teal primary palette.

Token	Value	Usage
`--primary-600`	`#0D9488`	Primary actions, active states
`--neutral-50`	`#F8FAFC`	Page backgrounds
`--neutral-900`	`#0F172A`	Body text
`--success`	`#10B981`	Positive indicators, healthy status
`--warning`	`#F59E0B`	Caution states, budget warnings
`--error`	`#EF4444`	Error states, critical alerts

Pure black (#000) and pure white (#FFF) are never used. All neutrals come from the Tailwind Slate scale, and the dashboard supports both light and dark modes through Tailwind dark: variants.

Tech Stack

Layer	Technology
Framework	Next.js 15 with App Router
UI	React 19, Tailwind CSS
State Management	Zustand (client state), TanStack Query (server state)
Workflow Canvas	React Flow (`@xyflow/react`)
Charts	Recharts
Real-time	Server-Sent Events (SSE) via EventSource

Getting Started


# Start the dashboard in development mode
npx turbo dev --filter=dashboard
 
# The dashboard runs on http://localhost:3001
# Requires the B2B API running on port 8001
cd services/backend
poetry run uvicorn src.main_b2b:app --reload --port 8001
 
# For full functionality, also start the Gateway API on port 8002
poetry run uvicorn src.main_gateway:app --reload --port 8002