@cueloop/client 0.1.0-alpha.75 → 0.1.0-alpha.76

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@cueloop/client",
-  "version": "0.1.0-alpha.75",
+  "version": "0.1.0-alpha.76",
   "description": "The cueloop review UI: projection renderer, keyboard grammar, review rail",
   "homepage": "https://github.com/mmurakaru/cueloop#readme",
   "bugs": {
@@ -27,10 +27,10 @@
     "access": "public"
   },
   "dependencies": {
-    "@cueloop/daemon": "0.1.0-alpha.75",
-    "@cueloop/extension-api": "0.1.0-alpha.75",
-    "@cueloop/integration-obsidian": "0.1.0-alpha.75",
-    "@cueloop/schema": "0.1.0-alpha.75",
+    "@cueloop/daemon": "0.1.0-alpha.76",
+    "@cueloop/extension-api": "0.1.0-alpha.76",
+    "@cueloop/integration-obsidian": "0.1.0-alpha.76",
+    "@cueloop/schema": "0.1.0-alpha.76",
     "@opentui/core": "^0.5.8",
     "@opentui/keymap": "0.5.8",
     "@opentui/react": "^0.5.8",

package/src/App.focus.test.ts

@@ -0,0 +1,147 @@
+import { describe, expect, test } from "bun:test";
+import {
+  appLeaderHandled,
+  nextFocusPane,
+  reconciledFocus,
+  threadsNavHandled,
+  visiblePanes,
+} from "./App";
+
+describe("threads keyboard nav", () => {
+  const base = () => {
+    let cursor = 1;
+    let opened = 0;
+
+    return {
+      setInboxCursor: (update: (cursor: number) => number) => (cursor = update(cursor)),
+      openSession: () => (opened += 1),
+      read: () => ({
+        get cursor() {
+          return cursor;
+        },
+        get opened() {
+          return opened;
+        },
+      }),
+    };
+  };
+
+  test("moves the cursor and opens only when the Threads pane is quiet and focused", () => {
+    const spy = base();
+    const call = (name: string) =>
+      threadsNavHandled({
+        focusedPane: "threads",
+        quiet: true,
+        key: { name },
+        count: 3,
+        setInboxCursor: spy.setInboxCursor,
+        openSession: spy.openSession,
+      });
+
+    expect(call("down")).toBe(true);
+    expect(spy.read().cursor).toBe(2);
+    expect(call("down")).toBe(true); // clamps at the last row
+    expect(spy.read().cursor).toBe(2);
+    expect(call("k")).toBe(true);
+    expect(spy.read().cursor).toBe(1);
+    expect(call("return")).toBe(true);
+    expect(spy.read().opened).toBe(1);
+  });
+
+  test("defers when another pane is focused, keys are owned elsewhere, or the inbox is empty", () => {
+    const spy = base();
+    const params = {
+      quiet: true,
+      key: { name: "down" },
+      count: 3,
+      setInboxCursor: spy.setInboxCursor,
+      openSession: spy.openSession,
+    };
+
+    expect(threadsNavHandled({ ...params, focusedPane: "changes" })).toBe(false);
+    expect(threadsNavHandled({ ...params, focusedPane: "threads", quiet: false })).toBe(false);
+    expect(threadsNavHandled({ ...params, focusedPane: "threads", count: 0 })).toBe(false);
+    expect(spy.read().cursor).toBe(1);
+  });
+});
+
+describe("pane focus cycle", () => {
+  test("visiblePanes lists only the open panes, in reading order", () => {
+    expect(visiblePanes(true, true, true, true)).toEqual([
+      "threads",
+      "thread",
+      "changes",
+      "project",
+    ]);
+    expect(visiblePanes(true, false, true, true)).toEqual(["threads", "changes", "project"]);
+    expect(visiblePanes(false, false, true, false)).toEqual(["changes"]);
+  });
+
+  test("nextFocusPane wraps forward and back over the visible panes", () => {
+    const panes = visiblePanes(true, false, true, true);
+
+    expect(nextFocusPane("threads", panes, false)).toBe("changes");
+    expect(nextFocusPane("project", panes, false)).toBe("threads");
+    expect(nextFocusPane("threads", panes, true)).toBe("project");
+    expect(nextFocusPane("changes", [], false)).toBe("changes");
+  });
+
+  test("reconciledFocus falls back only when the focused pane is not navigable", () => {
+    expect(reconciledFocus(["threads", "changes"], "threads")).toBeNull();
+    expect(reconciledFocus(["threads", "changes"], "thread")).toBe("threads");
+    expect(reconciledFocus(["changes", "project"], "thread")).toBe("changes");
+    expect(reconciledFocus([], "thread")).toBeNull();
+  });
+
+  test("appLeaderHandled captures the leader for the sidebar panes, then the next key", () => {
+    const leaderCombos = ["ctrl+g"];
+    const pending = { current: false };
+    const ran: string[] = [];
+    const call = (
+      focusedPane: "threads" | "project" | "thread" | "changes",
+      key: { name: string; ctrl?: boolean },
+    ) =>
+      appLeaderHandled({
+        focusedPane,
+        key,
+        leaderCombos,
+        pending,
+        runLeaderCommand: (pressed) => ran.push(pressed.name),
+      });
+
+    expect(call("threads", { name: "g", ctrl: true })).toBe(true);
+    expect(pending.current).toBe(true);
+    expect(call("threads", { name: "tab" })).toBe(true);
+    expect(pending.current).toBe(false);
+    expect(ran).toEqual(["tab"]);
+  });
+
+  test("appLeaderHandled defers on the content panes and swallows escape without a command", () => {
+    const leaderCombos = ["ctrl+g"];
+    let ran = false;
+    const runLeaderCommand = () => (ran = true);
+
+    expect(
+      appLeaderHandled({
+        focusedPane: "thread",
+        key: { name: "ctrl+g" },
+        leaderCombos,
+        pending: { current: false },
+        runLeaderCommand,
+      }),
+    ).toBe(false);
+
+    const pending = { current: true };
+    expect(
+      appLeaderHandled({
+        focusedPane: "project",
+        key: { name: "escape" },
+        leaderCombos,
+        pending,
+        runLeaderCommand,
+      }),
+    ).toBe(true);
+    expect(pending.current).toBe(false);
+    expect(ran).toBe(false);
+  });
+});

package/src/App.regression.test.tsx

@@ -0,0 +1,94 @@
+/** Regressions from the focus/perf round: ctrl+q must quit from any keyboard state, and clicking a
+ * sidebar thread must give it the selected accent at once (the cursor follows the click). */
+
+import { afterEach, beforeEach, 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 { DaemonServer } from "@cueloop/daemon";
+import { App } from "./App";
+import {
+  clickText,
+  isolateUserConfig,
+  pressKey,
+  renderReadyApp,
+  waitForText,
+} from "./test-support";
+
+const ACCENT_DARK: [number, number, number] = [203, 166, 247];
+
+let home: string;
+let restoreUserConfig: () => void;
+let server: DaemonServer;
+
+function plan(title: string): void {
+  server.core.sessionCreate({
+    workspace: { repoRoot: "/repo", branch: "main" },
+    artifact: { type: "plan", content: `# ${title}\n`, meta: { title, planPath: "plan.md" } },
+  });
+}
+
+beforeEach(() => {
+  home = mkdtempSync(join(tmpdir(), "cueloop-regression-"));
+  restoreUserConfig = isolateUserConfig(home);
+  server = new DaemonServer({ home, idleExitMs: 0 });
+  server.start();
+  plan("First review");
+  plan("Second review");
+});
+afterEach(() => {
+  restoreUserConfig();
+  server.stop();
+  rmSync(home, { recursive: true, force: true });
+});
+
+/** The text of the sidebar title span currently painted in the accent colour, or undefined. */
+function accentTitle(setup: Awaited<ReturnType<typeof renderReadyApp>>): string | undefined {
+  for (const line of setup.captureSpans().lines) {
+    for (const span of line.spans) {
+      const rgb = span.fg?.toInts();
+      if (
+        rgb &&
+        rgb[0] === ACCENT_DARK[0] &&
+        rgb[1] === ACCENT_DARK[1] &&
+        rgb[2] === ACCENT_DARK[2]
+      ) {
+        const text = span.text.trim();
+        if (text.includes("review")) return text;
+      }
+    }
+  }
+
+  return undefined;
+}
+
+test("ctrl+q quits even when a menu holds the keyboard", async () => {
+  let exitCode: number | undefined;
+  const setup = await renderReadyApp(<App home={home} onExit={(code) => (exitCode = code)} />, {
+    width: 120,
+    height: 32,
+  });
+  await waitForText(setup, "review");
+
+  // open the settings dialog from the top-left gear - it takes the keyboard
+  await setup.mockMouse.click(1, 0);
+  await waitForText(setup, "Keybinds");
+
+  await pressKey(setup, "q", { ctrl: true });
+
+  expect(exitCode).toBe(0);
+  setup.renderer.destroy();
+});
+
+test("clicking a sidebar thread gives it the selected accent at once", async () => {
+  const setup = await renderReadyApp(<App home={home} />, { width: 120, height: 32 });
+  await waitForText(setup, "Second review");
+
+  // click whichever thread is not already the selected (accent) one
+  const target = accentTitle(setup)?.includes("Second") ? "First review" : "Second review";
+  await clickText(setup, target);
+
+  expect(accentTitle(setup)).toContain(target.split(" ")[0]!);
+  setup.renderer.destroy();
+});

package/src/App.test.tsx

@@ -285,24 +285,27 @@ describe("no-thread shell", () => {
     expect(frame).toContain("Other Plan");
   });
 
-  test("the row kebab menu pins a thread into a Pinned section", async () => {
+  test("the row kebab menu stars a thread into a Starred section", async () => {
     // Arrange
     const setup = await renderReadyApp(<App home={home} />, { width: 120, height: 32 });
 
     await waitForText(setup, "Migration Plan");
 
-    // Act - hover the row to reveal its kebab, open the menu, and pick Pin
+    // Act - hover the row to reveal its kebab, open the menu, and pick Star
     const row = locateText(setup, "Migration Plan");
 
     await setup.mockMouse.moveTo(row.column, row.row);
     await waitForText(setup, "⋮");
     await clickText(setup, "⋮");
-    await waitForText(setup, "Pin");
-    await clickText(setup, "Pin");
-
-    // Assert - a Pinned section now holds the thread
-    await waitForText(setup, "Pinned");
-    expect(frameRow(setup, "Migration Plan")).toBeGreaterThan(frameRow(setup, "Pinned"));
+    // "star" alone collides with "Getting started" in the welcome pane, so target the menu via its
+    // unique "rename" row - the star action sits directly above it
+    await waitForText(setup, "rename");
+    const rename = locateText(setup, "rename");
+    await setup.mockMouse.click(rename.column, rename.row - 1);
+
+    // Assert - a Starred section now holds the thread
+    await waitForText(setup, "Starred");
+    expect(frameRow(setup, "Migration Plan")).toBeGreaterThan(frameRow(setup, "Starred"));
   });
 
   test("a bare launch shows the Welcome surface with the right region collapsed", async () => {