Production Overview
A unified executive dashboard — agent KPIs, AI quality monitoring, and human signals in a single view across all your deployed agents.
Why Use Production Overview?
The Production Overview page is the single pane of glass for your AI operations. Instead of switching between Monitoring, Human Signals, and custom KPI dashboards, this page brings everything together so leadership and on-call engineers can assess system health in seconds.
Agent KPIs
Track custom business and operational KPIs per agent with trend sparklines, configurable units, and click-to-expand trend charts.
Quality Scorecard
Hierarchical quality monitoring with source → component → metric drill-down, health indicators, and score deltas.
Human Signals
See human feedback KPIs (approval rate, escalation %, compliance) alongside automated metrics for a complete picture.
Multi-Agent Tabs
Switch between agents instantly using the Source Selector. Each agent shows its own KPIs, quality scores, and signals data.
Quick Start
Get the Production Overview populated in under two minutes:
1
Navigate to Production
Click Production in the left sidebar, or use the route /production. The page loads data from all connected stores simultaneously.
2
Select an Agent
Use the Source Selector tabs at the top to pick which agent to inspect. Each tab shows the agent avatar, name, and role. Data for all three sections filters to that agent.
3
Explore Sections
All three sections — Agent KPIs, AI Quality Monitoring, and Human Signals — are collapsible. Click a section header to expand or collapse it. Click any KPI card in Agent KPIs to see its trend chart.
4
Drill Into Details
Click Quality Scorecard in the AI Quality section to open the hierarchical table. Click the eye icon on any metric row to see its detail panel. Use the alert badge to jump to Monitoring.
💡 Tip
The Production page reads from the Monitoring, Human Signals, and KPI stores. Make sure you have data loaded in at least one of these — either via CSV upload or database sync — before visiting the page.
Page Anatomy
Here is the full Production Overview page layout with every major section annotated:
localhost:3500/production
Production Overview
Unified view of AI quality monitoring and human signals metrics
1
A
Alpha Bot
Customer Support
B
Beta Bot
Order Processing
G
Gamma Bot
Research Analyst
2
▼
Agent KPIs
3
Jan 15 – Feb 14 · 30 days
92.1%
Resolution Rate
4,231
Performance
1.2s
Avg Latency
4,231
Performance
0.87
CSAT Score
1,892
Quality
98.4%
Safety Compliance
4,231
Compliance
847
Escalations
847
Performance
4
▼
AI Quality Monitoring
3 Alerts
5
Total Metrics
12
Overall Avg Score
0.847
Pass Rate
89.2%
Data Freshness
12m ago
6
▼
Quality Scorecard
7
▼
Human Signals
8
87.3%
Approval Rate
2,156
Human Signals
4.2%
Escalation Rate
2,156
Human Signals
96.1%
Compliance
2,156
Human Signals
12.8s
Avg Handle Time
2,156
Human Signals
3.1%
Override Rate
2,156
Human Signals
The full Production Overview — page header, agent tabs, collapsible Agent KPIs, AI Quality Monitoring with scorecard, and Human Signals KPI strip.
1
Page Header — LayoutDashboard icon, title "Production Overview", and subtitle. Consistent across all AXIS pages.
2
Source Selector — Agent tabs showing avatar, name, and role. Clicking a tab filters all three sections to that agent's data. Auto-selects the first agent on load.
3
Agent KPIs Section — Collapsible section header with icon. Contains a date range badge and a grid of clickable KPI cards with sparklines.
4
KPI Card Grid — Up to 5 cards per row showing value, trend arrow, sparkline, label, record count badge, and category indicator. Click any card to expand its trend chart.
5
AI Quality Monitoring Section — Contains the Executive Summary scorecard. The header shows an alerts badge linking to
/monitoring.
6
Executive KPIs — Four summary cards: Total Metrics, Overall Avg Score, Pass Rate, and Data Freshness, each with trend sparklines where applicable.
7
Quality Scorecard Toggle — Click to expand the hierarchical table showing source → component → metric with scores, trends, health badges, and detail buttons.
8
Human Signals Section — Collapsible section showing top KPIs from your human signals data. Cards link to the
/human-signals page on click.Source Selector
The Source Selector appears below the page header as a row of agent tabs. It is shared across the Production page and determines which agent's data is displayed in every section.
Source Selector — Agent Tabs
A
Alpha Bot
Customer Support
B
Beta Bot
Order Processing
G
Gamma Bot
Research Analyst
Agent tabs with avatar, label, and role. The active tab has a purple underline and highlighted avatar background.
How it works:
- Sources are collected from three stores: Monitoring (
source_name), Human Signals (source_name), and KPI (source_name) - If an agent is configured in
config/agents.yaml, its avatar, label, and role are displayed. Otherwise, the raw source name is shown with a default bot icon - Selecting a tab sets the source filter in the Monitoring, Human Signals, and Memory stores simultaneously
- On first load, the first available agent is auto-selected
ℹ️ Info
The scope prop controls which stores contribute source names. On the Production page, the scope is ['monitoring', 'human_signals', 'kpi'], so all three data sources are combined into a single unified agent list.
Agent KPIs
The first collapsible section shows custom business and operational KPIs loaded from your KPI database. These are distinct from the monitoring quality metrics — they represent the high-level performance indicators your team cares about (resolution rate, latency, CSAT, etc.).
Date Range Badge
A pill badge in the top-right corner shows the date range covered by the KPI data:
Jan 15, 2026 – Feb 14, 2026 · 30 days
KPI Card Grid
Cards are arranged in a responsive grid (up to 5 columns). Each card displays:
| Element | Description |
|---|---|
| Value | Formatted based on unit: percent (92.1%), seconds (1.2s), score (0.87), count (847) |
| Trend Arrow | ▲ up or ▼ down, color-coded by polarity — green if the trend direction is good for that metric, red if bad |
| Sparkline | Inline SVG showing the recent daily values, color matched to the trend direction |
| Label | The KPI display name (e.g., "Resolution Rate") |
| Count Badge | Number of records the KPI is computed from |
| Category | Icon + category name (e.g., "Performance", "Quality", "Compliance") |
KPI Trend Chart
Click any KPI card to expand a trend chart below the grid. The chart animates in (slide down + fade) and shows the daily time series for that metric. Click the same card again to collapse it.
Agent KPIs — Expanded Trend Chart
92.1%
Resolution Rate
1.2s
Avg Latency
0.87
CSAT Score
98.4%
Safety Compliance
847
Escalations
Resolution Rate
✕ CloseClicking "Resolution Rate" expands a trend chart below the KPI grid. The selected card gets a purple ring highlight. Click the X to close.
📝 Note
Agent KPIs are loaded from a dedicated KPI store, separate from the monitoring data. They are configured per-agent in the backend and can represent any business metric. If no KPI data is available for the selected agent, this section will be empty.
AI Quality Monitoring
The second collapsible section surfaces the Executive Summary from the Monitoring module, giving you an at-a-glance quality scorecard without leaving the Production page.
Alerts Badge
The section header includes an alert count badge on the right side:
- When alerts exist: 3 Alerts — red background, clicking navigates to
/monitoring - When no alerts: neutral gray badge with "0 Alerts"
Executive KPI Cards
Four compact KPI cards appear at the top of this section:
| Card | Value | Color Logic | Sparkline |
|---|---|---|---|
| Total Metrics | Count of unique metric_name values |
Always neutral | None |
| Overall Avg Score | Mean of all metric_score values |
≥ 0.7 0.5–0.7 < 0.5 | Daily average sparkline |
| Pass Rate | % of scores ≥ 0.5 | ≥ 70% 50–70% < 50% | Daily pass rate sparkline |
| Data Freshness | Time since newest record | Always neutral | None |
Each card also shows a trend arrow (▲ or ▼) derived by comparing the first and last sparkline values. A 1% threshold determines whether the trend is "up", "down", or "flat".
Quality Scorecard
Below the KPI cards, click the Quality Scorecard toggle to reveal the hierarchical monitoring table. This is the same ExecutiveHierarchyTable used on the Monitoring page, embedded here for quick access.
Quality Scorecard — Expanded Hierarchy
The Quality Scorecard expanded to show the full 3-level hierarchy: source → component → metric with scores, deltas, sparkline trends, health badges, and view-detail actions.
Table columns:
- Hierarchy — Indented tree: sources at top, components indented 1 level, metrics indented 2 levels. Expand/collapse nodes with the chevron. Sortable by name.
- Category — Only shown for leaf metrics: SCORE, CLASSIFICATION, or ANALYSIS
- Score — Average
metric_score, color-coded (green ≥ 0.7, yellow 0.5–0.7, red < 0.5). Leaf nodes show a delta indicator comparing recent 25% vs older 75% of records. - Trend — Mini sparkline chart of daily-aggregated scores
- Health — Status badge derived from the average score: Healthy, Warning, or Critical
- Records — Record count (monospace)
- Actions — Eye icon on metric rows opens the Metric Detail Panel
💡 Tip
Use Expand All / Collapse buttons in the header to quickly open or close all hierarchy levels. The table header columns are sortable — click Hierarchy, Score, Health, or Records to sort.
Empty State
When no monitoring data is loaded for the selected agent, a placeholder appears with a call-to-action linking to /monitoring:
No Monitoring Data
No Monitoring Data
Upload monitoring data or connect to a database to see AI quality metrics.
Go to Monitor
Empty state with dashed border, icon, message, and action button linking to the Monitoring page.
Human Signals
The third collapsible section shows KPIs derived from human signals data — feedback, overrides, escalations, and similar human-in-the-loop metrics. These cards are computed from the Human Signals store using the display_config.kpi_strip configuration.
Human Signals KPI Cards
87.3%
Approval Rate
2,156
Human Signals
4.2%
Escalation Rate
2,156
Human Signals
96.1%
Compliance
2,156
Human Signals
12.8s
Avg Handle Time
2,156
Human Signals
3.1%
Override Rate
2,156
Human Signals
Human Signals KPI strip — up to 5 cards showing key human-in-the-loop metrics. Each card is clickable and links to the Human Signals page.
Card behavior:
- Shows up to 5 KPIs from the signals display configuration
- Each card displays: value, trend arrow (polarity-aware), sparkline, label, total case count badge, and a "Human Signals" category tag
- Clicking any card navigates to
/human-signalsfor deeper drill-down - Trend direction considers polarity: for "Escalation Rate", a downward trend is green (good); for "Approval Rate", upward is green
⚠️ Warning
If no human signals data is loaded for the selected agent, an empty state placeholder appears with a link to /human-signals. Upload signals data or configure a database connection for this section to populate.
Collapsible Sections
All three main content areas — Agent KPIs, AI Quality Monitoring, and Human Signals — are wrapped in collapsible section containers. These share the CollapsibleSection component pattern:
- Header bar — gray background, icon badge, bold title, optional right-side content (e.g., alerts badge)
- Default state — all sections are open (
defaultOpen: true) - Toggle — click the header to collapse/expand. The chevron rotates between ▼ (open) and ▶ (closed)
- Content — hidden entirely when collapsed (CSS
display: none), so only headers remain for a compact overview
💡 Tip
Collapse sections you don't need to focus on the data that matters. For example, if you only care about quality scores, collapse Agent KPIs and Human Signals to see just the Executive Summary.
Filtering
The Production page applies a single, page-wide filter: the selected source (agent). Unlike the Monitoring page, there are no additional environment, component, or time range filters here — the goal is a high-level summary.
How Source Filtering Works
| Section | Filter Applied | Store Field |
|---|---|---|
| Agent KPIs | KPI data filtered by source | kpiStore.selectedSource |
| AI Quality Monitoring | Monitoring records filtered by source_name | monitoringStore.selectedSourceName |
| Human Signals | Signal cases filtered by source_name | humanSignalsStore.selectedSourceName |
| Alert Count | Alerts filtered by source_name | monitoringStore.alerts |
Selecting a different agent tab instantly recomputes all KPIs, executive summary metrics, hierarchy trees, and signal aggregates for that agent.
Next Steps
AXIS Documentation · Built with MkDocs Material