Tool-Call Approval Queue
An AI agent proposes actions (sending an email, deleting a branch, opening a ticket), and nothing runs until a person approves it. The approval queue is where they do that, many times a day, so it has to feel instant and must never lose a decision silently.
Build the approval queue.
Requirements
- On load, fetch
GET /api/tool-calls, which answers{ "calls": [{ "id", "tool", "summary", "risk" }] }. While it loads, showLoading tool calls.... - Show a heading
Pending tool calls (N), where N is the number of calls in the queue, and a list with one item per call showing its tool, its summary and, whenriskis"high", aHigh riskbadge. Each item has anApproveand aRejectbutton. - Optimistic decisions: clicking
ApproveorRejectremoves the call from the list immediately (and updates N), then sendsPOST /api/tool-calls/<id>/approveorPOST /api/tool-calls/<id>/reject. - If that request fails, put the call back where it was in the original list and show an alert:
Could not approve "<summary>". It is back in the queue.(orCould not reject ...). - Approving a high-risk call first asks with
confirm(), with the call's summary in the message. If the user cancels, nothing changes and nothing is sent. Rejecting never asks, and neither does approving a low-risk call. - When the queue is empty, show
No tool calls waiting for approval.
The setup
The files open on a skeleton. Build the behaviour the requirements describe.
- src/main.jsx
- src/App.jsx
- src/styles.css
The preview has no network. fetch is answered by this problem's API:
- GET /api/tool-calls
- POST /api/tool-calls/:id/approve
- POST /api/tool-calls/:id/reject
Follow-up: Two reviewers have the same queue open. One approves a call the other is about to reject. How should the server answer the second decision, and what should the second reviewer's screen show?
- React with JavaScript and plain CSS; every file is editable. - Use `window.confirm` for the high-risk confirmation. - The list is a real list (`ul`/`li`), and the buttons are `button` elements.
- Views
- 2