dashboard: render step sub-line on rebuild queue entries (closes #437)
Frontend half of #437 — paired with damocles's #501 backend which adds `step: Option<String>` to `QueueEntry` and annotates 9 worker phases across ApplyCommit / Spawn / MetaUpdate / Rebuild pipelines. When `entry.step` is present, render a cyan `↳ <step>` sub-line below the main row in `renderQueueEntry`. Wraps to its own flex line via `flex-basis: 100%`, indented 1.8em to align under the state glyph + kind. Terminal transitions clear `step` on the backend, so the sub-line just disappears on Done / Failed rows — no client-side staleness handling needed. CSS: `.rqe-step` keys off cyan to visually group with the running-spinner color cue (vs the muted `.rqe-when` / `.rqe-reason` chips). `tabular-nums` keeps the indented arrow column stable as step strings change length mid-build. docs/web-ui.md updated to describe the new sub-line behaviour in the R3BU1LD QU3U3 section.
This commit is contained in:
parent
a286ae777c
commit
50986b5a05
3 changed files with 28 additions and 3 deletions
|
|
@ -208,9 +208,14 @@ timing, and an optional reason / error. Meta-update cascade
|
|||
rebuilds nest under their parent entry (`parent_id` grouping;
|
||||
`rqe-child` CSS class). Dedup: re-enqueueing a still-queued op
|
||||
for the same agent collapses into the existing entry. Running
|
||||
entries tick elapsed seconds live. Cold-loaded from
|
||||
`/api/state.rebuild_queue`; live updates via `rebuild_queue_changed`
|
||||
snapshot event.
|
||||
entries tick elapsed seconds live, and when the worker has
|
||||
annotated the current phase (#437) a cyan `↳ <step>` sub-line
|
||||
appears under the main row showing the in-flight step name
|
||||
(e.g. `↳ meta prepare_deploy` → `↳ nixos-container update` →
|
||||
`↳ finalize deploy`). Terminal transitions clear `step` on the
|
||||
backend so Done / Failed rows don't render stale labels.
|
||||
Cold-loaded from `/api/state.rebuild_queue`; live updates via
|
||||
`rebuild_queue_changed` snapshot event.
|
||||
|
||||
**K3PT ST4T3** — destroyed-but-state-kept tombstones (size +
|
||||
age + claude-creds badge). Two actions: `⊕ R3V1V3` (queues a
|
||||
|
|
|
|||
|
|
@ -791,6 +791,18 @@ code {
|
|||
.rqe-source-approval { color: var(--green); border-color: var(--green); }
|
||||
.rqe-when { color: var(--muted); font-size: 0.85em; }
|
||||
.rqe-reason { color: var(--muted); font-size: 0.85em; flex: 1 1 auto; }
|
||||
/* #437: in-flight step indicator on running queue entries — sub-line
|
||||
below the main row, indented under the state glyph + kind. Cyan
|
||||
keeps it visually grouped with the running spinner instead of
|
||||
blending into the muted reason/timing chips. flex-basis: 100% so
|
||||
it always wraps to its own line. */
|
||||
.rqe-step {
|
||||
flex-basis: 100%;
|
||||
margin: 0.1em 0 0 1.8em;
|
||||
color: var(--cyan);
|
||||
font-size: 0.85em;
|
||||
font-variant-numeric: tabular-nums;
|
||||
}
|
||||
.rqe-error {
|
||||
flex-basis: 100%;
|
||||
margin: 0.3em 0 0;
|
||||
|
|
|
|||
|
|
@ -1823,6 +1823,14 @@ window.marked = marked;
|
|||
const r = entry.reason.split('\n')[0];
|
||||
li.append(' ', el('span', { class: 'rqe-reason', title: entry.reason }, '— ' + truncate(r, 60)));
|
||||
}
|
||||
// Current step (#437 / #501): backend annotates the in-flight
|
||||
// phase on `running` entries — sub-line below the main row so the
|
||||
// operator can see "what's happening right now" inside a long
|
||||
// build. Terminal transitions clear `step` on the backend so this
|
||||
// doesn't render stale labels on Done / Failed rows.
|
||||
if (entry.step) {
|
||||
li.append(el('div', { class: 'rqe-step' }, '↳ ' + entry.step));
|
||||
}
|
||||
// Error block, when failed.
|
||||
if (entry.error) {
|
||||
li.append(el('pre', { class: 'rqe-error', title: entry.error }, truncate(entry.error, 200)));
|
||||
|
|
|
|||
Loading…
Reference in a new issue