@cueloop/client 0.1.0-alpha.32 → 0.1.0-alpha.34

package/src/App.readonly.test.tsx

@@ -9,7 +9,8 @@ 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, waitForText } from "./test-support";
+import { DARK } from "./theme";
+import { isolateUserConfig, press, waitForState, waitForText } from "./test-support";
 
 const PLAN = `# Migration Plan
 
@@ -35,7 +36,11 @@ beforeEach(() => {
   server.start();
   session = server.core.sessionCreate({
     workspace: { repoRoot: "/repo", branch: "main" },
-    artifact: { type: "plan", content: PLAN, meta: { title: "Migration Plan", planPath: "plan.md" } },
+    artifact: {
+      type: "plan",
+      content: PLAN,
+      meta: { title: "Migration Plan", planPath: "plan.md" },
+    },
   });
 });
 afterEach(() => {
@@ -56,26 +61,28 @@ async function renderObserver() {
 /** Session state that any mutating verb would change. */
 function snapshot() {
   const stored = server.core.sessionGet(session.id);
-  return { annotations: stored.annotations.length, workingCopy: stored.workingCopy, status: stored.status };
+  return {
+    annotations: stored.annotations.length,
+    workingCopy: stored.workingCopy,
+    status: stored.status,
+  };
 }
 
 describe("observer rendering", () => {
-  test("shows the observer badge and read-only hint bar", async () => {
+  test("shows the observer badge and the bottom menu", async () => {
     // Arrange
     const setup = await renderObserver();
 
     // Assert
     const frame = setup.captureCharFrame();
     expect(frame).toContain("· observer");
-    expect(frame).toContain("observer - read-only · j/k move");
-    expect(frame).not.toContain("⏎ submit");
+    expect(frame).toContain("menu");
   });
 });
 
 describe("observer verbs are blocked", () => {
   for (const [key, verb] of [
     ["c", "comment"],
-    ["s", "suggest"],
     ["x", "cut"],
     ["e", "edit"],
     ["enter", "submit"],
@@ -88,14 +95,13 @@ describe("observer verbs are blocked", () => {
       await press(setup, key);
       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("SUGGEST REPLACEMENT");
+      expect(frame).not.toContain('comment on "');
       expect(frame).not.toContain("verdict ←/→");
       expect(snapshot()).toEqual(before);
     });
   }
 
-  test("span mode c/s is blocked too", async () => {
+  test("span mode c is blocked too", async () => {
     // Arrange
     const setup = await renderObserver();
 
@@ -109,7 +115,7 @@ describe("observer verbs are blocked", () => {
     // Assert
     const frame = setup.captureCharFrame();
     expect(frame).toContain("observer - read-only");
-    expect(frame).not.toContain("COMMENT ON");
+    expect(frame).not.toContain('comment on "');
     expect(snapshot().annotations).toBe(0);
   });
 });
@@ -144,7 +150,23 @@ describe("observer navigation still works", () => {
     await press(setup, "n");
     await setup.renderOnce();
 
-    // Assert
-    await waitForText(setup, "▸ COMMENT");
+    // Assert - focus shows as the card's bright kind-colored border (transparent
+    // fill); a selected card is the only accent-colored border in the frame
+    await waitForText(setup, "COMMENT · me");
+    await waitForState(setup, () => hasBorderColor(setup, DARK.accent));
   });
 });
+
+/** Whether any border character (box-drawing) is painted in the given foreground hex. */
+function hasBorderColor(setup: Awaited<ReturnType<typeof renderObserver>>, hex: string): boolean {
+  for (const line of setup.captureSpans().lines) {
+    for (const span of line.spans) {
+      if (!/[╭╮╰╯│─┌┐└┘]/.test(span.text)) continue;
+      const [red, green, blue] = span.fg.toInts();
+      const rendered =
+        "#" + [red, green, blue].map((part) => part.toString(16).padStart(2, "0")).join("");
+      if (rendered === hex) return true;
+    }
+  }
+  return false;
+}

package/src/App.rendering.test.tsx

@@ -51,7 +51,10 @@ afterEach(() => {
 });
 
 async function frame(): Promise<string> {
-  const setup = await testRender(<App home={home} sessionId={session.id} />, { width: 120, height: 36 });
+  const setup = await testRender(<App home={home} sessionId={session.id} />, {
+    width: 120,
+    height: 36,
+  });
   await waitForText(setup, "Render Plan");
   // async highlights settle within the visual-idle wait
   await setup.waitForVisualIdle();
@@ -80,7 +83,8 @@ 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
-  const planColumn = (line: string): string => line.split("│")[0]!.trimEnd();
+  // the plan body is framed: content sits between the left border and the next │
+  const planColumn = (line: string): string => line.split("│")[1]?.trimEnd() ?? "";
 
   test("a code block never glues to the list item above it", async () => {
     // Arrange
@@ -111,11 +115,17 @@ describe("block spacing", () => {
       workspace: { repoRoot: "/repo", branch: "main" },
       artifact: { type: "plan", content: listPlan, meta: {} },
     });
-    const setup = await testRender(<App home={home} sessionId={s2.id} />, { width: 120, height: 30 });
+    const setup = await testRender(<App home={home} sessionId={s2.id} />, {
+      width: 120,
+      height: 30,
+    });
     await waitForText(setup, "one");
 
     // Assert
-    const lines = setup.captureCharFrame().split("\n").map((line) => line.trimEnd());
+    const lines = setup
+      .captureCharFrame()
+      .split("\n")
+      .map((line) => line.trimEnd());
     const one = lines.findIndex((line) => line.includes("- one"));
     expect(lines[one + 1]).toContain("- two");
   });

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

@@ -1,7 +1,7 @@
 /** 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, readFileSync, rmSync } from "node:fs";
+import { mkdtempSync, rmSync } from "node:fs";
 import { tmpdir } from "node:os";
 import { join } from "node:path";
 import React from "react";
@@ -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, waitForText, waitForTextGone } from "./test-support";
+import { isolateUserConfig, press, settle, waitForText, waitForTextGone } from "./test-support";
 
 const PLAN = "# Plan\n\nShip the thing.\n";
 
@@ -38,7 +38,10 @@ afterEach(() => {
 });
 
 async function renderApp() {
-  const setup = await testRender(<App home={home} sessionId={session.id} />, { width: 120, height: 30 });
+  const setup = await testRender(<App home={home} sessionId={session.id} />, {
+    width: 120,
+    height: 30,
+  });
   await waitForText(setup, "Review");
   return setup;
 }
@@ -47,26 +50,35 @@ describe("review panel", () => {
   test("b cycles expanded -> compact -> hidden -> expanded", async () => {
     // Arrange
     const setup = await renderApp();
-
-    // Assert
-    expect(setup.captureCharFrame()).toContain("Submit review"); // expanded rail
+    // 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();
 
     // Act
     await press(setup, "b");
 
-    // Assert
-    await waitForText(setup, "«");
-    let frame = setup.captureCharFrame();
-    expect(frame).toContain("«"); // compact strip shows the expand chevron
-    expect(frame).not.toContain("Submit review");
+    // Assert: compact drops the submit button and widens the plan (rail is a strip)
+    await waitForTextGone(setup, "Submit review");
+    const compactWidth = planWidth();
+    expect(compactWidth).toBeGreaterThan(expandedWidth);
 
     // Act
     await press(setup, "b");
+    await settle(setup);
 
-    // Assert
-    frame = await waitForTextGone(setup, "«");
-    expect(frame).not.toContain("«"); // hidden: no strip, no divider
-    expect(frame).not.toContain("│");
+    // Assert: hidden spans the plan full width, no rail column
+    const hiddenWidth = planWidth();
+    expect(hiddenWidth).toBeGreaterThan(compactWidth);
+    expect(hiddenWidth).toBeGreaterThan(115);
 
     // Act
     await press(setup, "b");

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

@@ -35,7 +35,11 @@ beforeEach(() => {
   server.start();
   session = server.core.sessionCreate({
     workspace: { repoRoot: "/repo", branch: "main" },
-    artifact: { type: "plan", content: PLAN, meta: { title: "Migration Plan", planPath: "plan.md" } },
+    artifact: {
+      type: "plan",
+      content: PLAN,
+      meta: { title: "Migration Plan", planPath: "plan.md" },
+    },
   });
 });
 afterEach(() => {
@@ -45,16 +49,17 @@ afterEach(() => {
 });
 
 async function renderApp(options: { readOnly?: boolean } = {}) {
-  const setup = await testRender(<App home={home} sessionId={session.id} readOnly={options.readOnly ?? false} />, {
-    width: 120,
-    height: 32,
-  });
+  const setup = await testRender(
+    <App home={home} sessionId={session.id} readOnly={options.readOnly ?? false} />,
+    {
+      width: 120,
+      height: 32,
+    },
+  );
   await waitForText(setup, "cueloop");
   return setup;
 }
 
-type Setup = Awaited<ReturnType<typeof renderApp>>;
-
 /** Seed annotations directly through the daemon core (all on one block). */
 function seedAnnotations(count: number): void {
   const blocks = parseBlocks(PLAN);
@@ -74,7 +79,7 @@ describe("rail submit confirm", () => {
     const setup = await renderApp();
 
     // Assert
-    expect(setup.captureCharFrame()).toContain("Submit review (0)");
+    expect(setup.captureCharFrame()).toContain("Submit review");
 
     // Act
     await press(setup, "enter");
@@ -88,10 +93,6 @@ describe("rail submit confirm", () => {
     expect(frame).toContain("[Approve]"); // nothing pending: approve default
     expect(frame).toContain(" Submit ");
     expect(frame).toContain(" Cancel ");
-    // key hints live in the status line, not on the buttons
-    expect(frame).toContain("verdict ←/→ · ⏎ submit · esc cancel");
-    // the bottom bar stayed a one-line hint: no detached verdict bar
-    expect(frame).not.toContain("Submit review (0) on ⏎");
   });
 
   test("left/right cycles the verdict selector in the card", async () => {
@@ -136,7 +137,7 @@ describe("rail submit confirm", () => {
     // a bare ESC settles after the parser's escape-sequence window
     const frame = await waitForTextGone(setup, "[Approve]");
     expect(frame).not.toContain("0 annotations");
-    expect(frame).toContain("Submit review (0)");
+    expect(frame).toContain("Submit review");
   });
 
   test("enter in the card resolves the session through the controller", async () => {

package/src/App.test.tsx

@@ -9,7 +9,13 @@ import { testRender } from "@opentui/react/test-utils";
 import { DaemonServer } from "@cueloop/daemon";
 import type { ReviewSession } from "@cueloop/schema";
 import { App } from "./App";
-import { isolateUserConfig, press, typeText as type, waitForState, waitForText } from "./test-support";
+import {
+  isolateUserConfig,
+  press,
+  typeText as type,
+  waitForState,
+  waitForText,
+} from "./test-support";
 
 const PLAN = `# Migration Plan
 
