Agent inbox
Runs from every agent in one list, sorted by what needs you, with the selected run open beside it.
Loading preview…
Install
- 1
Run this command in your Tailwind CSS project. It adds
components/ai/agent-inbox-split.tsxand installs its dependencies.$ npx shadcn@latest add https://gradientdeck.com/ai-components/r/agent-inbox-split.json
Usage & API
Example
import { AgentMark } from "@/components/ai/agent-inbox-split"
<AgentMark
agent={agent}
/>Props AgentMark
| Prop | Type & description | Required |
|---|---|---|
agent | InboxAgent | Required |
size | "sm" | "md" | Optional |
Dependencies
- React
- Tailwind CSS
- motion
- lucide-react
Implementation notes
The split preview is a workspace named Northwind. Agents are listed with marks, and one person is shown as the signed-in admin. The run list shows unread dots and the status. Nothing selected reads No run selected. The detail header can Mark read or Mark unread, Archive, or Move to inbox when the run is archived. Trigger, Started and Duration label the facts. The summary sits under them. A failure is an alert with Retry. Steps so far is a vertical list with a waiting step called out. A pending decision is a block titled Waiting for you, with the proposal rows and Approve and Decline. After a choice it reads Approved or Declined by you. J and K move the selection.
Example
import { AgentMark } from "@/components/ai/agent-inbox-triage"
<AgentMark
agent={agent}
/>Props AgentMark
| Prop | Type & description | Required |
|---|---|---|
agent | TriageAgent | Required |
size | "sm" | "md" | Optional |
Dependencies
- React
- Tailwind CSS
- motion
- lucide-react
Implementation notes
Triage shows one decision at a time, with the trigger, the duration, the proposal rows, an optional quoted preview and a note. Approve, Decline, Snooze and Skip sit on the bar, with keys A, D, S and the right arrow. Snooze opens until-options you pass. Skip moves the run to the end and says so. A progress line counts approved, declined and snoozed. Undo restores the last action. Up next lists the rest of the queue. When the queue is empty the title is Nothing left to triage, and the run can be started over. The header names the workspace and the screen.
Choosing a layout
Use the split when someone is watching many agents and needs to open one run without losing the queue. Use triage when the job is to empty the waiting pile, one decision after another, and the list is only there to show what is next. Both are for runs. A library of files the agent may read is project knowledge, not this inbox.
Saved filters such as Needs review or Failed this week, with live counts, are inbox views, and they are meant to sit over a run list like this one. A single decision inside a chat, with room to ask a question, is the decision card. The inbox is the place those runs are gathered after they leave the thread.
What is the difference between archive and decline?
Archive hides a run from the default list and can be reversed with Move to inbox. Decline is a decision on a run that is waiting, and it is recorded as declined. A run with no pending decision has archive, not approve and decline.
Does the inbox include runs that are still going?
Yes. Status covers needs you, running, failed and done. Triage is the subset you put in its queue, which in the preview is the runs waiting on a person. The split list can show all of them, with an optional agent filter and a flag for archived rows.