pi-weave 0.1.8 → 0.1.9

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

@@ -94,6 +94,12 @@ export interface GraphRenderer {
   fit(): void;
   /** Current positions, for warm-starting a re-run. */
   positions(): Map<string, Point>;
+  /** Called when the user starts dragging a node. */
+  onDragStart(handler: (id: string) => void): void;
+  /** Called with graph-space coordinates while a node is dragged. */
+  onDragMove(handler: (id: string, at: Point) => void): void;
+  /** Called when a node drag ends. */
+  onDragEnd(handler: (id: string) => void): void;
   /** Tear down. Idempotent, and must leave no listener behind. */
   destroy(): void;
 }
@@ -130,6 +136,9 @@ export function nullRenderer(): GraphRenderer {
     setHighlight() {},
     onSelect() {},
     fit() {},
+    onDragStart() {},
+    onDragMove() {},
+    onDragEnd() {},
     positions() {
       return new Map();
     },
@@ -174,8 +183,13 @@ export interface CameraLike {
 export interface SigmaLike {
   on(event: "clickNode", handler: (payload: { node: string }) => void): unknown;
   on(event: "clickStage", handler: () => void): unknown;
+  on(event: "downNode", handler: (payload: { node: string }) => void): unknown;
+  on(event: "moveBody", handler: (payload: { event: { x: number; y: number }; preventSigmaDefault(): void }) => void): unknown;
+  on(event: "upNode" | "upStage", handler: () => void): unknown;
+  viewportToGraph(position: { x: number; y: number }): Point;
   setSetting(key: "nodeReducer", value: (id: string, data: RenderNode) => NodeDisplayOverride): unknown;
   setSetting(key: "edgeReducer", value: (key: string, data: RenderEdge) => EdgeDisplayOverride): unknown;
+  setSetting(key: "enableCameraPanning", value: boolean): unknown;
   setGraph(graph: ProjectedGraph): unknown;
   refresh(): unknown;
   getCamera(): CameraLike;
@@ -212,6 +226,21 @@ export function sigmaRenderer(create: SigmaFactory, scheme: ColorScheme): GraphR
   let graph: ProjectedGraph = project({ nodes: [], edges: [] });
   let highlight: ReadonlySet<string> | null = null;
   let select: (id: string | null) => void = () => {};
+  let dragStart: (id: string) => void = () => {};
+  let dragMove: (id: string, at: Point) => void = () => {};
+  let dragEnd: (id: string) => void = () => {};
+  let dragging: string | null = null;
+
+  const endDrag = (id: string | null): void => {
+    if (dragging === null) return;
+    const current = dragging;
+    dragging = null;
+    // A node drag is a pin, not a pan: sigma's captor would otherwise move the
+    // camera on the same gesture that is moving the node, and the node would
+    // slide away from the cursor. Re-enable panning only when the drag ends.
+    sigma?.setSetting("enableCameraPanning", true);
+    if (id === null || id === current) dragEnd(current);
+  };
 
   /**
    * Push the current highlight into sigma's reducers (§7.4).
@@ -236,6 +265,26 @@ export function sigmaRenderer(create: SigmaFactory, scheme: ColorScheme): GraphR
       // the tree and the context rail all recompute from it.
       instance.on("clickNode", ({ node }) => select(node));
       instance.on("clickStage", () => select(null));
+      instance.on("downNode", ({ node }) => {
+        dragging = node;
+        // Hold the view still while the node follows the cursor (see endDrag).
+        sigma?.setSetting("enableCameraPanning", false);
+        dragStart(node);
+      });
+      instance.on("moveBody", (payload) => {
+        if (dragging !== null) {
+          // Sigma's captor pans the camera on every mouse move while the
+          // button is down; during a node drag that is the pan the gesture
+          // must not be. `preventSigmaDefault` is the captor's own gate — it
+          // is consulted right after this handler returns — and without it
+          // the camera follows the cursor 1:1 while the pin follows it too,
+          // so the node appears to slide away under the view.
+          payload.preventSigmaDefault();
+          dragMove(dragging, instance.viewportToGraph({ x: payload.event.x, y: payload.event.y }));
+        }
+      });
+      instance.on("upNode", () => endDrag(dragging));
+      instance.on("upStage", () => endDrag(null));
       applyReducers(instance);
       sigma = instance;
     },
@@ -261,6 +310,18 @@ export function sigmaRenderer(create: SigmaFactory, scheme: ColorScheme): GraphR
       select = handler;
     },
 
+    onDragStart(handler) {
+      dragStart = handler;
+    },
+
+    onDragMove(handler) {
+      dragMove = handler;
+    },
+
+    onDragEnd(handler) {
+      dragEnd = handler;
+    },
+
     fit() {
       // `animatedReset` settles when the animation ends. Nothing awaits a
       // camera move, and a rejection from a camera killed mid-flight is noise.
@@ -270,7 +331,6 @@ export function sigmaRenderer(create: SigmaFactory, scheme: ColorScheme): GraphR
     positions() {
       return positionsOf(graph);
     },
-
     destroy() {
       sigma?.kill();
       sigma = null;

package/src/web/client/selection.storage.ts

@@ -0,0 +1,69 @@
+/**
+ * selection.storage.ts — the §1.3 context bus's memory across reloads.
+ *
+ * A manual refresh used to drop the open note: `selectedId` is a Preact
+ * signal, and signals do not survive a page load. The layout already
+ * persists (`shell/layout.model.ts`), and this is the same trick for the
+ * one piece of selection state the user actually misses: which note they
+ * were reading.
+ *
+ * ## Restore needs the graph
+ *
+ * A saved id is only offered back if it still names a node of the freshly
+ * loaded graph — a note deleted in another window must not resurrect as a
+ * selection pointing at nothing. That check needs the graph, which arrives
+ * after mount, so the restore is deliberately a pure function of
+ * `(graph, storage)` the shell calls once the first graph lands, not
+ * something this module schedules itself.
+ *
+ * ## Tier rules (§2)
+ *
+ * `src/web/client/**`: storage arrives as a two-method port (same shape as
+ * `LayoutStorage`) rather than the global, because the real `localStorage`
+ * throws in partitioned-storage contexts and a module this small should be
+ * testable without a DOM.
+ */
+
+import type { GraphPayload } from "../shared/wire";
+
+/** The slice of `Storage` this module needs. */
+export interface SelectionStorage {
+  getItem(key: string): string | null;
+  setItem(key: string, value: string): void;
+}
+
+/** Versioned like `pi-weave.layout.v1`: an id-shape change gets a new key. */
+export const SELECTION_STORAGE_KEY = "pi-weave.selection.v1";
+
+/**
+ * Remember the selection; an empty string records "nothing open".
+ * Reports failure as `false` instead of throwing — a quota or
+ * partitioned-storage error must never break a selection.
+ */
+export function saveSelection(storage: SelectionStorage, id: string | null): boolean {
+  try {
+    storage.setItem(SELECTION_STORAGE_KEY, id ?? "");
+    return true;
+  } catch {
+    return false;
+  }
+}
+
+/**
+ * The saved selection to restore, or `null`.
+ *
+ * `graph` gates the offer: the id must still name a node of the current
+ * payload, so a note deleted elsewhere is quietly not restored. Reads are
+ * failure-absorbing for the same reason writes are.
+ */
+export function restoreSelection(graph: GraphPayload | null, storage: SelectionStorage): string | null {
+  if (graph === null) return null;
+  let raw: string | null;
+  try {
+    raw = storage.getItem(SELECTION_STORAGE_KEY);
+  } catch {
+    return null;
+  }
+  if (raw === null || raw === "") return null;
+  return graph.model.nodes.some((node) => node.id === raw) ? raw : null;
+}

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

@@ -13,6 +13,7 @@
  * opened would be a worse lie than the disabled version it replaced.
  */
 
+import { LOGO_MARK_B64, LOGO_MARK_MIME } from "../../shared/logo";
 import type { ConnectionView, HeaderSummary } from "./shell.model";
 import { SEARCH_PLACEHOLDER, searchHint, summaryParts } from "./shell.model";
 
@@ -28,7 +29,16 @@ export interface HeaderProps {
 export function Header(props: HeaderProps) {
   return (
     <header class="weave-header">
-      <span class="weave-brand">🧵 pi-weave</span>
+      <span class="weave-brand">
+        <img
+          class="weave-brand-mark"
+          src={`data:${LOGO_MARK_MIME};base64,${LOGO_MARK_B64}`}
+          alt=""
+          width={18}
+          height={18}
+        />
+        pi-weave
+      </span>
       <button type="button" class="weave-search" title={searchHint(props.shortcut)} onClick={props.onSearch}>
         <span class="weave-search-text">{SEARCH_PLACEHOLDER}</span>
         <kbd>{props.shortcut}</kbd>

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

@@ -30,6 +30,7 @@ import { domEventSource } from "../live";
 import { createEditor, watchUnload, type EditorHandle } from "../note/editor.controller";
 import { editorPrompt, editorToolbar, initialEditorState, shouldBlockUnload } from "../note/editor.model";
 import { SearchPalette } from "../search/SearchPalette";
+import { restoreSelection, saveSelection } from "../selection.storage";
 import { connection, graph, noteBody, selectedId } from "../state";
 import type { WorkspaceHandle } from "../workspace";
 import { observeNotes, select, startWorkspace } from "../workspace";
@@ -83,6 +84,22 @@ export function Shell(props: ShellProps) {
     return () => handle.stop();
   }, []);
 
+  // §1.3 continuity: a reload keeps the note you were reading. Saving is
+  // gated on the restore decision so the mount-time `null` cannot wipe the
+  // saved id before the first graph arrives to validate it against.
+  const selectionRestored = useRef(false);
+  useEffect(() => {
+    if (!selectionRestored.current) return;
+    saveSelection(localStorage, selectedId.value);
+  }, [selectedId.value]);
+  useEffect(() => {
+    if (selectionRestored.current || graph.value === null) return;
+    selectionRestored.current = true;
+    if (selectedId.value !== null) return;
+    const saved = restoreSelection(graph.value, localStorage);
+    if (saved !== null) void select(fetchJson, saved);
+  }, [graph.value]);
+
   // Every note that arrives, from any of the three directions it can arrive
   // from (mount, selection, SSE refetch), so the editor can decide whether it
   // is news or an interruption — see `editor.model.ts`'s header.

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

@@ -69,6 +69,7 @@ export const THEME_CSS = `
   --weave-bg:#141317;--weave-panel:#191820;--weave-fg:#e8e6ee;--weave-dim:#8f8a9c;
   --weave-faint:#5d5869;--weave-line:#26242e;--weave-line-strong:#343141;
   --weave-accent:#a48cff;--weave-ok:#4ade80;--weave-warn:#fbbf24;--weave-bad:#f87171;
+  --weave-new:rgba(164,140,255,.20);
   --weave-row:26px;--weave-gutter:10px;
 }
 @media (prefers-color-scheme: light){
@@ -76,6 +77,7 @@ export const THEME_CSS = `
     --weave-bg:#faf9f7;--weave-panel:#ffffff;--weave-fg:#1c1b19;--weave-dim:#6f6b66;
     --weave-faint:#9a958e;--weave-line:#e6e3de;--weave-line-strong:#d2cec8;
     --weave-accent:#6d4aff;--weave-ok:#15803d;--weave-warn:#b45309;--weave-bad:#b91c1c;
+    --weave-new:rgba(109,74,255,.14);
   }
 }
 body{font-size:13px}
@@ -86,7 +88,8 @@ body{font-size:13px}
   display:flex;align-items:center;gap:14px;padding:0 var(--weave-gutter);
   height:34px;border-bottom:1px solid var(--weave-line);background:var(--weave-panel);
 }
-.weave-brand{font-weight:600;letter-spacing:.01em;white-space:nowrap}
+.weave-brand{display:inline-flex;align-items:center;gap:6px;font-size:14px;font-weight:600;letter-spacing:.01em;white-space:nowrap}
+.weave-brand-mark{height:20px;width:20px;border-radius:5px}
 /* A button styled as a search field: the palette owns the only text input,
    so this opens it rather than pretending to accept a query. */
 .weave-search{
@@ -185,6 +188,17 @@ body{font-size:13px}
 }
 .weave-row:hover{background:var(--weave-line)}
 .weave-row-on{background:var(--weave-line-strong);color:var(--weave-fg)}
+/* A newly-arrived node (a file or note added since the last update, §6):
+   one short highlight that fades while the label settles from bold back to
+   normal. The class is computed from the frame diff in workspace.ts and
+   expires with it, so collapsing and re-expanding later does not replay the
+   arrival, and the first load never flashes the whole tree. */
+.weave-row-new{animation:weave-row-new 2.6s ease-out both}
+@keyframes weave-row-new{
+  0%{background:var(--weave-new);font-weight:700}
+  40%{font-weight:700}
+  100%{background:transparent;font-weight:400}
+}
 .weave-twisty{width:10px;flex:none;color:var(--weave-faint);cursor:pointer;text-align:center}
 .weave-kind{flex:none;color:var(--weave-faint);font-size:11px}
 .weave-prov{flex:none;font-size:9px}
@@ -309,7 +323,6 @@ body{font-size:13px}
   display:flex;align-items:center;gap:6px;flex-wrap:wrap;
   padding:5px var(--weave-gutter);border-top:1px solid var(--weave-line);
 }
-.weave-depth{font:inherit;font-size:10.5px;padding:3px 4px}
 .weave-graph-legend{
   margin-left:auto;display:flex;gap:9px;font-size:10.5px;color:var(--weave-faint);
   white-space:nowrap;

package/src/web/client/state.ts

@@ -76,3 +76,14 @@ export const treeState = signal<TreeState>(initialTreeState());
 
 /** SSE liveness (§6). */
 export const connection = signal<ConnectionState>("live");
+
+/**
+ * Node ids that appeared in the most recent graph update (weave-workspace
+ * §6 frame → tree feedback).
+ *
+ * Empty on the mount fetch — a first load must not animate the whole tree.
+ * The controller replaces the set on every published payload and clears it
+ * after {@link ../workspace!RECENT_TTL_MS}, so a row collapsed and re-expanded
+ * minutes later does not replay its arrival animation.
+ */
+export const recentIds = signal<ReadonlySet<string>>(new Set());

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

@@ -8,6 +8,7 @@
  */
 
 import { useState } from "preact/hooks";
+import { recentIds } from "../state";
 import type { GraphPayload } from "../../shared/wire";
 import type { TreeRowView, TreeViewState } from "./tree.model";
 import {
@@ -45,7 +46,9 @@ function Row({ view, onSelect, onToggle }: { view: TreeRowView; onSelect: () =>
   return (
     <li
       id={view.domId}
-      class={`weave-row weave-row-${view.kind}${view.selected ? " weave-row-on" : ""}`}
+      class={`weave-row weave-row-${view.kind}${view.selected ? " weave-row-on" : ""}${
+        recentIds.value.has(view.id) ? " weave-row-new" : ""
+      }`}
       role="treeitem"
       aria-level={view.level}
       aria-posinset={view.posinset}

package/src/web/client/workspace.ts

@@ -31,9 +31,10 @@
  * the socket, is what tells the user something is wrong.
  */
 
-import type { NotePayload } from "../shared/wire";
+import type { GraphPayload, NotePayload } from "../shared/wire";
 import type { ApiResult, FetchLike } from "./api";
 import { fetchGraph, fetchNote } from "./api";
+import { recentIds } from "./state";
 import type { EventSourceFactory, LiveHandle } from "./live";
 import { startLive } from "./live";
 import type { RefetchPlan } from "./live.model";
@@ -46,6 +47,34 @@ export interface WorkspaceOptions {
   open: EventSourceFactory;
   /** Overrides the SSE path. Tests use it; the shell does not. */
   path?: string;
+  /**
+   * One-shot timer, injectable for tests. Defaults to `setTimeout`. Used
+   * only to expire the recent-arrivals highlight ({@link RECENT_TTL_MS}).
+   */
+  defer?: (fn: () => void, ms: number) => () => void;
+}
+
+/** How long a newly-arrived node stays flagged in the tree (the animation is shorter). */
+export const RECENT_TTL_MS = 3_000;
+
+const NO_IDS: ReadonlySet<string> = new Set();
+
+/**
+ * Node ids present in `next` but not in `previous`.
+ *
+ * The mount fetch passes `previous === null`, which yields the empty set —
+ * a first load must not animate the entire tree as "new". A node that left
+ * and returned is new again: from the reader's point of view it *is* a
+ * fresh arrival.
+ */
+export function addedNodeIds(previous: GraphPayload | null, next: GraphPayload): ReadonlySet<string> {
+  if (previous === null) return NO_IDS;
+  const before = new Set(previous.model.nodes.map((node) => node.id));
+  const added = new Set<string>();
+  for (const node of next.model.nodes) {
+    if (!before.has(node.id)) added.add(node.id);
+  }
+  return added;
 }
 
 /**
@@ -97,10 +126,20 @@ export interface WorkspaceHandle {
  * subscriber. Skipping it is the difference between an idle workspace doing
  * nothing and one re-rendering three columns every time the watcher twitches.
  */
-async function loadGraph(fetchImpl: FetchLike, live: LiveHandle | null): Promise<ApiResult<unknown>> {
+async function loadGraph(
+  fetchImpl: FetchLike,
+  live: LiveHandle | null,
+  onPublished?: (previous: GraphPayload | null, next: GraphPayload) => void,
+): Promise<ApiResult<unknown>> {
+  // Captured before the fetch so the diff describes exactly what the reader
+  // was looking at when the update landed.
+  const previous = graph.value;
   const result = await fetchGraph(fetchImpl, graph.value);
   if (!result.ok) return result;
-  if (!result.cached) graph.value = result.data;
+  if (!result.cached) {
+    graph.value = result.data;
+    onPublished?.(previous, result.data);
+  }
   live?.seen(result.data.stamp);
   return result;
 }
@@ -157,13 +196,34 @@ export function noteSlug(id: string | null): string | null {
  */
 export function startWorkspace(opts: WorkspaceOptions): WorkspaceHandle {
   let live: LiveHandle | null = null;
+  let cancelRecentExpiry: (() => void) | null = null;
+  const defer =
+    opts.defer ??
+    ((fn: () => void, ms: number) => {
+      const handle = setTimeout(fn, ms);
+      return () => clearTimeout(handle);
+    });
+
+  /** Publish the frame's arrivals; the tree flashes them while they are new. */
+  const onPublished = (previous: GraphPayload | null, next: GraphPayload): void => {
+    const added = addedNodeIds(previous, next);
+    recentIds.value = added;
+    cancelRecentExpiry?.();
+    cancelRecentExpiry = null;
+    if (added.size > 0) {
+      cancelRecentExpiry = defer(() => {
+        cancelRecentExpiry = null;
+        recentIds.value = NO_IDS;
+      }, RECENT_TTL_MS);
+    }
+  };
 
   const runPlan = (plan: RefetchPlan): void => {
     // Fire-and-forget: this is called from a socket callback, which cannot
     // await. Failures are values (`api.ts`), so there is nothing to reject —
     // `void` documents that rather than hiding a floating promise.
     void (async () => {
-      if (plan.graph) await loadGraph(opts.fetch, live);
+      if (plan.graph) await loadGraph(opts.fetch, live, onPublished);
       if (plan.note) await loadNote(opts.fetch);
     })();
   };
@@ -175,7 +235,7 @@ export function startWorkspace(opts: WorkspaceOptions): WorkspaceHandle {
     ...(opts.path === undefined ? {} : { path: opts.path }),
   });
 
-  void loadGraph(opts.fetch, live);
+  void loadGraph(opts.fetch, live, onPublished);
 
   return {
     refresh() {
@@ -187,6 +247,9 @@ export function startWorkspace(opts: WorkspaceOptions): WorkspaceHandle {
     stop() {
       live?.stop();
       live = null;
+      cancelRecentExpiry?.();
+      cancelRecentExpiry = null;
+      recentIds.value = NO_IDS;
     },
   };
 }
@@ -211,4 +274,5 @@ export function resetWorkspace(): void {
   graph.value = null;
   noteBody.value = null;
   connection.value = "live";
+  recentIds.value = NO_IDS;
 }

package/src/web/server/page.ts

@@ -43,6 +43,7 @@
  */
 
 import { randomBytes } from "node:crypto";
+import { LOGO_MARK_B64, LOGO_MARK_MIME } from "../shared/logo";
 import type { Bootstrap } from "../shared/wire";
 import { BOOTSTRAP_ELEMENT_ID } from "../shared/wire";
 
@@ -236,6 +237,7 @@ export function renderPage(opts: RenderPageOptions): RenderedPage {
     '<meta name="viewport" content="width=device-width,initial-scale=1">',
     '<meta name="referrer" content="no-referrer">',
     "<title>pi-weave workspace</title>",
+    `<link rel="icon" type="image/png" href="data:${escapeAttr(LOGO_MARK_MIME)};base64,${escapeAttr(LOGO_MARK_B64)}">`,
     `<style nonce="${escapeAttr(nonce)}">`,
     THEME_CSS,
     "</style>",

package/src/web/server/routes.ts

@@ -363,6 +363,12 @@ export function toGraphPayload(model: CoreGraphModel, notes: readonly TaggedNote
  * prompted a refetch. A digest changes if and only if the bytes change, which
  * is the property both consumers actually need.
  *
+ * The digest is exact, but the payload is only an *excerpt* of the workspace:
+ * a note body below `PREVIEW_LEN` does not appear in the payload at all, so
+ * a body-only edit used to reproduce byte-identical payload and re-open the
+ * same hole through both dedupe layers. `GraphModel.contentDigest` — hashed
+ * over the note bodies themselves — closes that; see `core/graph/model.ts`.
+ *
  * `generatedAt` keeps its own, different job: it is the human-facing
  * "data as of" marker on the model, and the status bar still reads it.
  *
@@ -657,11 +663,15 @@ function normalizeEtag(value: string): string {
  * `DELETE /api/graph` and `PUT /api/note/x` answering the same `404` as any
  * other unrouted request: the family claims a request or it does not.
  *
- * The `rest` after the slug is matched **exactly**, not by prefix. A slug can
- * never legitimately contain `/` — `resolveNotePath` rejects it — so
- * `/api/note/a/b` is not a note named `a` with a sub-resource `b`, it is a
- * request for nothing, and it gets the `404` it deserves.
+ * The `rest` after the slug is matched **exactly**, not by prefix. Slugs may
+ * nest (`sessions/foo` — session memory lives in a vault subdirectory), so
+ * the family has exactly one sub-resource path (`/rename`) and everything
+ * else after a `/` belongs to the slug itself; anything else a caller
+ * appends is a request for nothing and gets the `404` it deserves. Core's
+ * `resolveNotePath` remains the traversal guard for whatever slug arrives.
  */
+const renameSuffix = "/rename";
+
 async function routeNote(
   deps: RouteDeps,
   method: string,
@@ -669,9 +679,11 @@ async function routeNote(
   req: IncomingMessage,
   res: ServerResponse,
 ): Promise<boolean> {
-  const cut = target.indexOf("/");
-  const slug = cut === -1 ? target : target.slice(0, cut);
-  const rest = cut === -1 ? "" : target.slice(cut);
+  // One sub-resource, matched at the end: a nested slug can itself contain
+  // slashes, so the split is anchored at the end, not the first slash.
+  const isRename = target.endsWith(renameSuffix);
+  const slug = isRename ? target.slice(0, target.length - renameSuffix.length) : target;
+  const rest = isRename ? renameSuffix : "";
 
   if (rest === "" && method === "GET") {
     await sendNote(deps, slug, res);

package/src/web/shared/graph.ts

@@ -153,6 +153,13 @@ export interface WireGraphModel {
   staleness: WireStalenessReport | null;
   nodes: WireGraphNode[];
   edges: WireGraphEdge[];
+  /**
+   * Content fingerprint of the note bodies (see core `GraphModel`). Rides
+   * the wire so `GraphPayload.stamp` — hashed over these bytes — moves on a
+   * body-only edit, which is what un-dedupes the SSE frame that refetches
+   * an open note.
+   */
+  contentDigest: string;
 }
 
 /**