@cueloop/client 0.1.0-alpha.65 → 0.1.0-alpha.67

package/src/App.review-panel.test.tsx

@@ -1,140 +0,0 @@
-/** The review panel end to end: the b key cycles expanded -> compact -> hidden -> expanded on the live App, and the collapse mode persists to the user config so it survives a restart. Rendering details are locked by the ReviewPanel stories; this suite proves the App wiring and the persistence. */
-
-import { afterEach, beforeEach, describe, expect, test } from "bun:test";
-import { mkdtempSync, rmSync } from "node:fs";
-import { tmpdir } from "node:os";
-import { join } from "node:path";
-import React from "react";
-import { testRender } from "@opentui/react/test-utils";
-import { DaemonServer } from "@cueloop/daemon";
-import type { ReviewSession } from "@cueloop/schema";
-import { App } from "./App";
-import { loadConfig } from "./config";
-import { isolateUserConfig, settle, waitForText, waitForTextGone, pressKey } from "./test-support";
-
-const PLAN = "# Plan\n\nShip the thing.\n";
-
-let home: string;
-let server: DaemonServer;
-let session: ReviewSession;
-let configPath: string;
-let restoreUserConfig: () => void;
-
-beforeEach(() => {
-  home = mkdtempSync(join(tmpdir(), "cueloop-panel-"));
-  configPath = join(home, "config.toml");
-  restoreUserConfig = isolateUserConfig(home, "config.toml");
-  server = new DaemonServer({ home, idleExitMs: 0 });
-  server.start();
-  session = server.core.sessionCreate({
-    workspace: { repoRoot: "/repo", branch: "main" },
-    artifact: { type: "plan", content: PLAN, meta: { title: "Plan" } },
-  });
-});
-afterEach(() => {
-  restoreUserConfig();
-  server.stop();
-  rmSync(home, { recursive: true, force: true });
-});
-
-async function renderApp() {
-  const setup = await testRender(<App home={home} sessionId={session.id} />, {
-    width: 120,
-    height: 30,
-  });
-
-  await waitForText(setup, "Review");
-
-  return setup;
-}
-
-describe("review panel", () => {
-  test("ctrl+r cycles expanded -> compact -> hidden -> expanded", async () => {
-    // Arrange
-    const setup = await renderApp();
-    // each mode has its own signature: expanded draws the tab box and the
-    // submit button, compact keeps only the count strip, hidden draws nothing
-    const railSignature = () => {
-      const frame = setup.captureCharFrame();
-
-      return {
-        tabs: frame.includes("Review  Tree  Agent"),
-        submit: frame.includes("Submit review"),
-        strip: /\s0\s*\n/.test(frame) && frame.includes("<"),
-      };
-    };
-
-    // Assert: expanded
-    expect(railSignature()).toEqual({ tabs: true, submit: true, strip: false });
-
-    // Act
-    await pressKey(setup, "r", { ctrl: true });
-
-    // Assert: compact drops the tabs and the button, keeps the strip
-    await waitForTextGone(setup, "Submit review");
-    expect(railSignature()).toEqual({ tabs: false, submit: false, strip: true });
-
-    // Act
-    await pressKey(setup, "r", { ctrl: true });
-    await settle(setup);
-
-    // Assert: hidden draws no rail at all
-    expect(railSignature()).toEqual({ tabs: false, submit: false, strip: false });
-
-    // Act
-    await pressKey(setup, "r", { ctrl: true });
-
-    // Assert
-    await waitForText(setup, "Submit review"); // back to expanded
-  });
-
-  test("the collapse mode persists to the user config", async () => {
-    // Arrange
-    const setup = await renderApp();
-
-    // Act
-    await pressKey(setup, "r", { ctrl: true }); // -> compact
-
-    // Assert
-    expect(loadConfig({ userConfigPath: configPath }).ui.reviewState).toBe("compact");
-  });
-
-  test("option+w widens the rail and persists the new width", async () => {
-    // Arrange
-    const setup = await renderApp();
-    const startWidth = loadConfig({ userConfigPath: configPath }).ui.reviewWidth;
-
-    // Act
-    await pressKey(setup, "w", { meta: true });
-
-    // Assert
-    const widened = loadConfig({ userConfigPath: configPath }).ui.reviewWidth;
-
-    expect(widened).toBeGreaterThan(startWidth);
-  });
-
-  test("submitting from a hidden panel force-opens the rail so the confirm card is reachable", async () => {
-    // Arrange
-    const setup = await renderApp();
-
-    await pressKey(setup, "r", { ctrl: true }); // -> compact
-    await pressKey(setup, "r", { ctrl: true }); // -> hidden
-
-    // Assert
-    await waitForTextGone(setup, "Submit review"); // rail is gone
-    expect(setup.captureCharFrame()).not.toContain("Submit review");
-
-    // Act
-    await pressKey(setup, "RETURN", { meta: true }); // submit while hidden must not trap in an invisible modal
-
-    // Assert
-    await waitForText(setup, "submit review");
-    const frame = setup.captureCharFrame();
-
-    expect(frame).toContain("submit review"); // the confirm card is visible again
-    expect(frame).toContain("[Approve]");
-
-    // the reveal is live-only: the saved panel preference stays as the user left it
-    expect(loadConfig({ userConfigPath: configPath }).ui.reviewState).toBe("hidden");
-  });
-});

