From c91ed9615b492fd0e2a2910b1d1778fc2ec5666a Mon Sep 17 00:00:00 2001
From: ojfbot <151410806+ojfbot@users.noreply.github.com>
Date: Wed, 25 Mar 2026 01:24:08 -0500
Subject: [PATCH 1/8] feat: enforce subgrouping + tag badges on tab tiles

- Strengthen LLM prompt to MUST-decompose large groups into children
  at specificity 5+ (6+ tabs) and 7+ (4+ tabs)
- Add enforceSubgroups() post-LLM enforcement via domain clustering
- Lower shouldRePrompt thresholds for more aggressive re-prompting
- Add tabTags to LLM schema (Zod + prompts + types)
- Render tag badge pills on large tab tiles (h>64, w>120)
- Add .gt-tag pill CSS styles

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/app/styles.css             |  43 ++++++++++++
 src/components/TreemapNode.tsx |  56 ++++++++++++++-
 src/lib/ai.ts                  |  13 +++-
 src/lib/grouping.ts            | 125 ++++++++++++++++++++++++++++++---
 src/lib/prompts.ts             |  88 +++++++++++++++++++++--
 src/types/index.ts             |   9 +++
 6 files changed, 311 insertions(+), 23 deletions(-)

diff --git a/src/app/styles.css b/src/app/styles.css
index 77c82a8..82f7200 100644
--- a/src/app/styles.css
+++ b/src/app/styles.css
@@ -931,6 +931,29 @@ body {
   filter: brightness(1.3);
 }
 
