opencode-cockpit 0.1.1 → 0.1.3

package/src/tui/console.tsx

@@ -1,438 +0,0 @@
-/** @jsxImportSource @opentui/solid */
-import type { TuiPluginApi } from "@opencode-ai/plugin/tui"
-import type { LogLine, ShellInfo } from "@opencode-cockpit/protocol/shell"
-import type { ScrollBoxRenderable } from "@opentui/core"
-import { useBindings } from "@opentui/keymap/solid"
-import { useTerminalDimensions } from "@opentui/solid"
-import { createEffect, createMemo, createSignal, For, on, onCleanup, Show } from "solid-js"
-import { Badge } from "./badge.tsx"
-import { isReleaseKey, keyToBytes } from "./keys.ts"
-import { type ShellStore, useScreen } from "./store.ts"
-import {
-  displayCommand,
-  kindColor,
-  kindOf,
-  relativeCwd,
-  statusDetail,
-  tailLines,
-  truncate,
-  wrapText,
-} from "./view.ts"
-
-export interface ConsoleProps {
-  api: TuiPluginApi
-  store: ShellStore
-  /** Start in typing mode. */
-  typing?: boolean
-  onClose: () => void
-  onNewShell: () => void
-}
-
-type View = "screen" | "log" | "details"
-type Notice = { text: string; tone: "info" | "success" | "error" }
-
-/** Daemon errors name ids and internal states; say what happened instead. */
-function friendlyError(err: unknown): string {
-  const message = err instanceof Error ? err.message : String(err)
-  if (/is (exited|killed|failed)$/.test(message)) return "the shell is no longer running"
-  if (/not found$/.test(message)) return "that shell was already removed"
-  if (/connection|not running|did not start/.test(message)) return "lost connection to cockpitd, retrying"
-  return message
-}
-const COMMAND_LINES = 3
-
-/**
- * Keyboard-first shell console in an overlay. Normal mode: single-key actions. Typing mode:
- * every key goes to the program (ctrl+c included); ctrl+] returns to normal mode.
- */
-export function Console(props: ConsoleProps) {
-  const theme = () => props.api.theme.current
-  const dims = useTerminalDimensions()
-  const shell = () => props.store.selected()
-  const [view, setView] = createSignal<View>("screen")
-  const [typing, setTyping] = createSignal(props.typing ?? false)
-  const [log, setLog] = createSignal<LogLine[]>([])
-  const [notice, setNotice] = createSignal<Notice>()
-  const { screen } = useScreen(props.store, () => shell()?.id)
-  let scroll: ScrollBoxRenderable | undefined
-
-  const running = () => shell()?.status === "running"
-  const client = props.store.client
-
-  // Layout budget. The host dialog starts at 1/4 of the height and is 116 columns wide (xlarge),
-  // capped by the screen; the body grows with content up to what the header leaves.
-  const frameRows = () => Math.max(10, dims().height - Math.floor(dims().height / 4) - 3)
-  const bodyCols = () => Math.max(20, Math.min(116, dims().width - 2) - 7)
-  const commandLines = createMemo(() => {
-    const s = shell()
-    return s ? wrapText(displayCommand(s), bodyCols() - 2, COMMAND_LINES) : []
-  })
-  const folder = createMemo(() => {
-    const s = shell()
-    return s ? relativeCwd(s.cwd, props.store.project()) : ""
-  })
-  const failure = createMemo(() => {
-    const s = shell()
-    if (!s || !s.summary) return undefined
-    const kind = kindOf(s)
-    return kind === "fail" || kind === "stop" ? s.summary : undefined
-  })
-  const bodyRows = () => {
-    const header = 1 + commandLines().length + (folder() ? 1 : 0) + (failure() ? 1 : 0)
-    return Math.max(3, frameRows() - header - 4) // margins (2) + footer (1) + bottom padding (1)
-  }
-
-  // Transient footer message. Replaces the key hints while shown, then clears itself.
-  let noticeTimer: ReturnType<typeof setTimeout> | undefined
-  const flash = (text: string, tone: Notice["tone"], ms?: number) => {
-    clearTimeout(noticeTimer)
-    setNotice({ text, tone })
-    if (ms) noticeTimer = setTimeout(() => setNotice(undefined), ms)
-  }
-  onCleanup(() => clearTimeout(noticeTimer))
-
-  const act = (label: string, fn: () => Promise<unknown>) => {
-    flash(`${label}…`, "info")
-    fn()
-      .then((result) => (typeof result === "string" ? flash(result, "success", 2500) : setNotice(undefined)))
-      .catch((err) => flash(`${label} failed: ${friendlyError(err)}`, "error", 5000))
-  }
-
-  /** Actions that need a live process explain themselves instead of failing. */
-  const whileRunning = (label: string, fn: (id: string) => void) => () => {
-    const s = shell()
-    if (!s) return
-    if (s.status !== "running") {
-      flash(
-        `can't ${label}: this shell already ${kindOf(s) === "done" ? "finished" : "ended"} · r runs it again`,
-        "info",
-        3000,
-      )
-      return
-    }
-    fn(s.id)
-  }
-
-  // Log view: reload on selection, view switch and new output.
-  createEffect(
-    on([() => shell()?.id, view, () => screen()], () => {
-      const id = shell()?.id
-      if (!id || view() !== "log") return
-      void client
-        .call("shell.read", { id, tail: 2000, limit: 2000 })
-        .then((page) => setLog(page.lines))
-        .catch(() => {})
-    }),
-  )
-
-  // Typing mode: size the PTY to what we show, then forward every key.
-  createEffect(
-    on(typing, (on) => {
-      const id = shell()?.id
-      if (!on || !id || !running()) return
-      setView("screen")
-      void client.call("shell.resize", { id, cols: bodyCols(), rows: bodyRows() }).catch(() => {})
-    }),
-  )
-  createEffect(() => {
-    if (typing() && !running()) setTyping(false)
-  })
-  const release = props.api.keymap.intercept(
-    "key",
-    (ctx) => {
-      if (!typing()) return
-      const event = ctx.event
-      ctx.consume({ preventDefault: true, stopPropagation: true })
-      if (isReleaseKey(event)) {
-        setTyping(false)
-        return
-      }
-      const bytes = keyToBytes(event)
-      const id = shell()?.id
-      if (bytes && id) void client.call("shell.write", { id, data: bytes }).catch(() => setTyping(false))
-    },
-    { priority: 10_000 },
-  )
-  onCleanup(release)
-
-  const withShell = (fn: (id: string) => void) => () => {
-    const id = shell()?.id
-    if (id) fn(id)
-  }
-  const toggle = (next: View) => setView((v) => (v === next ? "screen" : next))
-
-  useBindings(() => ({
-    enabled: () => !typing(),
-    commands: [
-      {
-        name: "cockpit.console.type",
-        title: "Type into shell",
-        run: whileRunning("type", () => setTyping(true)),
-      },
-      {
-        name: "cockpit.console.interrupt",
-        title: "Send ctrl+c",
-        run: whileRunning("interrupt", (id) =>
-          act("interrupt", async () => {
-            await client.call("shell.write", { id, data: "\x03" })
-            return "sent ctrl+c"
-          }),
-        ),
-      },
-      {
-        name: "cockpit.console.restart",
-        title: "Restart shell",
-        run: withShell((id) => act("restart", () => client.call("shell.restart", { id }))),
-      },
-      {
-        name: "cockpit.console.stop",
-        title: "Stop shell",
-        run: whileRunning("stop", (id) =>
-          act("stop", async () => {
-            await client.call("shell.stop", { id, signal: "SIGTERM", graceMs: 3000 })
-            return "stopped"
-          }),
-        ),
-      },
-      {
-        name: "cockpit.console.remove",
-        title: "Remove shell",
-        run: withShell((id) => act("remove", () => client.call("shell.remove", { id }))),
-      },
-      {
-        name: "cockpit.console.clear",
-        title: "Clear finished shells",
-        run: () =>
-          act("clear", async () => {
-            const n = await props.store.clearFinished()
-            return `cleared ${n} finished shell${n === 1 ? "" : "s"}`
-          }),
-      },
-      { name: "cockpit.console.all", title: "Show all / fewer shells", run: () => props.store.toggleAll() },
-      {
-        name: "cockpit.console.view",
-        title: "Toggle screen/log",
-        run: () => setView((v) => (v === "log" ? "screen" : "log")),
-      },
-      { name: "cockpit.console.details", title: "Toggle details", run: () => toggle("details") },
-      { name: "cockpit.console.next", title: "Next shell", run: () => props.store.step(1) },
-      { name: "cockpit.console.prev", title: "Previous shell", run: () => props.store.step(-1) },
-      { name: "cockpit.console.new", title: "New shell", run: () => props.onNewShell() },
-      { name: "cockpit.console.down", title: "Scroll down", run: () => scroll?.scrollBy(3) },
-      { name: "cockpit.console.up", title: "Scroll up", run: () => scroll?.scrollBy(-3) },
-      {
-        name: "cockpit.console.bottom",
-        title: "Scroll to end",
-        run: () => scroll?.scrollTo(scroll.scrollHeight),
-      },
-      { name: "cockpit.console.top", title: "Scroll to top", run: () => scroll?.scrollTo(0) },
-      { name: "cockpit.console.close", title: "Close console", run: () => props.onClose() },
-    ],
-    bindings: [
-      { key: "i,return", cmd: "cockpit.console.type", desc: "Type" },
-      { key: "c", cmd: "cockpit.console.interrupt", desc: "^C" },
-      { key: "r", cmd: "cockpit.console.restart", desc: "Restart" },
-      { key: "x", cmd: "cockpit.console.stop", desc: "Stop" },
-      { key: "d", cmd: "cockpit.console.remove", desc: "Remove" },
-      { key: "shift+d", cmd: "cockpit.console.clear", desc: "Clear finished" },
-      { key: "a", cmd: "cockpit.console.all", desc: "All" },
-      { key: "tab", cmd: "cockpit.console.view", desc: "Screen/log" },
-      { key: "?,shift+/", cmd: "cockpit.console.details", desc: "Details" },
-      { key: "],l,right", cmd: "cockpit.console.next", desc: "Next" },
-      { key: "[,h,left", cmd: "cockpit.console.prev", desc: "Prev" },
-      { key: "n", cmd: "cockpit.console.new", desc: "New" },
-      { key: "j,down", cmd: "cockpit.console.down", desc: "Down" },
-      { key: "k,up", cmd: "cockpit.console.up", desc: "Up" },
-      { key: "shift+g,end", cmd: "cockpit.console.bottom", desc: "End" },
-      { key: "g,home", cmd: "cockpit.console.top", desc: "Top" },
-      { key: "q", cmd: "cockpit.console.close", desc: "Close" },
-    ],
-  }))
-
-  const screenText = createMemo(() => tailLines(screen()?.text, bodyRows(), bodyCols()))
-  const details = createMemo(() =>
-    shell() ? detailRows(shell() as ShellInfo, props.store.now(), bodyCols()) : [],
-  )
-  const bodyHeight = createMemo(() => {
-    if (typing()) return bodyRows()
-    const content =
-      view() === "log"
-        ? log().length
-        : view() === "details"
-          ? details().length
-          : screenText().split("\n").length
-    return Math.min(bodyRows(), Math.max(6, content))
-  })
-  const position = createMemo(() => {
-    const list = props.store.visible()
-    const index = list.findIndex((x) => x.id === shell()?.id)
-    const hidden = props.store.hidden().length
-    return list.length > 1 || hidden > 0 ? `${index + 1}/${list.length}${hidden ? ` +${hidden}` : ""}` : ""
-  })
-  // Only the keys that do something for the selected shell.
-  const hint = createMemo(() => {
-    if (typing()) return "TYPING: keys go to the shell (ctrl+c included) · ctrl+] stop typing"
-    const next = view() === "log" ? "screen" : "log"
-    const wide = dims().width >= 110
-    const live = running()
-      ? wide
-        ? ["i type", "c ^C", "r restart", "x stop"]
-        : ["i type", "c ^C", "r", "x"]
-      : [wide ? "r run again" : "r rerun", wide ? "d remove" : "d"]
-    const common = wide
-      ? [`tab ${next}`, "? details", "[ ] switch", "D clear done", "a all", "esc"]
-      : [`tab ${next}`, "?", "[ ]", "D", "a", "esc"]
-    return [...(shell() ? live : ["n new"]), ...common].join(" · ")
-  })
-
-  return (
-    <box flexDirection="column" paddingLeft={2} paddingRight={2} paddingBottom={1} overflow="hidden">
-      <Show
-        when={shell()}
-        fallback={
-          <box flexDirection="column">
-            <text fg={theme().text} wrapMode="none">
-              <b>No shells in this project</b>
-            </text>
-            <text fg={theme().textMuted} wrapMode="none">
-              {truncate("Press n to start one. The agent starts its own with shell_start.", bodyCols())}
-            </text>
-          </box>
-        }
-      >
-        {(s) => (
-          <>
-            <box height={1} flexShrink={0} flexDirection="row" overflow="hidden">
-              <Badge api={props.api} shell={s()} frame={props.store.frame()} />
-              <text fg={theme().text} wrapMode="none" flexShrink={1}>
-                {" "}
-                <b>{truncate(s().title, Math.max(10, bodyCols() - 50))}</b>
-              </text>
-              <box flexGrow={1} />
-              <text fg={theme().textMuted} wrapMode="none" flexShrink={0}>
-                {[statusDetail(s(), props.store.now()), s().run > 1 ? `run ${s().run}` : "", position()]
-                  .filter(Boolean)
-                  .join(" · ")}
-              </text>
-            </box>
-            <For each={commandLines()}>
-              {(line, index) => (
-                <text fg={theme().text} wrapMode="none" flexShrink={0}>
-                  <span style={{ fg: theme().textMuted }}>{index() === 0 ? "$ " : "  "}</span>
-                  {line}
-                </text>
-              )}
-            </For>
-            <Show when={folder()}>
-              <text fg={theme().textMuted} wrapMode="none" flexShrink={0}>
-                {truncate(`in ${folder()}`, bodyCols())}
-              </text>
-            </Show>
-            <Show when={failure()}>
-              {(summary) => (
-                <text fg={kindColor(theme(), kindOf(s()))} wrapMode="none" flexShrink={0}>
-                  {truncate(`${kindOf(s()) === "fail" ? "error" : "last output"}: ${summary()}`, bodyCols())}
-                </text>
-              )}
-            </Show>
-            <box
-              height={bodyHeight()}
-              flexShrink={0}
-              marginTop={1}
-              marginBottom={1}
-              border={["left"]}
-              borderColor={typing() ? theme().accent : theme().border}
-              paddingLeft={1}
-              overflow="hidden"
-            >
-              <Show when={view() === "screen"}>
-                <text fg={theme().text} wrapMode="none">
-                  {screenText() || " "}
-                </text>
-              </Show>
-              <Show when={view() === "details"}>
-                <box flexDirection="column">
-                  <For each={details()}>
-                    {([key, value]) => (
-                      <text fg={theme().text} wrapMode="none">
-                        <span style={{ fg: theme().textMuted }}>{key.padEnd(10)}</span>
-                        {value}
-                      </text>
-                    )}
-                  </For>
-                </box>
-              </Show>
-              <Show when={view() === "log"}>
-                <scrollbox
-                  ref={(el: ScrollBoxRenderable) => {
-                    scroll = el
-                  }}
-                  flexGrow={1}
-                  stickyScroll={true}
-                  stickyStart="bottom"
-                  verticalScrollbarOptions={{ visible: false }}
-                  horizontalScrollbarOptions={{ visible: false }}
-                >
-                  <For each={log()}>
-                    {(line) => (
-                      <text fg={theme().text} wrapMode="none">
-                        <span style={{ fg: theme().textMuted }}>{String(line.n).padStart(5)} </span>
-                        {truncate(line.text, bodyCols() - 7)}
-                      </text>
-                    )}
-                  </For>
-                </scrollbox>
-              </Show>
-            </box>
-          </>
-        )}
-      </Show>
-
-      <box height={1} flexShrink={0} flexDirection="row" overflow="hidden">
-        <Show
-          when={notice()}
-          fallback={
-            <text fg={typing() ? theme().accent : theme().textMuted} wrapMode="none">
-              {truncate(hint(), bodyCols())}
-            </text>
-          }
-        >
-          {(n) => (
-            <text
-              fg={
-                n().tone === "error"
-                  ? theme().error
-                  : n().tone === "success"
-                    ? theme().success
-                    : theme().warning
-              }
-              wrapMode="none"
-            >
-              {truncate(n().text, bodyCols())}
-            </text>
-          )}
-        </Show>
-      </box>
-    </box>
-  )
-}
-
-/** Everything about a shell, with the full command wrapped rather than cut. */
-function detailRows(s: ShellInfo, now: number, cols: number): [string, string][] {
-  const width = Math.max(10, cols - 11)
-  const rows: [string, string][] = []
-  for (const [i, line] of wrapText(displayCommand(s), width, 12).entries())
-    rows.push([i === 0 ? "command" : "", line])
-  rows.push(["folder", s.cwd])
-  rows.push([
-    "status",
-    `${s.status}${s.exitCode !== undefined ? ` (exit ${s.exitCode})` : ""}${s.signal ? ` (${s.signal})` : ""}`,
-  ])
-  rows.push(["timing", statusDetail(s, now)])
-  rows.push(["started", new Date(s.startedAt).toLocaleString()])
-  if (s.summary) rows.push(["summary", truncate(s.summary, width)])
-  rows.push(["id", `${s.id} · run ${s.run}${s.pid ? ` · pid ${s.pid}` : ""}`])
-  rows.push(["owner", s.owner.session ? `agent session ${s.owner.session}` : "you"])
-  rows.push(["output", `${s.lines.last} lines · ${Math.round(s.bytes / 1024)} KiB`])
-  return rows
-}

