@circuitwall/jarela 2.3.0 → 2.5.0

package/components/settings/SettingsPanel.tsx

@@ -92,7 +92,7 @@ export function SettingsPanel() {
   }));
 
   return (
-    <div className="flex flex-col h-full min-h-0">
+    <div className="mx-auto flex h-full min-h-0 w-full max-w-5xl flex-col">
       <SubTabBar
         ariaLabel="Settings sub-section"
         tabs={tabItems}
@@ -120,7 +120,7 @@ export function SettingsPanel() {
 // future change to either panel without touching this file.
 function PrivacySecurityPanel() {
   return (
-    <div className="h-full overflow-y-auto no-scrollbar max-w-lg mx-auto w-full px-4 py-3">
+    <div className="h-full w-full overflow-y-auto px-4 py-3 no-scrollbar">
       <SettingsGroup defaultOpenId="pin">
         <SecurityPanel />
         <RedactionPanel />

package/components/tools/ToolsPanel.tsx

@@ -2,7 +2,6 @@
 import { useAppContext } from "@/contexts/AppContext";
 import { MCPPanel } from "@/components/mcp/MCPPanel";
 import { SkillsPanel } from "@/components/skills/SkillsPanel";
-import { UnifiedMemoryPanel } from "@/components/memory/UnifiedMemoryPanel";
 import { BridgesPanel } from "@/components/bridges/BridgesPanel";
 import { BrowserPanel } from "@/components/tools/BrowserPanel";
 import { PackagesPanel } from "./PackagesPanel";
@@ -13,7 +12,7 @@ import { SubTabBar, type SubTabItem } from "@/components/ui/SubTabBar";
 //                   manifests, and drop-in `.cjs` files. One home for
 //                   everything that turns into a LangChain tool.
 //   - "Skills"    — markdown playbooks (repos) the agent reads/writes on demand.
-//   - "Memory"    — searchable chats and documents, plus saved facts.
+//   - Knowledge now has its own Advanced-menu destination.
 //   - "MCP"       — external Model Context Protocol servers.
 //   - "Bridges"   — mobile / messaging bridge pairings.
 //   - "Browser"   — the local Chromium extension as an agent runtime surface.
@@ -23,17 +22,15 @@ type Sub =
   | "packages"
   | "browser"
   | "skills"
-  | "memory"
   | "mcp"
   | "bridges";
 
-const SUBS: Sub[] = ["packages", "browser", "skills", "memory", "mcp", "bridges"];
+const SUBS: Sub[] = ["packages", "browser", "skills", "mcp", "bridges"];
 
 const SUB_TITLES: Record<Sub, string> = {
   packages: "Packages",
   browser: "Browser",
   skills: "Skills",
-  memory: "Memory",
   mcp: "MCP servers",
   bridges: "Bridges",
 };
@@ -43,7 +40,6 @@ const SUB_TITLES: Record<Sub, string> = {
 const LEGACY_SUBS: Record<string, Sub> = {
   builtin: "packages",
   extensions: "packages",
-  documents: "memory",
 };
 
 export function ToolsPanel() {
@@ -70,7 +66,6 @@ export function ToolsPanel() {
         {active === "packages" && <PackagesPanel />}
         {active === "browser" && <BrowserPanel />}
         {active === "skills" && <SkillsPanel />}
-        {active === "memory" && <UnifiedMemoryPanel />}
         {active === "mcp" && <MCPPanel />}
         {active === "bridges" && <BridgesPanel />}
       </div>

package/components/ui/AppearancePreferences.test.tsx

@@ -0,0 +1,68 @@
+// @vitest-environment jsdom
+import { afterEach, beforeEach, describe, expect, it, vi } from "vitest";
+import { fireEvent, render, screen, waitFor } from "@testing-library/react";
+import { ThemeProvider, useTheme } from "@/contexts/ThemeContext";
+
+function PreferenceProbe() {
+  const { accentColor, setAccentColor, surfaceStyle, setSurfaceStyle } = useTheme();
+  return (
+    <div>
+      <span data-testid="accent">{accentColor}</span>
+      <span data-testid="surface">{surfaceStyle}</span>
+      <button onClick={() => setAccentColor("teal")}>Choose teal</button>
+      <button onClick={() => setAccentColor("default")}>Choose default</button>
+      <button onClick={() => setSurfaceStyle("ambient")}>Choose atmospheric</button>
+      <button onClick={() => setSurfaceStyle("liquid")}>Choose Liquid Glass</button>
+    </div>
+  );
+}
+
+describe("ThemeContext appearance preferences", () => {
+  beforeEach(() => {
+    localStorage.clear();
+    vi.stubGlobal("matchMedia", vi.fn().mockReturnValue({
+      matches: false,
+      addEventListener: vi.fn(),
+      removeEventListener: vi.fn(),
+    }));
+  });
+
+  afterEach(() => {
+    vi.unstubAllGlobals();
+    document.documentElement.removeAttribute("data-accent-color");
+    document.documentElement.removeAttribute("data-surface-style");
+  });
+
+  it("restores, applies, and resets appearance choices", async () => {
+    localStorage.setItem("jarela-accent-color", "rose");
+    localStorage.setItem("jarela-surface-style", "calm");
+    render(
+      <ThemeProvider>
+        <PreferenceProbe />
+      </ThemeProvider>,
+    );
+
+    await waitFor(() => {
+      expect(screen.getByTestId("accent").textContent).toBe("rose");
+      expect(screen.getByTestId("surface").textContent).toBe("calm");
+      expect(document.documentElement.dataset.accentColor).toBe("rose");
+      expect(document.documentElement.dataset.surfaceStyle).toBe("calm");
+    });
+
+    fireEvent.click(screen.getByRole("button", { name: "Choose teal" }));
+    expect(document.documentElement.dataset.accentColor).toBe("teal");
+    expect(localStorage.getItem("jarela-accent-color")).toBe("teal");
+
+    fireEvent.click(screen.getByRole("button", { name: "Choose default" }));
+    expect(document.documentElement.hasAttribute("data-accent-color")).toBe(false);
+    expect(localStorage.getItem("jarela-accent-color")).toBeNull();
+
+    fireEvent.click(screen.getByRole("button", { name: "Choose atmospheric" }));
+    expect(document.documentElement.dataset.surfaceStyle).toBe("ambient");
+    expect(localStorage.getItem("jarela-surface-style")).toBe("ambient");
+
+    fireEvent.click(screen.getByRole("button", { name: "Choose Liquid Glass" }));
+    expect(document.documentElement.dataset.surfaceStyle).toBe("liquid");
+    expect(localStorage.getItem("jarela-surface-style")).toBe("liquid");
+  });
+});

package/components/ui/BootScreen.test.tsx

@@ -0,0 +1,44 @@
+// @vitest-environment jsdom
+import { act, render } from "@testing-library/react";
+import { afterEach, expect, it, vi } from "vitest";
+import { BootScreen } from "./BootScreen";
+
+const reads = vi.hoisted(() => ({
+  profile: vi.fn(),
+  agent: vi.fn(),
+  thread: vi.fn(),
+  messages: vi.fn(),
+}));
+vi.mock("@/api/client", () => ({
+  api: {
+    profile: { get: reads.profile },
+    agents: { get: reads.agent, getThread: reads.thread },
+    threads: { get: reads.messages },
+  },
+}));
+vi.mock("@/components/ui/Logo", () => ({ Logo: () => null }));
+vi.mock("@/components/ui/VersionTag", () => ({ VersionTag: () => null }));
+vi.mock("@/components/ui/PoweredBy", () => ({ PoweredBy: () => null }));
+vi.mock("@/components/ui/WorkflowChecklist", () => ({ WorkflowChecklist: () => null }));
+
+afterEach(() => { vi.useRealTimers(); });
+
+it("does not restart boot prefetch after dismissal when the agent changes", async () => {
+  vi.useFakeTimers();
+  reads.profile.mockResolvedValue({});
+  reads.agent.mockResolvedValue({});
+  reads.thread.mockResolvedValue({ thread_id: "thread" });
+  reads.messages.mockResolvedValue({});
+  const onPickAgent = vi.fn();
+  const { rerender, container } = render(
+    <BootScreen agents={[]} agentsLoaded activeAgentId="first" onPickAgent={onPickAgent} />,
+  );
+  await act(async () => {});
+  await act(async () => { await vi.advanceTimersByTimeAsync(750); });
+  expect(container.innerHTML).toBe("");
+  rerender(<BootScreen agents={[]} agentsLoaded activeAgentId="second" onPickAgent={onPickAgent} />);
+  await act(async () => {});
+  expect(reads.agent).toHaveBeenCalledTimes(1);
+  expect(reads.agent).toHaveBeenCalledWith("first", { startup: true });
+  expect(reads.thread).toHaveBeenCalledTimes(1);
+});

package/components/ui/BootScreen.tsx

@@ -61,6 +61,7 @@ interface Props {
   agents: AgentConfig[];
   agentsLoaded: boolean;
   activeAgentId: string | null;
+  preferredThreadId?: string | null;
   onPickAgent: (agentId: string) => void;
   // Boot picker is a chat-tab gate; suppress on non-chat tabs so it doesn't overlay them.
   suppressed?: boolean;
@@ -78,7 +79,7 @@ interface Props {
 // Replaces the previous splash + ChatView empty-state agent picker. The
 // header (z-40) is hidden while this is visible so the user lands on a
 // focused, one-purpose screen.
-export function BootScreen({ agents, agentsLoaded, activeAgentId, onPickAgent, suppressed }: Props) {
+export function BootScreen({ agents, agentsLoaded, activeAgentId, preferredThreadId, onPickAgent, suppressed }: Props) {
   // Capture which agent we transitioned through so the icon can keep
   // showing during the fade-out, even if a parent state shift would
   // otherwise clear it.
@@ -96,7 +97,6 @@ export function BootScreen({ agents, agentsLoaded, activeAgentId, onPickAgent, s
   const [adoptionBusy, setAdoptionBusy] = useState<VersionAdoptionAction | null>(null);
   const [adoptionLiveLabel, setAdoptionLiveLabel] = useState<string | null>(null);
   const adoptionRef = useRef<VersionAdoptionState | null>(null);
-  const prefetchStartedRef = useRef(false);
   const adoptionRunStartedRef = useRef<string | null>(null);
   const adoptionAbortRef = useRef<AbortController | null>(null);
   adoptionRef.current = adoption;
@@ -244,9 +244,8 @@ export function BootScreen({ agents, agentsLoaded, activeAgentId, onPickAgent, s
   // half-rendered chat that has to fetch the same data anyway.
   useEffect(() => {
     const id = activeAgentId ?? pickedId;
-    if (!id || !agentsLoaded) return;
-    if (prefetchStartedRef.current) return;
-    prefetchStartedRef.current = true;
+    if (!id || !agentsLoaded || done) return;
+    setDismissing(false);
 
     setSteps([
       { key: "profile", label: "loading your profile", status: "active" },
@@ -259,22 +258,36 @@ export function BootScreen({ agents, agentsLoaded, activeAgentId, onPickAgent, s
 
     void (async () => {
       await Promise.allSettled([
-        api.profile.get().finally(() => {
+        api.profile.get({ startup: true }).catch((error: unknown) => {
+          console.error("startup profile warmup failed", error);
+        }).finally(() => {
           if (!cancelled) markStep("profile", "done");
         }),
         api.agents
-          .get(id)
+          .get(id, { startup: true })
+          .catch((error: unknown) => {
+            console.error("startup agent warmup failed", error);
+          })
           .finally(() => {
             if (!cancelled) markStep("agent", "done");
           }),
         (async () => {
           try {
-            const t = await api.agents.getThread(id);
+            if (preferredThreadId) {
+              try {
+                const preferred = await api.threads.get(preferredThreadId, { startup: true });
+                if (preferred.agent_id === id) return;
+              } catch (error) {
+                console.error("startup selected conversation warmup failed", error);
+              }
+            }
+            const t = await api.agents.getThread(id, { startup: true });
             if (cancelled) return;
             markStep("thread", "done");
             markStep("messages", "active");
-            await api.threads.get(t.thread_id);
-          } catch {
+            await api.threads.get(t.thread_id, { startup: true });
+          } catch (error) {
+            console.error("startup conversation warmup failed", error);
             // Errors here are non-fatal for boot — ChatView will surface
             // them with its own retry path. Just mark the steps done so
             // we don't block the user behind the splash forever.
@@ -301,7 +314,7 @@ export function BootScreen({ agents, agentsLoaded, activeAgentId, onPickAgent, s
       cancelled = true;
       if (dismissTimerRef.current) clearTimeout(dismissTimerRef.current);
     };
-  }, [activeAgentId, pickedId, agentsLoaded, markStep]);
+  }, [activeAgentId, pickedId, preferredThreadId, agentsLoaded, markStep, done]);
 
   if (done) return null;
   if (suppressed) return null;

package/components/ui/NotificationStatus.test.tsx

@@ -21,12 +21,12 @@ describe("NotificationStatus", () => {
   it("renders a theme-safe denied state with an accessible dismiss action", async () => {
     render(<NotificationStatus />);
 
-    const copy = await screen.findByText(/OS notifications are blocked/);
+    const copy = await screen.findByText(/System notifications are blocked/);
     const banner = copy.closest(".rounded-lg");
     expect(banner?.className).toContain("bg-rose-500/10");
     expect(screen.getByRole("button", { name: "Dismiss notification prompt" })).toBeTruthy();
 
     fireEvent.click(screen.getByRole("button", { name: "Dismiss notification prompt" }));
-    expect(screen.queryByText(/OS notifications are blocked/)).toBeNull();
+    expect(screen.queryByText(/System notifications are blocked/)).toBeNull();
   });
 });

package/components/ui/NotificationStatus.tsx

@@ -85,15 +85,15 @@ export function NotificationStatus() {
     : "border-amber-500/30 bg-amber-500/10";
 
   return (
-    <div className="absolute top-9 left-0 right-0 z-30 mx-auto max-w-2xl px-4 mt-2 pointer-events-none">
-      <div role="status" className={`pointer-events-auto rounded-lg border ${bannerTone} backdrop-blur px-3 py-2 flex items-center gap-2 shadow-lg`}>
+    <div className="absolute top-9 left-0 right-0 z-30 mx-auto max-w-xl px-4 mt-2 pointer-events-none">
+      <div role="status" className={`pointer-events-auto rounded-lg border ${bannerTone} backdrop-blur px-3 py-2 flex flex-wrap items-center gap-x-2 gap-y-1 shadow-lg`}>
         {status === "denied"
           ? <BellOff size={14} className="text-rose-700 dark:text-rose-400 shrink-0" />
           : <Bell size={14} className="text-amber-700 dark:text-amber-400 shrink-0" />}
-        <p className="text-xs text-fg mr-auto">
+        <p className="min-w-0 flex-1 basis-full text-xs text-fg sm:basis-auto">
           {status === "denied"
-            ? "OS notifications are blocked. In-app pop-ups still work; for system-level alerts when Jarela isn't focused, allow Notifications via the lock icon in the URL bar."
-            : "Enable OS notifications to also get pinged when Jarela isn't focused (in-app pop-ups already work)."}
+            ? "System notifications are blocked. In-app alerts still work; change this in browser site settings."
+            : "Enable system alerts for when Jarela isn't focused."}
         </p>
         {status === "default" && (
           <button

package/components/ui/SubTabBar.tsx

@@ -159,11 +159,10 @@ function EdgeArrow({ side, onClick }: { side: "left" | "right"; onClick: () => v
   return (
     <button
       type="button"
-      tabIndex={-1}
-      aria-hidden="true"
+      aria-label={`Scroll tabs ${side}`}
       onClick={onClick}
       className={
-        "absolute inset-y-0 w-8 flex items-center pointer-coarse:hidden text-fg-muted hover:text-fg from-[var(--bg-secondary)] via-[var(--bg-secondary)] to-transparent " +
+        "absolute inset-y-0 w-8 flex items-center text-fg-muted hover:text-fg from-[var(--bg-secondary)] via-[var(--bg-secondary)] to-transparent " +
         (side === "left"
           ? "bg-gradient-to-r left-0 justify-start pl-1"
           : "bg-gradient-to-l right-0 justify-end pr-1")

package/contexts/ThemeContext.tsx

@@ -2,13 +2,25 @@
 import { createContext, useCallback, useContext, useEffect, useState, type ReactNode } from "react";
 
 export type Theme = "light" | "dark" | "system";
+export type AccentColor = "default" | "blue" | "teal" | "violet" | "rose";
+export type SurfaceStyle = "ambient" | "calm" | "liquid";
 
 const STORAGE_KEY = "jarela-theme";
+const ACCENT_STORAGE_KEY = "jarela-accent-color";
+const SURFACE_STORAGE_KEY = "jarela-surface-style";
 
 function isTheme(v: unknown): v is Theme {
   return v === "light" || v === "dark" || v === "system";
 }
 
+function isAccentColor(v: unknown): v is AccentColor {
+  return v === "default" || v === "blue" || v === "teal" || v === "violet" || v === "rose";
+}
+
+function isSurfaceStyle(v: unknown): v is SurfaceStyle {
+  return v === "ambient" || v === "calm" || v === "liquid";
+}
+
 function readStored(): Theme {
   if (typeof window === "undefined") return "system";
   try {
@@ -19,6 +31,26 @@ function readStored(): Theme {
   }
 }
 
+function readStoredAccent(): AccentColor {
+  if (typeof window === "undefined") return "blue";
+  try {
+    const value = window.localStorage.getItem(ACCENT_STORAGE_KEY);
+    return isAccentColor(value) ? value : "default";
+  } catch {
+    return "default";
+  }
+}
+
+function readStoredSurface(): SurfaceStyle {
+  if (typeof window === "undefined") return "ambient";
+  try {
+    const value = window.localStorage.getItem(SURFACE_STORAGE_KEY);
+    return isSurfaceStyle(value) ? value : "ambient";
+  } catch {
+    return "ambient";
+  }
+}
+
 const LIGHT_CHROME = "#ffffff";
 const DARK_CHROME = "#09090b";
 
@@ -44,9 +76,27 @@ function apply(theme: Theme) {
   syncChrome(theme);
 }
 
+function applyAccentColor(accentColor: AccentColor) {
+  if (typeof document === "undefined") return;
+  if (accentColor === "default") {
+    document.documentElement.removeAttribute("data-accent-color");
+    return;
+  }
+  document.documentElement.setAttribute("data-accent-color", accentColor);
+}
+
+function applySurfaceStyle(surfaceStyle: SurfaceStyle) {
+  if (typeof document === "undefined") return;
+  document.documentElement.setAttribute("data-surface-style", surfaceStyle);
+}
+
 interface Ctx {
   theme: Theme;
   setTheme: (t: Theme) => void;
+  accentColor: AccentColor;
+  setAccentColor: (color: AccentColor) => void;
+  surfaceStyle: SurfaceStyle;
+  setSurfaceStyle: (style: SurfaceStyle) => void;
 }
 
 const ThemeContext = createContext<Ctx | null>(null);
@@ -56,10 +106,18 @@ export function ThemeProvider({ children }: { children: ReactNode }) {
   // which writes data-theme before React hydrates. The effect below syncs the
   // React state to whatever the script (or localStorage) decided.
   const [theme, setThemeState] = useState<Theme>("system");
+  const [accentColor, setAccentColorState] = useState<AccentColor>("blue");
+  const [surfaceStyle, setSurfaceStyleState] = useState<SurfaceStyle>("ambient");
 
   useEffect(() => {
     const stored = readStored();
+    const storedAccent = readStoredAccent();
+    const storedSurface = readStoredSurface();
     setThemeState(stored);
+    setAccentColorState(storedAccent);
+    setSurfaceStyleState(storedSurface);
+    applyAccentColor(storedAccent);
+    applySurfaceStyle(storedSurface);
     // When in "system" mode, mirror OS-level changes into the PWA chrome.
     if (typeof window === "undefined") return;
     const mq = window.matchMedia("(prefers-color-scheme: dark)");
@@ -80,7 +138,32 @@ export function ThemeProvider({ children }: { children: ReactNode }) {
     }
   }, []);
 
-  return <ThemeContext.Provider value={{ theme, setTheme }}>{children}</ThemeContext.Provider>;
+  const setAccentColor = useCallback((color: AccentColor) => {
+    setAccentColorState(color);
+    applyAccentColor(color);
+    try {
+      if (color === "default") window.localStorage.removeItem(ACCENT_STORAGE_KEY);
+      else window.localStorage.setItem(ACCENT_STORAGE_KEY, color);
+    } catch {
+      /* ignore quota / private-mode errors */
+    }
+  }, []);
+
+  const setSurfaceStyle = useCallback((style: SurfaceStyle) => {
+    setSurfaceStyleState(style);
+    applySurfaceStyle(style);
+    try {
+      window.localStorage.setItem(SURFACE_STORAGE_KEY, style);
+    } catch {
+      /* ignore quota / private-mode errors */
+    }
+  }, []);
+
+  return (
+    <ThemeContext.Provider value={{ theme, setTheme, accentColor, setAccentColor, surfaceStyle, setSurfaceStyle }}>
+      {children}
+    </ThemeContext.Provider>
+  );
 }
 
 export function useTheme() {

package/hooks/useAgentSession.test.ts

@@ -1,6 +1,6 @@
 // @vitest-environment jsdom
 
-import { renderHook, waitFor } from "@testing-library/react";
+import { act, renderHook, waitFor } from "@testing-library/react";
 import { beforeEach, describe, expect, it, vi } from "vitest";
 import { useAgentSession } from "@/hooks/useAgentSession";
 
@@ -11,6 +11,7 @@ vi.mock("@/api/client", () => ({
   api: {
     threads: {
       get: (...args: unknown[]) => threadGetMock(...args),
+      metadata: (...args: unknown[]) => threadGetMock(...args),
     },
     agents: {
       getThread: (...args: unknown[]) => agentGetThreadMock(...args),
@@ -35,5 +36,15 @@ describe("useAgentSession contract", () => {
     expect(result.current.loading).toBe(result.current.state.loading);
     expect(result.current.refresh).toBe(result.current.commands.refresh);
     expect(agentGetThreadMock).not.toHaveBeenCalled();
+    expect(threadGetMock).toHaveBeenCalledWith("preferred-thread", { startup: true });
+  });
+
+  it("uses the startup handoff initially but keeps explicit refreshes fresh", async () => {
+    agentGetThreadMock.mockResolvedValue({ thread_id: "thread" });
+    const { result } = renderHook(() => useAgentSession("agent"));
+    await waitFor(() => expect(result.current.threadId).toBe("thread"));
+    expect(agentGetThreadMock).toHaveBeenLastCalledWith("agent", { startup: true });
+    await act(async () => { await result.current.refresh(); });
+    expect(agentGetThreadMock).toHaveBeenLastCalledWith("agent", undefined);
   });
 });

package/hooks/useAgentSession.ts

@@ -15,7 +15,7 @@ export function useAgentSession(
   const [error, setError] = useState<string | null>(null);
   const requestSeqRef = useRef(0);
 
-  const refresh = useCallback(async () => {
+  const refresh = useCallback(async (opts?: { startup?: boolean }) => {
     if (!agentId) {
       setThreadId(null);
       setError(null);
@@ -32,7 +32,9 @@ export function useAgentSession(
       // prefer it as long as it still belongs to this agent.
       if (preferredThreadId) {
         try {
-          const d = await api.threads.get(preferredThreadId, { limit: 1 });
+          const d = opts?.startup
+            ? await api.threads.get(preferredThreadId, { startup: true })
+            : await api.threads.metadata(preferredThreadId);
           if (mySeq !== requestSeqRef.current) return;
           if (d.agent_id === agentId) {
             setThreadId(preferredThreadId);
@@ -43,7 +45,7 @@ export function useAgentSession(
         }
       }
 
-      const t = await api.agents.getThread(agentId);
+      const t = await api.agents.getThread(agentId, opts);
       if (mySeq !== requestSeqRef.current) return;
       setThreadId(t.thread_id);
     } catch (err) {
@@ -70,7 +72,7 @@ export function useAgentSession(
       return;
     }
 
-    void refresh();
+    void refresh({ startup: true });
 
   }, [agentId, preferredThreadId, refresh]);
 

package/hooks/useUrlSync.test.ts

@@ -30,4 +30,17 @@ describe("useUrlSync contract", () => {
       replaceStateSpy.mockRestore();
     });
   });
+
+  it.each([
+    "/?tab=documents",
+    "/?tab=tools&item=documents",
+    "/?tab=tools&item=memory",
+  ])("routes legacy Knowledge URL %s to the Advanced Knowledge panel", async (url) => {
+    window.history.replaceState(null, "", url);
+    renderHook(() => useUrlSync(), { wrapper });
+
+    await waitFor(() => {
+      expect(window.location.search).toBe("?tab=memory");
+    });
+  });
 });

package/hooks/useUrlSync.ts

@@ -38,10 +38,6 @@ export function useUrlSync(): UnifiedHookResult<
       tab = "tools";
       item = "packages";
     }
-    if (tab === "documents" || tab === "memory") {
-      tab = "tools";
-      item = "memory";
-    }
     // Browser-extension "Open Jarela" passes ?agent=<id> (and optionally
     // ?thread=<id>) so the app lands on the user's currently-picked
     // target agent instead of whichever chat was last open. The agent

package/lib/agents/citation-checker.test.ts

@@ -27,11 +27,27 @@ afterAll(() => {
 });
 
 describe("normalizeSource", () => {
-  it("lowercases + strips query/fragment + trailing slash on URLs", () => {
-    expect(normalizeSource("HTTPS://Example.com/Docs/?x=1#a")).toBe("https://example.com/docs");
+  it("lowercases + strips tracking params, page anchors and trailing slash on URLs", () => {
+    expect(normalizeSource("HTTPS://Example.com/Docs/?utm_source=x&fbclid=y#a")).toBe("https://example.com/docs");
     expect(normalizeSource("https://a.io/p/")).toBe("https://a.io/p");
   });
 
+  it("keeps the query and hash route that identify a message permalink", () => {
+    const a = normalizeSource("https://outlook.office365.com/owa/?ItemID=AAMk%2BA%3D&exvsurl=1&viewmodel=ReadMessageItem");
+    const b = normalizeSource("https://outlook.office365.com/owa/?ItemID=AAMk%2BB%3D&exvsurl=1&viewmodel=ReadMessageItem");
+    expect(a).not.toBe(b);
+    // Base64 item ids are case-sensitive; folding case would merge distinct messages.
+    expect(a).toContain("ItemID=AAMk%2BA%3D");
+    expect(normalizeSource("https://mail.google.com/mail/u/0/#all/18c2f0a1b2c3d4e5"))
+      .toBe("https://mail.google.com/mail/u/0#all/18c2f0a1b2c3d4e5");
+    expect(normalizeSource("https://www.youtube.com/watch?v=dQw4w9WgXcQ&utm_medium=share"))
+      .toBe("https://www.youtube.com/watch?v=dQw4w9WgXcQ");
+  });
+
+  it("treats the same permalink with reordered params as one source", () => {
+    expect(normalizeSource("https://x.test/r?b=2&a=1")).toBe(normalizeSource("https://x.test/r?a=1&b=2&utm_campaign=z"));
+  });
+
   it("normalises backslashes and trailing slashes on paths", () => {
     expect(normalizeSource("docs\\Adr\\README.md")).toBe("docs/adr/readme.md");
     expect(normalizeSource("lib/agents/")).toBe("lib/agents");
@@ -137,6 +153,18 @@ describe("parseCitationVerdict", () => {
     expect(out).toEqual([{ text: "a", marker: null, link: null, verified: false, reason: "no link", impact: "med" }]);
   });
 
+  it("finds the verdict when the model wraps it in prose that also contains braces", () => {
+    const verdict = '{"claims":[{"text":"rate is 5%","marker":1,"verified":true,"reason":"in [1]","impact":"high"}]}';
+    const expected = [{ text: "rate is 5%", marker: 1, link: null, verified: true, reason: "in [1]", impact: "high" }];
+    expect(parseCitationVerdict(`Checked the {draft} reply. ${verdict}`)).toEqual(expected);
+    expect(parseCitationVerdict(`${verdict}\nNote: ignored the {code} block.`)).toEqual(expected);
+  });
+
+  it("keeps braces that belong to a claim string", () => {
+    const out = parseCitationVerdict('{"claims":[{"text":"set {a: 1} in config","verified":false,"reason":"} unmatched"}]}');
+    expect(out?.[0].text).toBe("set {a: 1} in config");
+    expect(out?.[0].reason).toBe("} unmatched");
+  });
   it("returns null on malformed JSON", () => {
     expect(parseCitationVerdict("{not json")).toBeNull();
   });
@@ -299,6 +327,16 @@ describe("mergeDeclaredReferences", () => {
     ]);
   });
 
+  it("keeps two declared emails that differ only by their permalink id", () => {
+    const out = mergeDeclaredReferences([], [
+      { label: "Invoice mail", href: "https://mail.google.com/mail/u/0/#all/18c2f0a1b2c3d4e5" },
+      { label: "Contract mail", href: "https://mail.google.com/mail/u/0/#all/18c2f0a1b2c3ffff" },
+      { label: "Board invite", href: "https://outlook.office365.com/owa/?ItemID=AAMk%2BA%3D&exvsurl=1" },
+      { label: "Offsite invite", href: "https://outlook.office365.com/owa/?ItemID=AAMk%2BB%3D&exvsurl=1" },
+    ]);
+    expect(out.map((e) => e.label)).toEqual(["Invoice mail", "Contract mail", "Board invite", "Offsite invite"]);
+  });
+
   it("returns a copy of the manifest unchanged when there are no declared refs", () => {
     const manifest = [{ n: 1, label: "x", href: "x" }];
     expect(mergeDeclaredReferences(manifest, [])).toEqual(manifest);