@cueloop/client 0.1.0-alpha.0 → 0.1.0-alpha.100

package/src/workbench/components/file-tree.test.ts

@@ -0,0 +1,60 @@
+import { describe, expect, test } from "bun:test";
+import type { DiffFileContents } from "@cueloop/schema";
+import { buildFileTree } from "./file-tree";
+
+function file(path: string, status: DiffFileContents["status"] = "modified"): DiffFileContents {
+  return { path, oldContents: "a", newContents: "b", status };
+}
+
+describe("buildFileTree", () => {
+  test("nests files under their directories and keeps the full path as the leaf id", () => {
+    // Arrange
+    const files = [file("src/app/main.ts"), file("src/app/util.ts"), file("README.md")];
+
+    // Act
+    const tree = buildFileTree(files);
+
+    // Assert - one src folder over one app folder over two leaves, plus a root file
+    expect(tree.map((node) => node.label)).toEqual(["src", "README.md"]);
+    const app = tree[0]!.children![0]!;
+
+    expect(app.label).toBe("app");
+    expect(app.children!.map((leaf) => leaf.id)).toEqual(["src/app/main.ts", "src/app/util.ts"]);
+  });
+
+  test("carries the git status onto each leaf so the tree can tint it", () => {
+    // Act
+    const tree = buildFileTree([file("a.ts", "added"), file("b.ts", "deleted")]);
+
+    // Assert
+    expect(tree.map((leaf) => leaf.status)).toEqual(["added", "deleted"]);
+  });
+
+  test("merges files that share a directory into one folder node", () => {
+    // Act
+    const tree = buildFileTree([file("pkg/one.ts"), file("pkg/two.ts")]);
+
+    // Assert
+    expect(tree).toHaveLength(1);
+    expect(tree[0]!.children).toHaveLength(2);
+  });
+
+  test("returns an empty tree for no changes", () => {
+    expect(buildFileTree([])).toEqual([]);
+  });
+
+  test("badges a leaf with its comment count, and leaves an uncommented file bare", () => {
+    // Act
+    const tree = buildFileTree(
+      [file("a.ts"), file("b.ts")],
+      new Map([
+        ["a.ts", 3],
+        ["b.ts", 0],
+      ]),
+    );
+
+    // Assert - a.ts shows the dot-and-count, b.ts (0) shows nothing
+    expect(tree[0]!.badge).toBe("● 3");
+    expect(tree[1]!.badge).toBeUndefined();
+  });
+});

package/src/workbench/components/file-tree.ts

