Run queue
A queue of agent jobs in three parts — the one running with its steps and progress, the ones up next, and the ones done — with a compact toggle.
A run queue shows a batch of agent jobs moving through three parts. The job running is raised on its own card with its agent, its steps, a progress bar and the time left. The jobs up next wait below, each with when it should start, and the jobs done sit under them with how long each took and a green tick. A failed step turns its job red and offers a Retry; a Detailed / Compact switch folds the running job's steps away; and once every job is done a summary takes the running job's place.
- Summarise the researchResearch agent · Read 12 notes3.1s
- Read 12 notes
- Cluster findings
- Write the brief
- Draft the launch emailCopy agent4.2s
- Render the hero imageDesign agent2.4s
- Schedule the postsSocial agentin ~4s
Nothing waiting
Nothing done yet
Usage
<!-- include core.css + run-queue.css, then the component script -->
<div class="card bare" data-c="run-queue">
<div class="stage-in">
<div class="rq panel keep">
<div class="rq-h">
<div class="rq-ht"><b>Launch prep</b><span class="rq-st num">4 jobs queued</span></div>
<div class="seg2" role="group" aria-label="Density">
<button aria-pressed="true" data-v="full">Detailed</button>
<button aria-pressed="false" data-v="compact">Compact</button>
</div>
</div>
<div class="rq-tot" aria-hidden="true"></div>
<div class="rq-b"><!-- running / up next / done sections --></div>
</div>
</div>
</div>Properties
| Name | Type | Description |
|---|---|---|
jobs | RunJob[] | The jobs in the queue. Each has a title, an agent, an icon, a state, an optional progress, a time, a note, and its steps. |
title | string | The queue's name over its status line. |
status | string | Overrides the status line. Defaults to "1 of 4 done" or "All 4 done". |
summary | string | The line under "All N jobs done" once every job is done, like "18.4s in all · 1 retry". |
density | detailed | compact | detailed lists the running job's steps, compact folds them away. Left out, the switch changes it. |
onDensityChange / densityChange | callback | Fires when the Detailed / Compact switch changes. |
onRetry / retry | callback | Called by a failed step's Retry button with the job's and the step's index. Without it, failed steps show no button. |
bare | boolean | Sits flat in a chat thread, with no card. False by default. |
A RunJob state is queued, running, failed, or done. A RunStep has a label, a state, and an
optional meta shown once the step is done. Progress defaults to the share of a job's steps that are
done.
Theming
Works in light and dark (data-theme="dark") and in the Soft style (data-style="soft"). In
Blueprint the running job gets a hairline in the accent and the progress bars fill in steps. A
failed job turns red with a hatched fill; the step glyphs are a spinner while running, a tick when
done, and a cross on failure.