Agent Ops Monitor
Operational cockpit for monitoring autonomous agent infrastructure health, service metrics, and incident history.
Features
- Signal Feed: Real-time alerts with escalation + acknowledgement controls
- Service Metrics: Keep thresholds and trends visible next to active incidents
- Incident Timeline: Show latest actions for quick war-room context
- Environment Aware: Swap context (production vs staging) via props
Examples
Production Overview
Production infrastructure
Operations command center
Uptime 99.97%
3 signals
Live signals
Agent routed
Service metrics
Targets
P95 latencyTarget < 550ms
930ms
Error rateTarget < 1%
0.8%
Agent availabilityTarget > 99.9%
99.7%
Latest incidents
Failover to eu-west orchestrator06:42
Action · Monitor
Customer impact flagged for tier-1 accounts06:55
Action · CS notified
Incident Response
Production infrastructure
Operations command center
Uptime 99.92%
3 signals
Live signals
Agent routed
Service metrics
Targets
P95 latencyTarget < 550ms
780ms
Error rateTarget < 1%
1.2%
Agent availabilityTarget > 99.9%
99.3%
Latest incidents
Triggered read-only mode06:30
Action · Monitor lag
Routed backups to secondary region06:42
Action · Confirm ETL status
Staging Sandbox
Staging infrastructure
Operations command center
Uptime 99.5%
2 signals
Live signals
Agent routed
Service metrics
Targets
Deploy successTarget > 95%
97.1%
Preview latencyTarget < 600ms
420ms
QA coverageTarget > 80%
84%
Latest incidents
No recent incidents.
Installation
npx shadcn add "https://agents-ui-kit.com/c/agent-ops-monitor.json"API Reference
AgentOpsMonitor
| Prop | Type | Default | Description |
|---|---|---|---|
| environment | string | "Production" | Environment name in header |
| uptime | string | "99.97%" | Uptime badge |
| signals | OpsSignal[] | Sample signals | Live alerts feed |
| metrics | OpsServiceMetric[] | Sample metrics | Service metrics cards |
| incidents | IncidentEvent[] | Sample incidents | Recent incident timeline |
| onAcknowledge | (signal) => void | - | Called when acknowledging a signal |
| onEscalate | (signal) => void | - | Called when escalating |
| onExportReport | () => void | - | Fired by export button |
| className | string | - | Tailwind overrides |
Types
interface OpsSignal {
id: string
title: string
status: "healthy" | "warning" | "critical"
detail: string
owner?: string
lastUpdated?: string
}
interface OpsServiceMetric {
label: string
value: string
threshold: string
trend: "up" | "down" | "stable"
}
interface IncidentEvent {
id: string
timestamp: string
summary: string
actionNeeded?: string
}
Design Notes
- Signal list wraps in
ScrollAreafor consistent height in docs - Buttons follow
h-7sizing for secondary actions - Status badges reuse blue/emerald/amber/red palette established across the kit