@@ -0,0 +1,112 @@
+/**
+ * Builds a nested file tree from a diff's changed files, so the Changes column
+ * can browse them by directory. Each leaf keeps its repo-relative path as the id
+ * (what the diff rows are keyed by) and carries the git status for its tint.
+ */
+
+import type { DiffFileContents, DiffFileStatus } from "@cueloop/schema";
+import type { GitStatus, TreeNode } from "../../ui/components/primitives/tree-model";
+
+/** The diff file statuses are a subset of the tree's git statuses. */
+function gitStatusOf(status: DiffFileStatus): GitStatus {
+  return status;
+}
+
+interface MutableTreeNode {
+  id: string;
+  label: string;
+  status?: GitStatus;
+  badge?: string;
+  children?: Map<string, MutableTreeNode>;
+}
+
+function freeze(node: MutableTreeNode): TreeNode {
+  if (node.children === undefined) {
+    const leaf: TreeNode = { id: node.id, label: node.label, status: node.status };
+
+    if (node.badge !== undefined) leaf.badge = node.badge;
+
+    return leaf;
+  }
+
+  return {
+    id: node.id,
+    label: node.label,
+    children: [...node.children.values()].map(freeze),
+  };
+}
+
+/** A file's comment count as a leaf badge, or undefined when it carries none. */
+function commentBadge(
+  counts: ReadonlyMap<string, number> | undefined,
+  path: string,
+): string | undefined {
+  const count = counts?.get(path);
+
+  return count ? `● ${count}` : undefined;
+}
+
+/**
+ * Group changed files into a directory tree; leaves are keyed by their full path. A leaf whose
+ * file carries comments shows a dot-and-count badge, so feedback is visible even with its tab closed.
+ */
+export function buildFileTree(
+  files: readonly DiffFileContents[],
+  commentCounts?: ReadonlyMap<string, number>,
+): TreeNode[] {
+  const roots = new Map<string, MutableTreeNode>();
+
+  for (const file of files) {
+    const segments = file.path.split("/").filter((segment) => segment.length > 0);
+    let level = roots;
+    let prefix = "";
+
+    segments.forEach((segment, index) => {
+      prefix = prefix.length > 0 ? `${prefix}/${segment}` : segment;
+      const isLeaf = index === segments.length - 1;
+      let node = level.get(segment);
+
+      if (node === undefined) {
+        node = isLeaf
+          ? {
+              id: file.path,
+              label: segment,
+              status: gitStatusOf(file.status),
+              badge: commentBadge(commentCounts, file.path),
+            }
+          : { id: prefix, label: segment, children: new Map() };
+        level.set(segment, node);
+      }
+      if (!isLeaf) level = node.children!;
+    });
+  }
+
+  return [...roots.values()].map(freeze);
+}
+
+/** Group plain repo-relative paths (git ls-files) into a directory tree; leaves keep their full path. */
+export function buildPathTree(paths: readonly string[]): TreeNode[] {
+  const roots = new Map<string, MutableTreeNode>();
+
+  for (const path of paths) {
+    const segments = path.split("/").filter((segment) => segment.length > 0);
+    let level = roots;
+    let prefix = "";
+
+    segments.forEach((segment, index) => {
+      prefix = prefix.length > 0 ? `${prefix}/${segment}` : segment;
+      const isLeaf = index === segments.length - 1;
+      let node = level.get(segment);
+
+      if (node === undefined) {
+        node = isLeaf
+          ? { id: path, label: segment }
+          : { id: prefix, label: segment, children: new Map() };
+        level.set(segment, node);
+      }
+      if (!isLeaf) level = node.children!;
+    });
+  }
+
+  return [...roots.values()].map(freeze);
+}

package/src/workbench/use-changes-workbench.ts

