Add stale worktree pruning to sidebar

- Add a sidebar entry to open worktree cleanup
- Show merged PR links and merge age in the dialog
- Add bulk prune for stale records and cover age formatting

Author: BunsDev

apps/web/src/components/Sidebar.tsx

@@ -76,6 +76,7 @@ import { useTerminalStateStore } from "../terminalStateStore";
 import { useThreadSelectionStore } from "../threadSelectionStore";
 import type { Thread } from "../types";
 import { formatWorktreePathForDisplay, getOrphanedWorktreePathForThread } from "../worktreeCleanup";
+import { useWorktreeCleanupStore } from "../worktreeCleanupStore";
 import {
   getArm64IntelBuildWarningDescription,
   getDesktopUpdateActionError,
@@ -490,6 +491,7 @@ export default function Sidebar() {
   });
   const queryClient = useQueryClient();
   const removeWorktreeMutation = useMutation(gitRemoveWorktreeMutationOptions({ queryClient }));
+  const openWorktreeCleanupDialog = useWorktreeCleanupStore((s) => s.openDialog);
   const [addingProject, setAddingProject] = useState(false);
   const [newCwd, setNewCwd] = useState("");
   const [isPickingFolder, setIsPickingFolder] = useState(false);
@@ -2026,6 +2028,16 @@ export default function Sidebar() {
                   <span className="text-xs">Open Workspace</span>
                 </SidebarMenuButton>
               </SidebarMenuItem>
+              <SidebarMenuItem>
+                <SidebarMenuButton
+                  size="sm"
+                  className="gap-2 px-2 py-1.5 text-muted-foreground/70 hover:bg-accent hover:text-foreground"
+                  onClick={() => openWorktreeCleanupDialog()}
+                >
+                  <GitMergeIcon className="size-3.5" />
+                  <span className="text-xs">Worktree cleanup</span>
+                </SidebarMenuButton>
+              </SidebarMenuItem>
               <SidebarMenuItem>
                 <SidebarMenuButton
                   size="sm"

apps/web/src/components/WorktreeCleanupDialog.tsx

@@ -10,7 +10,7 @@ import {
   gitPruneWorktreesMutationOptions,
   gitRemoveWorktreeMutationOptions,
 } from "~/lib/gitReactQuery";
-import { formatWorktreePathForDisplay } from "~/worktreeCleanup";
+import { formatBranchAge, formatWorktreePathForDisplay } from "~/worktreeCleanup";
 import { useWorktreeCleanupStore } from "~/worktreeCleanupStore";
 import { toastManager } from "./ui/toast";
 import { Badge } from "./ui/badge";
@@ -64,10 +64,37 @@ export function WorktreeCleanupDialog() {
   const hasCandidates = candidates.length > 0;
   const isBusy = removeWorktreeMutation.isPending || pruneWorktreesMutation.isPending;
 
+  const staleCandidates = useMemo(
+    () =>
+      candidates.filter(
+        (c) => !c.pathExists && resolveWorktreeUsageCount(c, threadWorktreePaths) === 0,
+      ),
+    [candidates, threadWorktreePaths],
+  );
+  const hasStaleCandidates = staleCandidates.length > 0;
+
   const handleClose = () => {
     closeDialog();
   };
 
+  const handlePruneAllStale = async () => {
+    if (!cwd || !hasStaleCandidates) return;
+    try {
+      await pruneWorktreesMutation.mutateAsync({ cwd });
+      toastManager.add({
+        type: "success",
+        title: "Stale records pruned",
+        description: `Pruned ${staleCandidates.length} stale worktree record${staleCandidates.length === 1 ? "" : "s"}.`,
+      });
+    } catch (error) {
+      toastManager.add({
+        type: "error",
+        title: "Could not prune stale records",
+        description: error instanceof Error ? error.message : "Unknown error.",
+      });
+    }
+  };
+
   const handleRemoveCandidate = async (candidate: GitWorktreeCleanupCandidate) => {
     if (!cwd) return;
     const usageCount = resolveWorktreeUsageCount(candidate, threadWorktreePaths);
@@ -151,10 +178,21 @@ export function WorktreeCleanupDialog() {
                         <div className="flex flex-col gap-3 sm:flex-row sm:items-start sm:justify-between">
                           <div className="min-w-0 space-y-2">
                             <div className="flex flex-wrap items-center gap-2">
-                              <Badge variant="outline" size="sm">
-                                <GitMergeIcon className="size-3.5" />
-                                Merged PR #{candidate.prNumber}
-                              </Badge>
+                              <a
+                                href={candidate.prUrl}
+                                target="_blank"
+                                rel="noopener noreferrer"
+                                className="no-underline"
+                              >
+                                <Badge
+                                  variant="outline"
+                                  size="sm"
+                                  className="cursor-pointer hover:bg-accent"
+                                >
+                                  <GitMergeIcon className="size-3.5" />
+                                  Merged PR #{candidate.prNumber}
+                                </Badge>
+                              </a>
                               {candidate.pathExists ? (
                                 <Badge variant="success" size="sm">
                                   On disk
@@ -182,6 +220,11 @@ export function WorktreeCleanupDialog() {
                                 {" · "}
                                 Path{" "}
                                 <span className="font-mono text-foreground">{displayPath}</span>
+                                {" · "}
+                                Merged{" "}
+                                <span className="text-foreground">
+                                  {formatBranchAge(candidate.mergedAt)}
+                                </span>
                               </div>
                             </div>
                           </div>
@@ -215,9 +258,26 @@ export function WorktreeCleanupDialog() {
             <div className="text-xs text-muted-foreground">
               {candidates.length} candidate{candidates.length === 1 ? "" : "s"} found
             </div>
-            <Button variant="outline" size="sm" onClick={handleClose}>
-              Close
-            </Button>
+            <div className="flex items-center gap-2">
+              {hasStaleCandidates ? (
+                <Button
+                  variant="destructive-outline"
+                  size="sm"
+                  disabled={isBusy}
+                  onClick={() => void handlePruneAllStale()}
+                >
+                  {pruneWorktreesMutation.isPending ? (
+                    <LoaderCircleIcon className="size-3.5 animate-spin" />
+                  ) : (
+                    <Trash2Icon className="size-3.5" />
+                  )}
+                  Prune all stale ({staleCandidates.length})
+                </Button>
+              ) : null}
+              <Button variant="outline" size="sm" onClick={handleClose}>
+                Close
+              </Button>
+            </div>
           </div>
         </DialogFooter>
       </DialogPopup>

apps/web/src/worktreeCleanup.test.ts

@@ -2,7 +2,11 @@ import { ProjectId, ThreadId } from "@okcode/contracts";
 import { describe, expect, it } from "vitest";
 
 import { DEFAULT_INTERACTION_MODE, DEFAULT_RUNTIME_MODE, type Thread } from "./types";
-import { formatWorktreePathForDisplay, getOrphanedWorktreePathForThread } from "./worktreeCleanup";
+import {
+  formatBranchAge,
+  formatWorktreePathForDisplay,
+  getOrphanedWorktreePathForThread,
+} from "./worktreeCleanup";
 
 function makeThread(overrides: Partial<Thread> = {}): Thread {
   return {
@@ -76,6 +80,38 @@ describe("getOrphanedWorktreePathForThread", () => {
   });
 });
 
+describe("formatBranchAge", () => {
+  const now = new Date("2026-04-06T12:00:00.000Z");
+
+  it("returns 'just now' for timestamps less than a minute ago", () => {
+    expect(formatBranchAge("2026-04-06T11:59:30.000Z", now)).toBe("just now");
+  });
+
+  it("returns minutes for recent merges", () => {
+    expect(formatBranchAge("2026-04-06T11:45:00.000Z", now)).toBe("15m ago");
+  });
+
+  it("returns hours for same-day merges", () => {
+    expect(formatBranchAge("2026-04-06T05:00:00.000Z", now)).toBe("7h ago");
+  });
+
+  it("returns days for merges within a week", () => {
+    expect(formatBranchAge("2026-04-03T12:00:00.000Z", now)).toBe("3d ago");
+  });
+
+  it("returns weeks for merges within a month", () => {
+    expect(formatBranchAge("2026-03-16T12:00:00.000Z", now)).toBe("3w ago");
+  });
+
+  it("returns months for older merges", () => {
+    expect(formatBranchAge("2026-01-06T12:00:00.000Z", now)).toBe("3mo ago");
+  });
+
+  it("returns 'just now' for future timestamps", () => {
+    expect(formatBranchAge("2026-04-07T00:00:00.000Z", now)).toBe("just now");
+  });
+});
+
 describe("formatWorktreePathForDisplay", () => {
   it("shows only the last path segment for unix-like paths", () => {
     const result = formatWorktreePathForDisplay(

apps/web/src/worktreeCleanup.ts

@@ -32,6 +32,31 @@ export function getOrphanedWorktreePathForThread(
   return isShared ? null : targetWorktreePath;
 }
 
+/**
+ * Return a human-readable relative-time label for how long ago a branch was
+ * merged.  Expects an ISO-8601 `mergedAt` timestamp and an optional `now`
+ * override (for deterministic testing).
+ */
+export function formatBranchAge(mergedAt: string, now: Date = new Date()): string {
+  const mergedDate = new Date(mergedAt);
+  const diffMs = now.getTime() - mergedDate.getTime();
+  if (diffMs < 0) return "just now";
+
+  const seconds = Math.floor(diffMs / 1_000);
+  const minutes = Math.floor(seconds / 60);
+  const hours = Math.floor(minutes / 60);
+  const days = Math.floor(hours / 24);
+  const weeks = Math.floor(days / 7);
+  const months = Math.floor(days / 30);
+
+  if (months >= 1) return `${months}mo ago`;
+  if (weeks >= 1) return `${weeks}w ago`;
+  if (days >= 1) return `${days}d ago`;
+  if (hours >= 1) return `${hours}h ago`;
+  if (minutes >= 1) return `${minutes}m ago`;
+  return "just now";
+}
+
 export function formatWorktreePathForDisplay(worktreePath: string): string {
   const trimmed = worktreePath.trim();
   if (!trimmed) {