@neurocode-ai/tui 1.18.8

package/test/cli/tui/dialog-prompt.test.tsx

@@ -0,0 +1,147 @@
+/** @jsxImportSource @opentui/solid */
+import { TextareaRenderable } from "@opentui/core"
+import { createDefaultOpenTuiKeymap } from "@opentui/keymap/opentui"
+import { testRender, useRenderer } from "@opentui/solid"
+import { expect, test } from "bun:test"
+import { mkdir } from "node:fs/promises"
+import path from "node:path"
+import { onCleanup } from "solid-js"
+import { tmpdir } from "../../fixture/fixture"
+import { createTuiResolvedConfig } from "../../fixture/tui-runtime"
+import type { TuiKeybind } from "../../../src/config/keybind"
+import { TestTuiContexts } from "../../fixture/tui-environment"
+
+async function wait(fn: () => boolean, timeout = 2000) {
+  const start = Date.now()
+  while (!fn()) {
+    if (Date.now() - start > timeout) throw new Error("timed out waiting for condition")
+    await Bun.sleep(10)
+  }
+}
+
+async function mountPrompt(input: {
+  root: string
+  keybinds: Partial<TuiKeybind.Keybinds>
+  onConfirm: (value: string) => void
+}) {
+  const state = path.join(input.root, "state")
+  await mkdir(state, { recursive: true })
+  await Bun.write(path.join(state, "kv.json"), "{}")
+
+  const [
+    { DialogProvider },
+    { DialogPrompt },
+    { KVProvider },
+    { ThemeProvider },
+    { TuiConfigProvider },
+    { ToastProvider },
+    { OpencodeKeymapProvider, registerOpencodeKeymap },
+  ] = await Promise.all([
+    import("../../../src/ui/dialog"),
+    import("../../../src/ui/dialog-prompt"),
+    import("../../../src/context/kv"),
+    import("../../../src/context/theme"),
+    import("../../../src/config"),
+    import("../../../src/ui/toast"),
+    import("../../../src/keymap"),
+  ])
+
+  function Harness() {
+    const renderer = useRenderer()
+    const keymap = createDefaultOpenTuiKeymap(renderer)
+    const resolvedConfig = createTuiResolvedConfig({
+      keybinds: input.keybinds,
+      leader_timeout: 1000,
+    })
+    const off = registerOpencodeKeymap(keymap, renderer, resolvedConfig)
+    onCleanup(off)
+
+    return (
+      <TestTuiContexts
+        directory={input.root}
+        paths={{
+          home: input.root,
+          state,
+          worktree: input.root,
+        }}
+      >
+        <OpencodeKeymapProvider keymap={keymap}>
+          <TuiConfigProvider config={resolvedConfig}>
+            <KVProvider>
+              <ThemeProvider mode="dark">
+                <ToastProvider>
+                  <DialogProvider>
+                    <DialogPrompt title="Rename Session" value="draft" onConfirm={input.onConfirm} />
+                  </DialogProvider>
+                </ToastProvider>
+              </ThemeProvider>
+            </KVProvider>
+          </TuiConfigProvider>
+        </OpencodeKeymapProvider>
+      </TestTuiContexts>
+    )
+  }
+
+  const app = await testRender(() => <Harness />, { kittyKeyboard: true })
+  return {
+    app,
+    async cleanup() {
+      app.renderer.destroy()
+    },
+  }
+}
+
+test("dialog prompt submit wins when return is also input newline", async () => {
+  await using tmp = await tmpdir()
+  const confirmed: string[] = []
+  const prompt = await mountPrompt({
+    root: tmp.path,
+    keybinds: {
+      input_submit: "super+return",
+      input_newline: "return,shift+return,alt+return,ctrl+j",
+    },
+    onConfirm: (value) => confirmed.push(value),
+  })
+
+  try {
+    await wait(() => prompt.app.renderer.currentFocusedEditor instanceof TextareaRenderable)
+    const textarea = prompt.app.renderer.currentFocusedEditor
+    if (!(textarea instanceof TextareaRenderable)) throw new Error("expected focused dialog textarea")
+
+    prompt.app.mockInput.pressEnter()
+
+    expect(confirmed).toEqual(["draft"])
+    expect(textarea.plainText).toBe("draft")
+  } finally {
+    await prompt.cleanup()
+  }
+})
+
+test("dialog prompt submit can be rebound separately from input submit", async () => {
+  await using tmp = await tmpdir()
+  const confirmed: string[] = []
+  const prompt = await mountPrompt({
+    root: tmp.path,
+    keybinds: {
+      input_submit: "return",
+      "dialog.prompt.submit": "ctrl+y",
+    },
+    onConfirm: (value) => confirmed.push(value),
+  })
+
+  try {
+    await wait(() => prompt.app.renderer.currentFocusedEditor instanceof TextareaRenderable)
+    const textarea = prompt.app.renderer.currentFocusedEditor
+    if (!(textarea instanceof TextareaRenderable)) throw new Error("expected focused dialog textarea")
+
+    prompt.app.mockInput.pressEnter()
+    expect(confirmed).toEqual([])
+    expect(textarea.plainText).toBe("draft")
+
+    prompt.app.mockInput.pressKey("y", { ctrl: true })
+
+    expect(confirmed).toEqual(["draft"])
+  } finally {
+    await prompt.cleanup()
+  }
+})

