@tanishqkancharla/diffmap 0.1.5 → 0.3.0

package/src/viewer/changesSource.ts

@@ -0,0 +1,91 @@
+import { createContext, useContext, useEffect, useState } from "react";
+import {
+  isCommitRev,
+  type Delta,
+  type DeltasResponse,
+  type Changes,
+  type ChangesResponse,
+  type Rev,
+} from "../changes.js";
+import { DiffmapDefinitionError } from "../errors.js";
+
+/** Where a viewer reads changes: the local server, GitHub, or a gist snapshot. */
+export type ChangesLoader = (rev: Rev) => Promise<Changes | Error>;
+
+const localCache = new Map<Rev, Promise<Changes | Error>>();
+
+/** Commits never change, so they are cached; anything uncommitted is re-read. */
+export const loadLocalChanges: ChangesLoader = (rev) => {
+  const cached = localCache.get(rev);
+  if (cached !== undefined) return cached;
+  const request = fetch(`/__diffmap/changes?${new URLSearchParams({ rev })}`)
+    .then((response) => response.json())
+    .then((value) => {
+      // SAFETY: the local diffmap server owns this response shape.
+      const result = value as ChangesResponse;
+      if (result.changes !== undefined) return result.changes;
+      return new DiffmapDefinitionError({
+        reason: result.error ?? "Could not load changes.",
+      });
+    })
+    .catch(
+      (cause) =>
+        new DiffmapDefinitionError({
+          reason: "Could not reach the source service.",
+          cause,
+        }),
+    );
+  if (isCommitRev(rev)) localCache.set(rev, request);
+  return request;
+};
+
+/** The range picker's rows. Always re-read: uncommitted changes and HEAD move. */
+export async function loadLocalDeltas(rev: Rev): Promise<Delta[] | Error> {
+  const result = await fetch(
+    `/__diffmap/deltas?${new URLSearchParams({ rev })}`,
+  )
+    .then((response) => response.json())
+    .then((value) => {
+      // SAFETY: the local diffmap server owns this response shape.
+      return value as DeltasResponse;
+    })
+    .catch(
+      (cause) =>
+        new DiffmapDefinitionError({
+          reason: "Could not reach the source service.",
+          cause,
+        }),
+    );
+  if (result instanceof Error) return result;
+  return (
+    result.deltas ??
+    new DiffmapDefinitionError({
+      reason: result.error ?? "Could not list changes.",
+    })
+  );
+}
+
+export const ChangesLoaderContext =
+  createContext<ChangesLoader>(loadLocalChanges);
+
+export function useChanges(rev: Rev) {
+  const load = useContext(ChangesLoaderContext);
+  const [loaded, setLoaded] = useState<{
+    rev: Rev;
+    load: ChangesLoader;
+    result: Changes | Error;
+  }>();
+  useEffect(() => {
+    let active = true;
+    // oxlint-disable-next-line typescript/no-floating-promises -- The effect owns this request and ignores it after cleanup.
+    void load(rev).then((result) => {
+      if (active) setLoaded({ rev, load, result });
+    });
+    return () => {
+      active = false;
+    };
+  }, [rev, load]);
+  return loaded?.rev === rev && loaded.load === load
+    ? loaded.result
+    : undefined;
+}

package/src/viewer/sourceHeader.test.ts

@@ -1,11 +1,6 @@
 import assert from "node:assert/strict";
 import test from "node:test";
-import type { CodeViewDiffItem } from "@pierre/diffs";
-import {
-  sourcePanelOrigin,
-  sourcePanelPath,
-  sourcePanelPin,
-} from "./sourceHeader.ts";
+import { sourcePanelPin } from "./sourceHeader.ts";
 
 const sha = "ef78bf4678d2e76a7c8bcc4087fcadf347a1fcdf";
 const github = {
@@ -19,18 +14,9 @@ const gist = {
   htmlUrl: "https://gist.github.com/a3d2fe2b2e0b1422a4fd5378baced900",
 };
 
-function diffItem(id: string, name: string): CodeViewDiffItem {
-  return {
-    id,
-    type: "diff",
-    fileDiff: { name } as CodeViewDiffItem["fileDiff"],
-  };
-}
-
 test("github file pin is owner/repo @ shortsha linking to the blob at the pin SHA", () => {
   const path = "src/cli.ts";
   const pin = sourcePanelPin({
-    origin: "file",
     path,
     github,
   });
@@ -41,42 +27,8 @@ test("github file pin is owner/repo @ shortsha linking to the blob at the pin SH
   });
 });
 
