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

package/src/App.readonly.test.tsx

@@ -1,4 +1,4 @@
-/** Observer mode (tier 2): the App with readOnly renders and navigates like the controller's, but every mutating verb answers "observer - read-only" and leaves daemon state untouched. */
+/** Observer mode (tier 2): the App with readOnly renders and navigates like the controller's, but every mutating primitive answers "observer - read-only" and leaves daemon state untouched. */
 
 import { afterEach, beforeEach, describe, expect, test } from "bun:test";
 import { mkdtempSync, rmSync } from "node:fs";
@@ -10,7 +10,16 @@ import { DaemonServer } from "@cueloop/daemon";
 import { makeAnchor, parseBlocks, type ReviewSession } from "@cueloop/schema";
 import { App } from "./App";
 import { DARK } from "./theme";
-import { isolateUserConfig, press, waitForState, waitForText } from "./test-support";
+import {
+  clickText,
+  dragText,
+  frameRow,
+  isolateUserConfig,
+  pressKey,
+  typeText,
+  waitForState,
+  waitForText,
+} from "./test-support";
 
 const PLAN = `# Migration Plan
 
@@ -60,7 +69,9 @@ async function renderObserver() {
   return setup;
 }
 
-/** Session state that any mutating verb would change. */
+type Setup = Awaited<ReturnType<typeof renderObserver>>;
+
+/** Session state that any mutating primitive would change. */
 function snapshot() {
   const stored = server.core.sessionGet(session.id);
 
@@ -84,67 +95,101 @@ describe("observer rendering", () => {
   });
 });
 
-describe("observer verbs are blocked", () => {
-  for (const [key, verb] of [
-    ["c", "comment"],
-    ["x", "cut"],
-    ["e", "edit"],
-    ["enter", "submit"],
-  ] as const) {
-    test(`${verb} (${key}) answers observer - read-only and mutates nothing`, async () => {
+describe("observer primitives are blocked", () => {
+  const attempts: Array<[string, (setup: Setup) => Promise<void>]> = [
+    ["comment (typing)", (setup) => typeText(setup, "c")],
+    ["cut (option+x)", (setup) => pressKey(setup, "x", { meta: true })],
+    ["edit (ctrl+e)", (setup) => pressKey(setup, "e", { ctrl: true })],
+    ["submit (cmd+enter)", (setup) => pressKey(setup, "RETURN", { meta: true })],
+  ];
+
+  for (const [primitive, attempt] of attempts) {
+    test(`${primitive} answers observer - read-only and mutates nothing`, async () => {
       const setup = await renderObserver();
       const before = snapshot();
 
-      await press(setup, "j");
-      await press(setup, "j");
-      await press(setup, key);
+      await clickText(setup, "daemon");
+      await attempt(setup);
       const frame = await waitForText(setup, "observer - read-only");
 
-      // no overlay opened: compose/submit bars never appear
-      expect(frame).not.toContain('comment on "');
-      expect(frame).not.toContain("verdict ←/→");
+      // no draft card and no submit card ever appear
+      expect(frame).not.toContain("● c");
+      expect(frame).not.toContain("[Approve]");
       expect(snapshot()).toEqual(before);
     });
   }
 
-  test("span mode c is blocked too", async () => {
+  test("typing over a marked span is blocked too", async () => {
     // Arrange
     const setup = await renderObserver();
 
     // Act
-    await press(setup, "j");
-    await press(setup, "j");
-    await press(setup, "v");
-    await press(setup, "c");
-    await setup.renderOnce();
+    await dragText(setup, "The daemon", "daemon persists", "daemon".length);
+    await typeText(setup, "c");
 
     // Assert
-    const frame = setup.captureCharFrame();
+    const frame = await waitForText(setup, "observer - read-only");
 
-    expect(frame).toContain("observer - read-only");
-    expect(frame).not.toContain('comment on "');
+    expect(frame).not.toContain("● c");
     expect(snapshot().annotations).toBe(0);
   });
 });
 
+describe("a resolved review is read-only for its owner too", () => {
+  test("typing, deleting a card, and editing answer review submitted - read-only", async () => {
+    // Arrange: a comment exists and the verdict is in
+    server.core.sessionAnnotate(session.id, {
+      id: "a_done",
+      kind: "comment",
+      anchor: makeAnchor(parseBlocks(PLAN), 2, 0, 10),
+      body: "settled",
+    });
+    server.core.sessionResolve(session.id, "approve", "");
+    const setup = await testRender(<App home={home} sessionId={session.id} />, {
+      width: 120,
+      height: 32,
+    });
+
+    await waitForText(setup, "settled");
+    const before = snapshot();
+
+    // Act + Assert: a draft never opens
+    await clickText(setup, "daemon");
+    await typeText(setup, "c");
+    await waitForText(setup, "review submitted - read-only");
+    expect(setup.captureCharFrame()).not.toContain("● c");
+
+    // Act + Assert: the focused card cannot be deleted or edited
+    await pressKey(setup, "n", { meta: true });
+    await pressKey(setup, "BACKSPACE", { meta: true });
+    await pressKey(setup, "e", { meta: true });
+    await pressKey(setup, "x", { meta: true });
+    expect(snapshot()).toEqual(before);
+    expect(server.core.sessionGet(session.id).annotations).toHaveLength(1);
+  });
+});
+
 describe("observer navigation still works", () => {
-  test("j/k moves the cursor between blocks", async () => {
+  test("↓ moves the caret between blocks", async () => {
     // Arrange
     const setup = await renderObserver();
 
     // Act
-    await press(setup, "j");
-    await press(setup, "j");
+    await pressKey(setup, "ARROW_DOWN");
+    await pressKey(setup, "ARROW_DOWN");
     await setup.renderOnce();
 
-    // Assert
-    const lines = setup.captureCharFrame().split("\n");
-    const cursorLine = lines.find((line) => line.includes("▎"))!;
+    // Assert: the caret cell is painted on the paragraph's row
+    const caretRow = setup
+      .captureSpans()
+      .lines.findIndex((line) =>
+        line.spans.some((span) => span.bg.toInts().slice(0, 3).join() === "86,91,104"),
+      );
 
-    expect(cursorLine).toContain("persists sessions");
+    expect(caretRow).toBe(frameRow(setup, "persists sessions"));
   });
 
-  test("n focuses annotations made by the controller", async () => {
+  test("option+n focuses annotations made by the controller", async () => {
     // Arrange
     server.core.sessionAnnotate(session.id, {
       id: "a_obs1",
@@ -155,7 +200,7 @@ describe("observer navigation still works", () => {
     const setup = await renderObserver();
 
     // Act
-    await press(setup, "n");
+    await pressKey(setup, "n", { meta: true });
     await setup.renderOnce();
 
     // Assert - focus shows as the card's blue border (transparent fill); a

package/src/App.rendering.test.tsx

@@ -83,10 +83,9 @@ describe("code blocks", () => {
 });
 
 describe("block spacing", () => {
-  // the review panel's full-height divider paints a `│` on every row, so read
-  // the plan column (everything left of the divider) before asserting spacing
-  // the plan body is framed: content sits between the left border and the next │
-  const planColumn = (line: string): string => line.split("│")[1]?.trimEnd() ?? "";
+  // the review rail paints box edges on the right, so read the document
+  // column (everything left of the first rail glyph) before asserting spacing
+  const planColumn = (line: string): string => line.split(/[│╭╰]/)[0]!.trimEnd();
 
   test("a code block never glues to the list item above it", async () => {
     // Arrange
@@ -129,8 +128,8 @@ describe("block spacing", () => {
       .captureCharFrame()
       .split("\n")
       .map((line) => line.trimEnd());
-    const one = lines.findIndex((line) => line.includes("- one"));
+    const one = lines.findIndex((line) => line.includes("· one"));
 
-    expect(lines[one + 1]).toContain("- two");
+    expect(lines[one + 1]).toContain("· two");
   });
 });

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

@@ -10,7 +10,7 @@ import { DaemonServer } from "@cueloop/daemon";
 import type { ReviewSession } from "@cueloop/schema";
 import { App } from "./App";
 import { loadConfig } from "./config";
-import { isolateUserConfig, press, settle, waitForText, waitForTextGone } from "./test-support";
+import { isolateUserConfig, settle, waitForText, waitForTextGone, pressKey } from "./test-support";
 
 const PLAN = "# Plan\n\nShip the thing.\n";
 
@@ -49,43 +49,40 @@ async function renderApp() {
 }
 
 describe("review panel", () => {
-  test("b cycles expanded -> compact -> hidden -> expanded", async () => {
+  test("ctrl+r cycles expanded -> compact -> hidden -> expanded", async () => {
     // Arrange
     const setup = await renderApp();
-    // the plan frame widens as the rail shrinks: expanded < compact < hidden.
-    // its width is the column of its top-right corner (the first ╮ on the row).
-    const planWidth = () =>
-      setup
-        .captureCharFrame()
-        .split("\n")
-        .find((line) => line.includes("╮"))
-        ?.indexOf("╮") ?? 0;
-
-    // Assert: expanded shows the submit button and leaves room for the rail
-    expect(setup.captureCharFrame()).toContain("Submit review");
-    const expandedWidth = planWidth();
+    // 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 press(setup, "b");
+    await pressKey(setup, "r", { ctrl: true });
 
-    // Assert: compact drops the submit button and widens the plan (rail is a strip)
+    // Assert: compact drops the tabs and the button, keeps the strip
     await waitForTextGone(setup, "Submit review");
-    const compactWidth = planWidth();
-
-    expect(compactWidth).toBeGreaterThan(expandedWidth);
+    expect(railSignature()).toEqual({ tabs: false, submit: false, strip: true });
 
     // Act
-    await press(setup, "b");
+    await pressKey(setup, "r", { ctrl: true });
     await settle(setup);
 
-    // Assert: hidden spans the plan full width, no rail column
-    const hiddenWidth = planWidth();
-
-    expect(hiddenWidth).toBeGreaterThan(compactWidth);
-    expect(hiddenWidth).toBeGreaterThan(115);
+    // Assert: hidden draws no rail at all
+    expect(railSignature()).toEqual({ tabs: false, submit: false, strip: false });
 
     // Act
-    await press(setup, "b");
+    await pressKey(setup, "r", { ctrl: true });
 
     // Assert
     await waitForText(setup, "Submit review"); // back to expanded
@@ -96,19 +93,19 @@ describe("review panel", () => {
     const setup = await renderApp();
 
     // Act
-    await press(setup, "b"); // -> compact
+    await pressKey(setup, "r", { ctrl: true }); // -> compact
 
     // Assert
     expect(loadConfig({ userConfigPath: configPath }).ui.reviewState).toBe("compact");
   });
 
-  test("] widens the rail and persists the new width", async () => {
+  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 press(setup, "]");
+    await pressKey(setup, "w", { meta: true });
 
     // Assert
     const widened = loadConfig({ userConfigPath: configPath }).ui.reviewWidth;
@@ -120,15 +117,15 @@ describe("review panel", () => {
     // Arrange
     const setup = await renderApp();
 
-    await press(setup, "b"); // -> compact
-    await press(setup, "b"); // -> hidden
+    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 press(setup, "enter"); // submit while hidden must not trap in an invisible modal
+    await pressKey(setup, "RETURN", { meta: true }); // submit while hidden must not trap in an invisible modal
 
     // Assert
     await waitForText(setup, "submit review");

package/src/App.submit-confirm.test.tsx

@@ -9,7 +9,14 @@ import { testRender } from "@opentui/react/test-utils";
 import { DaemonServer } from "@cueloop/daemon";
 import { makeAnchor, parseBlocks, type ReviewSession } from "@cueloop/schema";
 import { App } from "./App";
-import { isolateUserConfig, press, settle, waitForText, waitForTextGone } from "./test-support";
+import {
+  isolateUserConfig,
+  press,
+  pressKey,
+  settle,
+  waitForText,
+  waitForTextGone,
+} from "./test-support";
 
 const PLAN = `# Migration Plan
 