@@ -0,0 +1,205 @@
+// The Changes/Project right-region state machine: the Project pane is the right sidebar and is always
+// present when the region is on, the Changes editor rides on it and never stands alone, and the two
+// toggles are mutually-exclusive file-tree modes. Owns the editor grid (tabs and splits) too.
+
+import { useRef, useState } from "react";
+import type { ProjectPanelMode } from "../app/components/AppShell";
+import type { LaunchLayout } from "../app/launch-layout";
+import {
+  activateTab,
+  changesTab,
+  closeTab,
+  containsGroup,
+  firstGroupId,
+  keepFileTab,
+  makeGroup,
+  openChangesTab,
+  openFileTab,
+  splitGroup,
+  welcomeTab,
+  type EditorNode,
+  type SplitDirection,
+} from "./components/editor-grid";
+
+/** Seed the workbench for a bare launch: the region opens on a disposable Welcome tab. */
+export interface ChangesWorkbenchOptions {
+  seed?: "changes" | "welcome";
+  layout?: LaunchLayout;
+}
+
+interface InitialPanes {
+  projectOpen: boolean;
+  changesOpen: boolean;
+  projectMode: ProjectPanelMode;
+  zoomed: boolean;
+}
+
+/** The right region's opening state: from the launch layout when given, else the welcome-seed defaults. */
+function initialPanes(options?: ChangesWorkbenchOptions): InitialPanes {
+  const layout = options?.layout;
+
+  if (layout) {
+    const changesOpen = layout.rightSidebar === "changes";
+
+    return {
+      projectOpen: layout.rightSidebar !== "off",
+      changesOpen,
+      projectMode: layout.projectMode ?? (layout.rightSidebar === "project" ? "tree" : "changes"),
+      // zoom fills the middle with the Changes editor, so a hand-edited layout that zooms without one
+      // would strand a blank center with the Thread pane hidden; only honor zoom when Changes is open
+      zoomed: layout.zoomChanges && changesOpen,
+    };
+  }
+  const welcomeSeed = options?.seed === "welcome";
+
+  return {
+    projectOpen: welcomeSeed,
+    changesOpen: welcomeSeed,
+    projectMode: "changes",
+    zoomed: false,
+  };
+}
+
+export interface ChangesWorkbench {
+  projectOpen: boolean;
+  changesOpen: boolean;
+  projectMode: ProjectPanelMode;
+  zoomed: boolean;
+  grid: EditorNode;
+  activeGroup: string;
+  toggleRight: () => void;
+  toggleChanges: () => void;
+  toggleProject: () => void;
+  toggleZoom: () => void;
+  focusGroup: (groupId: string) => void;
+  activate: (groupId: string, tabId: string) => void;
+  keepTab: (groupId: string, tabId: string) => void;
+  close: (groupId: string, tabId: string) => void;
+  split: (groupId: string, direction: SplitDirection) => void;
+  openFile: (path: string, fileView: "diff" | "contents", persistent?: boolean) => void;
+  syncSession: (sessionId: string | undefined, isDiff: boolean) => void;
+}
+
+export function useChangesWorkbench(options?: ChangesWorkbenchOptions): ChangesWorkbench {
+  const welcomeSeed = options?.seed === "welcome";
+  const initial = initialPanes(options);
+  const [projectOpen, setProjectOpen] = useState(initial.projectOpen);
+  const [changesOpen, setChangesOpen] = useState(initial.changesOpen);
+  const [projectMode, setProjectMode] = useState<ProjectPanelMode>(initial.projectMode);
+  const [zoomed, setZoomed] = useState(initial.zoomed);
+  const [grid, setGrid] = useState<EditorNode>(() =>
+    makeGroup([welcomeSeed ? welcomeTab() : changesTab()]),
+  );
+  const [focusedGroup, setFocusedGroup] = useState<string | null>(null);
+  const rememberedChanges = useRef(welcomeSeed);
+  const seenSession = useRef<string | undefined>(undefined);
+
+  const syncSession = (sessionId: string | undefined, isDiff: boolean): void => {
+    if (sessionId === undefined || sessionId === seenSession.current) return;
+    seenSession.current = sessionId;
+    setProjectOpen(isDiff);
+    setChangesOpen(isDiff);
+    setProjectMode(isDiff ? (options?.layout?.projectMode ?? "changes") : "tree");
+    rememberedChanges.current = isDiff;
+    // a non-diff thread has no Changes editor; leaving zoom on would strand the hidden Thread pane
+    if (!isDiff) setZoomed(false);
+    setGrid(makeGroup([changesTab()]));
+    setFocusedGroup(null);
+  };
+
+  const toggleRight = (): void => {
+    if (projectOpen) {
+      rememberedChanges.current = changesOpen;
+      setChangesOpen(false);
+      setProjectOpen(false);
+      // zoom focuses the Changes editor; collapsing the region returns the Thread pane full width
+      setZoomed(false);
+    } else {
+      setProjectOpen(true);
+      setChangesOpen(rememberedChanges.current);
+      setProjectMode(rememberedChanges.current ? "changes" : "tree");
+    }
+  };
+  const toggleChanges = (): void => {
+    setChangesOpen(true);
+    setProjectOpen(true);
+    setProjectMode("changes");
+    setGrid((tree) => {
+      const result = openChangesTab(tree, focusedGroup ?? firstGroupId(tree));
+
+      setFocusedGroup(result.focusGroupId);
+
+      return result.tree;
+    });
+  };
+  const toggleProject = (): void => {
+    setProjectOpen(true);
+    setProjectMode("tree");
+  };
+  const close = (groupId: string, tabId: string): void => {
+    setGrid((tree) => {
+      const pruned = closeTab(tree, groupId, tabId);
+
+      if (pruned === null) {
+        setChangesOpen(false);
+        setProjectMode("tree");
+        // leaving zoom on would hide the Thread pane with no editor to fill the gap
+        setZoomed(false);
+
+        return makeGroup([changesTab()]);
+      }
+      // re-home focus when the closed group was pruned away, so the next open has a live target
+      setFocusedGroup((current) =>
+        current !== null && containsGroup(pruned, current) ? current : firstGroupId(pruned),
+      );
+
+      return pruned;
+    });
+  };
+  const split = (groupId: string, direction: SplitDirection): void => {
+    setGrid((tree) => {
+      const result = splitGroup(tree, groupId, direction);
+
+      setFocusedGroup(result.focusGroupId);
+
+      return result.tree;
+    });
+  };
+  const openFile = (path: string, fileView: "diff" | "contents", persistent = false): void => {
+    setProjectOpen(true);
+    setChangesOpen(true);
+    setGrid((tree) => {
+      const result = openFileTab(
+        tree,
+        focusedGroup ?? firstGroupId(tree),
+        path,
+        fileView,
+        persistent,
+      );
+
+      setFocusedGroup(result.focusGroupId);
+
+      return result.tree;
+    });
+  };
+
+  return {
+    projectOpen,
+    changesOpen,
+    projectMode,
+    zoomed,
+    grid,
+    activeGroup: focusedGroup ?? firstGroupId(grid),
+    toggleRight,
+    toggleChanges,
+    toggleProject,
+    toggleZoom: () => setZoomed((value) => !value),
+    focusGroup: setFocusedGroup,
+    activate: (groupId, tabId) => setGrid((tree) => activateTab(tree, groupId, tabId)),
+    keepTab: (groupId, tabId) => setGrid((tree) => keepFileTab(tree, groupId, tabId)),
+    close,
+    split,
+    openFile,
+    syncSession,
+  };
+}

