feat(lanes): add lane tools menu and header liveness/age indicator

Move the rare destructive lane actions behind a LaneToolsMenu next to
the lane header, and show a liveness dot + status label + stage age
inline in the header instead of only in the card grid.

client/src/pages/Workspace.tsx

@@ -48,9 +48,10 @@ import type { Lane, LaneFeature, LaneCounts, ProofFeature, Session, WSMessage }
 import { eventBus } from "../lib/eventBus";
 import { LaneConsolePane } from "../components/run/LaneConsolePane";
 import PipelineMap from "../components/lanes/PipelineMap";
-import LaneCard from "../components/lanes/LaneCard";
+import LaneCard, { since, LIVENESS_DOT, LaneToolsMenu } from "../components/lanes/LaneCard";
 import LaneStripCard from "../components/lanes/LaneStripCard";
 import { AddLaneModal } from "../components/lanes/AddLaneModal";
+import { DestructiveLaneModal } from "../components/lanes/DestructiveLaneModal";
 import { readSplitViewState, writeSplitViewState } from "../lib/splitViewStorage";
 import type { SplitViewState, SplitLayout } from "../lib/splitViewStorage";
 
@@ -182,6 +183,7 @@ export function Workspace() {
   >([]);
   const [viewedFeature, setViewedFeature] = useState<LaneFeature | null>(null);
   const [proofFeatures, setProofFeatures] = useState<ProofFeature[]>([]);
+  const [removeConfirmOpen, setRemoveConfirmOpen] = useState(false);
 
   // Run state kept at page level: shared across every pane, or drives the
   // lane strip itself rather than any one pane's form.
@@ -511,14 +513,17 @@ export function Workspace() {
             </span>
           )}
         </div>
