feat(ui): the sidebar is a list, and colour only marks what varies #114

Merged
lz merged 1 commit from feat/sidebar-restyle into rc/sidebar-96 2026-09-04 16:53:34 +02:00
Owner

Third of four addressing sidebar-issues — the whole "workspace card" section.

Net −13 lines. This is styling; it should not add bulk. The one part that needed a backend field is split into #115.

The problem

The workspace card said "running and fine" four ways at once — a status LED, a coloured left stripe, a healthy chip, and (whenever anything under it was docked, which is most of the time) a wash across the whole card. Around them sat facts that never change: the container name, the creation date, and the image's capabilities.

The change

A workspace is now a section of a list rather than a card: full pane width, no border, no radius, no margin, no wash. What is left of status is presence — greyed means not running, plain means fine, a coloured chip means read me.

Every bullet from the list:

  • The LED, the healthy chip, the container name and the creation date are gone, as are the dind/playwright chips — an image capability is frozen at spawn and said nothing about this workspace. All four already appear in the workspace Settings panel, checked before deleting, so nothing became unreachable.
  • The repo moved directly under the name, and the took the corner the LED had.
  • "Sessions (N)", "No sessions yet" and "Sessions appear when the workspace is running" are gone. The first restated the rows; the second was false whenever it showed, since the workspace shell sits directly above it; the third told a greyed workspace what its greying already said.
  • Chips carry only what varies: unhealthy, degraded, provision failed, and the mount count.
  • The coloured left edge moved down to the session rows, at x=0 with no margin, lit for exactly the sessions carrying the wash — the ones with panels docked — so the sidebar edge and the dock tabs agree without a legend.

.card.running / .exited / .stopped / .errored are deleted from app.css: this was their only consumer. .card itself stays — ten other components use it.

Verification