package/src/workbench/use-remember-layout.ts

@@ -0,0 +1,31 @@
+import { useEffect, useRef } from "react";
+import { persistLayout } from "../settings/config";
+import { layoutFromPanes, type LaunchLayout } from "../app/launch-layout";
+
+/**
+ * Persist the pane composition whenever the user changes it, so the next bare launch restores it.
+ * Only a launch that carried an intended layout (a create-command or the vanilla inbox) remembers;
+ * a bare thread open collapses the sidebar and must not clobber the remembered composition. The
+ * mount write is skipped: the opening composition is the one just restored.
+ */
+export function useRememberLayout(
+  layout: LaunchLayout | undefined,
+  active: boolean,
+  threads: boolean,
+  changesOpen: boolean,
+  projectOpen: boolean,
+  zoomChanges: boolean,
+): void {
+  const settled = useRef(false);
+
+  useEffect(() => {
+    if (!settled.current) {
+      settled.current = true;
+
+      return;
+    }
+    // only the active workbench persists: on a bare launch App's unused panes must not clobber the shell's
+    if (!active || layout === undefined) return;
+    persistLayout(layoutFromPanes({ threads, changesOpen, projectOpen, zoomChanges }));
+  }, [active, layout, threads, changesOpen, projectOpen, zoomChanges]);
+}

package/src/workbench/use-repo-changes.ts

