Merge remote-tracking branch 'origin/main' into dorian

crates/maestro-tui/src/sidebar.rs

@@ -259,7 +259,7 @@ impl Sidebar {
         pad_to_width(spans, width, base)
     }
 
-    /// The adaptive second line: `[<duration>] [<detail>] [<blocked work> | exited] <command>`,
+    /// The adaptive second line: `[<duration>] [<detail>] <command> [<blocked work> | exited]`,
     /// led by the activity rail (docs/SIDEBAR.md).
     fn meta_row(&self, s: &Session, width: usize, focused: bool) -> Vec<Span<'static>> {
         let now = Utc::now();
@@ -329,8 +329,8 @@ impl Sidebar {
                 budget,
             ));
         }
-        spans.extend(tail);
         spans.extend(fit_to_width(vec![command], command_w));
+        spans.extend(tail);
         spans
     }
 }
@@ -927,9 +927,11 @@ mod tests {
         let all = rows(&draw(&sb, 28, 8));
         let idx = all.iter().position(|l| l.contains("claude")).unwrap();
         let meta = content(&all[idx + 1]);
+        let ellipsis = meta.find('…').expect("truncated command must contain …");
+        let tail = meta.find("~120").expect("diff stat must survive: {meta:?}");
         assert!(
-            meta.trim_end().ends_with('…'),
-            "truncated command must end with …: {meta:?}"
+            ellipsis < tail,
+            "command must truncate before the diff stat: {meta:?}"
         );
         assert!(
             content(&all[idx + 2]).trim().is_empty(),
@@ -1131,7 +1133,7 @@ mod tests {
     }
 
     #[test]
-    fn blocked_warning_survives_before_a_truncated_command() {
+    fn blocked_warning_survives_after_a_truncated_command() {
         let mut s = session_named(1, "name");
         s.command = "a-program-name-that-cannot-fit".into();
         s.blocked_work = Some(InTheWay {
@@ -1146,7 +1148,12 @@ mod tests {
         let all = rows(&draw(&sb, 29, 6));
         assert!(all[3].contains("~1"), "{:?}", all[3]);
         let meta = content(&all[3]);
-        assert!(meta.ends_with('…'), "command must truncate: {meta:?}");
+        let ellipsis = meta.find('…').expect("command must truncate");
+        let tail = meta.find("~1").unwrap();
+        assert!(
+            ellipsis < tail,
+            "diff stat must follow the truncated command: {meta:?}"
+        );
     }
 
     #[test]

docs/SIDEBAR.md

@@ -37,7 +37,7 @@ itself is not.
 Line 2 reads left to right:
 
 ```
-[<duration>] [<detail>] [<diff stat> | exited] <command>
+[<duration>] [<detail>] <command> [<diff stat> | exited]
 ```
 
 Its minimum content is therefore just the command.
@@ -51,13 +51,15 @@ command. `<duration>` follows in the rail's colour when shown. There is no
 state word and no second badge: the rail exists so the state is still legible
 when a row is dimmed or the terminal renders the duration in the default fg.
 
-In the **web client** the rail is a 5px bar positioned inside the row's own
-indent gutter — it shifts outward with nesting depth exactly as the gutter
-does — spanning the full card height. It carries motion, reserved for states
-that need attention (DESIGN.md's "living signals" rule): a slow breathing
-opacity while `Active`, a hard blink while `AwaitingInput`, a fast flash while
-`Error`. `Idle` is solid and still, on purpose. `prefers-reduced-motion`
-leaves every state as a solid bar.
+In the **web client** the rail is a 5px bar pinned to the row's own left
+edge, square corners, spanning the full card height edge to edge — it
+shifts outward with nesting depth along with the row's own padding, since
+it is positioned relative to the row. It carries motion only for states that
+need attention (DESIGN.md's "living signals" rule): a hard blink while
+`AwaitingInput`, a fast flash while `Error`. `Active` and `Idle` are both
+solid and still — colour alone (green vs. the idle grey) is the signal for
+`Active`, so it does not also pulse. `prefers-reduced-motion` leaves every
+state as a solid bar.
 
 In the **TUI** the rail is a one-column-wide block glyph (`▌`) in the state's
 palette role, leading the existing indent gutter (`INDENT`/`META_INDENT`) on
@@ -83,7 +85,7 @@ fragment; it no longer decides whether line 2 exists.
 while an agent-reported state is in force (see Precedence): when the report
 lapses at its TTL or is replaced, the detail goes with it. The detail
 truncates with `…` ahead of the trailing fragments — a long detail never
-pushes `<blocked work>`, `exited`, or `<command>` off the line, and neither
+pushes `<command>`, `<blocked work>`, or `exited` off the line, and neither
 client ever lets it wrap.
 
 `<diff stat>` is the blocked-work breakdown (#83) in diff notation, replacing

web/src/catalog.ts

@@ -76,13 +76,11 @@ const STATE_WORDS: Record<string, string> = {
   error: "Error",
 };
 
-/** docs/SIDEBAR.md: the activity rail sits inside the row's own indent
- * gutter, so it shifts outward with nesting depth exactly as that gutter
- * does. `depth * 16 + 8` is the same expression `renderNode` uses for the
- * row's own padding — the rail sits just inside it. */
-function activityRailMarkup(slug: string, stateWord: string, depth: number): string {
-  const left = depth * 16 + 2;
-  return `<span class="activity-rail" data-activity="${slug}" style="left:${left}px" role="img" title="${escapeHtml(stateWord)}" aria-label="${escapeHtml(stateWord)}"></span>`;
+/** docs/SIDEBAR.md: the activity rail is pinned to the row's own left edge,
+ * full height. The row's own padding (`renderNode`) shifts outward with
+ * nesting depth, carrying the rail with it. */
+function activityRailMarkup(slug: string, stateWord: string): string {
+  return `<span class="activity-rail" data-activity="${slug}" role="img" title="${escapeHtml(stateWord)}" aria-label="${escapeHtml(stateWord)}"></span>`;
 }
 
 function metaLine(s: Session, now: number): string {
@@ -98,9 +96,9 @@ function metaLine(s: Session, now: number): string {
     s.activity_detail
       ? `<span class="activity-detail">${escapeHtml(s.activity_detail)}</span>`
       : "",
+    commandFragment(s.command),
     blockers ? blockedFragment(blockers) : "",
     dead ? `<span class="card-flag">exited</span>` : "",
-    commandFragment(s.command),
   ];
   return `<span class="card-line2" data-activity="${slug}">${fragments.join("")}</span>`;
 }
@@ -180,7 +178,7 @@ function renderNode(node: TreeNode, depth: number): HTMLElement {
   );
   // docs/SIDEBAR.md: line 1 reserves action width, and line 2 is unconditional.
   row.innerHTML = `
-    ${activityRailMarkup(slug, stateWord, depth)}
+    ${activityRailMarkup(slug, stateWord)}
     <span class="card-line1">
       <span class="leaf-name">${escapeHtml(name)}</span>
       <span class="leaf-actions">

web/src/styles.css

@@ -1393,23 +1393,21 @@ input.leaf-rename:focus {
   color: var(--danger);
 }
 
-/* docs/SIDEBAR.md: the activity rail replaces the old inline dot. It sits
-   inside the row's own indent gutter (`.tree-leaf` is already positioned),
-   at a `left` set inline per nesting depth — see `activityRailMarkup` in
+/* docs/SIDEBAR.md: the activity rail replaces the old inline dot. It is
+   pinned to the row's own left edge, full height, square corners — see
    catalog.ts. Idle stays solid and still on purpose: motion is reserved for
    states that need attention (DESIGN.md's "living signals" rule). */
 .activity-rail {
   position: absolute;
-  top: 4px;
-  bottom: 4px;
+  top: 0;
+  bottom: 0;
+  left: 0;
   width: 5px;
-  border-radius: 2px;
   background: currentColor;
 }
 
 .activity-rail[data-activity="active"] {
   color: var(--live);
-  animation: pulse 2.4s var(--ease-out) infinite;
 }
 .activity-rail[data-activity="idle"] {
   color: var(--border-strong);