# Agent monitor A React block (a whole screen) in [Beamline](https://beamline.io/)'s [AI workspace](https://beamline.io/components/apps/ai-workspace) app. Live demo: https://beamline.io/components/agent-monitor Agents in production and on test. Monitor shows every agent or one over 24 hours, 7 or 14 days: runs, tokens, estimated cost and average run time counted from the same runs the histogram draws, so the runs tile always equals the histogram's total; succeeded runs are the quiet ink and failed ones the danger tone, in the histogram and the recent activity alike (with what failed); tool calls are ranked, and each agent's tools are listed with how often it calls them. Evaluations lists datasets with their cases (input, expected, reviewer) and runs of a dataset on agent versions with their average score and passes; two runs are compared case by case with the change, and choosing a third is refused, saying why. ## Use it for - Watching a fleet of AI agents: volume, failures, cost and tool use over a window. - Comparing agent versions on a test dataset before shipping one. ## Not for - One run's trace ([agent-runs](https://beamline.io/components/agent-runs), [run-trace](https://beamline.io/components/run-trace)). - Configuring an agent ([agent-builder](https://beamline.io/components/agent-builder)). ## Anatomy - header: Agents, Monitor and Evaluations - monitor: Agent (all or one), Window; tiles (runs, tokens, estimated cost, average run time); runs over time with the counts in words, a legend; tool calls ranked and each agent's tools; recent activity (status dot, agent, when, what failed, cost) - evaluations: datasets with case counts and the chosen dataset's cases; runs (compare checkbox, version on dataset, when, passes, average score bar, or Scoring); what to choose next or why a third is refused; the comparison table (case, both scores, the change) ## States - all agents, one agent - no runs in the window - failure spike - a run in progress - evaluation running (can't be compared) - one run chosen, two compared, a third refused, runs on different datasets - narrow room: tiles in two columns, panels stacked ## Keyboard - Tab through the filters, the panels and the evaluation runs - each run's compare checkbox is named with its version and dataset ## Motion Nothing animates; changing the window or agent redraws at once. ## Props | Prop | Type | Default | Description | | --- | --- | --- | --- | | `agents` (required) | `MonitoredAgent[]` | — | | | `runs` (required) | `MonitorRun[]` | — | | | `datasets` | `EvalDataset[]` | — | | | `evalRuns` | `EvalRun[]` | — | | | `view` | `"evals" \| "monitor"` | — | | | `defaultView` | `"evals" \| "monitor"` | — | | | `onViewChange` | `((view: "evals" \| "monitor") => void)` | — | | | `defaultAgent` | `string \| null` | — | | | `defaultWindow` | `Window` | — | | | `defaultCompare` | `string[]` | — | Evaluation runs chosen to compare first (two at most). | | `currency` | `string` | — | ISO 4217 code costs are in. Default "USD". | | `now` | `Date` | — | Now, for the window. Default: now. | | `locale` | `string` | — | | | `className` | `string` | — | Classes on the documented visual root; no override by default. | | `style` | `CSSProperties` | — | Inline styles on the documented visual root; no overrides by default. | | `ref` | `Ref` | — | Receives the documented native target or imperative handle; omitted by default. | ## Built from - [metric-card](https://beamline.io/components/metric-card) - [bar-list](https://beamline.io/components/bar-list) - select - [segmented-control](https://beamline.io/components/segmented-control) - checkbox - badge ## Dependencies `lucide-react` ## Import ```tsx import { AgentMonitor } from "@beamline/agent-monitor"; ``` ## Get it Agent monitor is part of Beamline UI. Install the parts you need in your React app as compiled packages or editable source. [Get Beamline](https://beamline.io/checkout?pack=complete) · [Connect your agent](https://beamline.io/connect) ## More in AI workspace - [AI agent workspace](https://beamline.io/components/agent-workspace): Threads, a conversation that opens on the thread's earlier turns (each with its trace, the tools the agent called, a cited answer and any table it… - [Agent runs monitor](https://beamline.io/components/agent-runs): Every run of your agents in one place: success rate, run time, tokens and spend; the last runs as a strip of status blocks; a live table where running… - [Conversation history](https://beamline.io/components/conversation-history): Past conversations with an assistant, ready to pick up again: the list by day with bookmarks and unsent drafts, a search through every message that… - [Knowledge base manager](https://beamline.io/components/knowledge-base): What your assistant knows and whether it is fresh: sources with live sync status (syncing with progress, out of date, failed with the reason and Retry)… - [Reading library](https://beamline.io/components/reading-library): A read-it-later library: saved views that are live filters (a query with every unreadable part named, the number that matches now, saved with a name; a… - [Artifact workbench](https://beamline.io/components/artifact-workbench): Where the things an assistant makes are checked before they leave: every document, piece of code, small app and data result from a conversation, each… - [AI image studio](https://beamline.io/components/image-studio): Write a prompt, pick a shape, a style and how many, and watch the variations generate side by side; each one opens full screen and can be upscaled or… - [Voice agent](https://beamline.io/components/voice-agent): A voice agent in three layouts on one session: a workspace with the agent's orb large on a stage (the line being said shows under it, questions to ask… - [Model playground](https://beamline.io/components/model-playground): Try one prompt on up to three models side by side: pick each model with its price and speed in view, set the system prompt, temperature and length once… - [Model inspector](https://beamline.io/components/model-inspector): A design model's objects without needing the 3D view: the model tree, where objects with the same name are told apart by id and path; the selected… - [Model issues](https://beamline.io/components/model-issues): Issues pinned to the objects of a design model. The queue says the scope beside every count (open in the project, on the loaded models, on this version)… - [Agent builder](https://beamline.io/components/agent-builder): An agent's configuration beside an assistant that proposes tools. Ask for what the agent should do and the assistant's proposal lists each tool with why… - [Workflow composer](https://beamline.io/components/workflow-composer): A workflow drafted from a sentence and finished by hand. The prompt drafts steps that arrive one by one on the graph (a draft cut short keeps what came… - [Data binding](https://beamline.io/components/data-binding): Bind an object's properties to a view model. Each property says whether it is bound, incomplete or mismatched. A binding takes its source from the… Part of [Beamline UI: polished, editable React components and complete screens for custom applications](https://beamline.io/). [Build your own style from any look; tokens, fonts, radii, motion; not only colours](https://beamline.io/docs/customize).