+/* Micro tab tiles inside gutter groups — microchip look */
+.gt-node--micro {
+  cursor: default;
+  padding: 0;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  border-width: 1px;
+  border-radius: 2px;
+  overflow: hidden;
+  pointer-events: none;
+}
+
+.gt-node--micro .gt-node__tab-close {
+  display: none !important;
+}
+
+.gt-node__tab-favicon--micro {
+  width: 12px;
+  height: 12px;
+  opacity: 0.7;
+}
+
 /* Focused group = background/header behind tab tiles */
 .gt-node--focused {
   cursor: pointer;
@@ -1091,6 +1114,26 @@ body {
   max-width: 100%;
 }
 
+.gt-node__tab-tags {
+  display: flex;
+  flex-wrap: wrap;
+  gap: 3px;
+  max-width: 100%;
+  overflow: hidden;
+  margin-top: 1px;
+}
+
+.gt-tag {
+  display: inline-flex;
+  padding: 1px 5px;
+  font-size: 8px;
+  font-weight: 500;
+  border-radius: 3px;
+  color: rgba(255, 255, 255, 0.85);
+  white-space: nowrap;
+  line-height: 1.4;
+}
+
 .gt-node__tab-close {
   position: absolute;
   top: 4px;
diff --git a/src/components/TreemapNode.tsx b/src/components/TreemapNode.tsx
index 8b2a8e4..7dc64f1 100644
--- a/src/components/TreemapNode.tsx
+++ b/src/components/TreemapNode.tsx
@@ -237,9 +237,14 @@ function ChildGroupContent({
       onClick={() => onClickGroup(group.id)}
       data-node-id={node.id}
     >
-      <span className="gt-node__child-label">
+      <span
+        className="gt-node__child-label"
+        style={w < 80 || h < 30 ? { fontSize: "8px" } : undefined}
+      >
         {group.label}
-        {group.sublabel && <span className="gt-node__child-sublabel"> / {group.sublabel}</span>}
+        {w > 60 && group.sublabel && (
+          <span className="gt-node__child-sublabel"> / {group.sublabel}</span>
+        )}
       </span>
     </div>
   );
@@ -271,6 +276,7 @@ function TabContent({
   onCloseTab: (id: number) => void;
 }) {
   const tab = node.tab!;
+  const isMicro = node.opacity < 1;
   const domain = useMemo(() => getDomain(tab.url), [tab.url]);
   const nodeRef = useRef<HTMLDivElement>(null);
 
@@ -280,6 +286,7 @@ function TabContent({
   const hoverTimer = useRef<ReturnType<typeof setTimeout>>();
 
   const onEnter = useCallback(() => {
+    if (isMicro) return;
     hoverTimer.current = setTimeout(() => {
       if (nodeRef.current) {
         const r = nodeRef.current.getBoundingClientRect();
@@ -297,13 +304,46 @@ function TabContent({
           .catch(() => {});
       }
     }, 200);
-  }, [tab.thumbnail, tab.id, capturedThumb]);
+  }, [tab.thumbnail, tab.id, capturedThumb, isMicro]);
 
   const onLeave = useCallback(() => {
     clearTimeout(hoverTimer.current);
     setHovered(false);
   }, []);
 
+  // Micro gutter tabs — minimal tile with favicon only
+  if (isMicro) {
+    return (
+      <div
+        className={`${classList} gt-node--micro`}
+        style={{
+          left: x,
+          top: y,
+          width: w,
+          height: h,
+          background: gradient,
+          borderColor,
+          opacity: node.opacity,
+        }}
+        onClick={() => onFocusTab(tab.id)}
+        data-node-id={node.id}
+      >
+        {w > 10 && h > 10 && (
+          <img
+            className="gt-node__tab-favicon gt-node__tab-favicon--micro"
+            src={tab.favIconUrl || `https://www.google.com/s2/favicons?domain=${domain}&sz=16`}
+            alt=""
+            width={12}
+            height={12}
+            onError={(e) => {
+              (e.target as HTMLImageElement).style.display = "none";
+            }}
+          />
+        )}
+      </div>
+    );
+  }
+
   return (
     <div
       ref={nodeRef}
@@ -338,6 +378,16 @@ function TabContent({
 
       {h > 56 && <span className="gt-node__tab-domain">{domain}</span>}
 
+      {h > 64 && w > 120 && tab.tags && tab.tags.length > 0 && (
+        <div className="gt-node__tab-tags">
+          {tab.tags.slice(0, 3).map((tag) => (
+            <span key={tag} className="gt-tag" style={{ backgroundColor: `hsl(${node.colorIndex * 47 + 200}, 25%, ${40}%)` }}>
+              {tag}
+            </span>
+          ))}
+        </div>
+      )}
+
       <button
         className="gt-node__tab-close"
         onClick={(e) => {
diff --git a/src/lib/ai.ts b/src/lib/ai.ts
index a0d0f3e..48c1787 100644
--- a/src/lib/ai.ts
+++ b/src/lib/ai.ts
@@ -22,6 +22,9 @@ const LLMResponseSchema = z.object({
   groups: z.array(LLMGroupSchema),
   ungrouped: z.array(z.number()),
   tabDescriptions: z.record(z.string(), z.string()).optional(),
+  tabTags: z.record(z.string(), z.array(z.string())).optional(),
+  focusGroupLabel: z.string().optional(),
+  focusChildLabel: z.string().optional(),
 });
 
 // ── Normalize LLM field name variants before Zod validation ──
@@ -122,7 +125,11 @@ export class GroupThinkAI {
     this.model = model;
   }
 
-  async groupTabs(tabs: TabInfo[], specificity: number): Promise<LLMGroupingResult> {
+  async groupTabs(
+    tabs: TabInfo[],
+    specificity: number,
+    contextHints?: string,
+  ): Promise<LLMGroupingResult> {
     console.log(`[GroupThink] groupTabs: ${tabs.length} tabs, specificity=${specificity}`);
 
     const tabSummaries = tabs.map((t) => ({
@@ -136,7 +143,9 @@ export class GroupThinkAI {
       model: this.model,
       max_tokens: 4096,
       system: SYSTEM_PROMPT,
-      messages: [{ role: "user", content: buildGroupingPrompt(tabSummaries, specificity) }],
+      messages: [
+        { role: "user", content: buildGroupingPrompt(tabSummaries, specificity, contextHints) },
+      ],
     });
     const elapsed = Math.round(performance.now() - t0);
 
diff --git a/src/lib/grouping.ts b/src/lib/grouping.ts
index 71205d8..75e781e 100644
--- a/src/lib/grouping.ts
+++ b/src/lib/grouping.ts
@@ -1,4 +1,4 @@
-import type { GroupingResponse, LLMGroupingResult, TabGroup } from "../types";
+import type { GroupingResponse, LLMGroupItem, LLMGroupingResult, TabGroup } from "../types";
 
 /**
  * Flatten a hierarchical grouping based on specificity level.
@@ -62,20 +62,123 @@ export function shouldRePrompt(
   newSpecificity: number,
   groups: TabGroup[],
 ): boolean {
-  // Moving from broad (<=3) to specific (>=7) or vice versa
-  const crossesMajorThreshold =
-    (currentSpecificity <= 3 && newSpecificity >= 7) ||
-    (currentSpecificity >= 7 && newSpecificity <= 3);
+  // Any jump of 3+ specificity points
+  if (Math.abs(newSpecificity - currentSpecificity) >= 3) return true;
+
+  // Crossing from broad to specific
+  if (currentSpecificity <= 3 && newSpecificity >= 5) return true;
+  if (currentSpecificity >= 7 && newSpecificity <= 3) return true;
+
+  // Moving to mid-high specificity but large groups lack children
+  if (newSpecificity >= 5) {
+    const threshold = newSpecificity >= 7 ? 4 : 6;
+    const hasLargeFlat = groups.some(
+      (g) => countTabs(g) >= threshold && (!g.children || g.children.length === 0),
+    );
+    if (hasLargeFlat) return true;
+  }
+
+  return false;
+}
+
+/**
+ * Post-LLM enforcement: ensure large groups have children at high specificity.
+ * Client-side domain clustering — no LLM call.
+ */
+export function enforceSubgroups(
+  result: LLMGroupingResult,
+  specificity: number,
+  tabs: { id: number; url: string; title: string }[],
+): LLMGroupingResult {
+  if (specificity < 5) return result;
+
+  const threshold = specificity >= 7 ? 4 : 6;
+  const tabMap = new Map(tabs.map((t) => [t.id, t]));
+  const merged = structuredClone(result);
+
+  function getDomain(tabId: number): string {
+    const t = tabMap.get(tabId);
+    if (!t) return "";
+    try {
+      return new URL(t.url).hostname.replace("www.", "");
+    } catch {
+      return "";
+    }
+  }
+
+  function labelFromDomain(domain: string): string {
+    // "docs.anthropic.com" → "Anthropic Docs", "github.com" → "GitHub"
+    const parts = domain.split(".");
+    if (parts.length >= 3) {
+      const sub = parts[0].charAt(0).toUpperCase() + parts[0].slice(1);
+      const base = parts[parts.length - 2].charAt(0).toUpperCase() + parts[parts.length - 2].slice(1);
+      return `${base} ${sub}`;
+    }
+    return parts[parts.length - 2]
+      ? parts[parts.length - 2].charAt(0).toUpperCase() + parts[parts.length - 2].slice(1)
+      : domain;
+  }
 
-  if (crossesMajorThreshold) return true;
+  for (const group of merged.groups) {
+    if (group.tabIds.length < threshold) continue;
+    if (group.children && group.children.length > 0) continue;
+
+    // Cluster by domain
+    const domainClusters = new Map<string, number[]>();
+    for (const tabId of group.tabIds) {
+      const domain = getDomain(tabId);
+      const key = domain || "__unknown";
+      if (!domainClusters.has(key)) domainClusters.set(key, []);
+      domainClusters.get(key)!.push(tabId);
+    }
 
-  // Moving to high specificity but no groups have children
-  if (newSpecificity >= 7) {
-    const hasChildren = groups.some((g) => g.children && g.children.length > 0);
-    if (!hasChildren) return true;
+    if (domainClusters.size >= 2) {
+      // Multiple domains → create children from clusters
+      const children: LLMGroupItem[] = [];
+      for (const [domain, tabIds] of domainClusters) {
+        if (tabIds.length === 0) continue;
+        children.push({
+          label: domain === "__unknown" ? "Other" : labelFromDomain(domain),
+          tabIds,
+        });
+      }
+      // Merge tiny children (1 tab) into the largest child
+      const sorted = children.sort((a, b) => b.tabIds.length - a.tabIds.length);
+      const kept: LLMGroupItem[] = [];
+      for (const child of sorted) {
+        if (child.tabIds.length <= 1 && kept.length > 0) {
+          kept[0].tabIds.push(...child.tabIds);
+        } else {
+          kept.push(child);
+        }
+      }
+      if (kept.length >= 2) {
+        group.children = kept;
+        group.tabIds = [];
+        console.log(
+          `[GroupThink] enforceSubgroups: decomposed "${group.label}" into ${kept.length} children`,
+        );
+      }
+    } else if (group.tabIds.length >= 6) {
+      // Single domain, 6+ tabs → split into halves by title
+      const sortedIds = [...group.tabIds].sort((a, b) => {
+        const ta = tabMap.get(a)?.title ?? "";
+        const tb = tabMap.get(b)?.title ?? "";
+        return ta.localeCompare(tb);
+      });
+      const mid = Math.ceil(sortedIds.length / 2);
+      group.children = [
+        { label: `${group.label} A`, tabIds: sortedIds.slice(0, mid) },
+        { label: `${group.label} B`, tabIds: sortedIds.slice(mid) },
+      ];
+      group.tabIds = [];
+      console.log(
+        `[GroupThink] enforceSubgroups: split "${group.label}" into 2 halves (single domain)`,
+      );
+    }
   }
 
-  return false;
+  return merged;
 }
 
 /** Move a tab from one group to another */
diff --git a/src/lib/prompts.ts b/src/lib/prompts.ts
index 0f2ce70..0d9ce37 100644
--- a/src/lib/prompts.ts
+++ b/src/lib/prompts.ts
@@ -3,11 +3,12 @@ export const SYSTEM_PROMPT = `You are a tab organizer. Given a list of browser t
 Core principle:
 - Group by what the page is ABOUT, not where it's hosted. A YouTube video about "Claude Code best practices" belongs with other Claude/Anthropic tabs, NOT in a "Videos" or "YouTube" group. A Medium article about React belongs with React/frontend tabs, not a "Medium" group. A GitHub repo for a Python library belongs with Python tabs, not a generic "GitHub" group.
 - Think about what the user was DOING when they opened each tab — group tabs that serve the same task or topic together.
+- When browser context signals are provided (visit frequency, bookmarks, recently closed tabs), use them to make better grouping decisions: high visit counts indicate active projects, bookmark folders reveal the user's mental model, recently closed tabs hint at completed or paused tasks.
 
 Rules:
 - Return ONLY valid JSON, no markdown fences, no commentary
 - Each group has a "label" of 1–3 words (concise, like a magazine section header)
-- At higher specificity, decompose groups with 4+ tabs into subcategories using "children"
+- CRITICAL: When the specificity level calls for subcategories (see user prompt), you MUST use "children" to decompose qualifying groups. A group that qualifies for decomposition MUST NOT have an empty or missing "children" array. When you create children, move all tab IDs into the children — the parent's "tabIds" should be empty.
 - Children have their own "label" (1–3 words) and optionally a "sublabel" (1–3 words) for extra context
 - Groups with 3 or fewer tabs should stay broad regardless of specificity
 - You MUST categorize every tab. The "ungrouped" array should be empty. Create a catchall group (e.g. "Miscellany") rather than leaving any tab ungrouped.
@@ -16,6 +17,7 @@ Rules:
 - NEVER create groups based on website/domain (no "YouTube", "GitHub", "Medium", "Reddit" groups). Always group by the content's topic.
 - CRITICAL: The field for tab IDs must be exactly "tabIds" (camelCase). Never use "tabs", "tab_ids", or other variants.
 - For each tab, write a 5–10 word description summarizing the page content. Include these in a top-level "tabDescriptions" map keyed by tab ID (as string).
+- For each tab, provide 1–3 short tags (1–2 words each) describing the page's topic or purpose. Include these in a top-level "tabTags" map keyed by tab ID (as string). Tags should be lowercase, concise topic labels (e.g., "ai", "docs", "pricing", "tutorial", "api reference").
 
 JSON schema:
 {
@@ -34,12 +36,14 @@ JSON schema:
     }
   ],
   "ungrouped": [number],
-  "tabDescriptions": { "<tabId>": "string (5-10 word description)" }
+  "tabDescriptions": { "<tabId>": "string (5-10 word description)" },
+  "tabTags": { "<tabId>": ["string (1-2 word tag)", ...] }
 }`;
 
 export function buildGroupingPrompt(
   tabs: { id: number; title: string; url: string }[],
   specificity: number,
+  contextHints?: string,
 ): string {
   const tabList = tabs
     .map(
@@ -48,17 +52,25 @@ export function buildGroupingPrompt(
     )
     .join("\n");
 
-  return `Specificity level: ${specificity}/10
+  let prompt = `Specificity level: ${specificity}/10
 
 Guidelines for this level:
 - 1–3: Use 3–5 very broad categories. No subcategories.
-- 4–6: Moderate detail. Subcategories only where a group has 6+ tabs.
-- 7–10: Fine-grained. Decompose any group with 4+ tabs into meaningful subcategories.
+- 4–6: Moderate detail. Any group with 6+ tabs MUST be decomposed into 2–4 children subcategories. Each child must have at least 2 tabs.
+- 7–10: Fine-grained. Any group with 4+ tabs MUST be decomposed into 2–5 children subcategories. Each child must have at least 2 tabs. This is a hard requirement.
 
 Tabs:
-${tabList}
+${tabList}`;
+
+  if (contextHints) {
+    prompt += `\n\n${contextHints}`;
+  }
+
+  prompt += `\n\nBefore returning, verify: at this specificity level, every group above the tab threshold has "children". If not, fix it.
 
 Return JSON only.`;
+
+  return prompt;
 }
 
 export function buildSweepPrompt(
@@ -97,11 +109,73 @@ Rules:
 Return JSON only (same schema).`;
 }
 
+export function buildContextHints(
+  context: import("./browser-context").BrowserContext,
+  tabs: { id: number }[],
+): string | undefined {
+  const lines: string[] = [];
+
+  for (const tab of tabs) {
+    const ctx = context.tabs.get(tab.id);
+    if (!ctx) continue;
+
+    const parts: string[] = [];
+    if (ctx.visitCount !== undefined && ctx.visitCount > 1) {
+      parts.push(`visited ${ctx.visitCount} times`);
+    }
+    if (ctx.lastVisitTime) {
+      const ago = Math.round((Date.now() - ctx.lastVisitTime) / 60_000);
+      if (ago < 60) parts.push(`last visited ${ago}min ago`);
+      else if (ago < 1440) parts.push(`last visited ${Math.round(ago / 60)}h ago`);
+    }
+    if (ctx.isBookmarked) {
+      parts.push(ctx.bookmarkFolder ? `bookmarked in "${ctx.bookmarkFolder}"` : "bookmarked");
+    }
+    if (ctx.isTopSite) {
+      parts.push("top site");
+    }
+
+    if (parts.length > 0) {
+      lines.push(`- Tab [${tab.id}]: ${parts.join(", ")}`);
+    }
+  }
+
+  const sections: string[] = [];
+
+  if (lines.length > 0) {
+    sections.push(
+      `User context signals (use to inform grouping decisions):\n${lines.join("\n")}`,
+    );
+  }
+
+  if (context.recentlyClosed.length > 0) {
+    const closedLines = context.recentlyClosed.map((t) => {
+      try {
+        return `- "${t.title}" — ${new URL(t.url).hostname}`;
+      } catch {
+        return `- "${t.title}"`;
+      }
+    });
+    sections.push(
+      `Recently closed tabs (indicates ended/paused tasks):\n${closedLines.join("\n")}`,
+    );
+  }
+
+  return sections.length > 0 ? sections.join("\n\n") : undefined;
+}
+
 export function buildRefinePrompt(currentGroupingJson: string, userInstruction: string): string {
   return `Current tab grouping:
 ${currentGroupingJson}
 
 User instruction: "${userInstruction}"
 
-Apply the user's instruction to the current grouping. Return the complete revised grouping as JSON (same schema). Return JSON only.`;
+Apply the user's instruction to the current grouping. Return the complete revised grouping as JSON (same schema).
+
+FOCUS: If the user's message implies they want to look at, focus on, explore, or zoom into a specific group or topic, include a "focusGroupLabel" field set to the EXACT label of the group to focus. If they also mention a specific subgroup or child, include "focusChildLabel" with the EXACT child label. If the user asks to focus a topic that doesn't have its own group yet, restructure the grouping so that topic becomes a distinct group, then set "focusGroupLabel" to it. If the user's instruction is purely structural (merge, rename, split) with no focus intent, omit these fields.
+
+Examples of focus intent: "show me my AI tabs", "focus on shopping", "what do I have open about React?", "zoom into the research group", "let me see the Claude stuff"
+Examples of no focus intent: "merge News and Media", "rename Shopping to Commerce", "split Development into Frontend and Backend"
+
+Return JSON only.`;
 }
diff --git a/src/types/index.ts b/src/types/index.ts
index 13eca6e..02d6028 100644
--- a/src/types/index.ts
+++ b/src/types/index.ts
@@ -11,6 +11,7 @@ export interface TabInfo {
   groupId: number;
   description?: string;
   thumbnail?: string;
+  tags?: string[];
 }
 
 // ── Grouping ──
@@ -29,6 +30,8 @@ export interface GroupingResponse {
   ungrouped: TabInfo[];
   specificity: number; // 1-10
   timestamp: number;
+  focusGroupLabel?: string;
+  focusChildLabel?: string;
 }
 
 // ── LLM response schema (before hydrating with TabInfo) ──
@@ -44,6 +47,9 @@ export interface LLMGroupingResult {
   groups: LLMGroupItem[];
   ungrouped: number[];
   tabDescriptions?: Record<string, string>;
+  tabTags?: Record<string, string[]>;
+  focusGroupLabel?: string;
+  focusChildLabel?: string;
 }
 
 // ── Chat ──
@@ -61,12 +67,14 @@ export interface GroupThinkConfig {
   model: string;
   specificity: number;
   theme: "light" | "dark" | "auto";
+  contextEnrichment: "off" | "basic" | "full";
 }
 
 export const DEFAULT_CONFIG: GroupThinkConfig = {
   model: "claude-sonnet-4-20250514",
   specificity: 5,
   theme: "auto",
+  contextEnrichment: "off",
 };
 
 // ── Messages (app ↔ background) ──
@@ -78,6 +86,7 @@ export type MessageType =
   | "group-tabs"
   | "refine-grouping"
   | "focus-tab"
+  | "split-view-tab"
   | "close-tab"
   | "ping";
 

From 3832d41f0f222d13e72af33c99400f153163ce97 Mon Sep 17 00:00:00 2001
From: ojfbot <151410806+ojfbot@users.noreply.github.com>
Date: Wed, 25 Mar 2026 01:24:16 -0500
Subject: [PATCH 2/8] feat: chat-driven group focus

- LLM can return focusGroupLabel/focusChildLabel to auto-zoom into a
  group when user asks via chat (e.g. "show me my Claude tabs")
- TreemapView accepts requestedFocusLabel prop with effect to auto-focus
- onFocusDismissed callback clears focus when user navigates back
- Breadcrumb, Escape, and group click all properly dismiss chat focus

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/app/index.tsx              | 70 +++++++++++++++++++++++++++++-----
 src/components/TreemapView.tsx | 41 +++++++++++++++++++-
 2 files changed, 99 insertions(+), 12 deletions(-)

diff --git a/src/app/index.tsx b/src/app/index.tsx
index eeb507c..e8a182c 100644
--- a/src/app/index.tsx
+++ b/src/app/index.tsx
@@ -26,6 +26,8 @@ function App() {
     Map<number, GroupAssignment> | undefined
   >();
   const [treemapReady, setTreemapReady] = useState(false);
+  const [focusLabel, setFocusLabel] = useState<string | undefined>();
+  const [focusChildLabel, setFocusChildLabel] = useState<string | undefined>();
   const timersRef = useRef<ReturnType<typeof setTimeout>[]>([]);
 
   const isLoading = loadingPhase !== "idle";
@@ -116,11 +118,20 @@ function App() {
           setGroupAssignments(assignments);
         }
 
-        // Update treemap
-        setRawGrouping(result);
-        setTabCount(countTabs(result));
-        setHistory([]);
-        if (!silent) setLoadingPhase("idle");
+        if (silent) {
+          // Silent regroup: storage listener picks up the update automatically.
+          // Only set state here as fallback (storage listener may have already fired).
+          setRawGrouping(result);
+          setTabCount(countTabs(result));
+        } else {
+          // Full regroup: update all state
+          setRawGrouping(result);
+          setTabCount(countTabs(result));
+          setHistory([]);
+          setFocusLabel(undefined);
+          setFocusChildLabel(undefined);
+          setLoadingPhase("idle");
+        }
       } catch (err) {
         if (!silent) {
           setError(err instanceof Error ? err.message : "Failed to group tabs");
@@ -131,7 +142,7 @@ function App() {
     [clearTimers, countTabs],
   );
 
-  // Initial grouping — try cache first for instant load
+  // Initial grouping — show cache instantly, then refresh in background
   useEffect(() => {
     if (!config?.anthropicApiKey) return;
 
@@ -141,12 +152,14 @@ function App() {
           type: "get-cached-grouping",
         })) as GroupingResponse | null;
         if (cached && cached.groups.length > 0) {
-          // Show cached grouping instantly — no animation
-          // Background tab listeners keep the cache fresh; user can hit Refresh for immediate update
+          // Show cached grouping instantly as placeholder
           setRawGrouping(cached);
           setTabCount(countTabs(cached));
           setSpecificity(cached.specificity ?? specificity);
           setLoadingPhase("idle");
+          // Kick off a silent background regroup so tabs stay fresh
+          // (storage listener will pick up the result)
+          doGrouping(cached.specificity ?? specificity, { silent: true });
           return;
         }
       } catch {
@@ -156,6 +169,25 @@ function App() {
     })();
   }, [config?.anthropicApiKey, countTabs, doGrouping, specificity]);
 
+  // Listen for background regroups (tab created/removed/updated)
+  useEffect(() => {
+    const listener = (
+      changes: { [key: string]: chrome.storage.StorageChange },
+      area: string,
+    ) => {
+      if (area !== "local") return;
+      if (!changes.groupthink_grouping?.newValue) return;
+      // Only pick up background updates when not actively loading
+      if (loadingPhase !== "idle" || chatLoading) return;
+
+      const updated = changes.groupthink_grouping.newValue as GroupingResponse;
+      setRawGrouping(updated);
+      setTabCount(countTabs(updated));
+    };
+    chrome.storage.onChanged.addListener(listener);
+    return () => chrome.storage.onChanged.removeListener(listener);
+  }, [loadingPhase, chatLoading, countTabs]);
+
   const handleSpecificityChange = useCallback(
     (newSpec: number) => {
       setSpecificity(newSpec);
@@ -195,9 +227,21 @@ function App() {
         if (result.error) throw new Error(result.error);
         setRawGrouping(result);
 
+        // Apply focus hints from LLM
+        if (result.focusGroupLabel) {
+          setFocusLabel(result.focusGroupLabel);
+          setFocusChildLabel(result.focusChildLabel ?? undefined);
+        } else {
+          setFocusLabel(undefined);
+          setFocusChildLabel(undefined);
+        }
+
+        const focusNote = result.focusGroupLabel
+          ? ` → Focused: ${result.focusGroupLabel}${result.focusChildLabel ? ` / ${result.focusChildLabel}` : ""}`
+          : "";
         const assistantMsg: ConversationMessage = {
           role: "assistant",
-          content: JSON.stringify(result.groups.map((g) => g.label)),
+          content: JSON.stringify(result.groups.map((g) => g.label)) + focusNote,
           timestamp: Date.now(),
         };
         setHistory([...updatedHistory, assistantMsg]);
@@ -211,7 +255,7 @@ function App() {
   );
 
   const handleFocusTab = useCallback((tabId: number) => {
-    chrome.runtime.sendMessage({ type: "focus-tab", tabId });
+    chrome.runtime.sendMessage({ type: "split-view-tab", tabId });
   }, []);
 
   const handleCloseTab = useCallback(
@@ -337,6 +381,12 @@ function App() {
             onFocusTab={handleFocusTab}
             onCloseTab={handleCloseTab}
             onReady={() => setTreemapReady(true)}
+            requestedFocusLabel={focusLabel}
+            requestedChildLabel={focusChildLabel}
+            onFocusDismissed={() => {
+              setFocusLabel(undefined);
+              setFocusChildLabel(undefined);
+            }}
           />
         )}
 
diff --git a/src/components/TreemapView.tsx b/src/components/TreemapView.tsx
index 0eb12d3..cbf668a 100644
--- a/src/components/TreemapView.tsx
+++ b/src/components/TreemapView.tsx
@@ -9,9 +9,20 @@ interface TreemapViewProps {
   onFocusTab: (tabId: number) => void;
   onCloseTab: (tabId: number) => void;
   onReady?: () => void;
+  requestedFocusLabel?: string;
+  requestedChildLabel?: string;
+  onFocusDismissed?: () => void;
 }
 
-export function TreemapView({ grouping, onFocusTab, onCloseTab, onReady }: TreemapViewProps) {
+export function TreemapView({
+  grouping,
+  onFocusTab,
+  onCloseTab,
+  onReady,
+  requestedFocusLabel,
+  requestedChildLabel,
+  onFocusDismissed,
+}: TreemapViewProps) {
   const containerRef = useRef<HTMLDivElement>(null);
   const [size, setSize] = useState({ width: 0, height: 0 });
   const [focusedGroupId, setFocusedGroupId] = useState<string | null>(null);
@@ -47,13 +58,38 @@ export function TreemapView({ grouping, onFocusTab, onCloseTab, onReady }: Treem
     return () => ro.disconnect();
   }, []);
 
+  // Auto-focus when chat requests it
+  useEffect(() => {
+    if (!requestedFocusLabel) return;
+    const normalizedReq = requestedFocusLabel.toLowerCase();
+    const match = grouping.groups.find((g) => g.label.toLowerCase() === normalizedReq);
+    if (match) {
+      setFocusedGroupId(match.id);
+      // If a child label is also requested, find and focus it
+      if (requestedChildLabel && match.children) {
+        const normalizedChild = requestedChildLabel.toLowerCase();
+        const childMatch = match.children.find(
+          (c) => c.label.toLowerCase() === normalizedChild,
+        );
+        if (childMatch) {
+          setFocusedChildId(childMatch.id);
+        } else {
+          setFocusedChildId(null);
+        }
+      } else {
+        setFocusedChildId(null);
+      }
+    }
+  }, [requestedFocusLabel, requestedChildLabel, grouping.groups]);
+
   const zoomOut = useCallback(() => {
     if (focusedChildId) {
       setFocusedChildId(null);
       return;
     }
     setFocusedGroupId(null);
-  }, [focusedChildId]);
+    onFocusDismissed?.();
+  }, [focusedChildId, onFocusDismissed]);
 
   // Escape → zoom out (child first, then group)
   useEffect(() => {
@@ -136,6 +172,7 @@ export function TreemapView({ grouping, onFocusTab, onCloseTab, onReady }: Treem
           onBack={() => {
             setFocusedChildId(null);
             setFocusedGroupId(null);
+            onFocusDismissed?.();
           }}
           onBackToGroup={() => setFocusedChildId(null)}
         />

From 17d887e7cfa29348c7e9d370e7b5b91c78309a8d Mon Sep 17 00:00:00 2001
From: ojfbot <151410806+ojfbot@users.noreply.github.com>
Date: Wed, 25 Mar 2026 01:24:22 -0500
Subject: [PATCH 3/8] feat: show subgroup tiles in gutter instead of micro-tab
 favicons
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Replace emitGutterTabs() with emitGutterChildren() — sidebar groups
now show labeled child-group tiles instead of cluttered favicon grids.
Groups without children show just their label and tab count.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/lib/treemap-layout.ts | 82 +++++++++++++++++++++++++++++++++------
 1 file changed, 70 insertions(+), 12 deletions(-)

diff --git a/src/lib/treemap-layout.ts b/src/lib/treemap-layout.ts
index 61df787..496fd73 100644
--- a/src/lib/treemap-layout.ts
+++ b/src/lib/treemap-layout.ts
@@ -110,6 +110,57 @@ function adaptivePadding(count: number, area: number): { padding: number; paddin
   return { padding: 4, paddingTop: 24 };
 }
 
+/**
+ * Emit child-group tiles inside a gutter group rect.
+ * Shows subgroup labels instead of individual tab favicons for a cleaner sidebar.
+ * Only emits when the group has 2+ children and the rect is large enough.
+ */
+function emitGutterChildren(
+  nodes: NodeRect[],
+  group: TabGroup,
+  groupRect: Rect,
+  colorIndex: number,
+): void {
+  if (!group.children || group.children.length < 2) return;
+  if (groupRect.w < 60 || groupRect.h < 60) return;
+
+  const labelH = 20;
+  const inset = 3;
+  const childAreaW = groupRect.w - inset * 2;
+  const childAreaH = groupRect.h - labelH - inset * 2;
+
+  if (childAreaW < 30 || childAreaH < 30) return;
+
+  const childLeaves = runTreemap(
+    group.children.map((c) => ({
+      weight: Math.max(c.tabs.length, 1),
+      data: c,
+    })),
+    childAreaW,
+    childAreaH,
+    2,
+    0,
+    group.children.length >= 4,
+  );
+
+  for (const { data: child, rect: childRect } of childLeaves) {
+    nodes.push({
+      id: `gutter-child-${child.id}`,
+      kind: "child-group",
+      rect: {
+        x: childRect.x + groupRect.x + inset,
+        y: childRect.y + groupRect.y + labelH,
+        w: childRect.w,
+        h: childRect.h,
+      },
+      colorIndex,
+      opacity: 0.5,
+      group: child,
+      parentGroupId: group.id,
+    });
+  }
+}
+
 /**
  * Unified layout: outputs all NodeRects for any zoom state.
  *
@@ -296,15 +347,17 @@ export function computeUnifiedLayout(
           true,
         );
         gutterLeaves.forEach(({ data: seg, rect: gutterRect }) => {
+          const absRect: Rect = {
+            x: gutterRect.x + gutterX,
+            y: gutterRect.y + innerY,
+            w: gutterRect.w,
+            h: gutterRect.h,
+          };
+
           nodes.push({
             id: seg.child.id,
             kind: "child-group",
-            rect: {
-              x: gutterRect.x + gutterX,
-              y: gutterRect.y + innerY,
-              w: gutterRect.w,
-              h: gutterRect.h,
-            },
+            rect: absRect,
             colorIndex: colorMap.get(focusedGroupId) ?? 0,
             opacity: 0.35,
             group: seg.child,
@@ -424,20 +477,25 @@ export function computeUnifiedLayout(
     );
 
     gutterLeaves.forEach(({ data, rect }) => {
+      const absRect: Rect = {
+        x: rect.x + gutterX,
+        y: rect.y + BREADCRUMB_H,
+        w: rect.w,
+        h: rect.h,
+      };
+
       nodes.push({
         id: data.group.id,
         kind: "group",
-        rect: {
-          x: rect.x + gutterX,
-          y: rect.y + BREADCRUMB_H,
-          w: rect.w,
-          h: rect.h,
-        },
+        rect: absRect,
         colorIndex: colorMap.get(data.group.id) ?? 0,
         opacity: 0.35,
         group: data.group,
         parentGroupId: null,
       });
+
+      // Subgroup tiles inside gutter groups
+      emitGutterChildren(nodes, data.group, absRect, colorMap.get(data.group.id) ?? 0);
     });
   }
 

From be371efcb0984aa48e85cfe7d21995adef77dc02 Mon Sep 17 00:00:00 2001
From: ojfbot <151410806+ojfbot@users.noreply.github.com>
Date: Wed, 25 Mar 2026 01:24:28 -0500
Subject: [PATCH 4/8] feat: split-view tab opening + pipeline wiring

- splitViewTab() tiles GroupThink left, clicked tab right using
  chrome.windows + system.display APIs
- Wire enforceSubgroups step 4 + hydrate tags in background pipeline
- Add split-view-tab and browser context gathering to message handler

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/background/index.ts | 47 +++++++++++++++++++++++++++++++---
 src/lib/tabs.ts         | 56 +++++++++++++++++++++++++++++++++++++++++
 src/manifest.json       |  3 ++-
 3 files changed, 101 insertions(+), 5 deletions(-)

diff --git a/src/background/index.ts b/src/background/index.ts
index 4a112bb..45a5644 100644
--- a/src/background/index.ts
+++ b/src/background/index.ts
@@ -1,8 +1,10 @@
 import { GroupThinkAI } from "../lib/ai";
+import { gatherBrowserContext } from "../lib/browser-context";
 import { ENV_CONFIG } from "../lib/env";
-import { mergeSmallGroups, mergeStepResults } from "../lib/grouping";
+import { enforceSubgroups, mergeSmallGroups, mergeStepResults } from "../lib/grouping";
+import { buildContextHints } from "../lib/prompts";
 import { Storage } from "../lib/storage";
-import { closeTab, focusTab, getAllTabs } from "../lib/tabs";
+import { closeTab, focusTab, getAllTabs, splitViewTab } from "../lib/tabs";
 import type {
   ConversationMessage,
   GroupingResponse,
@@ -49,13 +51,19 @@ async function captureTabThumbnail(tabId: number): Promise<string | null> {
 function hydrate(llmResult: LLMGroupingResult, tabs: TabInfo[]): GroupingResponse {
   const tabMap = new Map(tabs.map((t) => [t.id, t]));
   const descriptions = llmResult.tabDescriptions ?? {};
+  const tags = llmResult.tabTags ?? {};
   let idCounter = 0;
 
   function hydrateTab(tid: number): TabInfo | undefined {
     const tab = tabMap.get(tid);
     if (!tab) return undefined;
     const desc = descriptions[String(tid)];
-    return desc ? { ...tab, description: desc } : tab;
+    const tabTagList = tags[String(tid)];
+    return {
+      ...tab,
+      ...(desc ? { description: desc } : {}),
+      ...(tabTagList ? { tags: tabTagList } : {}),
+    };
   }
 
   function hydrateGroup(item: LLMGroupItem): TabGroup {
@@ -249,9 +257,17 @@ async function handleMessage(message: { type: string; [key: string]: unknown }):
       const ai = new GroupThinkAI(config.anthropicApiKey, config.model);
       const specificity = (message.specificity as number) ?? config.specificity;
 
+      // ── Gather browser context (if enabled) ──
+      let contextHints: string | undefined;
+      if (config.contextEnrichment && config.contextEnrichment !== "off") {
+        console.log(`[GroupThink] gathering browser context (${config.contextEnrichment})...`);
+        const context = await gatherBrowserContext(tabs, config.contextEnrichment);
+        contextHints = buildContextHints(context, tabs);
+      }
+
       // ── Step 1: Initial grouping ──
       console.log("[GroupThink] step 1: initial grouping...");
-      let llmResult = await ai.groupTabs(tabs, specificity);
+      let llmResult = await ai.groupTabs(tabs, specificity, contextHints);
       console.log(
         `[GroupThink] step 1 complete: ${llmResult.groups.length} groups, ${llmResult.ungrouped.length} ungrouped`,
       );
@@ -287,6 +303,16 @@ async function handleMessage(message: { type: string; [key: string]: unknown }):
       llmResult = mergeSmallGroups(llmResult, tabSummaries);
       console.log(`[GroupThink] step 3 complete: ${llmResult.groups.length} groups`);
 
+      // ── Step 4: Enforce subgroups for high specificity ──
+      if (specificity >= 5) {
+        console.log("[GroupThink] step 4: enforcing subgroups...");
+        const tabDetails = tabs.map((t) => ({ id: t.id, url: t.url, title: t.title }));
+        llmResult = enforceSubgroups(llmResult, specificity, tabDetails);
+        console.log(`[GroupThink] step 4 complete: ${llmResult.groups.length} groups`);
+      } else {
+        console.log("[GroupThink] step 4: skipped (specificity < 5)");
+      }
+
       // ── Hydrate + store ──
       console.log(`[GroupThink] hydrating ${llmResult.groups.length} groups...`);
       const grouping = hydrate(llmResult, tabs);
@@ -343,6 +369,14 @@ async function handleMessage(message: { type: string; [key: string]: unknown }):
       const grouping = hydrate(llmResult, allTabs);
       grouping.specificity = currentGrouping.specificity;
 
+      // Pass through focus hints from LLM
+      if (llmResult.focusGroupLabel) {
+        grouping.focusGroupLabel = llmResult.focusGroupLabel;
+      }
+      if (llmResult.focusChildLabel) {
+        grouping.focusChildLabel = llmResult.focusChildLabel;
+      }
+
       await Storage.setGrouping(grouping);
       return grouping;
     }
@@ -352,6 +386,11 @@ async function handleMessage(message: { type: string; [key: string]: unknown }):
       return { ok: true };
     }
 
+    case "split-view-tab": {
+      await splitViewTab(message.tabId as number);
+      return { ok: true };
+    }
+
     case "close-tab": {
       await closeTab(message.tabId as number);
       return { ok: true };
diff --git a/src/lib/tabs.ts b/src/lib/tabs.ts
index b3aafdd..30cd636 100644
--- a/src/lib/tabs.ts
+++ b/src/lib/tabs.ts
@@ -33,6 +33,62 @@ export async function focusTab(tabId: number): Promise<void> {
   }
 }
 
+/**
+ * Move a tab into a split view alongside the current GroupThink window.
+ * Resizes the current window to the left half, moves the target tab
+ * into a new window on the right half.
+ */
+export async function splitViewTab(tabId: number): Promise<void> {
+  const currentWindow = await chrome.windows.getCurrent();
+
+  // Get screen work area for accurate bounds
+  let left = 0;
+  let top = 0;
+  let screenW = (currentWindow.width ?? 1200) * 2;
+  let screenH = currentWindow.height ?? 800;
+
+  try {
+    const displays = await chrome.system.display.getInfo();
+    // Find the display containing the current window
+    const winLeft = currentWindow.left ?? 0;
+    const match = displays.find((d) => {
+      const b = d.workArea;
+      return winLeft >= b.left && winLeft < b.left + b.width;
+    });
+    const area = (match ?? displays[0]).workArea;
+    left = area.left;
+    top = area.top;
+    screenW = area.width;
+    screenH = area.height;
+  } catch {
+    // system.display unavailable — use current window position as fallback
+    left = currentWindow.left ?? 0;
+    top = currentWindow.top ?? 0;
+  }
+
+  const halfW = Math.floor(screenW / 2);
+
+  // Resize GroupThink window to left half
+  await chrome.windows.update(currentWindow.id!, {
+    state: "normal",
+    left,
+    top,
+    width: halfW,
+    height: screenH,
+  });
+
+  // Move the target tab into a new window on the right half
+  await chrome.windows.create({
+    tabId,
+    left: left + halfW,
+    top,
+    width: halfW,
+    height: screenH,
+    state: "normal",
+    focused: true,
+  });
+}
+
 /** Close a tab */
 export async function closeTab(tabId: number): Promise<void> {
   await chrome.tabs.remove(tabId);
diff --git a/src/manifest.json b/src/manifest.json
index fe6fbfb..03a4d00 100644
--- a/src/manifest.json
+++ b/src/manifest.json
@@ -3,7 +3,8 @@
   "name": "GroupThink",
   "version": "0.1.0",
   "description": "LLM-powered tab grouping for AI-first browsers",
-  "permissions": ["tabs", "storage", "tabGroups", "activeTab", "debugger"],
+  "permissions": ["tabs", "storage", "activeTab", "debugger", "system.display"],
+  "optional_permissions": ["history", "bookmarks", "topSites", "sessions", "tabGroups"],
   "host_permissions": ["<all_urls>"],
   "background": {
     "service_worker": "src/background/index.ts",

From 7c2dfbbc64745dafef0b35b11af191b409559a25 Mon Sep 17 00:00:00 2001
From: ojfbot <151410806+ojfbot@users.noreply.github.com>
Date: Wed, 25 Mar 2026 01:24:36 -0500
Subject: [PATCH 5/8] feat: browser context enrichment for smarter grouping
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

- New browser-context.ts gathers history visits, top sites, bookmarks,
  and recently closed tabs via optional Chrome APIs
- Options page: context enrichment toggle (Off/Basic/Full) with
  runtime permission request on enable
- Move tabGroups to optional_permissions for Dia compatibility
- Default off — opt-in only, data never persisted

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/lib/browser-context.ts | 185 +++++++++++++++++++++++++++++++++++++
 src/options/index.tsx      |  46 +++++++++
 2 files changed, 231 insertions(+)
 create mode 100644 src/lib/browser-context.ts

diff --git a/src/lib/browser-context.ts b/src/lib/browser-context.ts
new file mode 100644
index 0000000..a9e09e2
--- /dev/null
+++ b/src/lib/browser-context.ts
@@ -0,0 +1,185 @@
+export interface TabContext {
+  visitCount?: number;
+  lastVisitTime?: number;
+  isBookmarked?: boolean;
+  bookmarkFolder?: string;
+  isTopSite?: boolean;
+}
+
+export interface RecentlyClosed {
+  title: string;
+  url: string;
+}
+
+export interface BrowserContext {
+  tabs: Map<number, TabContext>;
+  recentlyClosed: RecentlyClosed[];
+}
+
+type EnrichmentLevel = "off" | "basic" | "full";
+
+async function hasPermission(permission: string): Promise<boolean> {
+  try {
+    return await chrome.permissions.contains({ permissions: [permission] });
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * Gather browser context signals for tab enrichment.
+ * Uses optional permissions — gracefully skips any API that isn't granted.
+ */
+export async function gatherBrowserContext(
+  tabs: Array<{ id: number; url: string }>,
+  level: EnrichmentLevel,
+): Promise<BrowserContext> {
+  const context: BrowserContext = {
+    tabs: new Map(),
+    recentlyClosed: [],
+  };
+
+  if (level === "off") return context;
+
+  const t0 = performance.now();
+
+  // Initialize context entries
+  for (const tab of tabs) {
+    context.tabs.set(tab.id, {});
+  }
+
+  // Run all enrichment in parallel
+  const tasks: Promise<void>[] = [];
+
+  // ── History: visit count + last visit time ──
+  if (await hasPermission("history")) {
+    tasks.push(enrichWithHistory(tabs, context));
+  }
+
+  // ── Top sites ──
+  if (await hasPermission("topSites")) {
+    tasks.push(enrichWithTopSites(tabs, context));
+  }
+
+  // ── Full level: bookmarks + sessions ──
+  if (level === "full") {
+    if (await hasPermission("bookmarks")) {
+      tasks.push(enrichWithBookmarks(tabs, context));
+    }
+    if (await hasPermission("sessions")) {
+      tasks.push(enrichWithSessions(context));
+    }
+  }
+
+  await Promise.allSettled(tasks);
+
+  console.log(
+    `[GroupThink] browser context gathered in ${Math.round(performance.now() - t0)}ms ` +
+      `(${context.tabs.size} tabs, ${context.recentlyClosed.length} recently closed)`,
+  );
+
+  return context;
+}
+
+async function enrichWithHistory(
+  tabs: Array<{ id: number; url: string }>,
+  context: BrowserContext,
+): Promise<void> {
+  await Promise.allSettled(
+    tabs.map(async (tab) => {
+      try {
+        const visits = await chrome.history.getVisits({ url: tab.url });
+        const entry = context.tabs.get(tab.id);
+        if (entry) {
+          entry.visitCount = visits.length;
+          if (visits.length > 0) {
+            entry.lastVisitTime = Math.max(...visits.map((v) => v.visitTime ?? 0));
+          }
+        }
+      } catch {
+        // Individual tab history lookup failed — skip
+      }
+    }),
+  );
+}
+
+async function enrichWithTopSites(
+  tabs: Array<{ id: number; url: string }>,
+  context: BrowserContext,
+): Promise<void> {
+  try {
+    const topSites = await chrome.topSites.get();
+    const topDomains = new Set<string>();
+    for (const site of topSites) {
+      try {
+        topDomains.add(new URL(site.url).hostname.replace("www.", ""));
+      } catch {
+        // Invalid URL — skip
+      }
+    }
+
+    for (const tab of tabs) {
+      try {
+        const domain = new URL(tab.url).hostname.replace("www.", "");
+        if (topDomains.has(domain)) {
+          const entry = context.tabs.get(tab.id);
+          if (entry) entry.isTopSite = true;
+        }
+      } catch {
+        // Invalid tab URL — skip
+      }
+    }
+  } catch {
+    // topSites API failed — skip entirely
+  }
+}
+
+async function enrichWithBookmarks(
+  tabs: Array<{ id: number; url: string }>,
+  context: BrowserContext,
+): Promise<void> {
+  await Promise.allSettled(
+    tabs.map(async (tab) => {
+      try {
+        const results = await chrome.bookmarks.search({ url: tab.url });
+        if (results.length > 0) {
+          const entry = context.tabs.get(tab.id);
+          if (entry) {
+            entry.isBookmarked = true;
+            // Get parent folder name
+            const parentId = results[0].parentId;
+            if (parentId) {
+              try {
+                const parents = await chrome.bookmarks.get(parentId);
+                if (parents[0]?.title) {
+                  entry.bookmarkFolder = parents[0].title;
+                }
+              } catch {
+                // Parent lookup failed — still mark as bookmarked
+              }
+            }
+          }
+        }
+      } catch {
+        // Individual bookmark lookup failed — skip
+      }
+    }),
+  );
+}
+
+async function enrichWithSessions(context: BrowserContext): Promise<void> {
+  try {
+    const sessions = await chrome.sessions.getRecentlyClosed({ maxResults: 10 });
+    for (const session of sessions) {
+      const tab = session.tab;
+      if (tab?.title && tab?.url && !tab.url.startsWith("chrome")) {
+        context.recentlyClosed.push({
+          title: tab.title,
+          url: tab.url,
+        });
+      }
+    }
+  } catch {
+    // sessions API failed — skip
+  }
+}
diff --git a/src/options/index.tsx b/src/options/index.tsx
index 1111028..893e8be 100644
--- a/src/options/index.tsx
+++ b/src/options/index.tsx
@@ -9,10 +9,19 @@ const MODELS = [
   { value: "claude-haiku-4-5-20251001", label: "Claude Haiku 4.5" },
 ];
 
+type EnrichmentLevel = "off" | "basic" | "full";
+
+const ENRICHMENT_PERMISSIONS: Record<EnrichmentLevel, string[]> = {
+  off: [],
+  basic: ["history", "topSites"],
+  full: ["history", "topSites", "bookmarks", "sessions"],
+};
+
 function Options() {
   const [apiKey, setApiKey] = useState("");
   const [model, setModel] = useState("claude-sonnet-4-20250514");
   const [theme, setTheme] = useState<"light" | "dark" | "auto">("auto");
+  const [enrichment, setEnrichment] = useState<EnrichmentLevel>("off");
   const [saved, setSaved] = useState(false);
 
   useEffect(() => {
@@ -21,9 +30,27 @@ function Options() {
       if (config.anthropicApiKey) setApiKey(config.anthropicApiKey);
       if (config.model) setModel(config.model);
       if (config.theme) setTheme(config.theme);
+      if (config.contextEnrichment) setEnrichment(config.contextEnrichment);
     });
   }, []);
 
+  const handleEnrichmentChange = async (level: EnrichmentLevel) => {
+    if (level === "off") {
+      setEnrichment(level);
+      return;
+    }
+    const perms = ENRICHMENT_PERMISSIONS[level];
+    try {
+      const granted = await chrome.permissions.request({ permissions: perms });
+      if (granted) {
+        setEnrichment(level);
+      }
+      // If denied, keep current level
+    } catch {
+      // Permission request failed — keep current level
+    }
+  };
+
   const handleSave = async () => {
     await chrome.runtime.sendMessage({
       type: "set-config",
@@ -31,6 +58,7 @@ function Options() {
         anthropicApiKey: apiKey,
         model,
         theme,
+        contextEnrichment: enrichment,
       },
     });
     ThemeManager.apply();
@@ -82,6 +110,24 @@ function Options() {
         </select>
       </div>
 
+      <div className="field">
+        <label htmlFor="enrichment">Browser Context</label>
+        <select
+          id="enrichment"
+          value={enrichment}
+          onChange={(e) => handleEnrichmentChange(e.target.value as EnrichmentLevel)}
+        >
+          <option value="off">Off — title and URL only</option>
+          <option value="basic">Basic — visit frequency + top sites</option>
+          <option value="full">Full — also bookmarks + recent history</option>
+        </select>
+        <p className="hint">
+          When enabled, browser signals are sent to the LLM for smarter grouping.
+          Data is gathered fresh per request and never stored.
+          {enrichment !== "off" && " Additional browser permissions will be requested."}
+        </p>
+      </div>
+
       <div className="actions">
         <button className="btn-primary" onClick={handleSave}>
           Save

From d86a623c50695c9bce01e0edd436b6ac5cbf3d13 Mon Sep 17 00:00:00 2001
From: ojfbot <151410806+ojfbot@users.noreply.github.com>
Date: Wed, 25 Mar 2026 01:40:06 -0500
Subject: [PATCH 6/8] fix(ci): remove hardcoded pnpm version, use
 packageManager from package.json

pnpm/action-setup@v4 now errors when both `version` input and
`packageManager` in package.json are set. Let it read from package.json.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .github/workflows/ci.yml | 2 --
 1 file changed, 2 deletions(-)

diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index e2317ee..6b87d02 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -12,8 +12,6 @@ jobs:
     steps:
       - uses: actions/checkout@v4
       - uses: pnpm/action-setup@v4
-        with:
-          version: '9.15.4'
       - uses: actions/setup-node@v4
         with:
           node-version: '24'

From 5a9a990adad41b2a12105098d792735c0a6c60d1 Mon Sep 17 00:00:00 2001
From: ojfbot <151410806+ojfbot@users.noreply.github.com>
Date: Wed, 25 Mar 2026 01:42:18 -0500
Subject: [PATCH 7/8] style: fix biome formatting errors

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 src/app/index.tsx              | 5 +----
 src/components/TreemapNode.tsx | 6 +++++-
 src/components/TreemapView.tsx | 4 +---
 src/lib/grouping.ts            | 3 ++-
 src/lib/prompts.ts             | 4 +---
 src/options/index.tsx          | 4 ++--
 6 files changed, 12 insertions(+), 14 deletions(-)

diff --git a/src/app/index.tsx b/src/app/index.tsx
index e8a182c..94a01c6 100644
--- a/src/app/index.tsx
+++ b/src/app/index.tsx
@@ -171,10 +171,7 @@ function App() {
 
   // Listen for background regroups (tab created/removed/updated)
   useEffect(() => {
-    const listener = (
-      changes: { [key: string]: chrome.storage.StorageChange },
-      area: string,
-    ) => {
+    const listener = (changes: { [key: string]: chrome.storage.StorageChange }, area: string) => {
       if (area !== "local") return;
       if (!changes.groupthink_grouping?.newValue) return;
       // Only pick up background updates when not actively loading
diff --git a/src/components/TreemapNode.tsx b/src/components/TreemapNode.tsx
index 7dc64f1..4037bb5 100644
--- a/src/components/TreemapNode.tsx
+++ b/src/components/TreemapNode.tsx
@@ -381,7 +381,11 @@ function TabContent({
       {h > 64 && w > 120 && tab.tags && tab.tags.length > 0 && (
         <div className="gt-node__tab-tags">
           {tab.tags.slice(0, 3).map((tag) => (
-            <span key={tag} className="gt-tag" style={{ backgroundColor: `hsl(${node.colorIndex * 47 + 200}, 25%, ${40}%)` }}>
+            <span
+              key={tag}
+              className="gt-tag"
+              style={{ backgroundColor: `hsl(${node.colorIndex * 47 + 200}, 25%, ${40}%)` }}
+            >
               {tag}
             </span>
           ))}
diff --git a/src/components/TreemapView.tsx b/src/components/TreemapView.tsx
index cbf668a..f634fc4 100644
--- a/src/components/TreemapView.tsx
+++ b/src/components/TreemapView.tsx
@@ -68,9 +68,7 @@ export function TreemapView({
       // If a child label is also requested, find and focus it
       if (requestedChildLabel && match.children) {
         const normalizedChild = requestedChildLabel.toLowerCase();
-        const childMatch = match.children.find(
-          (c) => c.label.toLowerCase() === normalizedChild,
-        );
+        const childMatch = match.children.find((c) => c.label.toLowerCase() === normalizedChild);
         if (childMatch) {
           setFocusedChildId(childMatch.id);
         } else {
diff --git a/src/lib/grouping.ts b/src/lib/grouping.ts
index 75e781e..28cda9d 100644
--- a/src/lib/grouping.ts
+++ b/src/lib/grouping.ts
@@ -111,7 +111,8 @@ export function enforceSubgroups(
     const parts = domain.split(".");
     if (parts.length >= 3) {
       const sub = parts[0].charAt(0).toUpperCase() + parts[0].slice(1);
-      const base = parts[parts.length - 2].charAt(0).toUpperCase() + parts[parts.length - 2].slice(1);
+      const base =
+        parts[parts.length - 2].charAt(0).toUpperCase() + parts[parts.length - 2].slice(1);
       return `${base} ${sub}`;
     }
     return parts[parts.length - 2]
diff --git a/src/lib/prompts.ts b/src/lib/prompts.ts
index 0d9ce37..ba7272e 100644
--- a/src/lib/prompts.ts
+++ b/src/lib/prompts.ts
@@ -143,9 +143,7 @@ export function buildContextHints(
   const sections: string[] = [];
 
   if (lines.length > 0) {
-    sections.push(
-      `User context signals (use to inform grouping decisions):\n${lines.join("\n")}`,
-    );
+    sections.push(`User context signals (use to inform grouping decisions):\n${lines.join("\n")}`);
   }
 
   if (context.recentlyClosed.length > 0) {
diff --git a/src/options/index.tsx b/src/options/index.tsx
index 893e8be..443803a 100644
--- a/src/options/index.tsx
+++ b/src/options/index.tsx
@@ -122,8 +122,8 @@ function Options() {
           <option value="full">Full — also bookmarks + recent history</option>
         </select>
         <p className="hint">
-          When enabled, browser signals are sent to the LLM for smarter grouping.
-          Data is gathered fresh per request and never stored.
+          When enabled, browser signals are sent to the LLM for smarter grouping. Data is gathered
+          fresh per request and never stored.
           {enrichment !== "off" && " Additional browser permissions will be requested."}
         </p>
       </div>

From 7e4c7aa88a9c6d11306776e4de9901a457fe8838 Mon Sep 17 00:00:00 2001
From: ojfbot <151410806+ojfbot@users.noreply.github.com>
Date: Wed, 25 Mar 2026 01:44:49 -0500
Subject: [PATCH 8/8] fix(ci): generate env.ts stub before type-check

env.ts is gitignored (generated at build time from env.json).
CI needs the stub to exist before tsc runs.

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
---
 .github/workflows/ci.yml | 1 +
 1 file changed, 1 insertion(+)

diff --git a/.github/workflows/ci.yml b/.github/workflows/ci.yml
index 6b87d02..9ba8364 100644
--- a/.github/workflows/ci.yml
+++ b/.github/workflows/ci.yml
@@ -17,6 +17,7 @@ jobs:
           node-version: '24'
           cache: 'pnpm'
       - run: pnpm install --frozen-lockfile
+      - run: node scripts/inject-env.js
       - run: pnpm lint
       - run: pnpm type-check
       - run: pnpm build:prod