package/src/tui/dock.tsx

@@ -1,130 +0,0 @@
-/** @jsxImportSource @opentui/solid */
-import type { TuiPluginApi } from "@opencode-ai/plugin/tui"
-import { useTerminalDimensions } from "@opentui/solid"
-import { createMemo, For, Show } from "solid-js"
-import { Badge } from "./badge.tsx"
-import type { ShellStore } from "./store.ts"
-import { useScreen } from "./store.ts"
-import { displayCommand, kindColor, kindOf, statusDetail, tailLines, truncate } from "./view.ts"
-
-export interface DockProps {
-  api: TuiPluginApi
-  store: ShellStore
-  height: number
-  hint: () => string
-  onOpenConsole: (id: string) => void
-}
-
-/** Split pane under the chat: status tabs for shells and the selected shell's live screen. */
-export function Dock(props: DockProps) {
-  const theme = () => props.api.theme.current
-  const dims = useTerminalDimensions()
-  const { screen } = useScreen(props.store, () => props.store.selected()?.id)
-  const bodyRows = () => Math.max(2, props.height - 3)
-  const body = createMemo(() => tailLines(screen()?.text, bodyRows(), Math.max(10, dims().width - 4)))
-
-  return (
-    <box
-      height={props.height}
-      flexShrink={0}
-      flexDirection="column"
-      border={["top"]}
-      borderColor={theme().border}
-      backgroundColor={theme().backgroundPanel}
-    >
-      <box
-        flexDirection="row"
-        gap={1}
-        paddingLeft={1}
-        paddingRight={1}
-        flexShrink={0}
-        height={1}
-        overflow="hidden"
-      >
-        <text fg={theme().text} flexShrink={0}>
-          <b>Shells</b>
-        </text>
-        <Show
-          when={props.store.shells().length > 0}
-          fallback={
-            <text fg={theme().textMuted} wrapMode="none">
-              none yet · the agent starts them, or /shell-new
-            </text>
-          }
-        >
-          <For each={props.store.visible()}>
-            {(shell) => {
-              const active = () => props.store.selected()?.id === shell.id
-              return (
-                <box
-                  flexDirection="row"
-                  flexShrink={0}
-                  paddingRight={1}
-                  backgroundColor={active() ? theme().backgroundElement : theme().backgroundPanel}
-                  onMouseDown={() =>
-                    active() ? props.onOpenConsole(shell.id) : props.store.select(shell.id)
-                  }
-                >
-                  <Badge api={props.api} shell={shell} frame={props.store.frame()} />
-                  <text fg={active() ? theme().text : theme().textMuted} wrapMode="none">
-                    {" "}
-                    {active() ? <b>{truncate(shell.title, 22)}</b> : truncate(shell.title, 22)}
-                  </text>
-                </box>
-              )
-            }}
-          </For>
-          <Show when={props.store.hidden().length > 0 || props.store.showAll()}>
-            <text
-              fg={theme().textMuted}
-              wrapMode="none"
-              flexShrink={0}
-              onMouseDown={() => props.store.toggleAll()}
-            >
-              {props.store.showAll() ? "▾ fewer" : `▸ ${props.store.hidden().length} more`}
-            </text>
-          </Show>
-        </Show>
-        <box flexGrow={1} />
-        <text fg={theme().textMuted} wrapMode="none" flexShrink={0}>
-          {props.hint()}
-        </text>
-      </box>
-      <Show when={props.store.selected()}>
-        {(shell) => (
-          <>
-            <box
-              flexGrow={1}
-              paddingLeft={2}
-              paddingRight={1}
-              minHeight={0}
-              overflow="hidden"
-              onMouseDown={() => props.onOpenConsole(shell().id)}
-            >
-              <text fg={theme().text} wrapMode="none">
-                {body() || " "}
-              </text>
-            </box>
-            <box flexDirection="row" gap={1} paddingLeft={2} flexShrink={0} height={1} overflow="hidden">
-              <text fg={kindColor(theme(), kindOf(shell()))} wrapMode="none" flexShrink={0}>
-                {statusDetail(shell(), props.store.now())}
-              </text>
-              <Show
-                when={kindOf(shell()) === "fail" && shell().summary}
-                fallback={
-                  <text fg={theme().textMuted} wrapMode="none">
-                    {truncate(`$ ${displayCommand(shell())}`, Math.max(20, dims().width - 40))}
-                  </text>
-                }
-              >
-                <text fg={theme().error} wrapMode="none">
-                  {truncate(`${shell().summary}`, Math.max(20, dims().width - 40))}
-                </text>
-              </Show>
-            </box>
-          </>
-        )}
-      </Show>
-    </box>
-  )
-}