@oharness/server 0.7.1 → 0.9.0

package/dist/page/client/state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"state.js","sourceRoot":"","sources":["../../../src/page/client/state.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,CAAC,MAAM,KAAK,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA2vC9B,CAAC"}

package/dist/page/client/terminal.d.ts

@@ -0,0 +1,7 @@
+/**
+ * The embedded terminal: a real shell per project, drawn by xterm.js in a
+ * panel under the conversation.
+ *
+ * One part of the client script; see ./index.ts for how the parts join.
+ */
+export declare const TERMINAL: string;

package/dist/page/client/terminal.js

@@ -0,0 +1,347 @@
+/**
+ * The embedded terminal: a real shell per project, drawn by xterm.js in a
+ * panel under the conversation.
+ *
+ * One part of the client script; see ./index.ts for how the parts join.
+ */
+export const TERMINAL = String.raw `
+// --- terminal ------------------------------------------------------------------
+// The shell lives on the server (terminal.ts) and outlives this panel: hiding
+// it, switching tabs or reloading the page all leave it running, and coming
+// back reattaches with the recent output replayed.
+
+const terminalPanel = document.getElementById("terminal");
+const terminalBody = document.getElementById("terminal-body");
+const terminalTabs = document.getElementById("terminal-tabs");
+const terminalWhere = document.getElementById("terminal-where");
+
+/**
+ * Per project folder, its terminals as tabs: each entry holds the xterm
+ * instance, its element and its stream, and the group remembers which tab
+ * was in front so coming back to the project finds the same one.
+ */
+const terminalGroups = new Map();
+/** The folder whose terminals are on show. */
+let terminalCwd = null;
+let terminalLib = null;
+
+const TERMINAL_HEIGHT_KEY = "oharness.terminalHeight";
+const TERMINAL_MIN = 120;
+
+function terminalShownFor(cwd) {
+  return !terminalPanel.hidden && terminalCwd === cwd;
+}
+
+/** xterm.js, fetched the first time a terminal opens rather than with the page. */
+function loadTerminalLib() {
+  terminalLib ??= new Promise((resolve, reject) => {
+    const css = document.createElement("link");
+    css.rel = "stylesheet";
+    css.href = q("/vendor/xterm.css");
+    document.head.appendChild(css);
+    const script = (src) => new Promise((done, fail) => {
+      const node = document.createElement("script");
+      node.src = q(src);
+      node.onload = done;
+      node.onerror = () => fail(new Error("could not load " + src));
+      document.head.appendChild(node);
+    });
+    script("/vendor/xterm.js")
+      .then(() => script("/vendor/xterm-fit.js"))
+      .then(() => resolve({ Terminal: window.Terminal, FitAddon: window.FitAddon.FitAddon }))
+      .catch((err) => { terminalLib = null; reject(err); });
+  });
+  return terminalLib;
+}
+
+/** The page's own colours, read when a terminal is made. */
+function terminalTheme() {
+  const css = getComputedStyle(document.body);
+  const v = (name, fallback) => css.getPropertyValue(name).trim() || fallback;
+  return {
+    background: v("--bg", "#111"),
+    foreground: v("--fg", "#ddd"),
+    cursor: v("--fg", "#ddd"),
+    cursorAccent: v("--bg", "#111"),
+    selectionBackground: v("--sel", "#444"),
+  };
+}
+
+function terminalGroup(cwd) {
+  let group = terminalGroups.get(cwd);
+  if (!group) terminalGroups.set(cwd, (group = { tabs: [], active: null, loaded: false, seq: 0 }));
+  return group;
+}
+
+function terminalActive() {
+  const group = terminalCwd && terminalGroups.get(terminalCwd);
+  return group ? group.active : undefined;
+}
+
+/**
+ * Show a project's terminals, starting a shell if it has none.
+ *
+ * Asked again for the project already on show it hides, which is what the
+ * tab's button wants; force keeps it open, for the menus.
+ */
+async function openTerminalIn(cwd, force) {
+  if (!cwd) return;
+  if (terminalShownFor(cwd) && !force) return hideTerminal();
+  track("panel_opened", { panel: "terminal" });
+
+  terminalCwd = cwd;
+  terminalWhere.textContent = projectName(cwd);
+  terminalWhere.title = cwd;
+  terminalPanel.hidden = false;
+  document.body.classList.add("terminal-open");
+  terminalApplyHeight();
+  paintTabs();
+
+  let lib;
+  try {
+    lib = await loadTerminalLib();
+  } catch (err) {
+    return void addNotice(String(err.message || err), "err");
+  }
+  if (terminalCwd !== cwd) return;
+
+  const group = terminalGroup(cwd);
+  if (!group.loaded) {
+    group.loaded = true;
+    // Shells this project already has — from before a reload, or from
+    // another window — come back as tabs rather than being started again.
+    const body = await getJson("/term/list?cwd=" + encodeURIComponent(cwd));
+    for (const found of body.terminals || []) {
+      const entry = terminalCreate(lib, cwd);
+      void terminalAttach(entry, found, true);
+    }
+    if (!group.tabs.length) await terminalNew(cwd);
+    else group.active = group.tabs[group.tabs.length - 1];
+  } else if (!group.tabs.length) {
+    await terminalNew(cwd);
+  }
+  if (terminalCwd === cwd) terminalSelect(group.active);
+}
+
+function hideTerminal() {
+  terminalPanel.hidden = true;
+  document.body.classList.remove("terminal-open");
+  paintTabs();
+}
+
+/** Keep the panel on the project of the tab in front. */
+function terminalFollow(cwd) {
+  if (!terminalPanel.hidden && cwd && cwd !== terminalCwd) void openTerminalIn(cwd, true);
+}
+
+/** Another shell in the project on show, as a new tab in front. */
+async function terminalNew(cwd) {
+  const lib = await loadTerminalLib();
+  const entry = terminalCreate(lib, cwd);
+  terminalGroup(cwd).active = entry;
+  terminalSelect(entry);
+  await terminalStart(entry);
+}
+
+function terminalCreate(lib, cwd) {
+  const group = terminalGroup(cwd);
+  const host = el("div", "terminal-host");
+  host.hidden = true;
+  terminalBody.appendChild(host);
+  const term = new lib.Terminal({
+    fontFamily: 'ui-monospace, "SF Mono", Menlo, Consolas, "Cascadia Mono", monospace',
+    fontSize: isPhone() ? 12 : 13,
+    lineHeight: 1.15,
+    cursorBlink: true,
+    scrollback: 5000,
+    theme: terminalTheme(),
+  });
+  const fit = new lib.FitAddon();
+  term.loadAddon(fit);
+  term.open(host);
+  const entry = {
+    cwd, host, term, fit, n: ++group.seq, name: "", id: null, source: null,
+    starting: false, exited: false, pending: "", sending: false,
+  };
+  group.tabs.push(entry);
+
+  term.onData((data) => {
+    // A shell that has exited restarts on the next key, the way a closed
+    // terminal tab is reopened by typing into it.
+    if (entry.exited) return void terminalStart(entry);
+    terminalSend(entry, data);
+  });
+  term.onResize(({ cols, rows }) => {
+    if (entry.id) void api("/term/resize", { id: entry.id, cols, rows });
+  });
+  return entry;
+}
+
+/** Bring one tab to the front of its project's panel. */
+function terminalSelect(entry) {
+  if (!entry) return paintTerminalTabs();
+  const group = terminalGroup(entry.cwd);
+  group.active = entry;
+  for (const [cwd, other] of terminalGroups) {
+    for (const tab of other.tabs) tab.host.hidden = !(cwd === terminalCwd && tab === entry);
+  }
+  paintTerminalTabs();
+  terminalFit(entry);
+  entry.term.focus();
+}
+
+function paintTerminalTabs() {
+  terminalTabs.replaceChildren();
+  const group = terminalCwd && terminalGroups.get(terminalCwd);
+  if (!group) return;
+  for (const entry of group.tabs) {
+    const tab = el("div", "terminal-tab" + (entry === group.active ? " on" : ""));
+    tab.setAttribute("role", "tab");
+    tab.setAttribute("aria-selected", String(entry === group.active));
+    tab.appendChild(svgIcon("command"));
+    tab.appendChild(el("span", "terminal-tab-label", (entry.name || t("terminal.title")) + (entry.n > 1 ? " " + entry.n : "")));
+    const close = el("button", "terminal-tab-x");
+    close.type = "button";
+    close.title = t("terminal.close");
+    close.setAttribute("aria-label", t("terminal.close"));
+    close.appendChild(svgIcon("close"));
+    close.addEventListener("click", (event) => {
+      event.stopPropagation();
+      terminalClose(entry);
+    });
+    tab.appendChild(close);
+    tab.addEventListener("click", () => terminalSelect(entry));
+    // A middle click closes, as it does on a browser's tabs.
+    tab.addEventListener("auxclick", (event) => { if (event.button === 1) terminalClose(entry); });
+    terminalTabs.appendChild(tab);
+  }
+  const active = terminalTabs.querySelector(".terminal-tab.on");
+  if (active) active.scrollIntoView({ block: "nearest", inline: "nearest" });
+}
+
+/** End one shell and drop its tab; the last one closing hides the panel. */
+function terminalClose(entry) {
+  const group = terminalGroup(entry.cwd);
+  if (entry.id) void api("/term/close", { id: entry.id });
+  if (entry.source) entry.source.close();
+  entry.id = null;
+  entry.term.dispose();
+  entry.host.remove();
+  const index = group.tabs.indexOf(entry);
+  group.tabs.splice(index, 1);
+  if (group.active === entry) group.active = group.tabs[Math.min(index, group.tabs.length - 1)] || null;
+  if (!group.tabs.length) return hideTerminal();
+  terminalSelect(group.active);
+}
+
+/**
+ * Keystrokes, in order.
+ *
+ * One request in flight at a time, with whatever was typed meanwhile sent
+ * together after it: two POSTs racing each other could land out of order, and
+ * a shell that receives "sl" for "ls" is worse than one that is a beat slow.
+ */
+function terminalSend(entry, data) {
+  entry.pending += data;
+  if (entry.sending || !entry.id) return;
+  entry.sending = true;
+  const flush = async () => {
+    while (entry.pending && entry.id) {
+      const chunk = entry.pending;
+      entry.pending = "";
+      await api("/term/input", { id: entry.id, data: chunk });
+    }
+    entry.sending = false;
+  };
+  void flush();
+}
+
+/** A shell for this tab — its first, or a new one after the last exited. */
+async function terminalStart(entry) {
+  if (entry.starting) return;
+  entry.starting = true;
+  const replace = entry.id;
+  if (entry.source) entry.source.close();
+  entry.source = null;
+  entry.id = null;
+  if (replace) entry.term.reset();
+  terminalFit(entry);
+  const body = await api("/term/open", {
+    cwd: entry.cwd, cols: entry.term.cols, rows: entry.term.rows, ...(replace ? { replace } : {}),
+  });
+  entry.starting = false;
+  if (!body || body.error) {
+    entry.term.writeln("\x1b[31m" + ((body && body.error) || "could not start a shell") + "\x1b[0m");
+    return;
+  }
+  terminalAttach(entry, body, false);
+}
+
+/** Follow one server-side shell: its output in, and a resize to match. */
+function terminalAttach(entry, info, replay) {
+  entry.id = info.id;
+  entry.name = info.name || entry.name;
+  entry.exited = false;
+  paintTerminalTabs();
+  const source = new EventSource(q("/term/stream?id=" + encodeURIComponent(info.id)));
+  entry.source = source;
+  source.onmessage = (message) => {
+    const event = JSON.parse(message.data);
+    if (event.type === "data") entry.term.write(event.data);
+    else if (event.type === "exit") {
+      entry.exited = true;
+      entry.term.writeln("\r\n\x1b[2m" + t("terminal.exited") + "\x1b[0m");
+    } else if (event.type === "closed") {
+      source.close();
+      if (entry.id === info.id) entry.id = null;
+    }
+  };
+  // A reattached shell was sized for whatever window it was last drawn in.
+  if (replay) void api("/term/resize", { id: info.id, cols: entry.term.cols, rows: entry.term.rows });
+  if (entry.pending) terminalSend(entry, "");
+}
+
+function terminalFit(entry) {
+  if (terminalPanel.hidden || entry.host.hidden) return;
+  try { entry.fit.fit(); } catch { /* not laid out yet */ }
+}
+
+// --- its height ------------------------------------------------------------------
+
+/** The most the terminal may take, leaving the conversation a readable strip. */
+function terminalMaxHeight() {
+  const main = document.getElementById("main").getBoundingClientRect().height;
+  return Math.max(TERMINAL_MIN, main - (isPhone() ? 140 : 220));
+}
+
+function terminalApplyHeight(px) {
+  const saved = px ?? storedSize(TERMINAL_HEIGHT_KEY);
+  if (!saved) return void terminalPanel.style.removeProperty("--terminal-height");
+  const height = clamp(saved, TERMINAL_MIN, terminalMaxHeight());
+  terminalPanel.style.setProperty("--terminal-height", height + "px");
+  return height;
+}
+
+let terminalDragged;
+dragHandle(document.getElementById("terminal-resizer"), {
+  axis: "y",
+  start: () => terminalPanel.getBoundingClientRect().height,
+  move: (dx, dy, start) => { terminalDragged = terminalApplyHeight(start - dy); },
+  end: () => storeSize(TERMINAL_HEIGHT_KEY, terminalDragged),
+  reset: () => { storeSize(TERMINAL_HEIGHT_KEY); terminalApplyHeight(); },
+});
+
+// Every size change reaches the shell as rows and columns: a drag, the window,
+// the sidebar folding, a phone's keyboard coming up.
+new ResizeObserver(() => {
+  const entry = terminalActive();
+  if (entry) terminalFit(entry);
+}).observe(terminalBody);
+window.addEventListener("resize", () => { if (!terminalPanel.hidden) terminalApplyHeight(); });
+
+document.getElementById("terminal-hide").addEventListener("click", hideTerminal);
+document.getElementById("terminal-new").addEventListener("click", () => {
+  if (terminalCwd) void terminalNew(terminalCwd);
+});
+`;
+//# sourceMappingURL=terminal.js.map

package/dist/page/client/terminal.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"terminal.js","sourceRoot":"","sources":["../../../src/page/client/terminal.ts"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,MAAM,CAAC,MAAM,QAAQ,GAAG,MAAM,CAAC,GAAG,CAAA;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAmVjC,CAAC"}

package/dist/page/client/transcript.d.ts

@@ -0,0 +1,8 @@
+/**
+ * The transcript itself, the tool cards it is made of, and the session tabs
+ * above it. Tool presentation is shared with the approval dialog, so a call
+ * reads the same whether it is waiting on an answer or already done.
+ *
+ * One part of the client script; see ./index.ts for how the parts join.
+ */
+export declare const TRANSCRIPT: string;