@@ -35,7 +41,11 @@ beforeEach(() => {
   server.start();
   session = server.core.sessionCreate({
     workspace: { repoRoot: "/repo", branch: "main" },
-    artifact: { type: "plan", content: PLAN, meta: { title: "Migration Plan", planPath: "plan.md" } },
+    artifact: {
+      type: "plan",
+      content: PLAN,
+      meta: { title: "Migration Plan", planPath: "plan.md" },
+    },
   });
 });
 afterEach(() => {
@@ -65,8 +75,8 @@ describe("plan rendering", () => {
     expect(frame).toContain("Context");
     expect(frame).toContain("persists sessions to disk atomically");
     expect(frame).toContain("- move the store");
-    expect(frame).toContain("Review (0)");
-    expect(frame).toContain("Submit review (0)");
+    expect(frame).toContain("Review");
+    expect(frame).toContain("Submit review");
   });
 });
 
@@ -138,8 +148,8 @@ describe("keyboard grammar", () => {
     // Act
     await press(setup, "x");
 
-    // Assert
-    await waitForText(setup, "[cut]");
+    // 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
@@ -179,7 +189,7 @@ describe("submit", () => {
     await press(setup, "c");
     await type(setup, "Needs a phase list.");
     await press(setup, "enter");
-    await waitForText(setup, "Review (1)");
+    await waitForText(setup, "Needs a phase list");
 
     // Act
     await press(setup, "enter"); // open submit
@@ -221,19 +231,46 @@ describe("submit", () => {
 });
 
 describe("inbox", () => {
-  test("inbox mode renders and opens a session", async () => {
+  test("inbox mode wears the review chrome (header + menu bar) and opens a session", async () => {
     // Arrange
     const setup = await testRender(<App home={home} />, { width: 120, height: 32 });
-    await waitForText(setup, "inbox");
+    await waitForText(setup, "cueloop");
 
-    // Assert
-    expect(setup.captureCharFrame()).toContain("inbox (1 pending)");
-    expect(setup.captureCharFrame()).toContain("Migration Plan");
+    // Assert - the same header/menu chrome as review, plus the session row
+    const frame = setup.captureCharFrame();
+    expect(frame).toContain("cueloop · resume");
+    expect(frame).toContain("Migration Plan");
+    expect(frame).toContain("menu"); // the shared MenuBar sits at the bottom
+    expect(frame).not.toContain("inbox ("); // the old inline header is gone
 
     // Act
     await press(setup, "enter");
 
     // Assert
-    await waitForText(setup, "Submit review (0)");
+    await waitForText(setup, "Submit review");
+  });
+
+  test("the menu opens from the inbox and escape is not a trap", async () => {
+    // Arrange
+    const setup = await testRender(<App home={home} />, { width: 120, height: 32 });
+    await waitForText(setup, "cueloop · resume");
+    const lines = setup.captureCharFrame().split("\n");
+    const menuRow = lines.findIndex((line) => line.includes("menu"));
+    const menuColumn = lines[menuRow]!.indexOf("menu");
+
+    // Act - open the drop-up from the shared menu bar
+    await setup.mockMouse.click(menuColumn + 1, menuRow);
+
+    // Assert - the drop-up options appear
+    await waitForText(setup, "Keybinds");
+    expect(setup.captureCharFrame()).toContain("Settings");
+
+    // Act - escape closes the menu (not a trap), and the inbox nav still works
+    await press(setup, "escape");
+    await waitForState(setup, () => !setup.captureCharFrame().includes("Keybinds"));
+    await press(setup, "enter");
+
+    // Assert
+    await waitForText(setup, "Submit review");
   });
 });

package/src/App.toast.test.tsx

@@ -0,0 +1,75 @@
+/** The share toast is non-modal: while it is up, escape still cancels an open overlay. */
+
+import { afterEach, beforeEach, describe, mock, 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";
+
+// the controller reaches the gateway through "./share"; stub it so `S` yields a toast
+const publishShare = mock(async () => ({ line: "ssh p_share01@cueloop.dev", copied: true }));
+mock.module("./share", () => ({
+  publishShare,
+  pullShare: mock(async () => null),
+  pushShare: mock(async () => {}),
+  shareIdFromLine: (line: string) => line.match(/^ssh (\S+)@/)?.[1],
+  collaboratorAnnotations: () => [],
+}));
+
+const { App } = await import("./App");
+const { isolateUserConfig, press, waitForText, waitForTextGone } = await import("./test-support");
+
+const PLAN = `# Migration Plan\n\n## Context\n\nThe daemon persists sessions to disk atomically.\n`;
+
+let home: string;
+let restoreUserConfig: () => void;
+let server: DaemonServer;
+let session: ReviewSession;
+
+beforeEach(() => {
+  home = mkdtempSync(join(tmpdir(), "cueloop-toast-"));
+  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" },
+    },
+  });
+});
+afterEach(() => {
+  restoreUserConfig();
+  server.stop();
+  rmSync(home, { recursive: true, force: true });
+});
+
+describe("share toast", () => {
+  test("escape cancels an open composer even while the toast is up", async () => {
+    // Arrange
+    const setup = await testRender(<App home={home} sessionId={session.id} />, {
+      width: 120,
+      height: 32,
+    });
+    await waitForText(setup, "cueloop");
+
+    // Act: share raises the toast, then open a composer under it
+    await press(setup, "S");
+    await waitForText(setup, "share link copied");
+    await press(setup, "j");
+    await press(setup, "j");
+    await press(setup, "c");
+    await waitForText(setup, 'comment on "');
+
+    // Act: escape must reach the composer, not get eaten by the toast
+    await press(setup, "escape");
+
+    // Assert: the composer closed on the first escape
+    await waitForTextGone(setup, 'comment on "');
+  });
+});