@gperezmz/bb-plugin-thread-glance 0.3.0 → 0.4.1

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

@@ -105,3 +105,10 @@ export function stateSince(
   if (at === undefined) return null;
   return formatDuration(now - at);
 }
+
+/**
+ * The widest texts `trailingTime` gives up to 99 weeks, one per unit. The
+ * trailing slot is as wide as the widest of them, so times line up down the
+ * list; an older row widens its own.
+ */
+export const TRAILING_SLOT_SIZERS = ["now", "<1m", "59m", "23h", "6d", "99w"] as const;

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

@@ -3,7 +3,7 @@
 import type { PluginSidebarThread } from "@get-bb/plugin-sdk/app";
 import {
   computeState,
-  dotFlagsOf,
+  chipFlagsOf,
   hiddenThreadFlags,
   isQuietThread,
   isUnread,
@@ -29,8 +29,8 @@ export interface ThreadInfo {
   unread: boolean;
   /** Own flags; for hidden threads only waits-on-you and unread-failed. */
   flags: ReadonlySet<Flag>;
-  /** What it adds to the child dot of the threads above it (see `dotFlagsOf`). */
-  dotFlags: ReadonlySet<Flag>;
+  /** What it adds to the children chip of the threads above it (see `chipFlagsOf`). */
+  chipFlags: ReadonlySet<Flag>;
   /**
    * The flags of this thread that make it need attention, for collapsed
    * groups, the counters, the need-you filter and auto-reveal: a child counts
@@ -55,14 +55,14 @@ export interface ThreadInfo {
   note: RowNote | null;
 }
 
-/** What a thread's descendants add up to, for its chip, its child dot and folding. */
+/** What a thread's descendants add up to, for its chip and folding. */
 export interface Subtree {
   /** Descendants, depth-first in creation order, hidden ones included. */
   descendants: ThreadInfo[];
   /** Union of the descendants' Needs attention flags and working, archived ones left out. */
   flags: ReadonlySet<Flag>;
-  /** Union of the descendants' `dotFlags`, archived ones left out: the child dot. */
-  dotFlags: ReadonlySet<Flag>;
+  /** Union of the descendants' `chipFlags`, archived ones left out: the chip's state. */
+  chipFlags: ReadonlySet<Flag>;
   /** Visible descendants at any depth. */
   visibleCount: number;
   /** Visible direct children: the chip's number. */
@@ -167,7 +167,7 @@ export function buildForest(inputs: ForestInputs): Forest {
       state,
       unread,
       flags: thread.isHidden ? hiddenThreadFlags(flags) : flags,
-      dotFlags: dotFlagsOf(flags, thread.isHidden),
+      chipFlags: chipFlagsOf(flags, thread.isHidden),
       attentionFlags: new Set<Flag>(),
       quiet: isQuietThread(state, unread, isActive),
       quietIgnoringOpen: false,
@@ -216,7 +216,7 @@ export function buildForest(inputs: ForestInputs): Forest {
     if (cached !== undefined) return cached;
     const descendants: ThreadInfo[] = [];
     const flags = new Set<Flag>();
-    const dotFlags = new Set<Flag>();
+    const chipFlags = new Set<Flag>();
     let visibleCount = 0;
     let childCount = 0;
     let quietIgnoringOpen = true;
@@ -229,10 +229,10 @@ export function buildForest(inputs: ForestInputs): Forest {
       if (!child.thread.isArchived) {
         for (const flag of child.attentionFlags) flags.add(flag);
         if (child.flags.has("working")) flags.add("working");
-        for (const flag of child.dotFlags) dotFlags.add(flag);
+        for (const flag of child.chipFlags) chipFlags.add(flag);
       }
       for (const flag of below.flags) flags.add(flag);
-      for (const flag of below.dotFlags) dotFlags.add(flag);
+      for (const flag of below.chipFlags) chipFlags.add(flag);
       if (child.thread.isHidden ? child.attentionFlags.size > 0 : !child.quietIgnoringOpen) quietIgnoringOpen = false;
       if (!child.thread.isHidden) {
         visibleCount += 1;
@@ -242,7 +242,7 @@ export function buildForest(inputs: ForestInputs): Forest {
       if (!below.quietIgnoringOpen) quietIgnoringOpen = false;
     }
     path.delete(id);
-    const subtree: Subtree = { descendants, flags, dotFlags, visibleCount, childCount, quietIgnoringOpen };
+    const subtree: Subtree = { descendants, flags, chipFlags, visibleCount, childCount, quietIgnoringOpen };
     subtrees.set(id, subtree);
     return subtree;
   };

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

@@ -29,12 +29,18 @@ import type { RowNote } from "./notes";
 /** How many quiet children stay in an expanded tree. */
 export const KEEP_QUIET_CHILDREN = 3;
 
-/** The children chip: the muted count of a parent's direct children, and its chevron. */
+/** The children chip: the count of a parent's direct children and its chevron, after the state of its descendants. */
 export interface Chip {
-  /** Direct children opening it shows, hidden ones left out. */
+  /** Direct children opening it shows, hidden ones left out; 0 draws no number. */
   count: number;
   /** The user opened the chip, so every child shows. */
   expanded: boolean;
+  /**
+   * The most urgent state among the descendants at any depth, open or
+   * collapsed, or null for none: its glyph leads the chip and colours it, and
+   * keeps that colour through dimming and hover.
+   */
+  flag: Flag | null;
 }
 
 export interface ThreadRow {
@@ -53,11 +59,6 @@ export interface ThreadRow {
    * default, a child whose harness is not its parent thread's.
    */
   harness: boolean;
-  /**
-   * The child dot on the status glyph: the most urgent state among the
-   * thread's descendants at any depth, or null for none.
-   */
-  childDot: Flag | null;
   /** The title is bold: the thread is unread. */
   bold: boolean;
   /** A root whose tree holds an unread thread: it offers Mark read for the whole tree. */
@@ -267,7 +268,6 @@ function threadRow(
     parentTitle: titleOf(context, info.parentId),
     chip: options.chip,
     harness: drawsHarness(context, info),
-    childDot: mostUrgent(subtreeOf(context, info.thread.id).dotFlags),
     bold: info.unread,
     treeUnread: info === root && [root, ...(context.forest.treeOf.get(root.thread.id)?.descendants ?? [])].some((info) => info.unread),
     note: info.note,
@@ -405,11 +405,13 @@ function clusterEnvironments(context: Context, units: Unit[], depth: number): Tr
   return rows;
 }
 
-/** The children chip of a parent, or null when opening it would show nothing. */
+/** The children chip of a parent, or null when it would show nothing. */
 function chipOf(context: Context, info: ThreadInfo, expanded: boolean): Chip | null {
-  const count = subtreeOf(context, info.thread.id).childCount;
-  if (count === 0 && eligibleChildren(context, info.thread.id).length === 0) return null;
-  return { count, expanded };
+  const { childCount: count, chipFlags } = subtreeOf(context, info.thread.id);
+  const flag = mostUrgent(chipFlags);
+  // A hidden child's failure that needs no attention has no row, yet the chip still shows it.
+  if (count === 0 && flag === null && eligibleChildren(context, info.thread.id).length === 0) return null;
+  return { count, expanded, flag };
 }
 
 /** What a thread and everything under it carry, for an environment folder's glyph. */

package/features/thread-list/testing/browser.css

@@ -0,0 +1,13 @@
+@import "tailwindcss";
+
+/* The tests measure where the row's boxes end up; fades would only delay it. */
+*,
+*::before,
+*::after {
+  transition: none !important;
+}
+
+/* bb draws icons as sized SVGs; the test SDK's stand-in is a bare span. */
+[data-icon] {
+  display: inline-block;
+}

package/features/thread-list/testing/fixtures.ts

@@ -8,7 +8,7 @@ import { defaultPreferences, type Preferences } from "@/shared/preferences";
 import { buildForest, type Forest } from "../model/trees";
 import { buildListView, type ListView, type Row } from "../model/view";
 import type { Targets } from "../model/expansion";
-import { pullRequestFact, type PullRequestState, type SettleInputs } from "../model/settled";
+import type { SettleInputs } from "../model/settled";
 
 export const T0 = 1_780_000_000_000;
 
@@ -125,8 +125,6 @@ export interface Scenario {
   needYouOnly?: boolean;
   /** bb's default harness; "claude-code", the fixtures' own, when absent. */
   defaultProviderId?: string | null;
-  /** Pull request lookups that answered, by thread id. */
-  pullRequests?: Record<string, PullRequestState | null>;
 }
 
 export function forestOf(scenario: Scenario): Forest {
@@ -165,15 +163,11 @@ export function viewOf(scenario: Scenario): ListView {
 
 /** The settle inputs a scenario stands for. */
 export function settleOf(scenario: Scenario): SettleInputs {
-  const answers = new Map(Object.entries(scenario.pullRequests ?? {}));
-  const defaultBranchOf = (projectId: string) =>
-    scenario.defaultBranches === undefined ? "main" : scenario.defaultBranches[projectId];
   return {
     now: scenario.now ?? T0 + 60_000,
     settleAfter: scenario.prefs?.settleAfter ?? defaultPreferences().settleAfter,
     startedAt: scenario.startedAt ?? {},
     finishedAt: scenario.finishedAt ?? {},
-    pullRequestOf: (thread) => pullRequestFact(thread, defaultBranchOf(thread.projectId), answers),
   };
 }
 

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@gperezmz/bb-plugin-thread-glance",
-  "version": "0.3.0",
+  "version": "0.4.1",
   "type": "module",
   "engines": {
     "bb": ">=0.43",
@@ -34,12 +34,14 @@
     "@radix-ui/react-popover": "^1.1.19",
     "@radix-ui/react-select": "^2.3.3",
     "@radix-ui/react-tooltip": "^1.2.12",
+    "@tailwindcss/vite": "^4.3.3",
     "@testing-library/dom": "^10.4.2",
     "@testing-library/react": "^16.3.3",
     "@types/better-sqlite3": "^7.6.12",
     "@types/node": "^22.0.0",
     "@types/react": "^19.0.0",
     "@types/react-dom": "^19.0.0",
+    "@vitest/browser-playwright": "5.0.1",
     "better-sqlite3": "^12.0.0",
     "class-variance-authority": "^0.7.1",
     "clsx": "^2.1.1",
@@ -47,10 +49,12 @@
     "esbuild": "^0.28.2",
     "hono": "^4.11.9",
     "jsdom": "^30.1.1",
+    "playwright": "^1.63.0",
     "react": "^19.3.0",
     "react-dom": "^19.3.0",
     "sonner": "^1.7.4",
     "tailwind-merge": "^3.4.0",
+    "tailwindcss": "^4.3.3",
     "typescript": "^7.0.2",
     "vaul": "^1.1.2",
     "vitest": "^5.0.1"

package/skills/thread-glance/SKILL.md

@@ -52,7 +52,7 @@ and `bb environment list`; a thread id is a `thr_…` id.
 | `collapsedThreadSections` | Custom section keys, `section:<id>` | `[]` |
 | `collapsedMachines` | Machine ids | `[]` |
 | `collapsedEnvironments` | Environment ids of collapsed folder rows | `[]` |
-| `settleAfter` | Settle after: how long a quiet thread goes without activity before its tree can settle into the group's "Settled (N)" fold: `12h`, `1d`, `3d`, `1w` or `never` (then only a merged or closed pull request settles it) | `1d` |
+| `settleAfter` | Settle after: how long a quiet thread goes without activity before its tree can settle into the group's "Settled (N)" fold: `12h`, `1d`, `3d`, `1w` or `never` (then nothing settles) | `1d` |
 | `openSettledFolds` | Group ids whose settled fold is open | `[]` |
 | `expandedOlder` | Parent thread ids whose "N more child threads" row is open, once that tree's children chip is open | `[]` |
 | `expandedChildren` | Parent thread ids whose chip is open | `[]` |

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

@@ -1,27 +0,0 @@
-// Looks up the pull request of every thread settling has to know about and
-// reports each answer. Draws nothing: the host shares one lookup per
-// environment with the badges that ask for the same threads.
-import { memo, useEffect } from "react";
-import { experimental_useSidebarThreadPullRequest as usePullRequest } from "@get-bb/plugin-sdk/app";
-import type { PullRequestState } from "../model/settled";
-
-type Answer = (threadId: string, state: PullRequestState | null) => void;
-
-const Probe = memo(function Probe({ threadId, onAnswer }: { threadId: string; onAnswer: Answer }) {
-  const { isLoading, pullRequest } = usePullRequest(threadId);
-  const state = isLoading ? undefined : (pullRequest?.state ?? null);
-  useEffect(() => {
-    if (state !== undefined) onAnswer(threadId, state);
-  }, [threadId, state, onAnswer]);
-  return null;
-});
-
-export function PullRequestProbes({ threadIds, onAnswer }: { threadIds: readonly string[]; onAnswer: Answer }) {
-  return (
-    <>
-      {threadIds.map((threadId) => (
-        <Probe key={threadId} threadId={threadId} onAnswer={onAnswer} />
-      ))}
-    </>
-  );
-}

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

@@ -1,36 +0,0 @@
-// The pull request lookups that answered, by thread id. Answers arriving in
-// one burst (a list's worth of lookups on load) land in one state update.
-//
-// Debt: this copies server state the host's per-row pull request hook owns,
-// because settling reads every thread's pull request at once and the SDK
-// offers no query over many threads. It clears when the SDK does.
-import { useCallback, useRef, useState } from "react";
-import type { PullRequestState } from "../model/settled";
-
-export type PullRequestAnswers = ReadonlyMap<string, PullRequestState | null>;
-
-export function usePullRequestAnswers(): [PullRequestAnswers, (threadId: string, state: PullRequestState | null) => void] {
-  const [answers, setAnswers] = useState<PullRequestAnswers>(() => new Map());
-  const pending = useRef(new Map<string, PullRequestState | null>());
-  const scheduled = useRef(false);
-  const onAnswer = useCallback((threadId: string, state: PullRequestState | null) => {
-    pending.current.set(threadId, state);
-    if (scheduled.current) return;
-    scheduled.current = true;
-    setTimeout(() => {
-      scheduled.current = false;
-      const batch = pending.current;
-      pending.current = new Map();
-      setAnswers((current) => {
-        let next: Map<string, PullRequestState | null> | null = null;
-        for (const [id, value] of batch) {
-          if (current.has(id) && current.get(id) === value) continue;
-          next ??= new Map(current);
-          next.set(id, value);
-        }
-        return next ?? current;
-      });
-    }, 0);
-  }, []);
-  return [answers, onAnswer];
-}