Browser, against a seeded instance covering running-with-chips, dormant, pulling-with-progress and provision-error, at 1500px and 420px. Measured: rows start at pane x=0 and end 1px short of the right (the pane's own border); every other block indents to 15px.

Gates: typecheck 4897 files / 0 errors, lint clean, 120 files / 1200 tests.

Three defects the browser caught and the suite could not (it is node-only, no DOM):

  1. A duplicated failure message — ProvisionProgress already renders Failed: <error>.
  2. A comment claiming row text lands at 15px when the status dot puts it at 33.
  3. The + session button silently went full-size: the old .card .btn.sm override covered the action row and the add-session form because both sat inside one card. Splitting the card up left the form's button on the global .btn.sm. Now one .left-pane .btn.sm rule covers both components.

One judgment call

The session status dot is kept. The list scopes the LED removal to the workspace card, and the dot earns its place: it is the indent that nests a session under its workspace. Say the word if you want it gone too.

Third of four addressing `sidebar-issues` — the whole "workspace card" section. **Net −13 lines.** This is styling; it should not add bulk. The one part that needed a backend field is split into #115. ## The problem The workspace card said "running and fine" four ways at once — a status LED, a coloured left stripe, a `healthy` chip, and (whenever anything under it was docked, which is most of the time) a wash across the whole card. Around them sat facts that never change: the container name, the creation date, and the image's capabilities. ## The change A workspace is now a **section of a list** rather than a card: full pane width, no border, no radius, no margin, no wash. What is left of status is *presence* — greyed means not running, plain means fine, a coloured chip means read me. Every bullet from the list: - The LED, the `healthy` chip, the container name and the creation date are gone, as are the dind/playwright chips — an image capability is frozen at spawn and said nothing about *this* workspace. **All four already appear in the workspace Settings panel**, checked before deleting, so nothing became unreachable. - The repo moved directly under the name, and the `⋯` took the corner the LED had. - "Sessions (N)", "No sessions yet" and "Sessions appear when the workspace is running" are gone. The first restated the rows; the second was false whenever it showed, since the workspace shell sits directly above it; the third told a greyed workspace what its greying already said. - Chips carry only what varies: `unhealthy`, `degraded`, `provision failed`, and the mount count. - The coloured left edge moved **down to the session rows**, at x=0 with no margin, lit for exactly the sessions carrying the wash — the ones with panels docked — so the sidebar edge and the dock tabs agree without a legend. `.card.running` / `.exited` / `.stopped` / `.errored` are deleted from `app.css`: this was their only consumer. `.card` itself stays — ten other components use it. ## Verification Browser, against a seeded instance covering running-with-chips, dormant, pulling-with-progress and provision-error, at 1500px and 420px. Measured: rows start at pane x=0 and end 1px short of the right (the pane's own border); every other block indents to 15px. Gates: typecheck 4897 files / 0 errors, lint clean, 120 files / 1200 tests. **Three defects the browser caught and the suite could not** (it is node-only, no DOM): 1. A duplicated failure message — `ProvisionProgress` already renders `Failed: <error>`. 2. A comment claiming row text lands at 15px when the status dot puts it at 33. 3. The `+ session` button silently went full-size: the old `.card .btn.sm` override covered the action row *and* the add-session form because both sat inside one card. Splitting the card up left the form's button on the global `.btn.sm`. Now one `.left-pane .btn.sm` rule covers both components. ## One judgment call **The session status dot is kept.** The list scopes the LED removal to the workspace card, and the dot earns its place: it is the indent that nests a session under its workspace. Say the word if you want it gone too.
feat(ui): the sidebar is a list, and colour only marks what varies
All checks were successful
ci / nexus (pull_request) Successful in 11m37s
pr-image-cleanup / delete-pr-images (pull_request) Successful in 15s
ci / images (pull_request) Successful in 14m20s
5ed754efde
The workspace card said "running and fine" four ways at once — a status LED, a
coloured left stripe, a `healthy` chip, and (whenever anything under it was
docked, which is most of the time) a wash across the whole card. Around them sat
facts that never change: the container name, the creation date, and the image's
capabilities.

A workspace is now a section of a list rather than a card: full pane width, no
border, no radius, no margin, no wash. What is left of status is presence —
greyed means not running, plain means fine, a coloured chip means read me.

- The LED, the `healthy` chip, the container name and the creation date are
  gone, as are the dind/playwright chips: an image capability is frozen at spawn
  and said nothing about THIS workspace. All four already appear in the
  workspace Settings panel, so nothing became unreachable.
- The repo moved directly under the name, and the ⋯ took the corner the LED had.
- The "Sessions (N)" heading, "No sessions yet" and "Sessions appear when the
  workspace is running" are gone. The first restated the rows; the second was
  false whenever it showed, since the workspace shell sits directly above it;
  the third told a greyed workspace what its greying already said.
- Chips carry only what varies: `unhealthy`, `degraded`, `provision failed`, and
  the operator's own mount count.

The coloured left edge moved DOWN to the session rows, at x=0 with no margin,
lit for exactly the sessions carrying the wash — the ones with panels docked —
so the sidebar edge and the dock tabs agree without a legend. Measured: rows
start at pane x=0 and end 1px short of the right (the pane's own border).

`.card.running` / `.card.exited` / `.card.stopped` / `.card.errored` are deleted
from app.css: this was their only consumer. `.card` itself stays — ten other
components use it.

Verified in a browser against a seeded instance covering running-with-chips,
dormant, pulling-with-progress and provision-error, at 1500px and 420px. Two
defects the screenshot caught and the suite could not: a duplicated failure
message (ProvisionProgress already renders `Failed: <error>`), and a comment
claiming the row text lands at 15px when the status dot puts it at 33.
lz merged commit c7d8933337 into rc/sidebar-96 2026-09-04 16:53:34 +02:00
Sign in to join this conversation.
No reviewers
No project
No assignees
1 participant
Notifications
Due date
The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference
lz/agent-nexus!114
No description provided.