-test("embedded source-diff says from this spec, not a GitHub blob", () => {
-  const items = [diffItem("cli", "src/cli.ts")];
-  const origin = sourcePanelOrigin({
-    showingFile: false,
-    reference: { kind: "file", path: "src/cli.ts" },
-    items,
-    linkedDiffId: "cli",
-  });
-  assert.equal(origin, "spec-diff");
-  assert.deepEqual(sourcePanelPin({ origin, path: "src/cli.ts", github }), {
-    kind: "spec",
-    label: "from this spec",
-  });
-});
-
-test("PR file diffs pin to the repo blob, not from this spec", () => {
-  const items = [diffItem("pr:src/cli.ts", "src/cli.ts")];
-  const origin = sourcePanelOrigin({
-    showingFile: false,
-    reference: { kind: "file", path: "src/cli.ts" },
-    items,
-  });
-  assert.equal(origin, "repo-diff");
-  const pin = sourcePanelPin({ origin, path: "src/cli.ts", github });
-  assert.equal(pin.kind, "github");
-  if (pin.kind !== "github") return;
-  assert.equal(pin.label, "tanishqkancharla/diffmap @ ef78bf4");
-  assert.match(
-    pin.href,
-    /\/blob\/ef78bf4678d2e76a7c8bcc4087fcadf347a1fcdf\/src\/cli.ts$/,
-  );
-});
-
 test("gist pin is gist id / filename, not a fake repo", () => {
   const pin = sourcePanelPin({
-    origin: "file",
     path: "src/cli.ts",
     gist,
   });
@@ -87,45 +39,8 @@ test("gist pin is gist id / filename, not a fake repo", () => {
   });
 });
 
