Verification UI

Visual flow builder, reviewer panel & pending inbox

The Verification engine has three front-ends. VerificationFlowPage is a drag-and-drop graph builder for authoring approval flows; VerificationPanel shows where one record sits and lets an approver decide; PendingVerifications is the reviewer's inbox of everything awaiting them. Together they cover authoring, acting and triaging — all on top of the same generated verification actions.

The builder writes exactly the graph the VerificationService runs (step / verifier / notification nodes, edges, verifier configs and notification rules), so what an admin draws is what the backend executes.

VerificationFlowPage — the builder#

A node-graph editor for one entity's approval flows. Drag step, verifier and notification nodes onto a canvas, connect them, configure each, then save and publish. It also embeds the pending queue and per-entity status tabs.

node types'step' | 'verifier' | 'notification'Optional

step nodes are ordered stages; verifier nodes attach an approver (a user or a role, with require_signature and all_must_approve); notification nodes fire messages on a trigger. Edges wire them together — the EdgeType union defines default / conditional / success / failure, but the builder currently authors only 'default' edges (there is no edge-type picker; the other values are type-only).

flow actionsflowList / flowGet / flowSave / flowPublish / flowDeleteOptional

CRUD over flow definitions. flowSave persists the whole FlowGraphData (steps, edges, verifier_configs, notification_rules, recipients, channels); flowPublish flips is_draft off so the flow can start. trigger_on (create / update / delete / manual) is stored builder metadata only — the backend never evaluates it and entity CRUD does not auto-start flows; you start a flow explicitly via start / start-for-entity.

verification actionspending / decide / entityStatusesOptional

Power the embedded tabs the FlowPage actually renders: the pending inbox (pendingAction + decideAction) and the per-entity status board (entityStatusesAction) — showPending / showEntityStatuses toggle these. (startAction / statusAction / startForEntityAction are declared on the props type but the FlowPage does not consume them — manual start lives in VerificationPanel, not here.)

listUsers / listRolesdata sourcesOptional

Optional actions that populate the verifier and recipient pickers, so a verifier node can be bound to a real user or role and a notification rule to real recipients.

VerificationPanel — act on one record#

Embed this next to a record to show its approval state and let the current user decide. (A variant prop is accepted but currently inert — 'default' | 'compact' | 'inline' all render the same layout.)

statusAction / decideActionrequiredOptional

statusAction loads the instance, current step, progress and history for { entity_name, entity_id }; decideAction submits approve/reject for the current step (payload { entity_name, entity_id, decision, reason }). NOTE: these components do NOT collect or submit a signature_id — the 'Signature Required' badge is informational only, so a step authored with require_signature CANNOT be completed through VerificationPanel/PendingVerifications (the backend rejects the decide with 'Signature is required for this verification step'). Signature capture is out of scope for the shipped UI.

startAction + allowStartmanual startOptional

allowStart shows a start button backed by startAction — but it renders (and handleStartFlow works) only when a flowId is supplied; without flowId no start button appears.

variant / showProgress / showHistorydisplayOptional

variant ('default' | 'compact' | 'inline') is accepted but currently a no-op — it does not change the layout (all values render identically). showProgress / showHistory toggle the step progress bar and the decision history. onDecisionMade / onFlowStarted / onFlowCompleted fire for your side-effects.

PendingVerifications — the inbox#

A standalone list of every record awaiting the current user's decision — the fastest way to give reviewers a queue.

pendingActionVerificationPendingActionOptional

Lists PendingItems (entity, flow name, step, whether a signature is required, when it arrived) scoped to the signed-in reviewer.

decideActionVerificationDecideActionOptional

Approve or reject straight from the row; onDecisionMade(entityName, entityId) lets you refresh the queue.

Related sections