pi-weave 0.3.10 → 0.3.12

package/src/web/client/graph/Graph.tsx

@@ -51,6 +51,8 @@ import {
   SHEET_LABEL,
   SHEET_OPEN,
   SHEET_OPEN_SPLIT,
+  SPOTLIGHT_BY_AGENT,
+  SPOTLIGHT_BY_AGENT_HINT,
   SPOTLIGHT_CLEAR,
   SPOTLIGHT_CLEAR_HINT,
   SPOTLIGHT_LABEL,
@@ -126,6 +128,8 @@ export interface GraphProps {
    * They light alongside the spotlight's own matches; omitted means none.
    */
   found?: readonly string[];
+  /** Whether `query` is the agent's newest search rather than the person's (`trail.model.ts`'s `agentSpotlight`). */
+  byAgent?: boolean;
   /**
    * Where the spotlight field writes. **Its presence is what makes this the
    * full graph view**: with it the column shows the floating spotlight field
@@ -150,6 +154,18 @@ export function Graph(props: GraphProps) {
   // mount frames the *starting* positions, which a settling simulation then
   // pushes past the edges — a two-note vault opened with clipped circles.
   const fitted = useRef(false);
+  // A re-frame asked for while the layout was still moving, done when it rests.
+  const reframe = useRef(false);
+  /**
+   * Frame the graph for where it is shown: the full view fits everything, and
+   * the Context card's note graph opens on the open note and its neighbours,
+   * since you read it while on that note (`renderer.ts`'s `focus`).
+   */
+  const frame = useCallback(() => {
+    const { full: whole, model: shown } = live.current;
+    if (whole) renderer.current?.fit();
+    else renderer.current?.focus(shown.highlight);
+  }, []);
   /**
    * Arm the simulation clock — idempotent.
    *
@@ -167,9 +183,10 @@ export function Graph(props: GraphProps) {
       engine.tick();
       // Asleep: let the clock die. The next pin re-arms it.
       if (!engine.awake()) {
-        if (!fitted.current) {
+        if (!fitted.current || reframe.current) {
           fitted.current = true;
-          renderer.current?.fit();
+          reframe.current = false;
+          frame();
         }
         return;
       }
@@ -216,8 +233,8 @@ export function Graph(props: GraphProps) {
   // Read by the mount-time `onSelect`, which outlives this render.
   const trailRef = useRef<ReadonlyMap<string, TrailGlow>>(NO_GLOWS);
   trailRef.current = props.trail ?? NO_GLOWS;
-  const live = useRef({ view, model, picture, onSelect: props.onSelect, selectedId: props.selectedId });
-  live.current = { view, model, picture, onSelect: props.onSelect, selectedId: props.selectedId };
+  const live = useRef({ view, model, picture, full, onSelect: props.onSelect, selectedId: props.selectedId });
+  live.current = { view, model, picture, full, onSelect: props.onSelect, selectedId: props.selectedId };
 
   useEffect(() => {
     const instance = props.renderer(scheme);
@@ -316,6 +333,16 @@ export function Graph(props: GraphProps) {
     renderer.current?.setHighlight(picture.highlight, picture.selectedId, picture.style);
   }, [picture]);
 
+  // Re-frame when another note opens under the Context card's graph, or the
+  // graph moves between the card and the full view. A click in the full view
+  // leaves the camera where it is. Before the first layout rests, the settle
+  // frames it; while the layout is still moving, the frame waits for it.
+  useEffect(() => {
+    if (!fitted.current) return;
+    if (clock.current !== null) reframe.current = true;
+    else frame();
+  }, [full, full ? null : props.selectedId]);
+
   useEffect(() => {
     renderer.current?.setTrail(trailRef.current);
   }, [props.trail]);
@@ -347,6 +374,7 @@ export function Graph(props: GraphProps) {
             aria-label={SPOTLIGHT_LABEL} spellcheck={false} autoComplete="off" onInput={(event) => props.onQuery?.(event.currentTarget.value)} />
           {spot === null ? null : (
             <>
+              {props.byAgent === true ? <span class="weave-spotlight-by" title={SPOTLIGHT_BY_AGENT_HINT}>{SPOTLIGHT_BY_AGENT}</span> : null}
               <span class={`weave-spotlight-count${spot.count === 0 ? " weave-spotlight-none" : ""}`} role="status">{litLabel(spot.count)}</span>
               <button type="button" class="weave-spotlight-clear" title={SPOTLIGHT_CLEAR_HINT} aria-label={SPOTLIGHT_CLEAR_HINT}
                 onClick={() => { props.onQuery?.(""); field.current?.focus(); }}>{SPOTLIGHT_CLEAR}</button>

package/src/web/client/graph/graph.model.ts

@@ -545,6 +545,47 @@ export function frameBox(points: readonly Point[]): ViewBox | null {
   return { x: [minX - padding, maxX + padding], y: [minY - padding, maxY + padding] };
 }
 
+/** Where sigma's camera looks, in the unit square a {@link ViewBox} is normalized onto. */
+export interface CameraTarget {
+  readonly x: number;
+  readonly y: number;
+  /** Sigma's zoom: 1 shows the whole box, smaller is closer. */
+  readonly ratio: number;
+}
+
+/** Room a focus leaves around what it frames, as a multiple of its span. */
+export const FOCUS_MARGIN = 1.2;
+
+/** The smallest span a focus frames, so a note with no links is not blown up to fill the card. */
+export const FOCUS_MIN_SPAN = COLLIDE_RADIUS * 10;
+
+/**
+ * The camera that frames `points` in a view frozen on `box`.
+ *
+ * The Context card's note graph is read while you are on a note, so it opens
+ * on that note and its neighbours instead of the whole vault. This is the
+ * arithmetic. Sigma normalizes the box onto a unit square centred on 0.5 (its
+ * longer side becomes 1), and a camera ratio of 1 shows that whole square. So
+ * the camera's centre is the points' centre in that square, and its ratio is
+ * their padded span as a share of the box. Never above 1: a focus does not
+ * zoom out past the fit.
+ *
+ * `null` when there is nothing to frame: no box, or no finite point.
+ */
+export function focusCamera(box: ViewBox | null, points: readonly Point[]): CameraTarget | null {
+  const around = frameBox(points);
+  if (box === null || around === null) return null;
+  const extent = Math.max(box.x[1] - box.x[0], box.y[1] - box.y[0]);
+  const scale = extent > 0 && Number.isFinite(extent) ? extent : 1;
+  const span = Math.max(around.x[1] - around.x[0], around.y[1] - around.y[0], FOCUS_MIN_SPAN);
+  const centre = (range: readonly [number, number]): number => (range[0] + range[1]) / 2;
+  return {
+    x: 0.5 + (centre(around.x) - centre(box.x)) / scale,
+    y: 0.5 + (centre(around.y) - centre(box.y)) / scale,
+    ratio: Math.min(1, (span * FOCUS_MARGIN) / scale),
+  };
+}
+
 /** The empty graph. What the column renders before the first payload lands. */
 export const EMPTY_RENDER_GRAPH: RenderGraph = { nodes: [], edges: [] };
 

package/src/web/client/graph/renderer.ts

@@ -1,7 +1,7 @@
 import type { GraphTheme } from "../../shared/themes";
 import type { Point } from "../../shared/layout";
-import type { EdgeDisplayOverride, GraphSettings, HighlightStyle, NodeDisplayOverride, RenderEdge, RenderGraph, RenderNode, TrailGlow, ViewBox } from "./graph.model";
-import { edgeReducer, fadeStep, frameBox, graphSettings, labelThreshold, nodeReducer, trailOverride } from "./graph.model";
+import type { CameraTarget, EdgeDisplayOverride, GraphSettings, HighlightStyle, NodeDisplayOverride, RenderEdge, RenderGraph, RenderNode, TrailGlow, ViewBox } from "./graph.model";
+import { edgeReducer, fadeStep, focusCamera, frameBox, graphSettings, labelThreshold, nodeReducer, trailOverride } from "./graph.model";
 import type { ProjectedGraph } from "./project";
 import { positionsOf, project, syncPositions } from "./project";
 
@@ -68,7 +68,7 @@ export interface SigmaLike {
    */
   setCustomBBox(box: ViewBox | null): unknown;
   refresh(): unknown;
-  getCamera(): { animatedReset(): Promise<void> };
+  getCamera(): { animatedReset(): Promise<void>; animate(state: CameraTarget): Promise<void> };
   kill(): void;
 }
 
@@ -169,6 +169,20 @@ export function sigmaRenderer(
   /** The box to freeze the view on, from the graph's *current* positions. */
   const boxOf = (): ViewBox | null => frameBox([...positionsOf(graph).values()]);
 
+  /**
+   * Repaint once a camera move lands. Sigma leaves edges out of frames drawn
+   * while the camera moves (`hideEdgesOnMove`) and repaints when the camera
+   * changes; a move onto where the camera already is changes nothing, so the
+   * frame drawn during it, without edges, stayed on screen until something
+   * else repainted. A renderer destroyed mid-move paints nothing, and a
+   * rejection from a camera killed mid-flight is noise.
+   */
+  const settle = (instance: SigmaLike, move: Promise<void>): void => {
+    move.then(() => {
+      if (sigma === instance) instance.refresh();
+    }, () => {});
+  };
+
   /**
    * Push the current highlight into sigma's reducers (§7.4).
    *
@@ -346,14 +360,24 @@ export function sigmaRenderer(
       const instance = sigma;
       if (instance === null) return;
       instance.setCustomBBox(boxOf());
-      // Sigma leaves edges out of frames drawn while the camera moves
-      // (`hideEdgesOnMove`) and repaints when the camera changes. A reset onto
-      // where the camera already is changes nothing, so the frame drawn during
-      // it, without edges, stayed on screen until something else repainted.
-      // One refresh once it settles draws them back.
-      instance.getCamera().animatedReset().then(() => {
-        if (sigma === instance) instance.refresh();
-      }, () => {});
+      settle(instance, instance.getCamera().animatedReset());
+    },
+
+    /**
+     * Frame these nodes instead of the whole graph — the Context card's note
+     * graph opening on the note you are reading (`focusCamera`). Re-frames on
+     * the current positions first, like `fit`, so the camera and the box
+     * agree. Nothing to frame (`null`, or no drawn node among `ids`) is a fit.
+     */
+    focus(ids: ReadonlySet<string> | null) {
+      const instance = sigma;
+      if (instance === null) return;
+      const box = boxOf();
+      const at = positionsOf(graph);
+      const points = [...(ids ?? [])].flatMap((id) => at.get(id) ?? []);
+      const target = focusCamera(box, points);
+      instance.setCustomBBox(box);
+      settle(instance, target === null ? instance.getCamera().animatedReset() : instance.getCamera().animate(target));
     },
 
     positions() {

package/src/web/client/graph/spotlight.model.ts

@@ -47,6 +47,10 @@ export const SPOTLIGHT_LABEL = "Light up in graph";
 export const SPOTLIGHT_CLEAR = "Esc";
 export const SPOTLIGHT_CLEAR_HINT = "Clear the spotlight (Esc)";
 
+/** The tag on the field while it shows the agent's newest search, and its hint. */
+export const SPOTLIGHT_BY_AGENT = "agent";
+export const SPOTLIGHT_BY_AGENT_HINT = "Your agent searched for this. Type to light up something else.";
+
 /** The legend while a spotlight is up, replacing the neighbourhood's. */
 export const SPOTLIGHT_LEGEND = { lit: "lit", dimmed: "not lit" } as const;
 

package/src/web/client/shell/Shell.tsx

@@ -20,7 +20,7 @@ import type { WorkspaceHandle } from "../workspace";
 import { ContextRail } from "./ContextRail";
 import { contextCount, contextModel } from "../context/context.model";
 import { startTrailPoll } from "../trail/trail";
-import { TRAIL_TICK_MS, trailLive, trailMarks, trailTurns } from "../trail/trail.model";
+import { TRAIL_TICK_MS, agentSearch, agentSpotlight, trailLive, trailMarks, trailTurns } from "../trail/trail.model";
 import type { TrailReplay } from "../trail/trail.model";
 import { ResizeHandle } from "./ResizeHandle";
 import { deeplinkSelection, formatHash } from "./deeplink.model";
@@ -142,6 +142,9 @@ export function Shell(props: ShellProps) {
   // What the search palette listed when it lit the graph up, for that query.
   // Typing a different query in the spotlight leaves these behind.
   const [graphFound, setGraphFound] = useState<{ query: string; ids: readonly string[] } | null>(null);
+  // The agent search the spotlight is showing (its trail `seq`), or `null`
+  // when the spotlight is the person's — see `agentSpotlight`.
+  const [agentLit, setAgentLit] = useState<number | null>(null);
   const draggedTab = useRef<string | null>(null);
   const [dropTab, setDropTab] = useState<{ paneId: string; before: string | null } | null>(null);
   const [dropPane, setDropPane] = useState<string | null>(null);
@@ -228,8 +231,10 @@ export function Shell(props: ShellProps) {
   const lightUp = (query: string, ids: readonly string[] = []): void => {
     setGraphQuery(query);
     setGraphFound({ query, ids });
+    setAgentLit(null);
     showGraph();
   };
+  const typeSpotlight = (query: string): void => { setGraphQuery(query); setAgentLit(null); };
   live.current = { layout, overlay, selectedId, graphPreviewId, select };
   const mayMutate = (slugs: readonly string[]): boolean => mayMutateDrafts(drafts, slugs, () => window.confirm("Discard unsaved changes to the affected notes before changing files?"));
   const save: SaveNote = async (slug, body, options) => {
@@ -323,6 +328,17 @@ export function Shell(props: ShellProps) {
   }, [trailGlowing]);
   const glows = useMemo(() => trailMarks(trail, trailNow, replay), [trail, trailNow, replay]);
   const turns = useMemo(() => trailTurns(trail, data.graph), [trail, data.graph]);
+  // The agent's searches light up in the graph view's spotlight, like the
+  // palette's "light up in graph", without switching to the graph.
+  const search = useMemo(() => agentSearch(trail), [trail]);
+  useEffect(() => {
+    const composing = graphQuery.trim() !== "" && document.activeElement?.classList.contains("weave-spotlight-input") === true;
+    const next = agentSpotlight(agentLit, search, composing);
+    if (next === null) return;
+    setGraphQuery(next.query);
+    setGraphFound({ query: next.query, ids: next.ids });
+    setAgentLit(next.agent);
+  }, [search?.seq]);
   // A floating card stays out of the way when it has nothing to say (no
   // selection, no agent turn), and over the graph, whose own sheet is its context.
   const coveredPane = layout.split === "down" ? layout.panes[0] : layout.panes.at(-1);
@@ -514,7 +530,7 @@ export function Shell(props: ShellProps) {
       </nav>
       <div class="weave-sidebar-dock weave-notes-dock" data-open={layout.treeVisible} inert={!layout.treeVisible} aria-hidden={!layout.treeVisible} style={{ "--weave-sidebar-width": `${Math.min(layout.treeWidth, width - 90)}px` }}><aside class="weave-sidebar weave-sidebar-notes" aria-label="Notes sidebar">
         <div class="weave-sidebar-heading"><button type="button" aria-pressed={!recentMode} onClick={() => setRecentMode(false)}>Files</button><button type="button" aria-pressed={recentMode} onClick={() => setRecentMode(true)}>Recent</button><button type="button" aria-label="Hide notes sidebar" onClick={() => { root.current?.querySelector<HTMLButtonElement>('[aria-label="Toggle notes sidebar"]')?.focus(); setLayout({ ...layout, treeVisible: false }); }}>«</button></div>
-        {recentMode ? <RecentList visits={visits} graph={data.graph} selectedId={selectedId} onSelect={select} /> : <Tree graph={data.graph} selectedId={selectedId} recentIds={data.recentIds} trail={glows} onSelect={(id, newTab, keepSidebar) => select(id, newTab, layout.activePane, keepSidebar)} onMutate={mayMutate} onRefresh={() => workspace.current?.refresh()} now={now} />}
+        {recentMode ? <RecentList visits={visits} graph={data.graph} selectedId={selectedId} onSelect={select} /> : <Tree graph={data.graph} selectedId={selectedId} recentIds={data.recentIds} onSelect={(id, newTab, keepSidebar) => select(id, newTab, layout.activePane, keepSidebar)} onMutate={mayMutate} onRefresh={() => workspace.current?.refresh()} now={now} />}
         <div class="weave-vault-label"><span>Workspace</span><strong title={props.cwd}>{props.cwd.split(/[\\/]/).filter(Boolean).pop() ?? "Weave"}</strong></div>
       </aside><ResizeHandle label="Resize notes sidebar" min={180} max={420} value={layout.treeWidth} onChange={(delta) => setLayout((value) => ({ ...value, treeWidth: Math.max(180, Math.min(420, value.treeWidth + delta)) }))} /></div>
       <main class={`weave-panes weave-split-${layout.split}`} style={layout.panes.length === 2 && width >= 850 ? { [layout.split === "right" ? "gridTemplateColumns" : "gridTemplateRows"]: `minmax(0, ${layout.ratio}fr) 4px minmax(0, ${1 - layout.ratio}fr)` } : {}}>
@@ -535,7 +551,7 @@ export function Shell(props: ShellProps) {
         aria-hidden={!graphVisible} inert={!graphVisible} role={contextGraphActive ? "region" : undefined} aria-label={contextGraphActive ? "Note graph" : undefined}
         style={{ ...graphBox, visibility: graphVisible ? "visible" : "hidden", pointerEvents: graphVisible ? "auto" : "none" }}>
         <Graph graph={data.graph} selectedId={selectedId} previewId={graphPreviewId} onSelect={selectGraph} onOpen={openGraphNode} renderer={createSigmaRenderer} storage={localStorage} host={window} scheme={graphTheme} forces={layout.preferences.forces} groupColors={layout.preferences.groupColors} bootFailed={data.graphFailed} fit={fit} trail={glows}
-          {...(contextGraphActive ? {} : { query: graphQuery, ...(graphFound?.query === graphQuery ? { found: graphFound.ids } : {}), onQuery: setGraphQuery, onOpenSplit: openGraphNodeInSplit })} now={now} />
+          {...(contextGraphActive ? {} : { query: graphQuery, ...(graphFound?.query === graphQuery ? { found: graphFound.ids } : {}), byAgent: agentLit !== null, onQuery: typeSpotlight, onOpenSplit: openGraphNodeInSplit })} now={now} />
       </div> : null}
     </div>
     <div class="weave-footer"><StatusBar model={statusBarModel(props.cwd, selectedId, searchShortcut(looksApple(props.platform)))} />

package/src/web/client/shell/icons.model.ts

@@ -131,7 +131,7 @@ export const ICONS: Readonly<Record<IconName, IconDef>> = {
   /** An open loop with its arrowhead. */
   refresh: { d: ["M13 8a5 5 0 1 1-1.5-3.55", "M13 2.75V5.5h-2.75"], filled: false },
   /** A hub with eight spokes. */
-  settings: { d: ["M10 8a2 2 0 1 1-4 0a2 2 0 1 1 4 0Z", "M8 1.75v1.5M8 12.75v1.5M1.75 8h1.5M12.75 8h1.5M3.6 3.6l1.05 1.05M11.35 11.35l1.05 1.05M3.6 12.4l1.05-1.05M11.35 4.65l1.05-1.05"], filled: false },
+  settings: { d: ["M6.50 3.65L6.89 1.70L9.11 1.70L9.50 3.65A4.6 4.6 0 0 1 11.02 4.53L12.90 3.89L14.01 5.81L12.52 7.12A4.6 4.6 0 0 1 12.52 8.88L14.01 10.19L12.90 12.11L11.02 11.47A4.6 4.6 0 0 1 9.50 12.35L9.11 14.30L6.89 14.30L6.50 12.35A4.6 4.6 0 0 1 4.98 11.47L3.10 12.11L1.99 10.19L3.48 8.88A4.6 4.6 0 0 1 3.48 7.12L1.99 5.81L3.10 3.89L4.98 4.53A4.6 4.6 0 0 1 6.50 3.65Z", "M10 8a2 2 0 1 1-4 0a2 2 0 1 1 4 0Z"], filled: false },
   /** A light theme. */
   sun: { d: ["M10.5 8a2.5 2.5 0 1 1-5 0a2.5 2.5 0 1 1 5 0Z", "M8 1.75V3M8 13v1.25M1.75 8H3M13 8h1.25M3.6 3.6l.9.9M11.5 11.5l.9.9M3.6 12.4l.9-.9M11.5 4.5l.9-.9"], filled: false },
   /** A dark theme. */

package/src/web/client/shell/theme.ts

@@ -164,7 +164,11 @@ body{font-size:var(--weave-px-base)}
    provenance glyph shape carries the distinction the colour swap drops;
    elsewhere the hues are unaffected. The palette's hit rows need the same
    remap: same selected ground, same failure. The label is restated last
-   so the selected row is always readable. */
+   so the selected row is always readable. The ground itself is the Context
+   rail's selection: the --weave-new tint plus a 2px inset accent bar, kept
+   under the pointer too. It is the only tinted row: the tree is where you
+   are, not what the agent touched (the graph shows that). */
+.weave-row-on,.weave-row-on:hover{background:var(--weave-new);box-shadow:inset 2px 0 0 var(--weave-accent)}
 .weave-row-on .weave-twisty,.weave-row-on .weave-kind,.weave-row-on .weave-prov,
 .weave-row-on .weave-meta,.weave-row-on .weave-label{color:var(--weave-fg)}
 .weave-hit-on .weave-hit-icon,.weave-hit-on .weave-hit-detail,.weave-hit-on .weave-hit-meta{color:var(--weave-fg)}
@@ -179,16 +183,6 @@ body{font-size:var(--weave-px-base)}
   40%{font-weight:700}
   100%{background:transparent;font-weight:400}
 }
-/* Recall trail (issue #78): a note the agent searched, read or wrote. The
-   tint follows the graph's palette for the same kinds (warn → ok → accent)
-   and steps down through three strength buckets as the glow fades. */
-.weave-row-trail{--weave-trail:var(--weave-warn);box-shadow:inset 2px 0 0 color-mix(in srgb,var(--weave-trail) var(--weave-trail-mix),transparent);background:color-mix(in srgb,var(--weave-trail) calc(var(--weave-trail-mix) / 6),transparent)}
-.weave-row-trail-read{--weave-trail:var(--weave-ok)}
-.weave-row-trail-wrote{--weave-trail:var(--weave-accent)}
-.weave-row-trail-3{--weave-trail-mix:90%}
-.weave-row-trail-2{--weave-trail-mix:55%}
-.weave-row-trail-1{--weave-trail-mix:25%}
-.weave-row-trail-wrote.weave-row-trail-3 .weave-label{font-weight:600}
 .weave-twisty{width:16px;height:16px;flex:none;display:inline-flex;align-items:center;justify-content:center;color:var(--weave-faint);cursor:pointer}
 .weave-kind{flex:none;color:var(--weave-faint);font-size:var(--weave-px-ui)}
 .weave-prov{flex:none;font-size:var(--weave-px-prov)}
@@ -602,6 +596,7 @@ body{font-size:var(--weave-px-base)}
   color:var(--weave-warn);background:color-mix(in srgb,var(--weave-warn) 16%,transparent);border-radius:999px;
 }
 .weave-spotlight-none{color:var(--weave-dim);background:var(--weave-line)}
+.weave-spotlight-by{flex:none;font-size:var(--weave-px-caption);color:var(--weave-dim);white-space:nowrap}
 .weave-spotlight .weave-spotlight-clear{
   flex:none;padding:1px 5px;cursor:pointer;font-family:var(--weave-mono);font-size:var(--weave-px-prov);
   color:var(--weave-faint);background:transparent;border:1px solid var(--weave-line-strong);border-radius:var(--weave-radius);
@@ -693,9 +688,8 @@ body{font-size:var(--weave-px-base)}
 .weave-trail{padding-top:6px;padding-bottom:6px;border-bottom:1px solid var(--weave-line)}
 .weave-trail-head{display:flex;align-items:center;gap:6px;font-size:var(--weave-px-caption);font-weight:600;letter-spacing:.09em;color:var(--weave-faint);text-transform:uppercase}
 .weave-trail-head .weave-ctx-count{margin-left:0}
-.weave-trail-replay,.weave-trail-turn{font:inherit;font-size:var(--weave-px-caption);letter-spacing:0;text-transform:none;color:var(--weave-dim);background:none;border:1px solid var(--weave-line);border-radius:var(--weave-radius);padding:0 6px;cursor:pointer}
-.weave-trail-replay{margin-left:auto}
-.weave-trail-replay:hover,.weave-trail-turn:hover{color:var(--weave-fg)}
+.weave-trail-turn{font:inherit;font-size:var(--weave-px-caption);letter-spacing:0;text-transform:none;color:var(--weave-dim);background:none;border:1px solid var(--weave-line);border-radius:var(--weave-radius);padding:0 6px;cursor:pointer}
+.weave-trail-turn:hover{color:var(--weave-fg)}
 .weave-trail-turn-on{color:var(--weave-accent);border-color:var(--weave-accent)}
 .weave-trail-steps{margin:4px 0 0;padding:0;list-style:none;display:flex;flex-direction:column;gap:2px}
 .weave-trail-step{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px;padding-left:10px;position:relative;line-height:1.45}

package/src/web/client/trail/TrailStrip.tsx

@@ -27,7 +27,6 @@ export function TrailStrip(props: TrailStripProps) {
       <h4 class="weave-ctx-head weave-trail-head">
         <span class="weave-trail-title">{turnHeading(shown, shown === latest)}</span>
         <span class="weave-ctx-count" title="Notes read or written">{shown.used}</span>
-        {shown.steps.length === 0 ? null : <button type="button" class="weave-trail-replay" title="Replay this turn's glow" onClick={() => props.onReplay(shown.turn)}>Replay</button>}
       </h4>
       {shown.steps.length === 0 ? <p class="weave-trail-empty">{TRAIL_EMPTY_TURN}</p> : null}
       <ol class="weave-trail-steps">

package/src/web/client/trail/trail.model.ts

@@ -9,6 +9,8 @@
  *    steps one after another from the moment it was clicked.
  *  - {@link trailTurns}: the "This turn" strip — each turn's steps in order,
  *    worded as `searched "auth" → read Auth migration → appended Auth migration`.
+ *  - {@link agentSearch}: the agent's newest search this turn, which the
+ *    graph view lights up in its spotlight ({@link agentSpotlight}).
  *
  * Pure, DOM-free and clock-free (every function takes `now`), like the other
  * `*.model.ts` files, so the whole feature is covered by unit tests.
@@ -179,17 +181,70 @@ export function trailTurns(trail: TrailPayload | null, graph: GraphPayload | nul
   return views.slice(0, TRAIL_TURNS_SHOWN);
 }
 
-/** The strip's heading for a turn: the latest is "This turn", older ones are their time. */
 /** What the strip says for a turn with no steps yet. */
 export const TRAIL_EMPTY_TURN = "Nothing recalled yet.";
 
+/** The strip's heading for a turn: the latest is "This turn", older ones are their time. */
 export function turnHeading(view: TrailTurnView, latest: boolean): string {
   return latest ? "This turn" : view.time === "" ? `Turn ${view.turn}` : view.time;
 }
 
-/** The tree row's class for a glow, or `""`. Strength is bucketed so the class list stays small. */
-export function trailRowClass(mark: TrailMark | undefined): string {
-  if (mark === undefined) return "";
-  const level = mark.strength > 0.66 ? 3 : mark.strength > 0.33 ? 2 : 1;
-  return ` weave-row-trail weave-row-trail-${mark.kind} weave-row-trail-${level}`;
+// --- the agent's search in the graph view's spotlight ----------------------------------
+
+/** The agent's newest search this turn: what the graph view's spotlight lights. */
+export interface AgentSearch {
+  /** The event's `seq`, so a new search is a new number even for the same words. */
+  seq: number;
+  query: string;
+  /** The notes the search returned, as node ids. */
+  ids: readonly string[];
+}
+
+/**
+ * The agent's newest search in the current turn, or `null`.
+ *
+ * Only the current turn counts, so the spotlight a search lit goes out when
+ * the agent moves on to the next request. A search with no words (the wire
+ * allows one) has nothing to spell in the field and is skipped.
+ */
+export function agentSearch(trail: TrailPayload | null): AgentSearch | null {
+  if (trail === null) return null;
+  for (let index = trail.events.length - 1; index >= 0; index--) {
+    const event = trail.events[index]!;
+    if (event.turn !== trail.turn) return null;
+    if (event.kind !== "searched" || event.query === undefined || event.query.trim() === "") continue;
+    return { seq: event.seq, query: event.query, ids: event.slugs.map((slug) => `note:${slug}`) };
+  }
+  return null;
+}
+
+/** What the spotlight becomes: its query, the ids lit alongside, and the agent search that set it (`null`: the person's). */
+export interface AgentSpotlight {
+  query: string;
+  ids: readonly string[];
+  agent: number | null;
+}
+
+/**
+ * How the graph view's spotlight follows the agent's searches, when
+ * {@link agentSearch} changes. `null` leaves the spotlight alone.
+ *
+ * A new search takes the spotlight over, the way the palette's "light up in
+ * graph" does, unless the person is in the middle of a query of their own:
+ * the field focused with words they typed. A focused field that is empty, or
+ * still shows an earlier agent search, is not theirs and follows along, so a
+ * field left focused never swallows a search. When the turn that searched is
+ * over, the spotlight it lit goes out, unless the person has made it theirs
+ * since by typing or lighting something up.
+ */
+export function agentSpotlight(
+  /** The `seq` of the agent search the spotlight shows now, or `null` when it is the person's (or empty). */
+  shown: number | null,
+  search: AgentSearch | null,
+  /** Whether the field has focus and holds words; `shown` says whose words they are. */
+  composing: boolean,
+): AgentSpotlight | null {
+  if (search === null) return shown === null ? null : { query: "", ids: [], agent: null };
+  if (search.seq === shown || (composing && shown === null)) return null;
+  return { query: search.query, ids: search.ids, agent: search.seq };
 }

package/src/web/client/tree/Tree.tsx

@@ -1,7 +1,5 @@
 /** The vault and repository tree column. */
 
-import type { TrailMark } from "../trail/trail.model";
-import { trailRowClass } from "../trail/trail.model";
 import { NOTE_DRAG_TYPE } from "../shell/shell.model";
 import { useLayoutEffect, useRef, useState } from "preact/hooks";
 import { createFolder, deleteFolder, deleteNote, moveNote, renameFolder, renameNote } from "../api";
@@ -48,8 +46,6 @@ export interface TreeProps {
   graph: GraphPayload | null;
   selectedId: string | null;
   recentIds: ReadonlySet<string>;
-  /** Recall-trail glows by row id (`trail/trail.model.ts`). */
-  trail?: ReadonlyMap<string, TrailMark>;
   onSelect: (id: string, newTab?: boolean, keepSidebar?: boolean) => void;
   /**
    * Ask before a mutation that would invalidate an open draft. `false` means
@@ -80,13 +76,13 @@ export function Icon({ name, class: className }: { name: IconName; class?: strin
   );
 }
 
-function Row({ view, recentIds, trail, edit, onEdit, onRename, onSelect, onToggle, onMenu, onDrop }: { view: ReturnType<typeof rowViews>[number]; recentIds: ReadonlySet<string>; trail: TrailMark | undefined; edit: string | null; onEdit: (value: string) => void; onRename: (value: string | null) => void; onSelect: (newTab: boolean) => void; onToggle: () => void; onMenu: (x: number, y: number) => void; onDrop: (id: string) => void }) {
+function Row({ view, recentIds, edit, onEdit, onRename, onSelect, onToggle, onMenu, onDrop }: { view: ReturnType<typeof rowViews>[number]; recentIds: ReadonlySet<string>; edit: string | null; onEdit: (value: string) => void; onRename: (value: string | null) => void; onSelect: (newTab: boolean) => void; onToggle: () => void; onMenu: (x: number, y: number) => void; onDrop: (id: string) => void }) {
   const folder = dropFolder(view.id);
   return (
     <li
       id={view.domId}
       data-row-id={view.id}
-      class={`weave-row weave-row-${view.kind}${view.selected ? " weave-row-on" : ""}${recentIds.has(view.id) ? " weave-row-new" : ""}${trailRowClass(trail)}`}
+      class={`weave-row weave-row-${view.kind}${view.selected ? " weave-row-on" : ""}${recentIds.has(view.id) ? " weave-row-new" : ""}`}
       role="treeitem"
       aria-level={view.level}
       aria-posinset={view.posinset}
@@ -301,7 +297,7 @@ export function Tree(props: TreeProps) {
             setMenu({ id: "vault", label: "Vault", x: event.clientX, y: event.clientY });
           }}
         >
-          {rowViews(rows, props.selectedId, props.now).map((view) => <Row key={view.id} view={view} recentIds={props.recentIds} trail={props.trail?.get(view.id)} edit={editing?.id === view.id ? editing.value : null} onEdit={(value) => setEditing((current) => current === null ? null : { ...current, value })} onRename={commitEdit} onSelect={(newTab) => { props.onSelect(view.id, newTab); if (view.hasKids) setState((current) => toggleExpanded(current, view.id)); }} onToggle={() => setState(toggleExpanded(state, view.id))} onMenu={(x, y) => setMenu({ id: view.id, label: view.label, x, y })} onDrop={(dragged) => { const folder = dropFolder(view.id); if (dragged.startsWith("note:") && folder !== undefined) { const target = mutableTreeRow(dragged); if (target !== null && !props.onMutate(affectedNoteSlugs(props.graph, target))) return; void run(moveNote(fetchJson, dragged.slice("note:".length), folder)); } }} />)}
+          {rowViews(rows, props.selectedId, props.now).map((view) => <Row key={view.id} view={view} recentIds={props.recentIds} edit={editing?.id === view.id ? editing.value : null} onEdit={(value) => setEditing((current) => current === null ? null : { ...current, value })} onRename={commitEdit} onSelect={(newTab) => { props.onSelect(view.id, newTab); if (view.hasKids) setState((current) => toggleExpanded(current, view.id)); }} onToggle={() => setState(toggleExpanded(state, view.id))} onMenu={(x, y) => setMenu({ id: view.id, label: view.label, x, y })} onDrop={(dragged) => { const folder = dropFolder(view.id); if (dragged.startsWith("note:") && folder !== undefined) { const target = mutableTreeRow(dragged); if (target !== null && !props.onMutate(affectedNoteSlugs(props.graph, target))) return; void run(moveNote(fetchJson, dragged.slice("note:".length), folder)); } }} />)}
         </ul>
       ) : <p class="weave-tree-empty">{empty}</p>}
       <p class="weave-tree-count">{rowCountLabel(rows)}</p>