-test("gist embedded source-diff says from this spec", () => {
-  const origin = sourcePanelOrigin({
-    showingFile: false,
-    items: [diffItem("serve", "src/serve.ts")],
-    reference: { kind: "diff", id: "serve", side: "new", start: 1, end: 3 },
-  });
-  assert.equal(origin, "spec-diff");
-  assert.deepEqual(sourcePanelPin({ origin, path: "src/serve.ts", gist }), {
-    kind: "spec",
-    label: "from this spec",
-  });
-});
-
 test("local file has no pin line", () => {
-  assert.deepEqual(sourcePanelPin({ origin: "file", path: "src/cli.ts" }), {
+  assert.deepEqual(sourcePanelPin({ path: "src/cli.ts" }), {
     kind: "none",
   });
 });
-
-test("sourcePanelPath prefers the open file, then the linked diff, then the reference", () => {
-  const items = [diffItem("cli", "src/cli.ts")];
-  assert.equal(
-    sourcePanelPath({ filePath: "src/registry.ts", items }),
-    "src/registry.ts",
-  );
-  assert.equal(
-    sourcePanelPath({
-      items,
-      linkedDiffId: "cli",
-      reference: { kind: "file", path: "src/other.ts" },
-    }),
-    "src/cli.ts",
-  );
-  assert.equal(
-    sourcePanelPath({
-      items,
-      reference: { kind: "file", path: "src/cli.ts" },
-    }),
-    "src/cli.ts",
-  );
-  assert.equal(sourcePanelPath({ items: [] }), undefined);
-});

package/src/viewer/sourceHeader.ts

@@ -1,82 +1,23 @@
-import type { CodeViewDiffItem } from "@pierre/diffs";
-import type { SourceReference } from "../annotations.js";
 import type { GistPin } from "../gist/pin.ts";
 import { githubGistUrl } from "../gist/route.ts";
 import type { GitHubPin } from "../github/pin.ts";
 import { githubBlobUrl } from "../github/route.ts";
 
-const PR_DIFF_PREFIX = "pr:";
-
-export type SourcePanelOrigin = "file" | "spec-diff" | "repo-diff";
-
 export type SourcePanelPin =
   | { kind: "github"; label: string; href: string }
   | { kind: "gist"; label: string; href: string }
-  | { kind: "spec"; label: "from this spec" }
   | { kind: "none" };
 
-/** Pull-files diffs are repo patches at the pin SHA; everything else is embedded in the spec. */
-export function isSpecEmbeddedDiff(item: CodeViewDiffItem) {
-  return !item.id.startsWith(PR_DIFF_PREFIX);
-}
-
-export function sourcePanelPath(input: {
-  filePath?: string;
-  reference?: SourceReference;
-  items: CodeViewDiffItem[];
-  linkedDiffId?: string;
-}): string | undefined {
-  if (input.filePath !== undefined && input.filePath.length > 0) {
-    return input.filePath;
-  }
-  if (input.linkedDiffId !== undefined) {
-    const linked = input.items.find((item) => item.id === input.linkedDiffId);
-    if (linked !== undefined) return linked.fileDiff.name;
-  }
-  const ref = input.reference;
-  if (ref === undefined) return undefined;
-  if (ref.kind === "file") return ref.path;
-  return input.items.find((item) => item.id === ref.id)?.fileDiff.name;
-}
-
-export function sourcePanelOrigin(input: {
-  showingFile: boolean;
-  reference?: SourceReference;
-  items: CodeViewDiffItem[];
-  linkedDiffId?: string;
-}): SourcePanelOrigin {
-  if (input.showingFile) return "file";
-  const ref = input.reference;
-  const focused =
-    input.linkedDiffId !== undefined
-      ? input.items.find((item) => item.id === input.linkedDiffId)
-      : ref?.kind === "diff"
-        ? input.items.find((item) => item.id === ref.id)
-        : ref?.kind === "file"
-          ? input.items.find((item) => item.fileDiff.name === ref.path)
-          : undefined;
-  if (focused !== undefined) {
-    return isSpecEmbeddedDiff(focused) ? "spec-diff" : "repo-diff";
-  }
-  if (input.items.some(isSpecEmbeddedDiff)) return "spec-diff";
-  if (input.items.length > 0) return "repo-diff";
-  return "file";
-}
-
 /**
- * Pin line for the source panel. A hosted spec is one SHA; blob links use that
- * SHA for the open path. Embedded `source-diff` is from the spec, not a blob.
+ * Pin line under a single open file. A hosted spec is one SHA; blob links use
+ * that SHA for the open path.
  */
 export function sourcePanelPin(input: {
-  origin: SourcePanelOrigin;
-  path: string | undefined;
+  path: string;
   github?: GitHubPin;
   gist?: GistPin;
 }): SourcePanelPin {
-  if (input.origin === "spec-diff") {
-    return { kind: "spec", label: "from this spec" };
-  }
-  if (input.github !== undefined && input.path !== undefined) {
+  if (input.github !== undefined) {
     const shortSha = input.github.sha.slice(0, 7);
     return {
       kind: "github",

package/src/viewer/sourceNavigation.ts

@@ -1,5 +1,4 @@
 import { useEffect, useMemo, useState } from "react";
-import type { CodeViewDiffItem, CodeViewLineSelection } from "@pierre/diffs";
 import type { SourceReference } from "../annotations.js";
 import type { SourceDefinition, DefinitionResponse } from "../definitions.js";
 import { DiffmapDefinitionError } from "../errors.js";
@@ -138,45 +137,3 @@ function readHostFileReference(
     end: range.end,
   };
 }
-
-export function matchingSourceDiff(
-  source: SourceDefinition,
-  items: CodeViewDiffItem[],
-): CodeViewLineSelection | undefined {
-  const lines = source.contents.split(/\r?\n/);
-  for (const item of items) {
-    const diff = item.fileDiff;
-    if (diff.name !== source.path) continue;
-    const ranges = diff.hunks.flatMap((hunk) => {
-      const start = Math.max(source.start, hunk.additionStart);
-      const end = Math.min(
-        source.end,
-        hunk.additionStart + hunk.additionCount - 1,
-      );
-      return start <= end ? [{ start, end, hunk }] : [];
-    });
-    if (ranges.length === 0) continue;
-    const matches = ranges.every(({ start, end, hunk }) => {
-      for (let line = start; line <= end; line++) {
-        const index = diff.isPartial
-          ? hunk.additionLineIndex + line - hunk.additionStart
-          : line - 1;
-        if (
-          diff.additionLines[index]?.replace(/\r?\n$/, "") !== lines[line - 1]
-        )
-          return false;
-      }
-      return true;
-    });
-    if (!matches) continue;
-    return {
-      id: item.id,
-      range: {
-        start: Math.min(...ranges.map((range) => range.start)),
-        end: Math.max(...ranges.map((range) => range.end)),
-        side: "additions",
-      },
-    };
-  }
-  return undefined;
-}

package/vite.config.ts

@@ -22,6 +22,7 @@ export default defineConfig(({ command }) => {
         "react-dom",
         "react/jsx-dev-runtime",
         "maui",
+        "motion/react",
         "purse-styles",
         "@pierre/diffs/react",
         "beautiful-mermaid",

package/vite.gist.config.ts

@@ -0,0 +1,57 @@
+import path from "node:path";
+import { fileURLToPath } from "node:url";
+import react from "@vitejs/plugin-react";
+import { defineConfig, type UserConfig } from "vite";
+
+const packageRoot = path.dirname(fileURLToPath(import.meta.url));
+const gistRoot = path.join(packageRoot, "gist");
+
+/** Production / preview: static gist viewer. Never pulls `virtual:diffmap`. */
+export function gistAppConfig(): UserConfig {
+  return {
+    root: gistRoot,
+    cacheDir: path.join(packageRoot, "node_modules/.vite-gist"),
+    publicDir: false,
+    optimizeDeps: {
+      include: [
+        "react",
+        "react-dom",
+        "react/jsx-dev-runtime",
+        "maui",
+        "motion/react",
+        "purse-styles",
+        "@pierre/diffs/react",
+        "beautiful-mermaid",
+        "errore",
+        "md4x/standalone",
+      ],
+    },
+    plugins: [react()],
+    appType: "spa",
+    resolve: {
+      alias: {
+        "md4x/napi": path.join(
+          packageRoot,
+          "node_modules/md4x/lib/standalone.mjs",
+        ),
+      },
+      dedupe: ["react", "react-dom", "purse-styles"],
+    },
+    server: {
+      fs: {
+        allow: [packageRoot],
+      },
+    },
+    preview: {
+      host: "127.0.0.1",
+      port: 4178,
+    },
+    build: {
+      outDir: path.join(packageRoot, "dist"),
+      emptyOutDir: true,
+    },
+    clearScreen: false,
+  };
+}
+
+export default defineConfig(gistAppConfig());

package/src/viewer/TocButton.tsx

@@ -1,27 +0,0 @@
-import { Button, UnorderedList, backgroundColor } from "maui";
-import { style, useStyles } from "purse-styles";
-
-export function TocButton(props: { expanded: boolean; onClick?: () => void }) {
-  const className = useStyles(pressedClass);
-  return (
-    <Button
-      id="diffmap-toc-button"
-      className={className}
-      variant="quiet"
-      aria-label="Table of contents"
-      aria-pressed={props.expanded}
-      aria-expanded={props.expanded}
-      aria-controls="diffmap-toc"
-      onClick={props.onClick}
-    >
-      <UnorderedList size="sm" />
-    </Button>
-  );
-}
-
-const pressedClass = style({
-  flexShrink: 0,
-  "&[aria-pressed='true']": {
-    backgroundColor: backgroundColor.elementActive,
-  },
-});