package/test/cli/tui/diff-viewer-file-tree.test.tsx

@@ -0,0 +1,200 @@
+/** @jsxImportSource @opentui/solid */
+import { describe, expect, test } from "bun:test"
+import { RGBA } from "@opentui/core"
+import { testRender } from "@opentui/solid"
+import type { JSX } from "solid-js"
+import { createTuiResolvedConfig } from "../../fixture/tui-runtime"
+import { KVProvider } from "../../../src/context/kv"
+import { ThemeProvider } from "../../../src/context/theme"
+import { TuiConfigProvider } from "../../../src/config"
+import { DiffViewerFileTree } from "../../../src/feature-plugins/system/diff-viewer-file-tree"
+import { TestTuiContexts } from "../../fixture/tui-environment"
+import {
+  allExpandedFileTreeDirectories,
+  buildFileTree,
+} from "../../../src/feature-plugins/system/diff-viewer-file-tree-utils"
+
+const theme = {
+  background: RGBA.fromHex("#000000"),
+  backgroundPanel: RGBA.fromHex("#111111"),
+  backgroundElement: RGBA.fromHex("#333333"),
+  primary: RGBA.fromHex("#00ffff"),
+  secondary: RGBA.fromHex("#0088ff"),
+  selectedListItemText: RGBA.fromHex("#ffffff"),
+  text: RGBA.fromHex("#ffffff"),
+  textMuted: RGBA.fromHex("#888888"),
+  error: RGBA.fromHex("#ff0000"),
+}
+
+describe("DiffViewerFileTree", () => {
+  test.skip("renders sorted hierarchical file rows", async () => {
+    const app = await testRender(
+      () =>
+        withTheme(() => (
+          <DiffViewerFileTree
+            width={32}
+            files={[
+              { file: "z-file.ts" },
+              { file: "b/file.ts" },
+              { file: "a/zeta.ts" },
+              { file: "b/alpha.ts" },
+              { file: "a/alpha.ts" },
+            ]}
+            loading={false}
+            error={undefined}
+            theme={theme}
+            focused={true}
+          />
+        )),
+      { width: 40, height: 20 },
+    )
+
+    try {
+      await renderOnceSettled(app)
+      const lines = visibleLines(app.captureCharFrame())
+
+      expect(lines).toEqual([
+        "▾ a",
+        "│  ├─ alpha.ts               ?",
+        "│  └─ zeta.ts                ?",
+        "├─ ▾ b",
+        "│  ├─ alpha.ts               ?",
+        "│  └─ file.ts                ?",
+      ])
+    } finally {
+      app.renderer.destroy()
+    }
+  })
+
+  test("keeps loading and error quiet while rendering an empty settled state", async () => {
+    const loading = await renderFrame(() => (
+      <DiffViewerFileTree width={32} files={[]} loading={true} error={undefined} theme={theme} />
+    ))
+    const failed = await renderFrame(() => (
+      <DiffViewerFileTree width={32} files={[]} loading={false} error={new Error("nope")} theme={theme} />
+    ))
+    const empty = await renderFrame(() => (
+      <DiffViewerFileTree width={32} files={[]} loading={false} error={undefined} theme={theme} />
+    ))
+
+    expect(loading).not.toContain("Loading diff...")
+    expect(loading).not.toContain("No files")
+    expect(failed).not.toContain("Failed to load diff")
+    expect(failed).not.toContain("No files")
+    expect(empty).toContain("No files")
+  })
+
+  test("does not render text markers for highlighted rows", async () => {
+    const files = [{ file: "src/config/tui.ts" }, { file: "README.md" }]
+    const src = buildFileTree(files).nodes.find((node) => node.kind === "directory" && node.name === "src")!
+
+    const focused = visibleLines(
+      await renderFrame(() => (
+        <DiffViewerFileTree
+          width={32}
+          files={files}
+          loading={false}
+          error={undefined}
+          theme={theme}
+          focused
+          highlightedNode={src.id}
+        />
+      )),
+    )
+    const unfocused = visibleLines(
+      await renderFrame(() => (
+        <DiffViewerFileTree width={32} files={files} loading={false} error={undefined} theme={theme} />
+      )),
+    )
+
+    expect(focused).toContain("▾ src/config")
+    expect(unfocused).toContain("▾ src/config")
+    expect(focused.some((line) => line.includes("*"))).toBe(false)
+    expect(unfocused.some((line) => line.includes("*"))).toBe(false)
+  })
+
+  test("renders collapsed and expanded directory rows", async () => {
+    const files = [{ file: "src/config/tui.ts" }, { file: "README.md" }]
+    const tree = buildFileTree(files)
+    const src = tree.nodes.find((node) => node.kind === "directory" && node.name === "src")!
+    const collapsed = allExpandedFileTreeDirectories(tree)
+    collapsed.delete(src.id)
+
+    expect(
+      visibleLines(
+        await renderFrame(() => (
+          <DiffViewerFileTree
+            width={32}
+            files={files}
+            loading={false}
+            error={undefined}
+            theme={theme}
+            expandedNodes={collapsed}
+          />
+        )),
+      ),
+    ).toEqual(["▸ src/config"])
+
+    expect(
+      visibleLines(
+        await renderFrame(() => (
+          <DiffViewerFileTree
+            files={files}
+            width={32}
+            loading={false}
+            error={undefined}
+            theme={theme}
+            expandedNodes={allExpandedFileTreeDirectories(tree)}
+          />
+        )),
+      ),
+    ).toEqual(["▾ src/config", "│  └─ tui.ts                 ?"])
+  })
+})
+
+async function renderFrame(component: () => JSX.Element) {
+  const app = await testRender(() => withTheme(component), { width: 40, height: 10 })
+  try {
+    await renderOnceSettled(app)
+    return await captureSettledFrame(app)
+  } finally {
+    app.renderer.destroy()
+  }
+}
+
+async function renderOnceSettled(app: Awaited<ReturnType<typeof testRender>>) {
+  await app.renderOnce()
+  await new Promise((resolve) => setTimeout(resolve, 25))
+  await app.renderOnce()
+}
+
+async function captureSettledFrame(app: Awaited<ReturnType<typeof testRender>>) {
+  for (let attempt = 0; attempt < 5; attempt++) {
+    const frame = app.captureCharFrame()
+    if (frame.trim().length > 0) return frame
+    await new Promise((resolve) => setTimeout(resolve, 25))
+    await app.renderOnce()
+  }
+  return app.captureCharFrame()
+}
+
+function withTheme(component: () => JSX.Element) {
+  return (
+    <TestTuiContexts>
+      <TuiConfigProvider config={createTuiResolvedConfig()}>
+        <KVProvider>
+          <ThemeProvider mode="dark">{component()}</ThemeProvider>
+        </KVProvider>
+      </TuiConfigProvider>
+    </TestTuiContexts>
+  )
+}
+
+function visibleLines(frame: string) {
+  return frame
+    .split("\n")
+    .map((line) => line.trimEnd())
+    .map((line) => line.replace(/^ ?│ ?/, "").replace(/[ │]*$/, ""))
+    .map((line) => (line.startsWith(" ") ? line.slice(1) : line))
+    .filter((line) => line.length > 0 && !/^┌|^└|^─+$/.test(line))
+}