@@ -0,0 +1,91 @@
+import { useEffect, useEffectEvent, useState } from "react";
+import type { DiffFileContents } from "@cueloop/schema";
+
+const CHANGES_REFRESH_MS = 2000;
+const EMPTY_CHANGED_FILES: readonly DiffFileContents[] = [];
+
+interface RepoChangesOptions {
+  loadChanges: () => Promise<readonly DiffFileContents[]>;
+  visible: boolean;
+  diffSourceKey: string;
+  initialFiles?: readonly DiffFileContents[];
+  refreshAutomatically?: boolean;
+}
+
+interface RepoChangesSnapshot {
+  diffSourceKey: string;
+  files: readonly DiffFileContents[];
+}
+
+function sameChangedFiles(a: readonly DiffFileContents[], b: readonly DiffFileContents[]): boolean {
+  return (
+    a.length === b.length &&
+    a.every(
+      (file, index) =>
+        file.path === b[index]?.path &&
+        file.status === b[index]?.status &&
+        file.oldContents === b[index]?.oldContents &&
+        file.newContents === b[index]?.newContents,
+    )
+  );
+}
+
+/** Refresh the visible Changes tree from the working repo; keep captured diff reviews fixed. */
+export function useRepoChanges({
+  loadChanges,
+  visible,
+  diffSourceKey,
+  initialFiles,
+  refreshAutomatically = true,
+}: RepoChangesOptions): readonly DiffFileContents[] {
+  const [snapshot, setSnapshot] = useState<RepoChangesSnapshot | null>(() =>
+    initialFiles ? { diffSourceKey, files: initialFiles } : null,
+  );
+  const loadLatestChanges = useEffectEvent(loadChanges);
+
+  useEffect(() => {
+    if (!visible) return;
+
+    let cancelled = false;
+    let requestInFlight = false;
+
+    const refreshChanges = async (): Promise<void> => {
+      if (requestInFlight) return;
+      requestInFlight = true;
+
+      try {
+        const files = await loadLatestChanges();
+
+        if (!cancelled) {
+          setSnapshot((previous) =>
+            previous?.diffSourceKey === diffSourceKey && sameChangedFiles(previous.files, files)
+              ? previous
+              : { diffSourceKey, files },
+          );
+        }
+      } catch {
+        if (!cancelled) {
+          setSnapshot((previous) =>
+            previous?.diffSourceKey === diffSourceKey && previous.files.length === 0
+              ? previous
+              : { diffSourceKey, files: EMPTY_CHANGED_FILES },
+          );
+        }
+      } finally {
+        requestInFlight = false;
+      }
+    };
+
+    void refreshChanges();
+    const timer = refreshAutomatically
+      ? setInterval(() => void refreshChanges(), CHANGES_REFRESH_MS)
+      : null;
+
+    return () => {
+      cancelled = true;
+      if (timer !== null) clearInterval(timer);
+    };
+  }, [visible, diffSourceKey, refreshAutomatically]);
+
+  return snapshot?.diffSourceKey === diffSourceKey ? snapshot.files : EMPTY_CHANGED_FILES;
+}

package/src/workbench/workbench-snapshot.test.ts

@@ -0,0 +1,99 @@
+/** Sharing/serving a workbench thread freezes its live working-tree diff into the artifact so a remote
+ * reviewer, who cannot see the owner's tree, reads a stable snapshot; any other thread passes through. */
+
+import { describe, expect, mock, test } from "bun:test";
+import { historyFromLinear, viewFollowing, type Thread } from "@cueloop/schema";
+import { snapshotWorkbench } from "./workbench-snapshot";
+
+const AT = "2026-01-01T00:00:00.000Z";
+
+const STALE_FILES = [
+  { path: "src/a.ts", oldContents: "a\n", newContents: "b\n", status: "modified" as const },
+];
+const LIVE = {
+  patch: "FRESH PATCH",
+  files: [
+    { path: "src/a.ts", oldContents: "a\n", newContents: "c\n", status: "modified" as const },
+  ],
+};
+
+function diffThread(meta: Thread["artifact"]["meta"]): Thread {
+  return {
+    schemaVersion: "1",
+    id: "ses_wb",
+    workspace: { repoRoot: "/repo", branch: "main" },
+    artifact: { type: "diff", content: "STALE PATCH", files: STALE_FILES, meta },
+    revisions: [{ revision: 1, content: "STALE PATCH", submittedAt: AT }],
+    annotations: [
+      {
+        id: "n1",
+        kind: "comment",
+        anchor: { quote: "b", prefix: "", suffix: "" },
+        body: "why?",
+        createdAt: AT,
+      },
+    ],
+    message: null,
+    status: "pending",
+    createdAt: AT,
+  };
+}
+
+describe("snapshotWorkbench", () => {
+  test("freezes a workbench thread's live diff and drops the workbench flag", async () => {
+    const frozen = await snapshotWorkbench(
+      diffThread({ workbench: true, title: "Workbench" }),
+      async () => LIVE,
+    );
+
+    // the live diff is pinned into the artifact
+    expect(frozen.artifact.content).toBe("FRESH PATCH");
+    expect(frozen.artifact.files).toEqual(LIVE.files);
+    // the snapshot marker pins the render; the workbench marker stays so file-targeted feedback still paints
+    expect(frozen.artifact.meta.snapshot).toBe(true);
+    expect(frozen.artifact.meta.workbench).toBe(true);
+    expect(frozen.artifact.meta.title).toBe("Workbench");
+    // the thread is otherwise intact - same id, workspace, and annotations
+    expect(frozen.id).toBe("ses_wb");
+    expect(frozen.annotations).toHaveLength(1);
+  });
+
+  test("recaptures history so the share path rebuilds the fresh content, not the stale head", async () => {
+    // a workbench thread carries branch history whose head is the creation-time capture
+    const base = diffThread({ workbench: true });
+    const withHistory: Thread = { ...base, history: historyFromLinear(base) };
+
+    const frozen = await snapshotWorkbench(withHistory, async () => LIVE);
+
+    // viewFollowing (the share path) rebuilds content from history - it must yield the fresh patch
+    expect(viewFollowing(frozen).artifact.content).toBe("FRESH PATCH");
+  });
+
+  test("pins the captured source and revision in a shared workbench", async () => {
+    const frozen = await snapshotWorkbench(
+      diffThread({ workbench: true, vcs: "jj", vcsRevisionId: "old" }),
+      async () => ({
+        ...LIVE,
+        vcs: "jj",
+        source: { changeId: "change", revisionId: "new" },
+      }),
+    );
+
+    expect(frozen.artifact.meta.vcsRevisionId).toBe("new");
+    expect(frozen.revisions[0]).toMatchObject({
+      content: LIVE.patch,
+      files: LIVE.files,
+      source: { vcs: "jj", changeId: "change", revisionId: "new" },
+    });
+  });
+
+  test("passes a plain diff review through untouched and never queries the tree", async () => {
+    const session = diffThread({ title: "PR #7" });
+    const repoDiff = mock(async () => LIVE);
+
+    const result = await snapshotWorkbench(session, repoDiff);
+
+    expect(result).toBe(session);
+    expect(repoDiff).not.toHaveBeenCalled();
+  });
+});

