@gperezmz/bb-plugin-thread-glance 0.4.0 → 0.4.2

package/dist/server.meta.json

@@ -3,7 +3,7 @@
   "sdkVersion": "0.5.9",
   "artifactFormatVersion": 1,
   "pluginId": "thread-glance",
-  "pluginVersion": "0.4.0",
+  "pluginVersion": "0.4.2",
   "builtWith": {
     "bbVersion": "0.43.4",
     "pluginSdkVersion": "0.5.9"

package/features/thread-list/components/GroupSection.tsx

@@ -21,6 +21,7 @@ import { EnvironmentRowView, OlderRowView, SettledRowView } from "./FoldRows";
 import { CounterStrip } from "./glyphs";
 import { visibleCounters } from "../model/counters";
 import { RenameEditor } from "./RenameEditor";
+import { HEADER_HOVER_HIDES, HEADER_HOVER_SHOWS } from "./input-modality";
 import { ROW_ICON_BUTTON, ThreadRowView } from "./ThreadRowView";
 
 export interface GroupController {
@@ -70,13 +71,13 @@ const GroupHeader = memo(function GroupHeader({
   });
   const compact = controller.compact;
   // Desktop: the counter sits flush right, and "+" and "…" fade in over its
-  // place on hover or focus, as a row's actions fade over its age. Nothing is
+  // place on hover or keyboard focus, as a row's actions fade over its age. Nothing is
   // kept for them otherwise. Phones keep them in line, always shown.
   const counterFade = compact
     ? ""
     : menuOpen
       ? "opacity-0"
-      : "group-hover/header:opacity-0 group-focus-within/header:opacity-0";
+      : HEADER_HOVER_HIDES;
   const actionsFade = compact
     ? ""
     : cn(
@@ -84,7 +85,7 @@ const GroupHeader = memo(function GroupHeader({
         dropActive ? "bg-sidebar-accent" : "bg-sidebar",
         menuOpen
           ? "opacity-100"
-          : "pointer-events-none opacity-0 group-hover/header:pointer-events-auto group-hover/header:opacity-100 group-focus-within/header:pointer-events-auto group-focus-within/header:opacity-100",
+          : HEADER_HOVER_SHOWS,
       );
   return (
     <div
@@ -163,10 +164,12 @@ const GroupHeader = memo(function GroupHeader({
                 </button>
               </DropdownMenuTrigger>
               <DropdownMenuContent align="end" className="min-w-48">
-                <DropdownMenuItem onSelect={() => controller.onMarkAllRead(group)}>
-                  <Icon name={ICONS.markRead} aria-hidden className="size-4" />
-                  Mark all read
-                </DropdownMenuItem>
+                {group.hasUnread ? (
+                  <DropdownMenuItem onSelect={() => controller.onMarkAllRead(group)}>
+                    <Icon name={ICONS.markRead} aria-hidden className="size-4" />
+                    Mark all read
+                  </DropdownMenuItem>
+                ) : null}
                 {group.descriptor.kind !== "pinned" && group.descriptor.newThreadProjectId !== null ? (
                   <DropdownMenuItem onSelect={() => controller.onNewThread(group)}>
                     <Icon name={ICONS.newThread} aria-hidden className="size-4" />

package/features/thread-list/components/ListHeader.tsx

@@ -22,6 +22,8 @@ export interface ListHeaderProps {
   needYouCount: number;
   needYouOnly: boolean;
   onToggleNeedYou(): void;
+  /** A thread in the list is unread; Mark all read is not drawn otherwise. */
+  hasUnread: boolean;
   onMarkAllRead(): void;
   prefs: Preferences;
   client: ClientPreferences;
@@ -34,6 +36,7 @@ export const ListHeader = memo(function ListHeader({
   needYouCount,
   needYouOnly,
   onToggleNeedYou,
+  hasUnread,
   onMarkAllRead,
   prefs,
   client,
@@ -61,9 +64,11 @@ export const ListHeader = memo(function ListHeader({
           {needYouCount} need you
         </button>
       ) : null}
-      <button type="button" aria-label="Mark all read" title="Mark all read" className={ROW_ICON_BUTTON} onClick={onMarkAllRead}>
-        <Icon name={ICONS.markRead} aria-hidden className="size-4" />
-      </button>
+      {hasUnread ? (
+        <button type="button" aria-label="Mark all read" title="Mark all read" className={ROW_ICON_BUTTON} onClick={onMarkAllRead}>
+          <Icon name={ICONS.markRead} aria-hidden className="size-4" />
+        </button>
+      ) : null}
       <Popover open={settingsOpen} onOpenChange={setSettingsOpen}>
         <PopoverTrigger asChild>
           <button type="button" aria-label="Thread Glance settings" title="Settings" className={ROW_ICON_BUTTON}>

package/features/thread-list/components/ThreadList.tsx

@@ -20,6 +20,7 @@ import {
   experimental_useSidebarThreads as useSidebarThreads,
   useEnvironmentProviders,
   useSdk,
+  useSidebarSplitLayout,
   useSidebarThreadDraftIds,
 } from "@get-bb/plugin-sdk/app";
 import type { PluginSidebarThread, PluginThreadListProps } from "@get-bb/plugin-sdk/app";
@@ -29,6 +30,7 @@ import { Popover, PopoverContent, PopoverTrigger } from "@/components/ui/popover
 import { cn } from "@/lib/utils";
 import { useAutoExpand } from "../data/useAutoExpand";
 import { useClientPreferences } from "../data/useClientPreferences";
+import { useIdleSince } from "../data/useIdleSince";
 import { useNow } from "../data/useNow";
 import { usePreferences } from "../data/usePreferences";
 import { useScheduled } from "../data/useScheduled";
@@ -39,9 +41,7 @@ import { moveGroup, ORDER_PREFERENCE } from "../model/groups";
 import { MARK_ALL_CONFIRM_ABOVE, type RowMenuAction } from "../model/menu";
 import { assignProviderMarks, providerMark } from "../model/provider-mark";
 import { markAllReadPlan, markReadPlanFor, toggleChip, toggleGroup, toggleOlder, toggleSettled, type ToggleOutcome } from "../model/toggles";
-import { pullRequestFact, pullRequestLookupIds, type SettleInputs } from "../model/settled";
-import { usePullRequestAnswers } from "../data/usePullRequestAnswers";
-import { PullRequestProbes } from "./PullRequestProbes";
+import type { SettleInputs } from "../model/settled";
 import { buildListView, countNeedYou, needYouActive, type GroupView, type ListView } from "../model/view";
 import { shareView } from "../model/share";
 import { ListLiveContext, type ListLive, type ModelInfo, type RowController } from "./controller";
@@ -54,6 +54,7 @@ import { modelDisplayName } from "../model/details";
 import { groupIdForRoot } from "../model/groups";
 import { CounterStrip } from "./glyphs";
 import { cancelPendingCards } from "./row-card";
+import { useInputModality } from "./input-modality";
 import { GroupSection, type DropStates, type GroupController } from "./GroupSection";
 import type { ProviderDisplay } from "./ProviderBadge";
 import { ThreadDetails } from "./ThreadDetails";
@@ -115,19 +116,31 @@ function ThreadListBody({
   const [client, updateClient] = useClientPreferences();
   // The need-you filter is per window and starts off on every load.
   const [needYouOn, setNeedYouOn] = useState(false);
+  const root = useRef<HTMLDivElement>(null);
+  useInputModality(root);
   const sidebar = useSidebarThreads({ experimental_lifecycles: prefs.showArchived ? ["active", "archived"] : ["active"] });
   const actions = useThreadActions();
   const sdk = useSdk();
   const { providers } = useProviders();
   const { providers: environmentProviders } = useEnvironmentProviders();
   const draftIds = useSidebarThreadDraftIds();
-  const { stamps, markSeen, clearSeen } = useStamps();
+  const splitLayout = useSidebarSplitLayout();
+  // Every thread a split pane shows is open, not only the focused one.
+  const openThreadIds = useMemo(
+    () => new Set(splitLayout?.panes.flatMap((pane) => (pane.threadId === null ? [] : [pane.threadId])) ?? []),
+    [splitLayout],
+  );
+  const { stamps, loaded: stampsLoaded, markSeen, markIdle, clearSeen } = useStamps();
   const scheduled = useScheduled();
   const notes = useNotes();
+  // When the next child's failure becomes orphaned. The forest knows it, but
+  // the forest is built from the clock, so the clock takes it from state.
+  const [orphanDeadline, setOrphanDeadline] = useState<number | null>(null);
   const nextDeadline = useMemo(() => {
     const future = Object.values(scheduled).filter((at) => at > Date.now());
+    if (orphanDeadline !== null) future.push(orphanDeadline);
     return future.length > 0 ? Math.min(...future) : null;
-  }, [scheduled]);
+  }, [scheduled, orphanDeadline]);
   const now = useNow(nextDeadline);
 
   const [editingId, setEditingId] = useState<string | null>(null);
@@ -145,6 +158,7 @@ function ThreadListBody({
   const ready = sidebar.status === "ready";
   const threads = sidebar.threads;
   const byId = useMemo(() => new Map(threads.map((thread) => [thread.id, thread])), [threads]);
+  const idleSince = useIdleSince(threads, markIdle);
 
   const forest = useMemo(
     () =>
@@ -152,6 +166,7 @@ function ThreadListBody({
         ? buildForest({
             threads,
             activeThreadId,
+            openThreadIds,
             finishedAt: stamps.finishedAt,
             seenAt: stamps.seenAt,
             draftIds,
@@ -159,10 +174,15 @@ function ThreadListBody({
             now,
             notes,
             childAttention: prefs.childAttention,
+            idleSince,
+            idleAt: stamps.idleAt,
+            stampsLoaded,
           })
         : null,
-    [ready, threads, activeThreadId, stamps.finishedAt, stamps.seenAt, draftIds, scheduled, now, notes, prefs.childAttention],
+    [ready, threads, activeThreadId, openThreadIds, stamps.finishedAt, stamps.seenAt, stamps.idleAt, stampsLoaded, draftIds, scheduled, now, notes, prefs.childAttention, idleSince],
   );
+  const nextOrphanAt = forest?.nextOrphanAt ?? null;
+  if (nextOrphanAt !== orphanDeadline) setOrphanDeadline(nextOrphanAt);
   const { targets, prune } = useAutoExpand(hydrated ? forest : null, activeThreadId);
   // Projects with a thread on a branch: the rest need no default branch.
   const branchedProjectIds = useMemo(
@@ -174,21 +194,15 @@ function ThreadListBody({
     (thread: PluginSidebarThread) => (defaultBranches.has(thread.projectId) ? (defaultBranches.get(thread.projectId) ?? null) : undefined),
     [defaultBranches],
   );
-  const [pullRequests, onPullRequest] = usePullRequestAnswers();
   const system = useSystemFacts();
-  const pullRequestLookups = useMemo(
-    () => (forest === null ? [] : pullRequestLookupIds(forest.infos.values(), defaultBranchOf)),
-    [forest, defaultBranchOf],
-  );
   const settle: SettleInputs = useMemo(
     () => ({
       now,
       settleAfter: prefs.settleAfter,
       startedAt: stamps.startedAt,
       finishedAt: stamps.finishedAt,
-      pullRequestOf: (thread) => pullRequestFact(thread, defaultBranchOf(thread), pullRequests),
     }),
-    [now, prefs.settleAfter, stamps.startedAt, stamps.finishedAt, defaultBranchOf, pullRequests],
+    [now, prefs.settleAfter, stamps.startedAt, stamps.finishedAt],
   );
   // Rows and groups that did not change keep their objects, so their
   // memoized components skip the render.
@@ -281,7 +295,7 @@ function ThreadListBody({
 
   const runMenuAction = useCallback(
     (action: RowMenuAction, thread: PluginSidebarThread, sectionId?: string | null) => {
-      const context = { activeThreadId, finishedAt: stamps.finishedAt, seenAt: stamps.seenAt };
+      const context = { activeThreadId, openThreadIds, finishedAt: stamps.finishedAt, seenAt: stamps.seenAt };
       const fail = (message: string) => (error: unknown) => toast.error(message, { description: describeError(error) });
       switch (action) {
         case "open-in-split":
@@ -334,7 +348,7 @@ function ThreadListBody({
           return;
       }
     },
-    [actions, activeThreadId, clearSeen, markSeen, onNavigate, sdk, stamps.finishedAt, stamps.seenAt],
+    [actions, activeThreadId, openThreadIds, clearSeen, markSeen, onNavigate, sdk, stamps.finishedAt, stamps.seenAt],
   );
   const runMenuActionRef = useRef(runMenuAction);
   useLayoutEffect(() => {
@@ -343,9 +357,9 @@ function ThreadListBody({
 
   // The committed state for the controllers' callbacks: they read it when
   // called, so the controllers themselves stay put while threads change.
-  const latest = useRef({ forest, view, prefs, byId, activeThreadId, stamps });
+  const latest = useRef({ forest, view, prefs, byId, activeThreadId, openThreadIds, stamps });
   useLayoutEffect(() => {
-    latest.current = { forest, view, prefs, byId, activeThreadId, stamps };
+    latest.current = { forest, view, prefs, byId, activeThreadId, openThreadIds, stamps };
   });
 
   const loadModel = useCallback(
@@ -459,15 +473,13 @@ function ThreadListBody({
   /** Marks every unread thread in the trees read, asking first above MARK_ALL_CONFIRM_ABOVE. `where` names them. */
   const markTreesRead = useCallback(
     (trees: readonly ThreadTree[], where: string) => {
-      const { activeThreadId, stamps } = latest.current;
-      const plan = markAllReadPlan(trees, { activeThreadId, finishedAt: stamps.finishedAt, seenAt: stamps.seenAt });
+      const { activeThreadId, openThreadIds, stamps } = latest.current;
+      const plan = markAllReadPlan(trees, { activeThreadId, openThreadIds, finishedAt: stamps.finishedAt, seenAt: stamps.seenAt });
       const run = () => {
         if (plan.seen.length > 0) markSeen(plan.seen);
         for (const id of plan.read) actions.setRead(id, true).catch(() => undefined);
       };
-      if (plan.read.length === 0) {
-        toast(`Nothing unread in ${where}`);
-      } else if (plan.read.length > MARK_ALL_CONFIRM_ABOVE) {
+      if (plan.read.length > MARK_ALL_CONFIRM_ABOVE) {
         setConfirm({
           title: `Mark ${plan.read.length} threads read?`,
           description: `Every unread thread in ${where}, child threads included, will be marked read.`,
@@ -711,19 +723,19 @@ function ThreadListBody({
 
   return (
     <ListLiveContext.Provider value={live}>
-      <div className="flex w-full min-w-0 flex-col px-1.5 pb-2">
+      <div ref={root} className="flex w-full min-w-0 flex-col px-1.5 pb-2">
         <ListHeader
           mode={prefs.organizationMode}
           needYouCount={view.needYouCount}
           needYouOnly={needYouOn}
           onToggleNeedYou={onToggleNeedYou}
+          hasUnread={view.hasUnread}
           onMarkAllRead={onMarkListRead}
           prefs={prefs}
           client={client}
           onPrefs={update}
           onClient={updateClient}
         />
-        <PullRequestProbes threadIds={pullRequestLookups} onAnswer={onPullRequest} />
         {threads.length === 0 ? (
           // bb's own pinned New thread button covers the empty list.
           <p className="px-3 py-4 text-sm text-muted-foreground">No threads yet.</p>

package/features/thread-list/components/ThreadRowView.tsx

@@ -32,6 +32,7 @@ import { RowContextMenuContent, RowDropdownMenuContent, type ContextMenuInput }
 import { SplitMiniMap, type MiniMapPane } from "./SplitMiniMap";
 import { ThreadDetails } from "./ThreadDetails";
 import { useRowCard } from "./row-card";
+import { ROW_HOVER_HIDES, ROW_HOVER_LAYS_OUT, ROW_HOVER_SHOWS } from "./input-modality";
 
 /** Two clicks on one row within this window start a rename, as in bb. */
 const RENAME_CLICK_MS = 400;
@@ -88,7 +89,7 @@ export interface ThreadRowViewProps {
   inPinned: boolean;
   /** Drop feedback from the list's drag state. */
   dropState: "valid" | "blocked" | "unchanged" | "before" | "after" | null;
-  /** The open thread is this one. */
+  /** The focused thread is this one. */
   active: boolean;
   /** Its title is being renamed. */
   editing: boolean;
@@ -309,7 +310,7 @@ export const ThreadRowView = memo(function ThreadRowView({
     ? ""
     : menuShowing
       ? "opacity-0"
-      : "group-hover/row:opacity-0 group-focus-within/row:opacity-0";
+      : ROW_HOVER_HIDES;
 
   const body = (
     <div
@@ -471,7 +472,7 @@ export const ThreadRowView = memo(function ThreadRowView({
             <span
               className={cn(
                 "items-center justify-self-end gap-0.5 pl-1.5 [grid-area:1/1]",
-                menuShowing ? "flex" : "hidden group-hover/row:flex group-focus-within/row:flex",
+                menuShowing ? "flex" : ROW_HOVER_LAYS_OUT,
               )}
             >
               {row.treeUnread ? (
@@ -577,7 +578,7 @@ export const ThreadRowView = memo(function ThreadRowView({
                       ? "relative"
                       : menuShowing
                         ? "opacity-100"
-                        : "opacity-0 group-hover/row:opacity-100 group-focus-within/row:opacity-100",
+                        : ROW_HOVER_SHOWS,
                   )}
                 >
                   <DropdownMenu open={menuOpen} onOpenChange={setMenuOpen}>

package/features/thread-list/components/controller.ts

@@ -54,7 +54,7 @@ export interface ListLive {
 
 export const ListLiveContext = createContext<ListLive>({
   now: 0,
-  stamps: { startedAt: {}, finishedAt: {}, pendingAt: {}, seenAt: {} },
+  stamps: { startedAt: {}, finishedAt: {}, pendingAt: {}, seenAt: {}, idleAt: {} },
   notes: {},
   treeOf: () => undefined,
 });

package/features/thread-list/components/input-modality.ts

@@ -0,0 +1,51 @@
+// Which input moved focus last, keyboard or pointer, written on the list's
+// root as `data-input-modality`. Rows and group headers show their hover
+// actions for focus inside them only under `keyboard`, so a click that leaves
+// focus in a row does not keep its hover look once the pointer leaves.
+// `:focus-visible` says the same, but Chromium drops focus on Tab from a row's
+// link when the actions it would reach are shown by `:has(:focus-visible)`.
+import { useEffect, type RefObject } from "react";
+
+export type InputModality = "keyboard" | "pointer";
+
+/** The modality an event starts, or null for one that changes nothing. */
+export function modalityOf(event: { type: string; key?: string; metaKey?: boolean; ctrlKey?: boolean; altKey?: boolean }): InputModality | null {
+  if (event.type === "pointerdown") return "pointer";
+  if (event.type !== "keydown") return null;
+  // A shortcut or a lone modifier does not move focus, as Chromium's own
+  // `:focus-visible` treats them.
+  if (event.metaKey || event.ctrlKey || event.altKey) return null;
+  if (event.key === "Shift" || event.key === "Meta" || event.key === "Control" || event.key === "Alt") return null;
+  return "keyboard";
+}
+
+// What a row or group header shows while hovered or holding keyboard focus,
+// as whole class strings so Tailwind finds each one in the source.
+
+/** A row part that fades out on hover, for the actions that take its place. */
+export const ROW_HOVER_HIDES = "group-hover/row:opacity-0 in-data-[input-modality=keyboard]:group-focus-within/row:opacity-0";
+/** A row part that fades in on hover. */
+export const ROW_HOVER_SHOWS = "opacity-0 group-hover/row:opacity-100 in-data-[input-modality=keyboard]:group-focus-within/row:opacity-100";
+/** A row part laid out only on hover, so it takes no width at rest. */
+export const ROW_HOVER_LAYS_OUT = "hidden group-hover/row:flex in-data-[input-modality=keyboard]:group-focus-within/row:flex";
+/** A group header part that fades out on hover. */
+export const HEADER_HOVER_HIDES = "group-hover/header:opacity-0 in-data-[input-modality=keyboard]:group-focus-within/header:opacity-0";
+/** A group header part that fades in on hover, and takes the pointer only then. */
+export const HEADER_HOVER_SHOWS =
+  "pointer-events-none opacity-0 group-hover/header:pointer-events-auto group-hover/header:opacity-100 in-data-[input-modality=keyboard]:group-focus-within/header:pointer-events-auto in-data-[input-modality=keyboard]:group-focus-within/header:opacity-100";
+
+/** Keeps `data-input-modality` on the element current for the whole document. */
+export function useInputModality(root: RefObject<HTMLElement | null>): void {
+  useEffect(() => {
+    const onInput = (event: Event) => {
+      const modality = modalityOf(event as KeyboardEvent);
+      if (modality !== null) root.current?.setAttribute("data-input-modality", modality);
+    };
+    document.addEventListener("keydown", onInput, true);
+    document.addEventListener("pointerdown", onInput, true);
+    return () => {
+      document.removeEventListener("keydown", onInput, true);
+      document.removeEventListener("pointerdown", onInput, true);
+    };
+  }, [root]);
+}

package/features/thread-list/components/row-card.ts

@@ -80,7 +80,7 @@ export function useRowCard(isActive: boolean, enabled: boolean): RowCard {
     };
   }, []);
 
-  // Becoming or ceasing to be the open thread, or a menu or rename taking
+  // Becoming or ceasing to be the focused thread, or a menu or rename taking
   // the row, closes the card and drops a pending open.
   useEffect(() => {
     cancel();

package/features/thread-list/data/useIdleSince.ts

@@ -0,0 +1,27 @@
+// When each thread last went from busy to idle, as this list saw it: the
+// orphaned-failure wait counts from it. Each change seen is also written to
+// the server's `idleAt` stamp, so a reload or another window keeps it.
+import { useEffect, useState } from "react";
+import type { PluginSidebarThread } from "@get-bb/plugin-sdk/app";
+import { trackIdle, type IdleTracker } from "../model/attention";
+
+const NONE: Readonly<Record<string, number>> = {};
+
+export function useIdleSince(
+  threads: readonly PluginSidebarThread[],
+  markIdle: (threadIds: string[]) => void,
+): Readonly<Record<string, number>> {
+  const [seen, setSeen] = useState<readonly PluginSidebarThread[] | null>(null);
+  const [tracker, setTracker] = useState<IdleTracker | null>(null);
+  // Adjusted during render, as React adjusts state from a changed input, so
+  // the render that sees the change already carries its time.
+  if (threads !== seen) {
+    const at = Date.now();
+    setSeen(threads);
+    setTracker((previous) => trackIdle(previous, threads, at));
+  }
+  useEffect(() => {
+    if (tracker !== null && tracker.wentIdle.length > 0) markIdle([...tracker.wentIdle]);
+  }, [tracker, markIdle]);
+  return tracker?.idleSince ?? NONE;
+}

package/features/thread-list/data/useNow.ts

@@ -1,5 +1,6 @@
 // A clock that ticks each minute (row ages) and at the next deadline
-// (scheduled → queued), so rows change without a request.
+// (scheduled → queued, a failure becoming orphaned), so rows change without
+// a request. A deadline already past ticks at once.
 import { useEffect, useState } from "react";
 
 export function useNow(nextDeadline: number | null): number {
@@ -11,8 +12,8 @@ export function useNow(nextDeadline: number | null): number {
   useEffect(() => {
     if (nextDeadline === null) return;
     const wait = nextDeadline - Date.now();
-    if (wait <= 0 || wait > 2 ** 31 - 1) return;
-    const timeout = setTimeout(() => setNow(Date.now()), wait + 50);
+    if (wait > 2 ** 31 - 1) return;
+    const timeout = setTimeout(() => setNow(Date.now()), Math.max(wait, 0) + 50);
     return () => clearTimeout(timeout);
   }, [nextDeadline]);
   return now;

package/features/thread-list/data/useStamps.ts

@@ -4,25 +4,33 @@ import { useRealtime, useRealtimeConnectionState, useRpc } from "@get-bb/plugin-
 import type { RpcContract } from "@/shared/contract";
 import { CHANNELS, type StampSignal, type Stamps } from "@/shared/signals";
 
-const EMPTY: Stamps = { startedAt: {}, finishedAt: {}, pendingAt: {}, seenAt: {} };
+const EMPTY: Stamps = { startedAt: {}, finishedAt: {}, pendingAt: {}, seenAt: {}, idleAt: {} };
 const KINDS = new Set(Object.keys(EMPTY));
 
 export interface StampsState {
   stamps: Stamps;
+  /** The first listing came back, or failed: until then every map is empty for want of it. */
+  loaded: boolean;
   markSeen(threadIds: string[]): void;
+  /** Records on the server that these threads were just seen going idle. */
+  markIdle(threadIds: string[]): void;
   clearSeen(threadIds: string[]): void;
 }
 
 export function useStamps(): StampsState {
   const rpc = useRpc<RpcContract>();
   const [stamps, setStamps] = useState<Stamps>(EMPTY);
+  const [loaded, setLoaded] = useState(false);
   const connection = useRealtimeConnectionState();
   const wasConnected = useRef(false);
 
   const load = useCallback(() => {
     rpc.call("listStamps", null).then(
-      (result) => setStamps(result.stamps),
-      () => undefined,
+      (result) => {
+        setStamps(result.stamps);
+        setLoaded(true);
+      },
+      () => setLoaded(true),
     );
   }, [rpc]);
 
@@ -55,6 +63,13 @@ export function useStamps(): StampsState {
     },
     [apply, rpc],
   );
+  const markIdle = useCallback(
+    (threadIds: string[]) => {
+      if (threadIds.length === 0) return;
+      rpc.call("markIdle", { threadIds }).catch(() => undefined);
+    },
+    [rpc],
+  );
   const clearSeen = useCallback(
     (threadIds: string[]) => {
       if (threadIds.length === 0) return;
@@ -64,5 +79,5 @@ export function useStamps(): StampsState {
     [apply, rpc],
   );
 
-  return { stamps, markSeen, clearSeen };
+  return { stamps, loaded, markSeen, markIdle, clearSeen };
 }

package/features/thread-list/model/attention.ts

@@ -3,7 +3,7 @@
 // builds. Pure.
 import type { PluginSidebarThread } from "@get-bb/plugin-sdk/app";
 import type { ChildAttention } from "@/shared/preferences";
-import { type Flag, type StateKind, type ThreadState } from "./state";
+import { computeState, type Flag, type StateKind, type ThreadState } from "./state";
 
 /** The flags that count for a root thread. Working is not one. */
 export const ROOT_ATTENTION: ReadonlySet<Flag> = new Set<Flag>([
@@ -17,11 +17,24 @@ export const ROOT_ATTENTION: ReadonlySet<Flag> = new Set<Flag>([
 /** States in which a parent thread is busy and may still deal with a failed child. */
 const BUSY: ReadonlySet<StateKind> = new Set<StateKind>(["working", "background", "queued", "scheduled"]);
 
+/**
+ * How long a parent thread stays idle before a child's failure counts as
+ * orphaned. bb reports a child's turn to its parent after a 2 s batch delay,
+ * and the parent then has to start: a failure it is about to pick up never
+ * reaches the need-you filter.
+ */
+export const ORPHAN_WAIT_MS = 5_000;
+
 export interface ParentThread {
   thread: Pick<PluginSidebarThread, "latestAttentionAt">;
   state: Pick<ThreadState, "kind">;
   /** When the plugin server last saw the parent thread finish a turn, if it did. */
   finishedAt?: number;
+  /**
+   * When a window last saw the parent thread go from busy to idle, if one did;
+   * null while that is not yet known, and no failure under it counts.
+   */
+  idleSince?: number | null;
 }
 
 /** A parent thread is idle when it is not working, setting up, running background work or holding a queued message. */
@@ -41,21 +54,72 @@ export function failureTime(
 }
 
 /**
- * An orphaned failure: the parent thread is idle and has not run or
- * finished since the child failed. A busy parent thread, or one that
+ * When a child's failure becomes an orphaned failure, or null while it cannot:
+ * the parent thread is idle and has not run or finished since the child
+ * failed, and has stayed idle for `ORPHAN_WAIT_MS` from the later of the
+ * failure and its last becoming idle. A busy parent thread, or one that
  * finished after the failure, is taken to know about it. The parent thread's
  * own clock is its last finish (`finishedAt`, or `latestAttentionAt` when it
  * failed): `updatedAt` also moves when someone merely opens or renames it.
  */
+export function orphanedAt(
+  thread: Pick<PluginSidebarThread, "latestAttentionAt" | "updatedAt">,
+  flags: ReadonlySet<Flag>,
+  parent: ParentThread,
+): number | null {
+  if (!flags.has("unread-failed") && !flags.has("queue-failed")) return null;
+  if (!isParentIdle(parent) || parent.idleSince === null) return null;
+  const parentActiveAt = Math.max(parent.thread.latestAttentionAt, parent.finishedAt ?? 0);
+  const failedAt = failureTime(thread, flags);
+  if (parentActiveAt > failedAt) return null;
+  return Math.max(failedAt, parent.idleSince ?? 0) + ORPHAN_WAIT_MS;
+}
+
+/** Whether a child's failure is an orphaned failure at `now` (see `orphanedAt`). */
 export function isOrphanedFailure(
   thread: Pick<PluginSidebarThread, "latestAttentionAt" | "updatedAt">,
   flags: ReadonlySet<Flag>,
   parent: ParentThread,
+  now: number,
 ): boolean {
-  if (!flags.has("unread-failed") && !flags.has("queue-failed")) return false;
-  if (!isParentIdle(parent)) return false;
-  const parentActiveAt = Math.max(parent.thread.latestAttentionAt, parent.finishedAt ?? 0);
-  return parentActiveAt <= failureTime(thread, flags);
+  const at = orphanedAt(thread, flags, parent);
+  return at !== null && at <= now;
+}
+
+/** Which threads the list last saw busy, and when each last went from busy to idle. */
+export interface IdleTracker {
+  busy: ReadonlySet<string>;
+  idleSince: Readonly<Record<string, number>>;
+  /** The threads this step saw go idle, for the server's `idleAt`. */
+  wentIdle: readonly string[];
+}
+
+function isBusyThread(thread: PluginSidebarThread): boolean {
+  const state = computeState(thread, { unread: false, hasDraft: false, scheduledAt: null, now: 0 });
+  return !isParentIdle({ thread, state });
+}
+
+/**
+ * The tracker after the list sees `threads` at `at`: a thread busy before and
+ * idle now went idle at `at`. A thread first seen idle has no time here; the
+ * server's `idleAt` holds what an earlier window saw.
+ */
+export function trackIdle(previous: IdleTracker | null, threads: readonly PluginSidebarThread[], at: number): IdleTracker {
+  const busy = new Set<string>();
+  const idleSince: Record<string, number> = {};
+  const wentIdle: string[] = [];
+  for (const thread of threads) {
+    const id = thread.id;
+    if (isBusyThread(thread)) {
+      busy.add(id);
+    } else if (previous?.busy.has(id)) {
+      idleSince[id] = at;
+      wentIdle.push(id);
+    } else if (previous?.idleSince[id] !== undefined) {
+      idleSince[id] = previous.idleSince[id];
+    }
+  }
+  return { busy, idleSince, wentIdle };
 }
 
 /**

package/features/thread-list/model/expansion.ts

@@ -6,7 +6,7 @@ import type { Forest } from "./trees";
 /**
  * `reveal` targets open the parent chips on their path. `open` targets (a
  * thread that newly became unread) open no chip, so finished children don't
- * expand their parent's. The open thread's target, of either kind, also
+ * expand their parent's. The focused thread's target, of either kind, also
  * opens its collapsed group. No target opens a settled fold.
  */
 export type TargetKind = "reveal" | "open";