-        <button
-          onClick={() => setAddLaneOpen(true)}
-          className="ml-auto flex items-center gap-1.5 rounded border border-border-light px-3 py-1 text-xs text-fg-secondary transition-colors hover:border-border-light hover:text-fg-primary"
-          title={tLanes("addLane")}
-        >
-          <Plus className="h-3.5 w-3.5" />
-          {tLanes("add")}
-        </button>
+        <div className="ml-auto flex items-center gap-2">
+          {currentLane && <LaneToolsMenu lane={currentLane} />}
+          <button
+            onClick={() => setAddLaneOpen(true)}
+            className="flex items-center gap-1.5 rounded border border-border-light px-3 py-1 text-xs text-fg-secondary transition-colors hover:border-border-light hover:text-fg-primary"
+            title={tLanes("addLane")}
+          >
+            <Plus className="h-3.5 w-3.5" />
+            {tLanes("add")}
+          </button>
+        </div>
       </div>
 
       {/* Lane strip + detail stack vertically: the strip is a horizontally
@@ -549,13 +554,24 @@ export function Workspace() {
             className="flex min-h-0 min-w-0 flex-1 flex-col card p-4"
           >
             <div className="mb-3 flex flex-wrap items-center justify-between gap-2">
-              <span className="truncate text-sm font-semibold text-fg-primary">
-                {tLanes("laneHeader", {
-                  id: currentLane.id,
-                  title: currentLane.title || currentLane.cwd,
-                  pipeline: currentLane.pipeline_name,
-                })}
-              </span>
+              <div className="flex min-w-0 items-center gap-2">
+                <span className="flex shrink-0 items-center gap-1.5 text-[11px] font-medium uppercase tracking-wide text-fg-secondary">
+                  <span className={`h-2 w-2 rounded-full ${LIVENESS_DOT[currentLane.liveness]}`} />
+                  {currentLane.liveness === "dead"
+                    ? tLanes("statusDead")
+                    : tLanes(`status.${currentLane.status}`, { defaultValue: currentLane.status })}
+                </span>
+                <span className="truncate text-sm font-semibold text-fg-primary">
+                  {tLanes("laneHeader", {
+                    id: currentLane.id,
+                    title: currentLane.title || currentLane.cwd,
+                    pipeline: currentLane.pipeline_name,
+                  })}
+                </span>
+                <span className="shrink-0 tabular-nums text-xs text-fg-muted">
+                  {since(currentLane.stage_seconds)}
+                </span>
+              </div>
               <div className="flex items-center gap-2">
                 <button
                   type="button"
@@ -572,9 +588,6 @@ export function Workspace() {
             {showInfo && (
               <div className="max-h-[45vh] shrink-0 overflow-y-auto">
                 <div className="mb-3 flex flex-wrap items-baseline gap-2">
-                  <span className="text-[11px] font-semibold uppercase tracking-widest text-fg-muted">
-                    {tLanes("cardId", { id: currentLane.id })}
-                  </span>
                   <select
                     data-testid="pipeline-picker"
                     aria-label={tLanes("pipelinePicker.label")}
@@ -634,6 +647,16 @@ export function Workspace() {
                       ))}
                     </select>
                   )}
+                  <button
+                    type="button"
+                    data-testid="lane-action-remove"
+                    onClick={() => setRemoveConfirmOpen(true)}
+                    className="ml-auto rounded px-2 py-0.5 text-status-danger transition-colors hover:bg-status-danger/15"
+                  >
+                    {currentLane.kind === "adopted"
+                      ? tLanes("action.forget")
+                      : tLanes("action.remove")}
+                  </button>
                 </div>
                 <div className="mb-3">
                   <LaneCard
@@ -749,6 +772,19 @@ export function Workspace() {
         )}
       </div>
 
+      {currentLane && removeConfirmOpen && (
+        <DestructiveLaneModal
+          lane={currentLane}
+          action="remove"
+          open
+          onClose={() => setRemoveConfirmOpen(false)}
+          onConfirm={(body) => {
+            setRemoveConfirmOpen(false);
+            void handleLaneAction(currentLane.id, "remove", body);
+          }}
+        />
+      )}
+
       <AddLaneModal
         open={addLaneOpen}
         cwdSuggestions={cwdSuggestions}

client/src/pages/__tests__/__snapshots__/screens.snapshot.test.tsx.snap

@@ -5735,31 +5735,35 @@ exports[`screen snapshots > Run 1`] = `
           running
         </span>
       </div>
-      <button
-        class="ml-auto flex items-center gap-1.5 rounded border border-border-light px-3 py-1 text-xs text-fg-secondary transition-colors hover:border-border-light hover:text-fg-primary"
-        title="Create a lane from a working directory"
+      <div
+        class="ml-auto flex items-center gap-2"
       >
-        <svg
-          class="lucide lucide-plus h-3.5 w-3.5"
-          fill="none"
-          height="24"
-          stroke="currentColor"
-          stroke-linecap="round"
-          stroke-linejoin="round"
-          stroke-width="2"
-          viewBox="0 0 24 24"
-          width="24"
-          xmlns="http://www.w3.org/2000/svg"
+        <button
+          class="flex items-center gap-1.5 rounded border border-border-light px-3 py-1 text-xs text-fg-secondary transition-colors hover:border-border-light hover:text-fg-primary"
+          title="Create a lane from a working directory"
         >
-          <path
-            d="M5 12h14"
-          />
-          <path
-            d="M12 5v14"
-          />
-        </svg>
-        Add lane
-      </button>
+          <svg
+            class="lucide lucide-plus h-3.5 w-3.5"
+            fill="none"
+            height="24"
+            stroke="currentColor"
+            stroke-linecap="round"
+            stroke-linejoin="round"
+            stroke-width="2"
+            viewBox="0 0 24 24"
+            width="24"
+            xmlns="http://www.w3.org/2000/svg"
+          >
+            <path
+              d="M5 12h14"
+            />
+            <path
+              d="M12 5v14"
+            />
+          </svg>
+          Add lane
+        </button>
+      </div>
     </div>
     <div
       class="flex min-h-0 flex-1 flex-col gap-4"