package/src/workbench/workbench-snapshot.ts

@@ -0,0 +1,59 @@
+import {
+  recaptureMainHead,
+  type DiffFileContents,
+  type DiffSource,
+  type Thread,
+} from "@cueloop/schema";
+
+/** Reads the live working-tree diff for a repo root (the daemon's `repo.diff` RPC). */
+export type RepoDiff = (
+  repoRoot: string,
+  vcs?: string,
+) => Promise<{
+  patch: string;
+  files: DiffFileContents[];
+  source?: Omit<DiffSource, "vcs">;
+  vcs?: string;
+}>;
+
+/**
+ * Freeze a workbench thread's live working-tree diff into its artifact for a remote reviewer, who cannot
+ * see the owner's tree. The `snapshot` marker pins the render to this captured diff while keeping the
+ * workbench marker, so the reviewer still sees the file-targeted feedback already on the thread. Any other
+ * thread is already stable and passes through; the owner's own session keeps the original live thread.
+ */
+export async function snapshotWorkbench(session: Thread, repoDiff: RepoDiff): Promise<Thread> {
+  if (session.artifact.type !== "diff" || session.artifact.meta.workbench !== true) return session;
+
+  const { patch, files, source, vcs } = await repoDiff(
+    session.workspace.repoRoot,
+    session.artifact.meta.vcs,
+  );
+  const provider = vcs ?? session.artifact.meta.vcs;
+  const artifact = {
+    ...session.artifact,
+    content: patch,
+    files,
+    meta: {
+      ...session.artifact.meta,
+      snapshot: true,
+      vcs: provider,
+      vcsChangeId: source?.changeId,
+      vcsRevisionId: source?.revisionId,
+    },
+  };
+  // the share path rebuilds content from history; recapture the branch head so it matches the fresh patch
+  const history = session.history ? recaptureMainHead(session.history, patch) : session.history;
+  const revisions = session.revisions.map((revision, index) =>
+    index === session.revisions.length - 1
+      ? {
+          ...revision,
+          content: patch,
+          files,
+          source: provider && source ? { vcs: provider, ...source } : undefined,
+        }
+      : revision,
+  );
+
+  return { ...session, artifact, history, revisions };
+}