Human-in-the-Loop UI
A confirm() in React is not durable. The agent must pause server-side.
A bank approval queue, not an OK dialog that vanishes on refresh.
Visual Workflows
Start here — scroll inside each diagram frame to explore, then use + / − to zoom up to 200% if needed.
Overview
Scroll inside the frame to explore · use + / − to zoom up to 200%
Scroll inside the frame to explore · use + / − to zoom up to 200%
This turn
Scroll inside the frame to explore · use + / − to zoom up to 200%
A bank approval queue, not an OK dialog that vanishes on refresh.
Key Takeaways
- 1.Human-in-the-loop is a first-class event: approve, edit, reject, with a timeout.
- 2.The run pauses in the runtime, not only in the browser.
- 3.Show what will happen if they approve.
- 4.A confirm() in React is not durable.
- 5.The agent must pause server-side.
Learn elsewhere
- →Human Approval — Phase 20
Real Example
Scenario
A bank approval queue, not an OK dialog that vanishes on refresh.
What you would do
In AG-UI & Agent UX, apply Human-in-the-Loop UI to this scenario: A bank approval queue, not an OK dialog that vanishes on refresh. Identify the inputs, run the technique, validate the output, and note one thing you would monitor in production.
Cheat Sheet
Quick recap
quick ref- •Human-in-the-loop is a first-class event: approve, edit, reject, with a timeout
- •The run pauses in the runtime, not only in the browser
- •Show what will happen if they approve
Common Mistakes
- ✕Skipping evaluation for Human-in-the-Loop UI before production
- ✕No logging or tracing around hitl ui steps
- ✕Ignoring cost and latency implications