@@ -85,7 +92,7 @@ describe("rail submit confirm", () => {
     expect(setup.captureCharFrame()).toContain("Submit review");
 
     // Act
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForText(setup, "submit review");
@@ -102,7 +109,7 @@ describe("rail submit confirm", () => {
     // Arrange
     const setup = await renderApp();
 
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForText(setup, "[Approve]");
@@ -130,7 +137,7 @@ describe("rail submit confirm", () => {
     // Arrange
     const setup = await renderApp();
 
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForText(setup, "[Approve]");
@@ -152,7 +159,7 @@ describe("rail submit confirm", () => {
     const setup = await renderApp();
 
     // Act
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForText(setup, "[Changes]"); // pending items: request changes default
@@ -173,26 +180,34 @@ describe("rail submit confirm", () => {
     expect(stored.verdict!.kind).toBe("request_changes");
   });
 
+  /** The rail's columns of the frame, so document text never leaks into a rail assertion. */
+  function railText(frame: string): string {
+    const rows = frame.split("\n");
+    const railColumn = rows.find((row) => row.includes("Review  Tree  Agent"))!.indexOf("│");
+
+    return rows.map((row) => row.slice(railColumn)).join("\n");
+  }
+
   test("the annotation stack stays scrollable while the card is open", async () => {
     // Arrange
     seedAnnotations(12);
     const setup = await renderApp();
 
     // Act
-    // walk annotation focus to the last card: the rail scrolls it into view
-    for (let index = 0; index < 12; index++) await press(setup, "n");
+    // walk card focus to the last one: the rail scrolls it into view
+    for (let index = 0; index < 12; index++) await pressKey(setup, "n", { meta: true });
 
     // Assert
     await waitForText(setup, "note 12");
-    expect(setup.captureCharFrame()).not.toContain("note 01");
+    expect(railText(setup.captureCharFrame())).not.toContain("note 01");
 
     // Act
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForText(setup, "[Changes]");
     // the card is pinned outside the scrollbox; the stack stays scrolled off the top
-    expect(setup.captureCharFrame()).not.toContain("note 01");
+    expect(railText(setup.captureCharFrame())).not.toContain("note 01");
 
     // Act
     // the stack still scrolls with the card open: wheel over the rail
@@ -202,7 +217,7 @@ describe("rail submit confirm", () => {
 
     // Assert
     await waitForText(setup, "note 12");
-    const scrolledWithCard = setup.captureCharFrame();
+    const scrolledWithCard = railText(setup.captureCharFrame());
 
     expect(scrolledWithCard).toContain("submit review");
     expect(scrolledWithCard).not.toContain("note 01");
@@ -214,7 +229,7 @@ describe("rail submit confirm", () => {
     const setup = await renderApp({ readOnly: true });
 
     // Act
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForText(setup, "observer - read-only");

package/src/App.test.tsx

@@ -10,8 +10,12 @@ import { DaemonServer } from "@cueloop/daemon";
 import type { ReviewSession } from "@cueloop/schema";
 import { App } from "./App";
 import {
+  clickText,
+  dragText,
+  frameRow,
   isolateUserConfig,
   press,
+  pressKey,
   typeText as type,
   waitForState,
   waitForText,
@@ -77,45 +81,36 @@ describe("plan rendering", () => {
     expect(frame).toContain("Migration Plan");
     expect(frame).toContain("Context");
     expect(frame).toContain("persists sessions to disk atomically");
-    expect(frame).toContain("- move the store");
+    expect(frame).toContain("· move the store");
     expect(frame).toContain("Review");
     expect(frame).toContain("Submit review");
   });
 });
 
-describe("keyboard grammar", () => {
-  test("j/k moves the cursor glyph between blocks", async () => {
+describe("thread view grammar", () => {
+  test("↓ moves the caret between blocks and typing anchors to the block under it", async () => {
     // Arrange
     const setup = await renderApp();
 
-    // Act
-    await press(setup, "j");
-    await press(setup, "j");
-    await setup.renderOnce();
+    // Act: two blocks down lands on the paragraph; a printable opens a draft there
+    await pressKey(setup, "ARROW_DOWN");
+    await pressKey(setup, "ARROW_DOWN");
+    await type(setup, "x");
 
-    // Assert
-    const lines = setup.captureCharFrame().split("\n");
-    const cursorLine = lines.find((line) => line.includes("▎"))!;
-
-    expect(cursorLine).toContain("persists sessions");
+    // Assert: the draft card sits right under the paragraph's row
+    await waitForText(setup, "● x");
+    expect(frameRow(setup, "● x")).toBeGreaterThan(frameRow(setup, "persists sessions"));
+    expect(frameRow(setup, "● x")).toBeLessThan(frameRow(setup, "Steps"));
   });
 
-  test("comment flow: c types a body, ⏎ saves to the daemon", async () => {
+  test("comment flow: click a word, type a body, cmd+⏎ saves to the daemon", async () => {
     // Arrange
     const setup = await renderApp();
 
     // Act
-    await press(setup, "j");
-    await press(setup, "j");
-    await press(setup, "c");
-    await setup.renderOnce();
-
-    // Assert
-    await waitForText(setup, 'comment on "The daemon');
-
-    // Act
+    await clickText(setup, "daemon");
     await type(setup, "Define atomically.");
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForText(setup, "COMMENT");
@@ -123,50 +118,44 @@ describe("keyboard grammar", () => {
 
     expect(stored.annotations.length).toBe(1);
     expect(stored.annotations[0]!.body).toBe("Define atomically.");
+    expect(stored.annotations[0]!.anchor.quote).toBe("daemon");
   });
 
-  test("span mode: v + l selects words, c anchors the exact span", async () => {
+  test("a drag marks the exact span the comment anchors to", async () => {
     // Arrange
     const setup = await renderApp();
 
-    // Act
-    await press(setup, "j");
-    await press(setup, "j");
-    await press(setup, "v");
-    await press(setup, "l"); // "The daemon"
-    await press(setup, "c");
+    // Act: from the start of "The" to the end of "daemon"
+    await dragText(setup, "The daemon", "daemon persists", "daemon".length);
     await type(setup, "Which daemon?");
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForState(setup, () => server.core.sessionGet(session.id).annotations.length === 1);
-    const stored = server.core.sessionGet(session.id);
-
-    expect(stored.annotations[0]!.anchor.quote).toBe("The daemon");
+    expect(server.core.sessionGet(session.id).annotations[0]!.anchor.quote).toBe("The daemon");
   });
 
-  test("x cuts a block into the working copy; x restores it", async () => {
+  test("option+x cuts the caret's block into the working copy; option+x restores it", async () => {
     // Arrange
     const setup = await renderApp();
 
-    // move to "- move the store" (h1, h2, p, h2 = 4 steps in)
-    for (let i = 0; i < 4; i++) await press(setup, "j");
+    await clickText(setup, "move the store");
 
     // Act
-    await press(setup, "x");
+    await pressKey(setup, "x", { meta: true });
 
     // Assert - the rail shows the cut as a removal card titled CUT · me
     await waitForText(setup, "CUT · me");
     expect(server.core.sessionGet(session.id).workingCopy).not.toContain("move the store");
 
     // Act
-    await press(setup, "x");
+    await pressKey(setup, "x", { meta: true });
 
     // Assert
     await waitForState(setup, () => server.core.sessionGet(session.id).workingCopy === undefined);
   });
 
-  test("e runs $EDITOR on the working copy and tracks the diff", async () => {
+  test("ctrl+e runs $EDITOR on the working copy and tracks the diff", async () => {
     const script = join(home, "fake-editor.sh");
 
     await Bun.write(script, `#!/bin/sh\nsed -i '' 's/atomically/very atomically/' "$1"\n`);
@@ -177,7 +166,7 @@ describe("keyboard grammar", () => {
       const setup = await renderApp();
 
       // Act
-      await press(setup, "e");
+      await pressKey(setup, "e", { ctrl: true });
 
       // Assert
       await waitForText(setup, "[edited]");
@@ -189,19 +178,17 @@ describe("keyboard grammar", () => {
 });
 
 describe("submit", () => {
-  test("⏎ opens the rail confirm card; verdict + summary resolve the session", async () => {
+  test("cmd+⏎ opens the rail confirm card; verdict + summary resolve the session", async () => {
     // Arrange
     const setup = await renderApp();
 
-    await press(setup, "j");
-    await press(setup, "j");
-    await press(setup, "c");
+    await clickText(setup, "daemon");
     await type(setup, "Needs a phase list.");
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
     await waitForText(setup, "Needs a phase list");
 
-    // Act
-    await press(setup, "enter"); // open submit
+    // Act: with no composer open the same chord opens submit
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForText(setup, "[Changes]");
@@ -226,7 +213,7 @@ describe("submit", () => {
     const setup = await renderApp();
 
     // Act
-    await press(setup, "enter");
+    await pressKey(setup, "RETURN", { meta: true });
 
     // Assert
     await waitForText(setup, "[Approve]"); // no pending items → approve default
@@ -287,3 +274,40 @@ describe("inbox", () => {
     await waitForText(setup, "Submit review");
   });
 });
+
+describe("the thread view and the menu", () => {
+  test("the keybinds dialog lists the thread view grammar, keeps keys away from the text, and closes on escape", async () => {
+    // Arrange
+    const setup = await renderApp();
+
+    await waitForText(setup, "The daemon persists");
+    const lines = setup.captureCharFrame().split("\n");
+    const menuRow = lines.findIndex((line) => line.includes("menu"));
+    const menuColumn = lines[menuRow]!.indexOf("menu");
+
+    // Act - open the menu, then the keybinds dialog
+    await setup.mockMouse.click(menuColumn + 1, menuRow);
+    await waitForText(setup, "Keybinds");
+    const dropUp = setup.captureCharFrame().split("\n");
+    const keybindsRow = dropUp.findIndex((line) => line.includes("Keybinds"));
+
+    await setup.mockMouse.click(dropUp[keybindsRow]!.indexOf("Keybinds") + 1, keybindsRow);
+    await waitForText(setup, "mark text, across blocks");
+
+    // Assert - the thread grammar, not the plan sheet's
+    const dialog = setup.captureCharFrame();
+
+    expect(dialog).toContain("⌘⌥m");
+    expect(dialog).toContain("dismiss an empty draft");
+    expect(dialog).not.toContain("grow/shrink");
+
+    // Act - a printable behind the dialog must not open a comment; escape closes it
+    await press(setup, "x");
+    expect(setup.captureCharFrame()).not.toContain("● x");
+    await press(setup, "escape");
+
+    // Assert
+    await waitForState(setup, () => !setup.captureCharFrame().includes("dismiss an empty draft"));
+    expect(setup.captureCharFrame()).not.toContain("● x");
+  });
+});