package/src/App.tree.test.tsx

@@ -1,224 +0,0 @@
-/**
- * The rail's Tree tab over the real App and an in-process daemon: the option
- * chords and the mouse reach the same primitives, the pane paints the path,
- * the tips, and the checkpoints, and the thread view shows a moved path in the
- * frame after the key.
- */
-
-import { afterEach, beforeEach, describe, expect, test } from "bun:test";
-import { mkdtempSync, rmSync } from "node:fs";
-import { tmpdir } from "node:os";
-import { join } from "node:path";
-import React from "react";
-import { testRender } from "@opentui/react/test-utils";
-import { DaemonServer } from "@cueloop/daemon";
-import type { ReviewSession } from "@cueloop/schema";
-import { App } from "./App";
-import {
-  clickText,
-  isolateUserConfig,
-  press,
-  pressKey,
-  typeText as type,
-  waitForState,
-  waitForText,
-  waitForTextGone,
-} from "./test-support";
-
-const PLAN = `# Migration Plan
-
-## Context
-
-The daemon persists sessions to disk atomically.
-
-## Steps
-
-- move the store
-- add recovery
-`;
-
-let home: string;
-let server: DaemonServer;
-let session: ReviewSession;
-let restoreUserConfig: () => void;
-
-beforeEach(() => {
-  home = mkdtempSync(join(tmpdir(), "cueloop-tree-"));
-  restoreUserConfig = isolateUserConfig(home);
-  server = new DaemonServer({ home, idleExitMs: 0 });
-  server.start();
-  session = server.core.sessionCreate({
-    workspace: { repoRoot: "/repo", branch: "main" },
-    artifact: {
-      type: "plan",
-      content: PLAN,
-      meta: { title: "Migration Plan", planPath: "plan.md", agent: "agent/worker-3" },
-    },
-  });
-});
-afterEach(() => {
-  restoreUserConfig();
-  server.stop();
-  rmSync(home, { recursive: true, force: true });
-});
-
-async function renderApp(role: "owner" | "collaborator" = "owner") {
-  const setup = await testRender(<App home={home} sessionId={session.id} role={role} />, {
-    width: 120,
-    height: 32,
-  });
-
-  await waitForText(setup, "cueloop");
-
-  return setup;
-}
-
-type Setup = Awaited<ReturnType<typeof renderApp>>;
-
-/** Leave a comment on the word, sent with the terminal-safe chord. */
-async function comment(setup: Setup, word: string, body: string): Promise<void> {
-  await clickText(setup, word);
-  await type(setup, body);
-  await pressKey(setup, "RETURN", { meta: true });
-  await waitForText(setup, body);
-}
-
-/** Frames painted until the needle leaves the screen, starting right after a key with no settle. */
-async function framesUntilGone(setup: Setup, needle: string, limit = 4): Promise<number> {
-  for (let frame = 1; frame <= limit; frame++) {
-    await new Promise((resolve) => setTimeout(resolve, 0));
-    await setup.renderOnce();
-    if (!setup.captureCharFrame().includes(needle)) return frame;
-  }
-  throw new Error(`"${needle}" never left the frame`);
-}
-
-describe("the Tree tab", () => {
-  test("option+t shows the tree: the revision, the comments, the current tip, a checkpoint", async () => {
-    // Arrange
-    const setup = await renderApp();
-
-    await comment(setup, "daemon", "Which daemon?");
-
-    // Act
-    await pressKey(setup, "t", { meta: true });
-    await waitForText(setup, "● comment");
-    await pressKey(setup, "l", { meta: true });
-    await waitForText(setup, "Checkpoint");
-    await type(setup, "first pass");
-    await press(setup, "enter");
-
-    // Assert: the tip row carries the branch and the new label
-    await waitForText(setup, "⚑ first pass");
-    expect(setup.captureCharFrame()).toContain("◉ revision 1");
-    expect(setup.captureCharFrame()).toContain("← main");
-    await waitForState(
-      setup,
-      () => Object.values(server.core.sessionGet(session.id).history!.labels)[0] === "first pass",
-    );
-  });
-
-  test("option+b branches; option+p / option+g move back and the path repaints in one frame", async () => {
-    // Arrange: a comment on main, a branch, a second comment on it
-    const setup = await renderApp();
-
-    await comment(setup, "daemon", "Which daemon?");
-    await pressKey(setup, "t", { meta: true });
-    await waitForText(setup, "● comment");
-    await pressKey(setup, "b", { meta: true });
-    await waitForText(setup, "Branch");
-    await type(setup, "alt");
-    await press(setup, "enter");
-    await waitForText(setup, "← main, alt");
-    await comment(setup, "recovery", "Only on alt.");
-    await waitForText(setup, "● comment  ← alt");
-
-    // Act: stand on the revision (two rows up from alt's tip) and move back to it
-    await pressKey(setup, "p", { meta: true });
-    await pressKey(setup, "p", { meta: true });
-    await pressKey(setup, "g", { meta: true });
-    await waitForText(setup, "Move back");
-    setup.mockInput.pressKey("RETURN");
-
-    // Assert: both comments leave the document in the frame after the key; the record follows
-    expect(await framesUntilGone(setup, "Only on alt.")).toBeLessThanOrEqual(1);
-    expect(setup.captureCharFrame()).not.toContain("Which daemon?");
-    await waitForState(setup, () => {
-      const record = server.core.sessionGet(session.id);
-
-      return (
-        record.history!.branch === "alt" &&
-        record.annotations.length === 0 &&
-        record.shelvedAnnotations?.length === 2
-      );
-    });
-
-    // Act: main's tip is the first comment - going there is a switch, no prompt
-    await pressKey(setup, "n", { meta: true });
-    await pressKey(setup, "g", { meta: true });
-
-    // Assert
-    await waitForText(setup, "on branch main");
-    await waitForText(setup, "Which daemon?");
-    expect(setup.captureCharFrame()).not.toContain("Only on alt.");
-    await waitForState(setup, () => server.core.sessionGet(session.id).history!.branch === "main");
-  });
-
-  test("the mouse reaches the same primitives: the tab, a row, and the buttons", async () => {
-    // Arrange
-    const setup = await renderApp();
-
-    await comment(setup, "daemon", "Which daemon?");
-
-    // Act: open the tab, select the revision row, open the label prompt from its button
-    await clickText(setup, "Tree");
-    await waitForText(setup, "◉ revision 1");
-    await clickText(setup, "◉ revision 1");
-    await clickText(setup, "Label");
-
-    // Assert
-    await waitForText(setup, "Checkpoint");
-    await press(setup, "escape");
-    await waitForTextGone(setup, "Checkpoint");
-
-    // Act: a second click on the selected row goes there - a move back asks for a summary
-    await clickText(setup, "◉ revision 1");
-    await waitForText(setup, "Move back");
-  });
-
-  test("a collaborator reads the tree and cannot move it", async () => {
-    // Arrange
-    const setup = await renderApp("collaborator");
-
-    // Act
-    await pressKey(setup, "t", { meta: true });
-    await waitForText(setup, "● revision 1");
-    await pressKey(setup, "b", { meta: true });
-
-    // Assert: no prompt, the read-only answer, no buttons
-    await waitForText(setup, "observer - read-only");
-    expect(setup.captureCharFrame()).not.toContain("Fork+share");
-
-    // Act: two clicks on the revision row select it and nothing more
-    await clickText(setup, "● revision 1");
-    await clickText(setup, "● revision 1");
-
-    // Assert: no prompt opened, the record stands
-    expect(setup.captureCharFrame()).not.toContain("Move back");
-    expect(server.core.sessionGet(session.id).history!.entries).toHaveLength(1);
-  });
-
-  test("a resolved review keeps the fork buttons and drops the moving ones", async () => {
-    // Arrange
-    server.core.sessionResolve(session.id, "approve", "ship it");
-    const setup = await renderApp();
-
-    // Act
-    await pressKey(setup, "t", { meta: true });
-    await waitForText(setup, "Fork+share");
-
-    // Assert
-    expect(setup.captureCharFrame()).not.toContain("Branch");
-    expect(setup.captureCharFrame()).not.toContain("Label");
-  });
-});

