@oharness/server 0.9.2 → 0.10.0

package/dist/page/client/routines.js

@@ -22,55 +22,180 @@ async function newRoutine() {
   input.setSelectionRange(input.value.length, input.value.length);
 }
 
-/** One run as a line: when, how it went, and what it cost. */
-function runSummary(run) {
-  const when = new Date(run.startedAt).toLocaleString();
-  if (run.skipped) return t("routines.skipped", { when });
-  const parts = [t(run.ok ? "routines.lastOk" : "routines.lastFailed", { when })];
-  if (run.catchUp) parts.push(t("routines.catchUp"));
-  parts.push(t("routines.turns", { n: run.turns }));
-  if (run.costUsd) parts.push("$" + run.costUsd.toFixed(4));
-  return parts.join(" · ");
+/** A span of time as someone reads it: 42s, 3m 05s, 1h 12m. */
+function runDuration(ms) {
+  const sec = Math.max(0, Math.round(ms / 1000));
+  if (sec < 60) return sec + "s";
+  const min = Math.floor(sec / 60);
+  if (min < 60) return min + "m " + String(sec % 60).padStart(2, "0") + "s";
+  return Math.floor(min / 60) + "h " + (min % 60) + "m";
 }
 
+/** The first line worth reading out of what a run said, or why it stopped. */
+function runExcerpt(run) {
+  const text = run.error || run.output || "";
+  const line = text.split("\n").map((one) => one.replace(/^[#>*\-\s]+/, "").trim()).find(Boolean) || "";
+  return line.length > 160 ? line.slice(0, 159) + "…" : line;
+}
+
+/**
+ * What the page remembers across repaints: which histories are folded away
+ * and which runs are open. The panel is rebuilt whenever a run starts or
+ * ends, and losing what someone had opened each time would make it unusable
+ * while a routine is going.
+ */
+const foldedHistories = new Set();
+const openRuns = new Set();
+const runKey = (routine, run) => routine.name + "\0" + run.startedAt;
+
 /**
- * A routine's past runs, fetched when opened.
+ * One run in the history: a status, when, how long, what it cost, and one
+ * line under it — what it is doing, while it runs; the start of its answer or
+ * its error, after. Clicking opens it in place to the whole of that text,
+ * with a way into its conversation.
+ */
+function routineRunRow(run, routine) {
+  const state = run.running ? "running" : run.skipped ? "skipped" : run.ok ? "ok" : "failed";
+  const key = runKey(routine, run);
+  const row = el("div", "routine-run " + state);
+  row.dataset.routine = routine.name;
+  const top = el("div", "routine-run-top");
+  top.appendChild(el("span", "run-status " + state, t("routines.status." + state)));
+  top.appendChild(el("span", null, new Date(run.startedAt).toLocaleString()));
+  const facts = el("span", "muted routine-run-facts");
+  if (run.running) {
+    const tick = () => {
+      if (!facts.isConnected && facts.dataset.painted) return clearInterval(timer);
+      facts.dataset.painted = "1";
+      const bits = [t("routines.elapsed", { d: runDuration(Date.now() - run.startedAt) })];
+      const turns = Number(row.dataset.turns || run.turns || 0);
+      if (turns) bits.push(t("routines.turns", { n: turns }));
+      facts.textContent = bits.join(" · ");
+    };
+    const timer = setInterval(tick, 1000);
+    tick();
+  } else if (!run.skipped) {
+    const bits = [runDuration(run.finishedAt - run.startedAt), t("routines.turns", { n: run.turns })];
+    if (run.costUsd) bits.push("$" + run.costUsd.toFixed(4));
+    if (run.catchUp) bits.push(t("routines.catchUp"));
+    facts.textContent = bits.join(" · ");
+  } else if (run.reason === "still-running") {
+    facts.textContent = t("routines.stillRunning");
+  }
+  top.appendChild(facts);
+  row.appendChild(top);
+
+  const full = run.running ? run.activity || "" : run.error || run.output || "";
+  const line = el("div", "routine-run-text" + (run.error ? " err" : " muted"),
+    run.running ? full || t("routines.starting") : runExcerpt(run));
+  row.appendChild(line);
+  if (!line.textContent) line.remove();
+
+  const detail = el("div", "routine-run-detail");
+  if (full && !run.running) {
+    // The answer as the conversation shows it; an error stays plain text.
+    const body = el("div", "routine-run-full" + (run.error ? " err" : " md"));
+    if (run.error) body.textContent = full;
+    else body.appendChild(renderMarkdown(full));
+    detail.appendChild(body);
+  }
+  if (run.sessionId) {
+    const open = el("button", "ghost small", t("routines.openRun"));
+    open.type = "button";
+    open.addEventListener("click", (event) => {
+      event.stopPropagation();
+      void openSession(run.sessionId, routine.cwd);
+    });
+    detail.appendChild(open);
+  }
+  if (!detail.childNodes.length) return row;
+
+  row.appendChild(detail);
+  row.tabIndex = 0;
+  row.setAttribute("role", "button");
+  const setOpen = (on) => {
+    row.classList.toggle("open", on);
+    row.setAttribute("aria-expanded", on ? "true" : "false");
+    if (on) openRuns.add(key); else openRuns.delete(key);
+  };
+  setOpen(openRuns.has(key));
+  row.addEventListener("click", (event) => {
+    // Selecting text in the full answer is reading it, not closing it.
+    if (String(getSelection() || "")) return;
+    if (event.target.closest(".routine-run-full") && row.classList.contains("open")) return;
+    setOpen(!row.classList.contains("open"));
+  });
+  row.addEventListener("keydown", (event) => {
+    if (event.target !== row || (event.key !== "Enter" && event.key !== " ")) return;
+    event.preventDefault();
+    setOpen(!row.classList.contains("open"));
+  });
+  return row;
+}
+
+/** How many runs a card shows before "Show all". */
+const RUNS_SHOWN = 5;
+
+/**
+ * A routine's runs, newest first, the one going now on top.
  *
- * Skipped times are listed with the runs, with why: a routine that "didn't
- * run" is the question this answers, and the answer is usually that the
- * previous run was still going. A run opens its session — the whole of what
- * the agent did, not the last paragraph of it.
+ * Open unless folded: whether it ran, and what came of it, is what anyone
+ * opening this page wants to know. Repainted whenever a run starts or ends,
+ * and patched in place as a running one moves on, so a run started here is
+ * on the page at once and turns into its result when it finishes.
  */
 function routineHistory(routine) {
-  const box = el("details", "routine-history");
-  box.appendChild(el("summary", "muted small", t("routines.history")));
+  const box = el("div", "routine-history");
+  const head = el("button", "routine-history-head muted small");
+  head.type = "button";
+  const label = el("span", null, t("routines.history"));
+  head.append(el("span", "chev", "▾"), label);
+  box.appendChild(head);
   const list = el("div", "routine-runs");
   box.appendChild(list);
-  box.addEventListener("toggle", () => {
-    if (!box.open || list.dataset.loaded) return;
-    list.dataset.loaded = "1";
-    list.appendChild(el("div", "muted small", t("routines.loading")));
-    void getJson("/routine/history?name=" + encodeURIComponent(routine.name)).then((body) => {
+  const fold = (on) => {
+    box.classList.toggle("folded", on);
+    head.setAttribute("aria-expanded", on ? "false" : "true");
+    if (on) foldedHistories.add(routine.name); else foldedHistories.delete(routine.name);
+  };
+  fold(foldedHistories.has(routine.name));
+  head.addEventListener("click", () => fold(!box.classList.contains("folded")));
+
+  list.appendChild(el("div", "muted small", t("routines.loading")));
+  void getJson("/routine/history?name=" + encodeURIComponent(routine.name)).then((body) => {
+    list.replaceChildren();
+    const runs = (body && body.runs) || [];
+    if (runs.length) label.textContent = t("routines.historyCount", { n: runs.filter((run) => !run.running).length });
+    if (!runs.length) return void list.appendChild(el("div", "muted small", t("routines.noRuns")));
+    const paint = (all) => {
       list.replaceChildren();
-      const runs = (body && body.runs) || [];
-      if (!runs.length) return void list.appendChild(el("div", "muted small", t("routines.noRuns")));
-      for (const run of runs) {
-        const line = el(run.sessionId ? "button" : "div", "routine-run small" + (run.ok || run.skipped ? "" : " failed"));
-        line.appendChild(el("span", null, runSummary(run)));
-        if (run.skipped && run.reason === "still-running") {
-          line.appendChild(el("span", "muted", t("routines.stillRunning")));
-        }
-        if (run.sessionId) {
-          line.type = "button";
-          line.addEventListener("click", () => void openSession(run.sessionId, routine.cwd));
-        }
-        list.appendChild(line);
+      for (const run of all ? runs : runs.slice(0, RUNS_SHOWN)) list.appendChild(routineRunRow(run, routine));
+      if (runs.length > RUNS_SHOWN) {
+        const more = el("button", "ghost small routine-more", all ? t("routines.showFewer") : t("routines.showAll", { n: runs.length }));
+        more.type = "button";
+        more.addEventListener("click", () => paint(!all));
+        list.appendChild(more);
       }
-    });
+    };
+    paint(false);
   });
   return box;
 }
 
+/** A running routine moved on: say so in its row, without a repaint. */
+function paintRoutineActivity(event) {
+  for (const row of document.querySelectorAll(".routine-run.running")) {
+    if (row.dataset.routine !== event.name) continue;
+    row.dataset.turns = String(event.turns || 0);
+    let line = row.querySelector(".routine-run-text");
+    if (!line) {
+      line = el("div", "routine-run-text muted");
+      row.querySelector(".routine-run-top").after(line);
+    }
+    if (event.activity) line.textContent = event.activity;
+  }
+}
+
 /**
  * Scheduled runs, read from the scheduler rather than kept here.
  *
@@ -103,6 +228,10 @@ async function showRoutines() {
       const head = el("div", "row-head");
       head.appendChild(el("span", "row-title", routine.name));
       head.appendChild(el("span", "mono row-cron", routine.cron));
+      // What it runs on, and what it needs connected: the two things a run
+      // fails on without anyone there to fix them.
+      if (routine.model) head.appendChild(el("span", "muted small routine-where", routine.model.split("/").pop()));
+      if (routine.apps && routine.apps.length) head.appendChild(el("span", "muted small routine-where", routine.apps.join(", ")));
       if (!routine.enabled) head.appendChild(el("span", "tag", t("routines.paused")));
       // Where it runs. A routine is made in one project and runs there, from
       // whichever project is open when its time comes, so the card says which.
@@ -112,8 +241,9 @@ async function showRoutines() {
         head.appendChild(where);
       }
 
-      const run = el("button", "ghost", t("routines.run"));
+      const run = el("button", "ghost", t(routine.running ? "routines.running" : "routines.run"));
       run.type = "button";
+      run.disabled = Boolean(routine.running);
       run.addEventListener("click", () => {
         run.disabled = true;
         run.textContent = t("routines.running");
@@ -161,11 +291,9 @@ async function showRoutines() {
       if (routine.enabled && routine.nextRunAt) {
         bits.push(t("routines.next", { when: new Date(routine.nextRunAt).toLocaleString() }));
       }
-      if (routine.lastRun) bits.push(runSummary(routine.lastRun));
+      // The last run is the first line of the history below, so it is not
+      // repeated here.
       if (bits.length) row.appendChild(el("div", "muted small", bits.join("   ·   ")));
-      if (routine.lastRun && routine.lastRun.error) {
-        row.appendChild(el("div", "err small", routine.lastRun.error));
-      }
       row.appendChild(routineHistory(routine));
       panel.appendChild(row);
     }
@@ -197,7 +325,7 @@ async function showSettings() {
 
   // Rows are grouped by what they are about. Each group is filled as the page
   // is built and drawn at the end under its heading, and only when it has rows.
-  const groups = { workspace: el("div"), sync: el("div"), memory: el("div"), activity: el("div"), advanced: el("div"), about: el("div") };
+  const groups = { workspace: el("div"), remote: el("div"), sync: el("div"), memory: el("div"), activity: el("div"), advanced: el("div"), about: el("div") };
   let target = groups.workspace;
 
   // A click on a button inside a summary toggles the disclosure as well as
@@ -674,6 +802,132 @@ async function showSettings() {
       }),
     );
   }
+  // Remote control: a phone on this account driving this machine through the
+  // relay. Offered only where the server was given a relay to use, and off
+  // until somebody at the machine turns it on.
+  const remote = await getJson("/remote");
+  if (remote && !remote.error && remote.available) {
+    target = groups.remote;
+    const stateKey = (view) =>
+      view.state === "online" ? "online" : view.state === "connecting" ? "connecting" : view.state === "signed-out" ? "signedOut" : "off";
+    const body = field(
+      t("settings.remote"),
+      t("settings.remote." + stateKey(remote)),
+      t("settings.remoteHint"),
+      toggle(remote.on, t("settings.remote"), (next) => {
+        void api("/remote", { enabled: next }).then((result) => {
+          if (result && result.error) addNotice(result.error, "err");
+          void showSettings();
+        });
+      }),
+    );
+    if (remote.keepsAwake) body.appendChild(el("div", "muted small", t("settings.remoteAwake")));
+
+    // Where it stands, said in a sentence: off, waiting on an account,
+    // reaching for the relay, or there.
+    const status = el("div", "setting-status small");
+    const dot = el("span", "status-dot");
+    const said = el("span");
+    status.append(dot, said);
+    body.appendChild(status);
+    let signIn = null;
+    if (typeof openConnect === "function") {
+      signIn = el("button", "ghost", t("settings.remoteSignIn"));
+      signIn.type = "button";
+      signIn.addEventListener("click", () => openConnect("official"));
+      body.appendChild(signIn);
+    }
+    const row = body.parentNode;
+    const shownValue = row.querySelector(".setting-value");
+    const paint = (view) => {
+      const key = stateKey(view);
+      dot.className = "status-dot" + (key === "online" ? " ok" : "");
+      said.textContent = t("settings.remoteStatus." + key);
+      if (shownValue) shownValue.textContent = t("settings.remote." + key);
+      if (signIn) signIn.hidden = key !== "signedOut";
+    };
+    paint(remote);
+    // Connecting and signing in finish on their own time, so the row looks
+    // again while it is on screen and not yet online.
+    if (remote.on) {
+      const timer = setInterval(() => {
+        if (!document.body.contains(row)) return clearInterval(timer);
+        void getJson("/remote").then((view) => {
+          if (!view || view.error || !document.body.contains(row)) return;
+          paint(view);
+          if (!view.on || view.state === "online") clearInterval(timer);
+        });
+      }, 3000);
+    }
+
+    // The phones allowed in so far. Forgetting one ends its connection now
+    // and sends it back to the Allow card next time.
+    const phones = el("div", "setting-list");
+    phones.appendChild(el("div", "muted small", t("settings.remotePhones")));
+    const devices = remote.devices || [];
+    if (!devices.length) phones.appendChild(el("div", "small", t("settings.remoteNoPhones")));
+    for (const device of devices) {
+      const line = el("div", "remote-phone small");
+      line.appendChild(el("span", "remote-phone-name", device.name || device.id));
+      if (device.pairedAt) {
+        line.appendChild(el("span", "muted", t("settings.remotePairedOn", { date: new Date(device.pairedAt).toLocaleDateString() })));
+      }
+      const forget = el("button", "ghost", t("settings.remoteForget"));
+      forget.type = "button";
+      forget.addEventListener("click", () => {
+        forget.disabled = true;
+        void api("/remote/revoke", { id: device.id }).then((result) => {
+          if (result && result.error) {
+            forget.disabled = false;
+            return void addNotice(result.error, "err");
+          }
+          addNotice(t("settings.remoteForgotten", { name: device.name || device.id }));
+          void showSettings();
+        });
+      });
+      line.appendChild(forget);
+      phones.appendChild(line);
+    }
+    body.appendChild(phones);
+  }
+  // Computer use: only in the desktop app, which ships the helper. The switch
+  // is whether it may ever take the real mouse and keyboard; the list below
+  // it is the person's own additions to the apps it refuses.
+  const computer = await getJson("/computer-use/settings");
+  if (computer && !computer.error && computer.available) {
+    target = groups.workspace;
+    const takeover = computer.takeover !== "never";
+    const body = field(
+      t("settings.computerTakeover"),
+      t(takeover ? "settings.computerTakeoverAsk" : "settings.computerTakeoverNever"),
+      t("settings.computerTakeoverHint"),
+      toggle(takeover, t("settings.computerTakeover"), (next) => {
+        void api("/computer-use/settings", { takeover: next ? "ask" : "never" }).then(showSettings);
+      }),
+    );
+    const blocked = el("div", "setting-list");
+    blocked.appendChild(el("div", "muted small", t("settings.computerBlocked")));
+    const box = el("textarea", "boxed");
+    box.value = (computer.blockedApps || []).join("\n");
+    box.rows = Math.max(2, (computer.blockedApps || []).length + 1);
+    box.spellcheck = false;
+    box.style.width = "100%";
+    box.placeholder = t("settings.computerBlockedPlaceholder");
+    blocked.appendChild(box);
+    const save = el("button", "ghost", t("perms.save"));
+    save.type = "button";
+    save.addEventListener("click", () => {
+      save.disabled = true;
+      const apps = box.value.split("\n").map((line) => line.trim()).filter(Boolean);
+      void api("/computer-use/settings", { blockedApps: apps }).then((result) => {
+        save.disabled = false;
+        if (result && result.error) return void addNotice(result.error, "err");
+        addNotice(t("perms.saved"));
+      });
+    });
+    blocked.appendChild(save);
+    body.appendChild(blocked);
+  }
   // Which browsers the agent may use. Three choices, so a segmented control
   // rather than a switch; absent when the browser tools are off altogether,
   // since then there is nothing for it to move.
@@ -726,6 +980,7 @@ async function showSettings() {
   }
   const sections = [
     ["settings.section.workspace", [groups.workspace]],
+    ["settings.section.remote", [groups.remote]],
     ["settings.section.sync", [groups.sync, groups.memory]],
     ["settings.section.activity", [groups.activity]],
     ["settings.section.advanced", [groups.advanced]],

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

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