# Shadcn AI Ops blocks

> AI startup control plane pages for model providers, prompts, token cost, routing, and quotas.

- Type: Pro blocks (Solutions)
- Page: https://web.dev.reui.io/blocks/solutions/ai-ops
- Blocks: 9
- Installs with a ReUI Pro or Ultimate license; setup: https://web.dev.reui.io/docs/license-setup

## When to use

- Model operations dashboards that track provider health, token volume and spend against a budget cap
- Provider connection and routing pages that set priority order, fallback providers and risk tier controls
- Prompt, feature flag and token usage registries, a prompt editor and a safety policy wizard

## When not to use

- Autonomous agent runs, tool permissions and human approval of agent actions: use the [Agents blocks](https://web.dev.reui.io/blocks/solutions/agents.md)
- A bare table for your own columns and rows, with no provider or token sample records: use [Data Grid](https://web.dev.reui.io/components/data-grid.md) (`get_component("data-grid")`)
- A KPI tile and trend chart overview for a fulfillment, staffing, revenue or payouts team: use the [Dashboard blocks](https://web.dev.reui.io/blocks/application/dashboard.md)

## Agent notes

- Each page.tsx wraps the block in a `min-h-svh` container; remove it when the block sits inside your app shell
- No block calls an API: changes stay in local `useState` or uncontrolled inputs, so wire each save, switch, export and row action to your backend

## Third-party libraries

- Sonner v2: [API reference](https://sonner.emilkowal.ski/toast), [docs](https://sonner.emilkowal.ski/getting-started), used by 8 of 9 blocks
- TanStack Table v9: [API reference](https://tanstack.com/table/v9/docs/framework/react/reference/index), [docs](https://tanstack.com/table/v9/docs/framework/react/quick-start), used by 5 of 9 blocks
- Recharts v3: [API reference](https://recharts.github.io/en-US/api/), [docs](https://recharts.github.io/en-US/guide/getting-started/), used by 2 of 9 blocks
- dnd kit v6: [API reference](https://dndkit.com/legacy/api-documentation/context-provider/dnd-context/), [docs](https://dndkit.com/legacy/introduction/getting-started/), used by 1 of 9 blocks (these are the Legacy docs; dndkit.com's default docs cover the newer @dnd-kit/react, a different API)
- date-fns v4: [docs](https://date-fns.org/v4.1.0/docs/Getting-Started), used by 1 of 9 blocks
- Base UI v1: [API reference](https://base-ui.com/react/components), [docs](https://base-ui.com/react/overview/quick-start), [llms.txt](https://base-ui.com/llms.txt), used by 1 of 9 blocks

## Blocks

- [AI Ops Dashboard](https://web.dev.reui.io/blocks/solutions/ai-ops/solution-ai-ops-1.md): AI Operations Dashboard with Provider Failover Timeline and Token Activity Chart. Best for failover steps with owner rows that expand to notes and assignees, beside a 3 line token chart and above a routing rule table.
- [Provider Connections](https://web.dev.reui.io/blocks/solutions/ai-ops/solution-ai-ops-2.md): AI model provider settings page with priority and fallback routing rows. Best for provider rows ranked by priority, where taking a used rank swaps 2 rows, a switch pauses one and a missing key opens a connect dialog.
- [Prompt Review Queue](https://web.dev.reui.io/blocks/solutions/ai-ops/solution-ai-ops-3.md): Tabbed AI Ops Prompt Registry Queue with Table and Card View Toggle. Best for a prompt review queue with 5 line tabs, a table or card toggle, a Display popover for density and columns, and mark ready or flag actions.
- [Prompt Editor](https://web.dev.reui.io/blocks/solutions/ai-ops/solution-ai-ops-4.md): Prompt Editor with Configuration and Evaluation Details. Best for one prompt edited across 5 tabs, from system text and user template to reviewers, eval runs and access, with an Unsaved or Saved badge.
- [Model Routing Policy](https://web.dev.reui.io/blocks/solutions/ai-ops/solution-ai-ops-5.md): AI Ops Routing Rules Settings with Risk-Tiered Policy Toggle Grid. Best for route cards for 4 risk tiers with 4 policy switches each, some locked, and a fallback select that fails save while Restricted has none.
- [AI Feature Flags](https://web.dev.reui.io/blocks/solutions/ai-ops/solution-ai-ops-6.md): AI Feature Flags Data Grid with Rollout Stage Tabs and Inline Enable Switches. Best for feature flags in stage tabs with counts, inline enable switches, a create sheet, an archive confirm and a 4 lane drag board below.
- [Safety Policy Builder](https://web.dev.reui.io/blocks/solutions/ai-ops/solution-ai-ops-7.md): AI Safety Policy Builder Wizard with Stepper Rail and Policy Rule Coverage Table. Best for a full height 4 step policy wizard on a vertical stepper rail, whose editable rule table flags any coverage under 75 percent as a gap.
- [Token Spend Ledger](https://web.dev.reui.io/blocks/solutions/ai-ops/solution-ai-ops-8.md): AI Token Spend Ledger Data Grid with Budget Status and CSV Export. Best for token cost rows with an add entry sheet, a row detail sheet, column visibility and 3 follow up panels of switches and buttons.
- [Spend vs Budget](https://web.dev.reui.io/blocks/solutions/ai-ops/solution-ai-ops-9.md): AI Ops Cost Dashboard with Spend Pace Chart and Tabbed Provider Cost Grid. Best for spend against a dashed budget cap line, a segmented provider share bar and a cost event table split into budget, provider and prompt tabs.

Every ReUI item has a twin like this one; the index is https://web.dev.reui.io/llms.txt. Agents with the ReUI MCP (https://web.dev.reui.io/docs/mcp) get the same guidance from the getters named above.