Agent Approval Gate

Agent action approval: risk, diff, explicit consent and a decision log. Pro · AI chat and agents › Agents and reasoning

A stop sign for an AI agent's risky action: what it wants to do and why, how risky it is, the exact changes, and Approve / Reject with an explicit confirmation. Nothing is approved without a person pressing Approve; the decision and its comment go to a log.

Installation

npx valyro-cli@latest login
npx valyro-cli@latest add agent-approval-gate

npm install valyro-ui-pro

import 'valyro-ui-pro/styles.css';
import { AgentApprovalGate } from 'valyro-ui-pro';

Props

Prop	Type	Default
`action`	`AgentApprovalAction \| null`		The action waiting for a decision; `null` shows the empty state. Give the gate a new `key` per action so the confirmation starts over.
`riskLevel` *	`'low' \| 'medium' \| 'high' \| 'critical'`		How dangerous the action is; sets the colour, the button and the default confirmation.
`riskFactors`	`ReactNode[]`		Concrete reasons it is risky: "Deletes data", "Sends an email to 1,200 people".
`diff`	`AgentApprovalDiff \| AgentApprovalDiff[]`		What changes: one text or several files, shown as a unified diff.
`onApprove`	`(input: AgentApprovalDecisionInput) => unknown`		Called by Approve. Return a promise to show progress until it settles; a rejection keeps the gate open with an error.
`onReject`	`(input: AgentApprovalDecisionInput) => unknown`		Called by Reject; same promise handling as `onApprove`.
`pending`	`boolean`	`false`	The decision is being sent (when you track it yourself): buttons are disabled with a spinner.
`decision`	`AgentApprovalOutcome \| null`		Decision taken. `null`: still waiting.
`defaultDecision`	`AgentApprovalOutcome \| null`	`null`	Initial decision when uncontrolled.
`onDecisionChange`	`(decision: AgentApprovalOutcome \| null) => void`		Called once a decision went through (after the promise of onApprove / onReject resolved).
`confirmation`	`'none' \| 'checkbox' \| 'type'`		Step before Approve: `none`, a `checkbox`, or `type` the confirm text. Default by risk: none up to medium, checkbox for high, typing for critical.
`confirmText`	`string`		Text to type for `confirmation: 'type'`. Default: the action's `target`.
`commentRequired`	`'never' \| 'reject' \| 'always'`	`'never'`	When a comment is required: `never` (default), `reject` or `always`.
`log`	`AgentApprovalLogEntry[]`		History of the request: asked, decided, expired.
`redactSecrets`	`boolean`	`true`	Masks secrets in `action.params`. Default true.
`loading`	`boolean`	`false`	The action is loading: skeleton.
`error`	`ReactNode`		Something went wrong (loading or saving); shown as an alert.
`title`	`ReactNode`		Heading. Default: `labels.title`.
`headingLevel`	`2 \| 3 \| 4 \| 5`	`3`	Level of the heading (default 3).
`timeZone`	`string`		IANA time zone of the log times (default: the ThemeProvider's, then the reader's).
`locale`	`string`		BCP 47 locale for dates; defaults to the ThemeProvider's.
`labels`	`Partial<Omit<AgentApprovalGateLabels, 'riskLevels' \| 'outcomes'>> & { riskLevels?: Partial<Record<AgentRiskLevel, string>>; outcomes?: Partial<Record<AgentApprovalLogEntry['outcome'], string>>; }`		Overrides for the built-in English text; keys left out keep their defaults.

Related components

Chain of Thought — Model reasoning steps
Tool Call — Tool call with approval
Agent Plan — Live agent task plan
Agent Trace Timeline — Agent steps as a waterfall: time, tokens, cost, inputs and outputs with secrets redacted
Memory Panel — What the assistant remembers
AI Chat Window — AI chat window
Chat Message — Messages with streaming output
Message Branches — Message versions and a conversation branch tree
Streaming Text — Smooth token streaming
Markdown Preview — Rendered Markdown
Response Feedback — Answer rating and a rubric for reviewers
Prompt Composer — Prompt field with attachments

Previous: Agent Trace Timeline · Next: Memory Panel · All AI chat and agents