package/src/components/ReviewPanel.stories.tsx

@@ -1,100 +0,0 @@
-import React from "react";
-import { DARK } from "../theme";
-import { REVIEW_MAX_WIDTH, REVIEW_MIN_WIDTH } from "../review-panel";
-import type { Story, StoryMeta } from "./story";
-import { ReviewPanel } from "./ReviewPanel";
-import { FIXTURE_ANNOTATIONS, fixturePlanSession } from "./story-fixtures";
-
-export const meta: StoryMeta = { title: "ReviewPanel" };
-
-/** An empty Tree tab: the stories here show the review tab. */
-const tree = {
-  rows: [],
-  canMove: true,
-  canFork: true,
-  onSelect: () => {},
-  onGo: () => {},
-  onBranch: () => {},
-  onLabel: () => {},
-  onFork: () => {},
-  onForkAndShare: () => {},
-};
-
-const rail = {
-  session: fixturePlanSession(),
-  tree,
-  authorNames: {},
-  selectedId: FIXTURE_ANNOTATIONS[0]!.id,
-  resolvedIds: new Set(FIXTURE_ANNOTATIONS.map((annotation) => annotation.id)),
-  curationItems: [],
-  railTab: "review" as const,
-  pendingCount: 2,
-  cardEdit: null,
-  submitConfirm: null,
-  onTabChange: () => {},
-  onSelectCard: () => {},
-  onActivateCard: () => {},
-  onSelectCuration: () => {},
-  onUndoCuration: () => {},
-  onSubmitRequest: () => {},
-  onLaunchHarness: () => {},
-};
-
-const panelCallbacks = { onDividerGrab: () => {}, onToggle: () => {} };
-
-/** The plan area to the left of the divider, so the layout reads in context. */
-function PanelFrame({ children }: { children: React.ReactNode }): React.ReactNode {
-  return (
-    <box
-      style={{
-        flexDirection: "row",
-        width: "100%",
-        height: "100%",
-        backgroundColor: DARK.background,
-      }}
-    >
-      <box style={{ flexGrow: 1, paddingLeft: 1 }}>
-        <text fg={DARK.textMuted}>The plan takes the width the panel hands back.</text>
-      </box>
-      {children}
-    </box>
-  );
-}
-
-export const ExpandedNarrow: Story = {
-  render: () => (
-    <PanelFrame>
-      <ReviewPanel mode="expanded" width={REVIEW_MIN_WIDTH} rail={rail} {...panelCallbacks} />
-    </PanelFrame>
-  ),
-  size: { width: 80, height: 24 },
-};
-
-export const ExpandedWide: Story = {
-  render: () => (
-    <PanelFrame>
-      <ReviewPanel mode="expanded" width={REVIEW_MAX_WIDTH} rail={rail} {...panelCallbacks} />
-    </PanelFrame>
-  ),
-  expectedColors: [DARK.accent],
-  size: { width: 90, height: 24 },
-};
-
-export const Compact: Story = {
-  render: () => (
-    <PanelFrame>
-      <ReviewPanel mode="compact" width={34} rail={rail} {...panelCallbacks} />
-    </PanelFrame>
-  ),
-  expectedColors: [DARK.accent],
-  size: { width: 60, height: 24 },
-};
-
-export const Hidden: Story = {
-  render: () => (
-    <PanelFrame>
-      <ReviewPanel mode="hidden" width={34} rail={rail} {...panelCallbacks} />
-    </PanelFrame>
-  ),
-  size: { width: 60, height: 24 },
-};