package/test/cli/tui/diff-viewer.test.tsx

@@ -0,0 +1,268 @@
+/** @jsxImportSource @opentui/solid */
+import { expect, test } from "bun:test"
+import { createDefaultOpenTuiKeymap } from "@opentui/keymap/opentui"
+import { DiffRenderable, type Renderable, ScrollBoxRenderable } from "@opentui/core"
+import { testRender, useRenderer } from "@opentui/solid"
+import type { TuiPluginApi, TuiPluginMeta, TuiRouteCurrent, TuiRouteDefinition } from "@neurocode-ai/plugin/tui"
+import type { Session } from "@neurocode-ai/sdk/v2"
+import { KVProvider } from "../../../src/context/kv"
+import { ThemeProvider } from "../../../src/context/theme"
+import { TuiConfigProvider } from "../../../src/config"
+import { TuiKeybind } from "../../../src/config/keybind"
+import { OpencodeKeymapProvider } from "../../../src/keymap"
+import diffViewerPlugin from "../../../src/feature-plugins/system/diff-viewer"
+import { createTuiPluginApi } from "../../fixture/tui-plugin"
+import { createTuiResolvedConfig } from "../../fixture/tui-runtime"
+import { TestTuiContexts } from "../../fixture/tui-environment"
+
+test("closing the diff viewer returns to the route it opened from", async () => {
+  const viewer = await renderDiffViewer([])
+  try {
+    expect(viewer.current()).toEqual({
+      name: "diff",
+      params: { mode: "git", sessionID: "session-1", returnRoute: startRoute },
+    })
+    expect(viewer.vcsDiffInput()).toEqual({ directory: "/repo/session", mode: "git", context: 12 })
+
+    expect(viewer.commands.has("diff.close")).toBe(true)
+    viewer.commands.get("diff.close")!.run?.({} as never)
+    expect(viewer.current()).toEqual(startRoute)
+  } finally {
+    viewer.app.renderer.destroy()
+  }
+})
+
+test("brackets navigate diff hunks", async () => {
+  const viewer = await renderDiffViewer(
+    [
+      {
+        file: "src/file.ts",
+        additions: 3,
+        deletions: 3,
+        status: "modified",
+        patch: `--- a/src/file.ts
++++ b/src/file.ts
+@@ -1,3 +1,3 @@
+ const first = true
+-const oldFirst = true
++const newFirst = true
+ const afterFirst = true
+@@ -20,3 +20,3 @@
+ const second = true
+-const oldSecond = true
++const newSecond = true
+ const afterSecond = true
+@@ -40,3 +40,3 @@
+ const third = true
+-const oldThird = true
++const newThird = true
+ const afterThird = true`,
+      },
+    ],
+    12,
+  )
+  try {
+    await viewer.app.waitForFrame((frame) => frame.includes("const first"))
+    await viewer.app.waitFor(() => Boolean(findScrollBox(viewer.app.renderer.root)))
+    await viewer.app.flush()
+    const scroll = findScrollBox(viewer.app.renderer.root)!
+    const initial = scroll.scrollTop
+
+    expect(TuiKeybind.defaultValue("diff_next_hunk")).toBe("]")
+    expect(TuiKeybind.defaultValue("diff_previous_hunk")).toBe("[")
+
+    viewer.commands.get("diff.next_hunk")!.run?.({} as never)
+    await viewer.app.renderOnce()
+    const first = scroll.scrollTop
+    expect(first).toBeGreaterThan(initial)
+
+    viewer.commands.get("diff.next_hunk")!.run?.({} as never)
+    await viewer.app.renderOnce()
+    const second = scroll.scrollTop
+    expect(second).toBeGreaterThan(first)
+
+    viewer.commands.get("diff.previous_hunk")!.run?.({} as never)
+    await viewer.app.renderOnce()
+    expect(scroll.scrollTop).toBe(first)
+
+    viewer.commands.get("diff.next_hunk")!.run?.({} as never)
+    await viewer.app.renderOnce()
+    expect(scroll.scrollTop).toBe(second)
+
+    scroll.scrollTo(initial)
+    viewer.commands.get("diff.next_hunk")!.run?.({} as never)
+    await viewer.app.renderOnce()
+    expect(scroll.scrollTop).toBe(first)
+  } finally {
+    viewer.app.renderer.destroy()
+  }
+})
+
+async function renderDiffViewer(vcsDiff: unknown[], height = 20, initialRoute?: TuiRouteCurrent) {
+  const commands = new Map<
+    string,
+    NonNullable<Parameters<TuiPluginApi["keymap"]["registerLayer"]>[0]["commands"]>[number]
+  >()
+  let current = initialRoute ?? startRoute
+  let renderDiff: TuiRouteDefinition["render"] | undefined
+  let vcsDiffInput: unknown
+  let sessionDiffInput: unknown
+  const config = createTuiResolvedConfig()
+  function Harness() {
+    const renderer = useRenderer()
+    const keymap = createDefaultOpenTuiKeymap(renderer)
+    const registerLayer = keymap.registerLayer.bind(keymap)
+    keymap.registerLayer = (layer) => {
+      layer.commands?.forEach((command) => commands.set(command.name, command))
+      return registerLayer(layer)
+    }
+    const base = createTuiPluginApi({
+      keymap,
+      client: {
+        vcs: {
+          diff: async (input: unknown) => {
+            vcsDiffInput = input
+            return { data: vcsDiff }
+          },
+        },
+        session: {
+          diff: async (input: unknown) => {
+            sessionDiffInput = input
+            return { data: [] }
+          },
+        },
+      } as unknown as TuiPluginApi["client"],
+      state: {
+        session: {
+          get: () => session,
+        },
+      },
+    })
+    const api = {
+      ...base,
+      route: {
+        register(routes) {
+          renderDiff = routes.find((route) => route.name === "diff")?.render
+          return () => {}
+        },
+        navigate(name, params) {
+          current = params ? { name, params } : { name }
+        },
+        get current() {
+          return current
+        },
+      },
+    } satisfies TuiPluginApi
+
+    void diffViewerPlugin.tui(api, undefined, pluginMeta)
+    if (!initialRoute) commands.get("diff.open")?.run?.({} as never)
+
+    return (
+      <TestTuiContexts>
+        <OpencodeKeymapProvider keymap={keymap}>
+          <TuiConfigProvider config={config}>
+            <KVProvider>
+              <ThemeProvider mode="dark">
+                {renderDiff?.({ params: "params" in current ? current.params : undefined })}
+              </ThemeProvider>
+            </KVProvider>
+          </TuiConfigProvider>
+        </OpencodeKeymapProvider>
+      </TestTuiContexts>
+    )
+  }
+
+  const app = await testRender(() => <Harness />, { width: 80, height })
+  await waitForCommand(app, commands, "diff.close")
+  return {
+    app,
+    commands,
+    current: () => current,
+    vcsDiffInput: () => vcsDiffInput,
+    sessionDiffInput: () => sessionDiffInput,
+  }
+}
+
+const startRoute: TuiRouteCurrent = { name: "session", params: { sessionID: "session-1" } }
+
+function findScrollBox(root: Renderable): ScrollBoxRenderable | undefined {
+  if (root instanceof ScrollBoxRenderable && containsDiff(root)) return root
+  return root.getChildren().map(findScrollBox).find(Boolean)
+}
+
+function containsDiff(root: Renderable): boolean {
+  if (root instanceof DiffRenderable) return true
+  return root.getChildren().some(containsDiff)
+}
+
+const session = {
+  id: "session-1",
+  slug: "session-1",
+  projectID: "project-1",
+  directory: "/repo/session",
+  title: "Session",
+  version: "1",
+  time: {
+    created: 0,
+    updated: 0,
+  },
+} satisfies Session
+
+test("branch diff source requests branch VCS diff", async () => {
+  const viewer = await renderDiffViewer([], 20, {
+    name: "diff",
+    params: { mode: "branch", sessionID: "session-1", returnRoute: startRoute },
+  })
+  try {
+    expect(viewer.current()).toEqual({
+      name: "diff",
+      params: { mode: "branch", sessionID: "session-1", returnRoute: startRoute },
+    })
+    expect(viewer.vcsDiffInput()).toEqual({ directory: "/repo/session", mode: "branch", context: 12 })
+    expect(viewer.sessionDiffInput()).toBeUndefined()
+  } finally {
+    viewer.app.renderer.destroy()
+  }
+})
+
+test("last-turn diff source requests session diff", async () => {
+  const viewer = await renderDiffViewer([], 20, {
+    name: "diff",
+    params: { mode: "last-turn", sessionID: "session-1", messageID: "message-1", returnRoute: startRoute },
+  })
+  try {
+    expect(viewer.current()).toEqual({
+      name: "diff",
+      params: { mode: "last-turn", sessionID: "session-1", messageID: "message-1", returnRoute: startRoute },
+    })
+    expect(viewer.sessionDiffInput()).toEqual({ sessionID: "session-1", messageID: "message-1" })
+    expect(viewer.vcsDiffInput()).toBeUndefined()
+  } finally {
+    viewer.app.renderer.destroy()
+  }
+})
+
+async function waitForCommand(
+  app: Awaited<ReturnType<typeof testRender>>,
+  commands: Map<string, unknown>,
+  command: string,
+) {
+  for (let attempt = 0; attempt < 10; attempt++) {
+    await app.renderOnce()
+    if (commands.has(command)) return
+    await new Promise((resolve) => setTimeout(resolve, 25))
+  }
+}
+
+const pluginMeta = {
+  id: "diff-viewer",
+  source: "internal",
+  spec: "diff-viewer",
+  target: "diff-viewer",
+  first_time: 0,
+  last_time: 0,
+  time_changed: 0,
+  load_count: 1,
+  fingerprint: "test",
+  state: "same",
+} satisfies TuiPluginMeta