omp-conductor 0.18.2 → 0.19.0

package/src/dashboard/app.js

@@ -29,6 +29,16 @@ const panelReports = document.getElementById("panel-reports");
 const runDetail = document.getElementById("run-detail");
 const runTitle = document.getElementById("run-title");
 const runAttempts = document.getElementById("run-attempts");
+const controls = document.getElementById("controls");
+const controlResult = document.getElementById("control-result");
+const transcriptPane = document.getElementById("transcript");
+const transcriptToggle = document.getElementById("transcript-toggle");
+const transcriptAutoscroll = document.getElementById("transcript-autoscroll");
+const transcriptState = document.getElementById("transcript-state");
+const panelStats = document.getElementById("panel-stats");
+const statsBody = document.getElementById("stats-body");
+const statsWindowBar = document.getElementById("stats-window");
+const statsWindowLabel = document.getElementById("stats-window-label");
 
 /** Human verdict per daemon state — "down" spelled out by design. */
 const STATE_TEXT = {
@@ -56,6 +66,7 @@ const LANE_TITLES = {
 let token = localStorage.getItem(TOKEN_KEY);
 let currentProject = null;
 let currentTab = "board";
+let currentRunIssue = null;
 let pollTimer = null;
 
 function el(tag, className, text) {
@@ -80,6 +91,112 @@ async function api(path) {
   return res.json();
 }
 
+// --- controls (#295) ---
+
+// The mutating twin of `api`. Separate on purpose: every caller has to name a
+// method, so a read can never become a write by editing one string, and the
+// answer body is returned even for a refusal because the refusal text IS the
+// useful part (the daemon's own 409/422 wording, or a 502 naming the daemon).
+async function apiPost(path, body) {
+  const res = await fetch(path, {
+    method: "POST",
+    headers: {
+      Authorization: `Bearer ${token}`,
+      ...(body === undefined ? {} : { "content-type": "application/json" }),
+    },
+    ...(body === undefined ? {} : { body: JSON.stringify(body) }),
+  });
+  if (res.status === 401) {
+    showTokenPrompt();
+    throw new Error("token refused");
+  }
+  let parsed = null;
+  try {
+    parsed = await res.json();
+  } catch {
+    parsed = null;
+  }
+  return { ok: res.ok, status: res.status, body: parsed };
+}
+
+/** One line of feedback under the control bar — the server's own words. */
+function showControlResult(text, failed) {
+  controlResult.textContent = text;
+  controlResult.hidden = false;
+  controlResult.classList.toggle("state-degraded", failed === true);
+}
+
+/**
+ * Run one control and report it, then refresh so the page shows the new truth
+ * rather than the operator's expectation of it.
+ */
+async function runControl(path, body, describe) {
+  showControlResult(`${describe}…`, false);
+  try {
+    const answer = await apiPost(path, body);
+    const detail =
+      answer.body !== null && typeof answer.body === "object" && typeof answer.body.error === "string"
+        ? answer.body.error
+        : JSON.stringify(answer.body);
+    showControlResult(
+      answer.ok ? `${describe}: ok` : `${describe} refused (${answer.status}): ${detail}`,
+      __omp_shell("answer.ok,")
+    );
+  } catch (err) {
+    showControlResult(`${describe} failed: ${String(err.message ?? err)}`, true);
+    return;
+  }
+  await refreshProject(currentTab).catch(() => undefined);
+}
+
+/**
+ * The confirm gate for a destructive action, naming exactly what will happen.
+ *
+ * `hold` and `disarm` are here alongside worker-stop and `unblock --force`
+ * because both take the heartbeat down, and re-arming costs a Telegram
+ * challenge an operator has to answer in the chat — that is not something a
+ * mis-click should buy.
+ */
+function confirmDestructive(text) {
+  return window.confirm(text);
+}
+
+function projectPath(suffix) {
+  return `/api/projects/${encodeURIComponent(currentProject)}${suffix}`;
+}
+
+controls.addEventListener("click", (event) => {
+  const action = event.target?.dataset?.control;
+  if (action === undefined || currentProject === null) return;
+  event.preventDefault();
+  if (action === "resume") {
+    runControl(projectPath("/resume"), undefined, "resume dispatch");
+    return;
+  }
+  if (action === "disarm") {
+    if (!confirmDestructive("Disarm ticks? Re-arming needs a Telegram challenge answered in the chat.")) {
+      return;
+    }
+    runControl(projectPath("/disarm"), undefined, "disarm ticks");
+    return;
+  }
+  const reason = window.prompt(
+    action === "hold"
+      ? "Reason for holding the fleet (recorded in the pause sentinel):"
+      : "Reason for pausing dispatch (recorded in the pause sentinel):",
+  );
+  if (reason === null || reason.trim() === "") return;
+  if (
+    action === "hold" &&
+    __omp_shell("confirmDestructive(")
+      "Hold stops new claims AND disarms ticks. Re-arming needs a Telegram challenge answered in the chat. Continue?",
+    )
+  ) {
+    return;
+  }
+  runControl(projectPath(`/${action}`), { reason: reason.trim() }, `${action} fleet`);
+});
+
 function daemonLine(view) {
   const { daemon } = view;
   const text =
@@ -209,17 +326,26 @@ function setTab(tab) {
   panelBoard.hidden = tab !== "board";
   panelLedger.hidden = tab !== "ledger";
   panelReports.hidden = tab !== "reports";
+  panelStats.hidden = tab !== "stats";
   runDetail.hidden = true;
 }
 
 async function refreshProject(tab) {
   if (tab === "ledger") return refreshLedger();
   if (tab === "reports") return refreshReports();
+  if (tab === "stats") return refreshStats();
   return refreshBoard();
 }
 
 function renderProjectError(err) {
-  const target = currentTab === "ledger" ? panelLedger : currentTab === "reports" ? panelReports : panelBoard;
+  const target =
+    currentTab === "ledger"
+      ? panelLedger
+      : currentTab === "reports"
+        ? panelReports
+        : currentTab === "stats"
+          ? statsBody
+          : panelBoard;
   clear(target).appendChild(el("p", "error", `Could not load: ${err.message}`));
 }
 
@@ -281,9 +407,87 @@ function showRunDetail(issue) {
   runTitle.textContent = `${currentProject} #${issue}`;
   clear(runAttempts);
   runDetail.hidden = false;
+  // A stream belongs to one issue. Navigating to another run closes it rather
+  // than leaving it following the run the operator just left.
+  closeTranscript();
+  currentRunIssue = issue;
+  transcriptPane.hidden = true;
+  clear(transcriptPane);
+  transcriptToggle.textContent = "Watch transcript";
+  transcriptState.textContent = "";
+  transcriptState.classList.remove("state-degraded");
+  renderRunControls(issue);
   refreshRuns(issue);
 }
 
+/**
+ * Per-run actions (#295), rebuilt for whichever issue is open.
+ *
+ * Worker pause/resume/stop and extend go to the owning daemon, so a dead daemon
+ * answers 502 and the button says so — it never reports a pause that did not
+ * happen. `unblock --force` and worker-stop are confirmed by name because both
+ * destroy something: a terminal settlement, or an uncommitted worktree that is
+ * the only copy of a worker's output.
+ */
+function renderRunControls(issue) {
+  const bar = clear(document.getElementById("run-controls"));
+  const button = (label, className, handler) => {
+    const node = el("button", className, label);
+    node.type = "button";
+    node.addEventListener("click", handler);
+    bar.appendChild(node);
+  };
+  button("Pause worker", undefined, () =>
+    runControl(projectPath(`/runs/${issue}/worker/pause`), {}, `pause worker #${issue}`),
+  );
+  button("Resume worker", undefined, () =>
+    runControl(projectPath(`/runs/${issue}/worker/resume`), {}, `resume worker #${issue}`),
+  );
+  button("Stop worker", "destructive", () => {
+    const reason = window.prompt(`Reason for stopping #${issue} (recorded in the run's report):`);
+    if (reason === null || reason.trim() === "") return;
+    if (
+      __omp_shell("confirmDestructive(")
+        `Stop #${issue}? This settles the run terminally, salvages its tree and frees the slot. It cannot be resumed.`,
+      )
+    ) {
+      return;
+    }
+    runControl(
+      projectPath(`/runs/${issue}/worker/stop`),
+      { reason: reason.trim() },
+      `stop worker #${issue}`,
+    );
+  });
+  button("Extend turns", undefined, () => {
+    const raw = window.prompt(`New turn ceiling for #${issue}:`);
+    if (raw === null) return;
+    const maxTurns = Number(raw);
+    if (!Number.isSafeInteger(maxTurns) || maxTurns < 1) {
+      showControlResult("extend refused: the turn ceiling must be a positive integer", true);
+      return;
+    }
+    runControl(projectPath(`/runs/${issue}/extend`), { maxTurns }, `extend #${issue} to ${maxTurns}`);
+  });
+  button("Unblock", undefined, () =>
+    runControl(projectPath(`/runs/${issue}/unblock`), {}, `unblock #${issue}`),
+  );
+  button("Unblock --force", "destructive", () => {
+    if (
+      __omp_shell("confirmDestructive(")
+        `Force-unblock #${issue}? This accepts the loss of uncommitted work in its worktree, which may be the only copy.`,
+      )
+    ) {
+      return;
+    }
+    runControl(
+      projectPath(`/runs/${issue}/unblock`),
+      { force: true },
+      `force-unblock #${issue}`,
+    );
+  });
+}
+
 async function refreshRuns(issue) {
   const { runs } = await api(`/api/projects/${encodeURIComponent(currentProject)}/runs/${issue}`);
   const tbody = clear(runAttempts);
@@ -303,6 +507,265 @@ async function refreshRuns(issue) {
   }
 }
 
+// --- analytics (#297) ---
+
+const SVG_NS = "http://www.w3.org/2000/svg";
+let statsSince = "7d";
+
+function svg(tag, attrs) {
+  const node = document.createElementNS(SVG_NS, tag);
+  for (const [key, value] of Object.entries(attrs ?? {})) {
+    node.setAttribute(key, String(value));
+  }
+  return node;
+}
+
+/**
+ * A horizontal bar chart, hand-rolled because the epic forbids a chart
+ * dependency — and because the whole vocabulary needed is a rect and a label.
+ *
+ * `rows` is `[label, value, note?]`. An empty set renders the explicit empty
+ * state rather than an axis with nothing on it: a chart with no bars reads as a
+ * measurement of zero, which is the misreading #282 and this slice both exist to
+ * prevent.
+ */
+function barChart(title, rows, format) {
+  const box = el("div", "chart");
+  box.appendChild(el("h4", undefined, title));
+  if (rows.length === 0) {
+    box.appendChild(el("p", "empty", "no measurements in this window"));
+    return box;
+  }
+  const max = Math.max(...rows.map(([, value]) => value), 0);
+  const width = 520;
+  const rowH = 22;
+  const labelW = 168;
+  const chart = svg("svg", {
+    viewBox: `0 0 ${width} ${rows.length * rowH + 6}`,
+    role: "img",
+    "aria-label": title,
+    class: "bars",
+  });
+  rows.forEach(([label, value, note], i) => {
+    const y = i * rowH + 3;
+    const barW = max === 0 ? 0 : Math.max(1, Math.round(((width - labelW - 90) * value) / max));
+    chart.appendChild(
+      svg("text", { x: 0, y: y + 13, class: "bar-label" }),
+    ).textContent = label;
+    chart.appendChild(svg("rect", { x: labelW, y, width: barW, height: rowH - 8, class: "bar" }));
+    chart.appendChild(
+      svg("text", { x: labelW + barW + 6, y: y + 13, class: "bar-value" }),
+    ).textContent = note ?? format(value);
+  });
+  box.appendChild(chart);
+  return box;
+}
+
+function statLine(label, value) {
+  const row = el("div", "stat");
+  row.appendChild(el("span", "stat-label", label));
+  row.appendChild(el("span", "stat-value", value));
+  return row;
+}
+
+/** `null` means "not measured" everywhere in the report, and must never print
+ *  as a zero — that is the difference between "no merges" and "free". */
+function orDash(value, format) {
+  return value === null || value === undefined ? "—" : format(value);
+}
+
+function hours(ms) {
+  return `${(ms / 3_600_000).toFixed(1)}h`;
+}
+
+async function refreshStats() {
+  const path = projectPath(`/stats?since=${encodeURIComponent(statsSince)}`);
+  const report = await api(path);
+  statsWindowLabel.textContent = `${report.window.sinceDay} → ${report.window.untilDay}`;
+  const out = clear(statsBody);
+
+  if (report.empty === true) {
+    // The report's own verdict, not an inference from zeros.
+    out.appendChild(
+      el(
+        "p",
+        "empty",
+        "Nothing settled in this window — no measurements to show. (Zeros here would read as outcomes.)",
+      ),
+    );
+    out.appendChild(statLine("GitHub API calls", String(report.ghCalls)));
+    return;
+  }
+
+  const total = report.total;
+  const summary = el("div", "summary");
+  summary.appendChild(statLine("merged", String(total.merged)));
+  summary.appendChild(statLine("settled", String(total.settled)));
+  summary.appendChild(
+    statLine("merge rate", orDash(total.mergeRate, (v) => `${Math.round(v * 100)}%`)),
+  );
+  summary.appendChild(statLine("attempts / merge", orDash(total.runsPerMerged, (v) => v.toFixed(1))));
+  summary.appendChild(statLine("lead time p50", orDash(total.leadTimeMedianMs, hours)));
+  summary.appendChild(statLine("lead time p90", orDash(total.leadTimeP90Ms, hours)));
+  summary.appendChild(statLine("metered spend", usd(total.spendUsd)));
+  summary.appendChild(statLine("$ / merge", orDash(total.spendPerMerged, usd)));
+  summary.appendChild(statLine("GitHub API calls", String(report.ghCalls)));
+  out.appendChild(summary);
+
+  // Unmetered runs are their own series, never averaged in as free (#297's
+  // third criterion). Cost unknown is not cost zero, and the two must not sit
+  // in one number.
+  const unmetered = el("div", "chart");
+  unmetered.appendChild(el("h4", undefined, "Unmetered (telemetry absent — cost unknown, not $0)"));
+  const unmeteredRows = el("div", "summary");
+  unmeteredRows.appendChild(statLine("runs", String(total.unmeteredRuns)));
+  unmeteredRows.appendChild(statLine("merged issues", String(total.unmeteredMerged)));
+  unmetered.appendChild(unmeteredRows);
+  out.appendChild(unmetered);
+
+  out.appendChild(
+    barChart(
+      "Merges per repo",
+      report.repos.map((r) => [r.repo, r.merged]),
+      (v) => String(v),
+    ),
+  );
+  out.appendChild(
+    barChart(
+      "USD per merged PR",
+      report.repos
+        .filter((r) => r.spendPerMerged !== null)
+        .map((r) => [r.repo, r.spendPerMerged, usd(r.spendPerMerged)]),
+      usd,
+    ),
+  );
+  out.appendChild(
+    barChart(
+      "Lead time p90 per repo",
+      report.repos
+        .filter((r) => r.leadTimeP90Ms !== null)
+        .map((r) => [r.repo, r.leadTimeP90Ms, hours(r.leadTimeP90Ms)]),
+      hours,
+    ),
+  );
+  out.appendChild(
+    barChart(
+      "Failure classes",
+      Object.entries(total.failureClasses)
+        .sort((a, b) => b[1] - a[1])
+        .map(([cls, n]) => [cls, n]),
+      (v) => String(v),
+    ),
+  );
+}
+
+statsWindowBar.addEventListener("click", (event) => {
+  const since = event.target?.dataset?.since;
+  if (since === undefined || currentProject === null) return;
+  if (since === "custom") {
+    const raw = window.prompt("Window start — 7d, 30d, any Nd, or YYYY-MM-DD:", statsSince);
+    if (raw === null || raw.trim() === "") return;
+    statsSince = raw.trim();
+  } else {
+    statsSince = since;
+  }
+  refreshStats().catch((err) => renderProjectError(err));
+});
+
+// --- live transcript (#296) ---
+
+// The open stream, if any. One at a time by construction: opening a second
+// would double every line and leave the first following a run nobody is
+// watching.
+let transcriptSource = null;
+let transcriptIssue = null;
+// Cap on retained lines. A long run's transcript is unbounded and the DOM is
+// not: keeping every line eventually stalls the tab, which is a worse failure
+// than losing the top of a log the host still has in full.
+const TRANSCRIPT_MAX_LINES = 4000;
+
+function closeTranscript() {
+  if (transcriptSource !== null) {
+    transcriptSource.close();
+    transcriptSource = null;
+  }
+  transcriptIssue = null;
+}
+
+function transcriptAppend(text, className) {
+  const atBottom =
+    transcriptPane.scrollHeight - transcriptPane.scrollTop - transcriptPane.clientHeight < 24;
+  transcriptPane.appendChild(el("div", className, text));
+  while (transcriptPane.childElementCount > TRANSCRIPT_MAX_LINES) {
+    transcriptPane.removeChild(transcriptPane.firstElementChild);
+  }
+  // Autoscroll only when the operator is already at the bottom, even with the
+  // box ticked: yanking the view down while somebody is reading turn three is
+  // how a live pane becomes unusable.
+  if (transcriptAutoscroll.checked && atBottom) {
+    transcriptPane.scrollTop = transcriptPane.scrollHeight;
+  }
+}
+
+function openTranscript(issue) {
+  closeTranscript();
+  transcriptIssue = issue;
+  transcriptPane.hidden = false;
+  clear(transcriptPane);
+  transcriptToggle.textContent = "Stop watching";
+  transcriptState.textContent = "connecting…";
+  transcriptState.classList.remove("state-degraded");
+
+  // `EventSource` cannot send an Authorization header, so the token rides as a
+  // query parameter on this one endpoint. It is loopback by default and the
+  // page already holds the token; the alternative — a cookie — would be sent on
+  // every request including the static ones, which is strictly worse.
+  const url =
+    projectPath(`/runs/${issue}/transcript/stream`) + `?token=${encodeURIComponent(token)}`;
+  const source = new EventSource(url);
+  transcriptSource = source;
+
+  source.onopen = () => {
+    if (transcriptSource === source) transcriptState.textContent = "streaming";
+  };
+  source.onmessage = (event) => {
+    if (transcriptSource !== source) return;
+    transcriptAppend(event.data);
+  };
+  source.addEventListener("end", () => {
+    if (transcriptSource !== source) return;
+    transcriptState.textContent = "run ended — stream closed";
+    transcriptToggle.textContent = "Watch transcript";
+    closeTranscript();
+  });
+  source.addEventListener("error", (event) => {
+    if (transcriptSource !== source) return;
+    // A server-sent `error` event carries a reason (no transcript yet, no run);
+    // a transport error carries none, and EventSource retries that itself.
+    if (typeof event.data === "string" && event.data !== "") {
+      transcriptAppend(event.data, "state-degraded");
+      transcriptState.textContent = event.data;
+      transcriptState.classList.add("state-degraded");
+      transcriptToggle.textContent = "Watch transcript";
+      closeTranscript();
+      return;
+    }
+    transcriptState.textContent = "reconnecting…";
+  });
+}
+
+transcriptToggle.addEventListener("click", () => {
+  if (transcriptSource !== null) {
+    closeTranscript();
+    transcriptToggle.textContent = "Watch transcript";
+    transcriptState.textContent = "stopped";
+    return;
+  }
+  const issue = currentRunIssue;
+  if (issue === null) return;
+  openTranscript(issue);
+});
+
 function stateClass(state) {
   if (state === "merged" || state === "settled") return "green";
   if (state === "failed" || state === "killed") return "red";
@@ -383,8 +846,43 @@ async function refreshLedger() {
 
 async function refreshReports() {
   const path = `/api/projects/${encodeURIComponent(currentProject)}/reports`;
-  const { openReports, digestBacklog, heldNotices } = await api(path);
+  const { openReports, digestBacklog, heldNotices, openDecisions } = await api(path);
   const out = clear(panelReports);
+
+  // Questions waiting on the operator, answerable in place (#295's answer verb,
+  // which had no surface until #297 surfaced the list it acts on). Rendered
+  // first because it is the only thing on this tab that is *blocking* something.
+  const decisions = openDecisions ?? [];
+  out.appendChild(el("h3", undefined, `Open decisions (${decisions.length})`));
+  const dl = el("ul", "reports");
+  if (decisions.length === 0) dl.appendChild(el("li", "empty", "no open decisions"));
+  for (const decision of decisions) {
+    const li = el("li");
+    li.appendChild(el("div", undefined, decision.question));
+    const meta = [`asked ${new Date(decision.askedAt).toLocaleString()}`];
+    if (decision.blocks !== undefined && decision.blocks !== null) meta.push(`blocks ${decision.blocks}`);
+    li.appendChild(el("div", "state-muted", meta.join(" · ")));
+    // A watch is the orchestrator's own condition, never a question put to a
+    // human — offering an answer box for one would invite answering something
+    // nobody asked.
+    if (decision.kind !== "watch") {
+      const answer = el("button", undefined, "Answer…");
+      answer.type = "button";
+      answer.addEventListener("click", () => {
+        const text = window.prompt(decision.question);
+        if (text === null || text.trim() === "") return;
+        runControl(
+          projectPath(`/decisions/${encodeURIComponent(decision.id)}/answer`),
+          { answer: text.trim() },
+          `answer decision ${decision.id.slice(0, 8)}`,
+        );
+      });
+      li.appendChild(answer);
+    }
+    dl.appendChild(li);
+  }
+  out.appendChild(dl);
+
   out.appendChild(el("h3", undefined, `Open reports (${openReports.length})`));
   const ul = el("ul", "reports");
   if (openReports.length === 0) ul.appendChild(el("li", "empty", "no open reports"));
@@ -419,11 +917,15 @@ async function refreshReports() {
 
 document.getElementById("back-to-fleet").addEventListener("click", (event) => {
   event.preventDefault();
+  // Leaving the run view closes its stream (#296). Without this, navigating
+  // away leaves a follow running on the host for a pane nobody can see.
+  closeTranscript();
   showFleetView();
 });
 
 document.getElementById("back-to-board").addEventListener("click", (event) => {
   event.preventDefault();
+  closeTranscript();
   runDetail.hidden = true;
   refreshBoard().catch((err) => renderProjectError(err));
 });