package/src/components/ReviewPanel.tsx

@@ -1,103 +0,0 @@
-/**
- * The review surface's outer shell: the grabbable divider plus the rail in one
- * of three modes - expanded (the full ReviewRail, resizable), compact (a narrow
- * count + dots strip that hands width back to the plan), or hidden (nothing at
- * all, no leftover tab). The keybinding cycles all three; the clickable chevron
- * toggles expanded and compact only. App owns the width/mode state and the drag
- * on the container; this file only reads them. The geometry (width clamp, the
- * divider glyph column, the cycle) lives in review-panel.ts so this stays
- * declarative.
- */
-
-import React from "react";
-import type { Annotation } from "@cueloop/schema";
-import type { Theme } from "../theme";
-import { useComponentTheme } from "./theme-context";
-import { ReviewRail, type ReviewRailHandle, type ReviewRailProps } from "./ReviewRail";
-import { REVIEW_COMPACT_WIDTH, type ReviewPanelMode } from "../review-panel";
-
-export interface ReviewPanelProps {
-  mode: ReviewPanelMode;
-  /** Expanded-rail width in columns (already clamped by the app). */
-  width: number;
-  /** Arm a divider drag; the app tracks the drag itself on the container. */
-  onDividerGrab: () => void;
-  /** Chevron click: expanded <-> compact (never hidden). */
-  onToggle: () => void;
-  /** The expanded ReviewRail's props; width and onCollapse are supplied here. */
-  rail: Omit<ReviewRailProps, "width" | "onCollapse" | "theme">;
-  railRef?: React.Ref<ReviewRailHandle>;
-  theme?: Theme;
-}
-
-/** An invisible, full-height grab column: the plan's right border is the seam. */
-function ReviewDivider({ onGrab }: { onGrab: () => void }): React.ReactNode {
-  // childless: it stretches to the row height like the plan and rail beside it,
-  // so the three columns share one bottom edge. Invisible, but full-height grab.
-  return <box style={{ width: 1 }} onMouseDown={onGrab} />;
-}
-
-/** The compact strip: the card count, one kind-colored dot per card, and the
- *  `<` expand chevron, bottom-padded to sit at the same row as the expanded `>`. */
-function CompactRail({
-  annotations,
-  onExpand,
-  theme,
-}: {
-  annotations: Annotation[];
-  onExpand: () => void;
-  theme?: Theme;
-}): React.ReactNode {
-  const tokens = useComponentTheme(theme);
-
-  return (
-    <box
-      style={{
-        width: REVIEW_COMPACT_WIDTH,
-        backgroundColor: tokens.panel,
-        flexDirection: "column",
-        paddingTop: 1,
-        paddingBottom: 1,
-      }}
-    >
-      <box style={{ alignItems: "center" }}>
-        <text fg={tokens.accent}>{String(annotations.length)}</text>
-      </box>
-      <box style={{ height: 1 }} />
-      <box style={{ flexDirection: "column", alignItems: "center" }}>
-        {annotations.map((annotation) => (
-          <text key={annotation.id} fg={tokens.accent}>
-            ●
-          </text>
-        ))}
-      </box>
-      <box style={{ flexGrow: 1 }} />
-      <box style={{ paddingLeft: 1 }} onMouseUp={onExpand}>
-        <text fg={tokens.textDim}>{"<"}</text>
-      </box>
-    </box>
-  );
-}
-
-export function ReviewPanel({
-  mode,
-  width,
-  onDividerGrab,
-  onToggle,
-  rail,
-  railRef,
-  theme,
-}: ReviewPanelProps): React.ReactNode {
-  if (mode === "hidden") return null;
-
-  return (
-    <>
-      <ReviewDivider onGrab={onDividerGrab} />
-      {mode === "expanded" ? (
-        <ReviewRail ref={railRef} {...rail} width={width} onCollapse={onToggle} theme={theme} />
-      ) : (
-        <CompactRail annotations={rail.session.annotations} onExpand={onToggle} theme={theme} />
-      )}
-    </>
-  );
-}