@oharness/server 0.7.0 → 0.8.0

package/dist/page/client/dialogs.js

@@ -0,0 +1,724 @@
+/**
+ * The two things that stop a turn to ask: the permission dialog, and the
+ * question cards the ask_user tool puts in the transcript.
+ *
+ * One part of the client script; see ./index.ts for how the parts join.
+ */
+export const DIALOGS = String.raw `
+// --- permission dialog ----------------------------------------------------
+
+/**
+ * How many lines of the payload are shown before the body is folded.
+ *
+ * Enough to recognise what is being written without the buttons falling below
+ * the fold, which is what decides whether the dialog gets read or dismissed.
+ */
+const ASK_FOLD = 14;
+
+const askBody = document.getElementById("ask-body");
+const askMore = document.getElementById("ask-more");
+const askExpand = document.getElementById("ask-expand");
+const askRaw = document.getElementById("ask-raw");
+const askScope = document.getElementById("ask-scope");
+let askState = null;
+/**
+ * Requests that arrived while another was on screen, oldest first. A second
+ * request used to overwrite the first one's id, which left that turn waiting
+ * on an answer nobody could give any more.
+ */
+const askQueue = [];
+
+/**
+ * The rule a "remember" answer would write.
+ *
+ * Mirrors candidates() on the server so the dialog can name the exact
+ * pattern being persisted. Naming it is the point: "remember for this project"
+ * reads like a blanket grant, and users decline it rather than find out.
+ */
+function askRuleKey(request) {
+  const name = request.toolName || "";
+  // The spelling candidates() writes a rule in: capitalized, unless the name is
+  // already snake_case and would only be disfigured by it.
+  const capitalized = name.includes("_") ? name : name.charAt(0).toUpperCase() + name.slice(1);
+  const input = request.input;
+  if (!input || typeof input !== "object") return capitalized;
+  // A platform app call is named by its app, and by the app's own tool when it
+  // is executing one — see principalArgument() on the server.
+  if (typeof input.app === "string") {
+    const app = typeof input.tool === "string" ? input.app + ":" + input.tool : input.app;
+    return capitalized + "(" + app + ")";
+  }
+  const field =
+    name === "bash" ? "command"
+    : "path" in input ? "path"
+    : "pattern" in input ? "pattern"
+    : "url" in input ? "url"
+    : null;
+  const value = field ? input[field] : undefined;
+  if (typeof value !== "string") return capitalized;
+  return capitalized + "(" + value + ")";
+}
+
+/** Bytes, at the precision a person actually reads them at. */
+function askSize(text) {
+  const bytes = new TextEncoder().encode(text).length;
+  if (bytes < 1024) return bytes + " B";
+  if (bytes < 1024 * 1024) return (bytes / 1024).toFixed(1) + " KB";
+  return (bytes / (1024 * 1024)).toFixed(1) + " MB";
+}
+
+/** Lines of a payload. A file ending in a newline has no empty last line to show. */
+const askLines = (text, kind) => {
+  const lines = text.split("\n");
+  if (lines.length > 1 && lines[lines.length - 1] === "") lines.pop();
+  return lines.map((s) => ({ s, kind }));
+};
+
+/**
+ * The request, rearranged for a reader.
+ *
+ * The payload of a write is the file content, not the JSON object carrying it;
+ * the payload of an edit is the substitution, which only means anything as a
+ * diff. A command leads with what it is for when the model said, and shows
+ * the command whole underneath. Other tools get their parameters as a table,
+ * with the JSON behind the toggle — and a call with no parameters gets no body.
+ */
+function askView(request) {
+  const name = (request.toolName || "").toLowerCase();
+  const input = request.input && typeof request.input === "object" ? request.input : {};
+  const view = {
+    tag: t("ask.tagCall"),
+    target: toolTitle(request.toolName, input, request.title),
+    path: "",
+    mono: false,
+    logo: undefined,
+    meta: [],
+    lines: [],
+    code: "",
+    params: null,
+  };
+
+  if (name === "write" && typeof input.content === "string") {
+    view.tag = t("ask.tagWrite");
+    view.path = askPath(input.path);
+    view.lines = input.content === "" ? [] : askLines(input.content, "");
+    view.meta.push(
+      view.lines.length === 1 ? t("ask.oneLine") : t("ask.nLines", { n: view.lines.length }),
+      askSize(input.content),
+    );
+    return view;
+  }
+
+  if (name === "edit" && typeof input.newString === "string") {
+    const removed = input.oldString ? askLines(String(input.oldString), "del") : [];
+    const added = input.newString ? askLines(input.newString, "add") : [];
+    view.tag = input.replaceAll ? t("ask.tagEditAll") : t("ask.tagEdit");
+    view.path = askPath(input.path);
+    view.meta.push(t("ask.diffStat", { added: added.length, removed: removed.length }));
+    view.lines = removed.concat(added);
+    return view;
+  }
+
+  if (name === "bash" && typeof input.command === "string") {
+    view.tag = t("ask.tagBash");
+    if (typeof input.description === "string" && input.description.trim()) {
+      view.target = input.description.trim();
+      view.code = input.command;
+    } else {
+      view.target = input.command;
+      view.mono = true;
+    }
+    return view;
+  }
+
+  if (name === "cloud_app_execute" || name === "cloud_app_tools") {
+    view.tag = t("ask.tagApp");
+    if (typeof input.app === "string") view.logo = cloudAppLogo(input.app);
+    if (name === "cloud_app_execute" && !isEmptyInput(input.arguments)) view.params = input.arguments;
+    return view;
+  }
+
+  if (typeof input.url === "string") {
+    view.tag = t("ask.tagFetch");
+    view.target = input.url;
+    view.mono = true;
+    const rest = Object.fromEntries(Object.entries(input).filter(([key]) => key !== "url"));
+    if (!isEmptyInput(rest)) view.params = rest;
+    return view;
+  }
+
+  if (typeof input.path === "string") view.meta.push(askPath(input.path));
+  else if (typeof input.pattern === "string") view.meta.push(input.pattern);
+  if (!isEmptyInput(input)) view.params = input;
+  return view;
+}
+
+function paintAskHead(view, request) {
+  document.getElementById("ask-tag").textContent = view.tag;
+  const target = document.getElementById("ask-target");
+  target.replaceChildren();
+  target.classList.toggle("mono", view.mono || Boolean(view.path));
+  if (view.path) {
+    // The directory is context; the file name is the thing being approved.
+    const cut = view.path.lastIndexOf("/");
+    if (cut >= 0) target.appendChild(el("span", "dir", view.path.slice(0, cut + 1)));
+    target.appendChild(el("span", "base", view.path.slice(cut + 1)));
+  } else {
+    target.textContent = view.target || "";
+  }
+
+  const logo = document.getElementById("ask-logo");
+  logo.hidden = !view.logo;
+  if (view.logo) {
+    logo.onerror = () => { logo.hidden = true; };
+    logo.src = view.logo;
+  } else {
+    logo.removeAttribute("src");
+  }
+
+  const meta = document.getElementById("ask-meta");
+  // Which rule made the harness ask belongs with the other metadata, and in
+  // the page's own language rather than the engine's English sentence.
+  const rule = request.rule ? t("ask.rule", { rule: request.rule }) : request.reason;
+  meta.textContent = view.meta.concat(rule ? [rule] : []).filter(Boolean).join(" · ");
+  meta.hidden = meta.textContent === "";
+}
+
+/** A path shown relative to the working directory when it sits inside it. */
+function askPath(value) {
+  if (typeof value !== "string") return "";
+  if (currentCwd && value.startsWith(currentCwd + "/")) return value.slice(currentCwd.length + 1);
+  return value;
+}
+
+function renderAskBody() {
+  if (!askState) return;
+  const { view, request } = askState;
+  askBody.replaceChildren();
+  askBody.classList.remove("diff", "clamped");
+  let foldable = false;
+
+  if (askState.raw) {
+    const pre = el("pre", "ask-code");
+    pre.textContent = JSON.stringify(request.input, null, 2);
+    askBody.appendChild(pre);
+  } else if (view.lines.length) {
+    const shown = askState.expanded ? view.lines : view.lines.slice(0, ASK_FOLD);
+    foldable = view.lines.length > ASK_FOLD;
+    askBody.classList.toggle("diff", view.lines.some((line) => line.kind));
+    for (const [index, line] of shown.entries()) {
+      const row = el("div", "ask-line" + (line.kind ? " " + line.kind : ""));
+      // A diff has no line numbers to give: the replacement has not happened, so
+      // counting the rows would name positions that do not exist in the file.
+      const gutter = line.kind === "del" ? "−" : line.kind === "add" ? "+" : String(index + 1);
+      row.append(el("span", "n", gutter), el("span", "s", line.s || " "));
+      askBody.appendChild(row);
+    }
+    askBody.classList.toggle("clamped", !askState.expanded);
+  } else if (view.code) {
+    const pre = el("pre", "ask-code");
+    pre.textContent = view.code;
+    askBody.appendChild(pre);
+  } else if (view.params) {
+    askBody.appendChild(paramTable(view.params));
+  }
+  askBody.hidden = askBody.childElementCount === 0;
+
+  askExpand.hidden = askState.raw || !foldable;
+  askExpand.textContent = askState.expanded ? t("ask.collapse") : t("ask.expand", { n: view.lines.length });
+  // Raw parameters only where the body is a rearrangement of them. A file or
+  // a command is already shown whole, and an empty call has nothing to reveal.
+  // This button used to be shown always, which on a command left one orphaned
+  // row between two rules.
+  askRaw.hidden = !view.params;
+  askRaw.textContent = askState.raw ? t("ask.rawHide") : t("ask.raw");
+  askMore.hidden = askExpand.hidden && askRaw.hidden;
+}
+
+function showAsk(event) {
+  if (pendingId === event.id || askQueue.some((queued) => queued.id === event.id)) return;
+  if (pendingId) return void askQueue.push(event);
+  pendingId = event.id;
+  const request = event.request;
+  const view = askView(request);
+  askState = { request, view, expanded: false, raw: false };
+
+  paintAskHead(view, request);
+  // Every description is laid out up front, one line each and stacked in one
+  // cell, so hovering swaps the text without resizing the dialog. The rule key
+  // closes each line: a long path is what gets cut, and the tooltip has it all.
+  const ruleKey = askRuleKey(request);
+  for (const line of askScope.children) {
+    const scope = line.dataset.scope;
+    line.textContent = t(scope === "once" ? "ask.scopeOnce" : scope === "session" ? "ask.scopeSession" : "ask.scopeProject", { key: ruleKey });
+    line.title = line.textContent;
+  }
+  askScope.dataset.show = "once";
+  renderAskBody();
+  // The palette is a convenience; this is a turn waiting on an answer. Two
+  // stacked modals would leave the deeper one unreachable behind the newer.
+  if (paletteDialog.open) paletteDialog.close();
+  if (!ask.open) ask.showModal();
+  ask.querySelector('[data-answer="once"]').focus();
+}
+
+function nextAsk() {
+  const next = askQueue.shift();
+  if (next) showAsk(next);
+}
+
+/** Taken down without an answer: another window answered it, or its turn stopped. */
+function withdrawAsk(id) {
+  const queued = askQueue.findIndex((entry) => entry.id === id);
+  if (queued >= 0) askQueue.splice(queued, 1);
+  if (pendingId !== id) return;
+  pendingId = null;
+  ask.close();
+}
+
+askExpand.addEventListener("click", () => {
+  askState.expanded = !askState.expanded;
+  renderAskBody();
+});
+
+askRaw.addEventListener("click", () => {
+  askState.raw = !askState.raw;
+  renderAskBody();
+});
+
+ask.addEventListener("close", () => {
+  // Escape, the backdrop, anything other than a button: a dismissal is a
+  // refusal. Approval has to be an explicit act.
+  if (pendingId) answer(false, null);
+  askState = null;
+  // After the close has finished: showModal on a dialog still closing throws.
+  setTimeout(nextAsk, 0);
+});
+
+// Enter approves once, which is the answer the dialog is focused on anyway.
+// Escape already denies, through the dialog's own close.
+ask.addEventListener("keydown", (event) => {
+  if (event.key !== "Enter" || event.shiftKey || event.metaKey || event.ctrlKey) return;
+  if (event.target.tagName === "BUTTON" && event.target.dataset.answer !== "once") return;
+  event.preventDefault();
+  ask.querySelector('[data-answer="once"]').click();
+});
+
+for (const button of ask.querySelectorAll("[data-answer]")) {
+  button.addEventListener("click", () => {
+    const choice = button.dataset.answer;
+    answer(choice !== "no", choice === "session" || choice === "project" ? choice : null);
+    ask.close();
+  });
+
+  // What a scope actually costs, spelled out before it is chosen rather than
+  // discovered later in the settings file.
+  const scope = button.dataset.scope;
+  if (!scope) continue;
+  const describe = () => {
+    askScope.dataset.show = scope;
+  };
+  const hide = () => {
+    askScope.dataset.show = "once";
+  };
+  button.addEventListener("mouseenter", describe);
+  button.addEventListener("focus", describe);
+  button.addEventListener("mouseleave", hide);
+  button.addEventListener("blur", hide);
+}
+
+function answer(allow, remember) {
+  const id = pendingId;
+  pendingId = null;
+  if (!id) return;
+  // Which way the answer went and how far it was remembered — never what was
+  // being asked about, which is a command line or a path.
+  track("permission_answered", { allow: allow, remember: remember || "once" });
+  void api("/permission", { id, allow, remember: remember || undefined });
+}
+
+
+// --- questions -------------------------------------------------------------
+// The ask_user tool. The card lives in the transcript of its own session, is
+// drawn again after a reload (the server replays what is still waiting), and
+// ends as one line saying how it was answered.
+
+/** Every question this page has seen, by the server's interaction id. */
+const questionCards = new Map();
+
+function questionCard(event) {
+  // Only a server interaction can be answered; anything without its id is not one.
+  if (typeof event.id !== "string") return;
+  let entry = questionCards.get(event.id);
+  if (!entry) {
+    const questions = (event.request && event.request.questions) || [];
+    entry = {
+      id: event.id,
+      session: event.session,
+      request: event.request,
+      step: 0,
+      preview: 0,
+      status: "open",
+      error: "",
+      result: null,
+      picks: Object.fromEntries(questions.map((q) => [q.id, { selected: [], other: "" }])),
+    };
+    questionCards.set(event.id, entry);
+  }
+  paintQuestion(entry);
+  const box = questionBox(entry);
+  if (pane(entry.session) === panes.get(activeId)) {
+    follow();
+    // Focus moves to the card only when nothing is being typed: a question
+    // arriving mid-sentence must not swallow the next keystrokes.
+    if (document.activeElement !== input || !input.value) {
+      const first = box.querySelector(".q-opt");
+      if (first) first.focus({ preventScroll: true });
+    }
+  }
+}
+
+function questionBox(entry) {
+  const target = pane(entry.session);
+  let box = target.node.querySelector('[data-question-id="' + entry.id + '"]');
+  if (!box) {
+    box = el("section", "question-card column");
+    box.dataset.questionId = entry.id;
+    box.tabIndex = -1;
+    box.setAttribute("aria-live", "polite");
+    box.addEventListener("keydown", (e) => questionKey(entry, e));
+    target.node.appendChild(box);
+  }
+  return box;
+}
+
+function openQuestion(session) {
+  for (const entry of questionCards.values()) {
+    if (entry.session === session && entry.status === "open") return entry;
+  }
+  return undefined;
+}
+
+const questionAnswered = (entry, q) => {
+  const pick = entry.picks[q.id];
+  return Boolean(pick && (pick.selected.length || pick.other.trim()));
+};
+
+function paintQuestion(entry) {
+  const box = questionBox(entry);
+  const focused = document.activeElement && box.contains(document.activeElement)
+    ? document.activeElement.dataset.index || (document.activeElement.classList.contains("q-other-input") ? "other" : "")
+    : "";
+  box.replaceChildren();
+  const questions = entry.request.questions || [];
+  const live = entry.status === "open" || entry.status === "sending";
+  box.classList.toggle("settled", !live);
+  if (!live) {
+    for (const node of questionSettled(entry)) box.appendChild(node);
+    return;
+  }
+
+  const q = questions[entry.step] || questions[0];
+  const pick = entry.picks[q.id];
+
+  const head = el("div", "q-head");
+  if (questions.length > 1) {
+    questions.forEach((item, index) => {
+      const tab = el("button", "q-tab" + (index === entry.step ? " on" : "") + (questionAnswered(entry, item) ? " done" : ""), item.header);
+      tab.type = "button";
+      tab.onclick = () => { entry.step = index; entry.preview = 0; paintQuestion(entry); };
+      head.appendChild(tab);
+    });
+  } else {
+    head.appendChild(el("span", "q-tag", q.header));
+  }
+  if (q.multiSelect) head.appendChild(el("span", "q-hint", t("question.multi")));
+  box.appendChild(head);
+  box.appendChild(el("div", "q-text", q.question));
+
+  const layout = el("div", "q-layout");
+  const list = el("div", "q-options");
+  list.setAttribute("role", "group");
+  q.options.forEach((option, index) => {
+    const on = pick.selected.includes(option.label);
+    const row = el("button", "q-opt" + (on ? " on" : ""));
+    row.type = "button";
+    row.dataset.index = String(index);
+    row.setAttribute("aria-pressed", String(on));
+    row.appendChild(el("span", "q-key", String(index + 1)));
+    const words = el("span", "q-words");
+    words.appendChild(el("span", "q-label", option.label));
+    if (option.description) words.appendChild(el("span", "q-desc", option.description));
+    row.appendChild(words);
+    row.appendChild(el("span", "q-check", on ? "✓" : ""));
+    row.onclick = () => pickOption(entry, q, index);
+    const show = () => {
+      if (entry.preview === index) return;
+      entry.preview = index;
+      const panel = box.querySelector(".q-preview");
+      if (!panel) return;
+      panel.textContent = option.preview || "";
+      panel.hidden = !option.preview;
+    };
+    row.addEventListener("mouseenter", show);
+    row.addEventListener("focus", show);
+    list.appendChild(row);
+  });
+
+  const other = el("label", "q-opt q-other" + (pick.other.trim() ? " on" : ""));
+  other.appendChild(el("span", "q-key", String(q.options.length + 1)));
+  const field = el("input", "q-other-input");
+  field.type = "text";
+  field.maxLength = 2000;
+  field.placeholder = t("question.other");
+  field.value = pick.other;
+  field.addEventListener("input", () => {
+    pick.other = field.value;
+    // One answer to a single-choice question: typing replaces the pick.
+    if (!q.multiSelect && field.value.trim() && pick.selected.length) {
+      pick.selected = [];
+      for (const row of list.querySelectorAll(".q-opt[data-index]")) {
+        row.classList.remove("on");
+        row.setAttribute("aria-pressed", "false");
+        row.querySelector(".q-check").textContent = "";
+      }
+    }
+    other.classList.toggle("on", Boolean(field.value.trim()));
+    paintQuestionActions(entry, box);
+  });
+  field.addEventListener("keydown", (e) => {
+    if (e.key === "Enter" && !e.isComposing) {
+      e.preventDefault();
+      advanceQuestion(entry);
+    }
+  });
+  other.appendChild(field);
+  list.appendChild(other);
+  layout.appendChild(list);
+
+  // Under the options, not beside them: side by side halved both inside a chat
+  // column, and most options carry no preview at all. It follows the row under
+  // the pointer or the keyboard, and folds away for a row that has none.
+  if (q.options.some((option) => option.preview)) {
+    const preview = el("pre", "q-preview mono");
+    const shown = (q.options[entry.preview] || q.options[0]).preview || "";
+    preview.textContent = shown;
+    preview.hidden = !shown;
+    layout.appendChild(preview);
+  }
+  box.appendChild(layout);
+
+  const actions = el("div", "q-actions");
+  box.appendChild(actions);
+  paintQuestionActions(entry, box);
+  if (entry.error) box.appendChild(el("div", "q-error", entry.error));
+
+  // Keep the keyboard where it was across the redraw a pick causes.
+  if (focused === "other") field.focus();
+  else if (focused) {
+    const again = list.querySelector('.q-opt[data-index="' + focused + '"]');
+    if (again) again.focus();
+  }
+}
+
+function paintQuestionActions(entry, box) {
+  const actions = box.querySelector(".q-actions");
+  if (!actions) return;
+  actions.replaceChildren();
+  const questions = entry.request.questions || [];
+  const last = entry.step >= questions.length - 1;
+  const sending = entry.status === "sending";
+
+  // The hint holds the left end; every button sits together at the right,
+  // Skip nearest the reader's way in and Submit last.
+  actions.appendChild(el("span", "q-keys", t("question.keys")));
+  const skip = el("button", "quiet", t("question.skip"));
+  skip.type = "button";
+  skip.disabled = sending;
+  skip.onclick = () => void sendQuestion(entry, { outcome: "dismissed" });
+  actions.appendChild(skip);
+
+  if (entry.step > 0) {
+    const back = el("button", "", t("question.back"));
+    back.type = "button";
+    back.disabled = sending;
+    back.onclick = () => { entry.step--; entry.preview = 0; paintQuestion(entry); };
+    actions.appendChild(back);
+  }
+  const primary = el("button", "approve", last ? t("question.submit") : t("question.next"));
+  primary.type = "button";
+  primary.disabled = sending || (last
+    ? !questions.every((q) => questionAnswered(entry, q))
+    : !questionAnswered(entry, questions[entry.step]));
+  primary.onclick = () => advanceQuestion(entry);
+  actions.appendChild(primary);
+}
+
+function pickOption(entry, q, index) {
+  if (entry.status !== "open") return;
+  const pick = entry.picks[q.id];
+  const label = q.options[index].label;
+  if (q.multiSelect) {
+    pick.selected = pick.selected.includes(label)
+      ? pick.selected.filter((chosen) => chosen !== label)
+      : pick.selected.concat(label);
+  } else {
+    pick.selected = pick.selected[0] === label ? [] : [label];
+    if (pick.selected.length) pick.other = "";
+  }
+  entry.preview = index;
+  paintQuestion(entry);
+  // A single choice with more questions after it moves on by itself; the last
+  // one still waits for Submit, so a slip of the finger is not sent.
+  const questions = entry.request.questions;
+  if (!q.multiSelect && pick.selected.length && entry.step < questions.length - 1) {
+    entry.step++;
+    entry.preview = 0;
+    paintQuestion(entry);
+    const first = questionBox(entry).querySelector(".q-opt");
+    if (first) first.focus();
+  }
+}
+
+function advanceQuestion(entry) {
+  if (entry.status !== "open") return;
+  const questions = entry.request.questions;
+  if (!questionAnswered(entry, questions[entry.step])) return;
+  if (entry.step < questions.length - 1) {
+    entry.step++;
+    entry.preview = 0;
+    paintQuestion(entry);
+    const first = questionBox(entry).querySelector(".q-opt");
+    if (first) first.focus();
+    return;
+  }
+  const unanswered = questions.findIndex((q) => !questionAnswered(entry, q));
+  if (unanswered >= 0) {
+    entry.step = unanswered;
+    return void paintQuestion(entry);
+  }
+  const answers = {};
+  for (const q of questions) {
+    const pick = entry.picks[q.id];
+    const other = pick.other.trim();
+    answers[q.id] = other ? { selected: pick.selected, other } : { selected: pick.selected };
+  }
+  void sendQuestion(entry, { outcome: "answered", answers });
+}
+
+function questionKey(entry, e) {
+  if (entry.status !== "open" || e.metaKey || e.ctrlKey || e.altKey) return;
+  if (e.target && e.target.tagName === "INPUT") return;
+  const questions = entry.request.questions;
+  const q = questions[entry.step];
+  if (!q) return;
+  if (/^[1-9]$/.test(e.key)) {
+    const n = Number(e.key);
+    if (n <= q.options.length) {
+      e.preventDefault();
+      return void pickOption(entry, q, n - 1);
+    }
+    if (n === q.options.length + 1) {
+      e.preventDefault();
+      const field = questionBox(entry).querySelector(".q-other-input");
+      if (field) field.focus();
+      return;
+    }
+  }
+  // Enter moves on rather than toggling the focused row; Space still toggles.
+  if (e.key === "Enter") {
+    e.preventDefault();
+    return void advanceQuestion(entry);
+  }
+  if ((e.key === "ArrowRight" && entry.step < questions.length - 1) || (e.key === "ArrowLeft" && entry.step > 0)) {
+    e.preventDefault();
+    entry.step += e.key === "ArrowRight" ? 1 : -1;
+    entry.preview = 0;
+    paintQuestion(entry);
+    const first = questionBox(entry).querySelector(".q-opt");
+    if (first) first.focus();
+  }
+  if (e.key === "Escape") {
+    e.preventDefault();
+    void sendQuestion(entry, { outcome: "dismissed" });
+  }
+}
+
+async function sendQuestion(entry, answer) {
+  if (entry.status !== "open") return;
+  entry.status = "sending";
+  entry.error = "";
+  paintQuestion(entry);
+  const reply = await api("/question", { id: entry.id, answer });
+  if (reply && reply.error) {
+    // Gone already means it was settled elsewhere; the result event says how.
+    // A 404 is that case with the event lost on the way (a stream that
+    // reconnected): the question is over, so the card says so instead of
+    // offering an answer nobody is waiting for.
+    if (entry.status === "sending" && reply.error === "no such pending question") {
+      entry.status = "closed";
+    } else if (entry.status === "sending") {
+      entry.status = "open";
+      entry.error = reply.error;
+    }
+    return void paintQuestion(entry);
+  }
+  // Counts and outcome only, never the questions or what was chosen.
+  track("question_answered", {
+    questions: entry.request.questions.length,
+    outcome: answer.outcome,
+    other: Boolean(answer.answers && Object.values(answer.answers).some((pick) => pick.other)),
+  });
+  if (entry.status === "sending" || entry.status === "closed") {
+    entry.status = answer.outcome;
+    entry.result = answer;
+  }
+  paintQuestion(entry);
+  if (pane(entry.session) === panes.get(activeId)) input.focus();
+}
+
+/** The engine's own account of how the question ended — authoritative over the page's. */
+function settleQuestion(event) {
+  for (const entry of questionCards.values()) {
+    if (entry.session !== event.session || !entry.request || entry.request.id !== event.id) continue;
+    if (!event.result) continue;
+    entry.status = event.result.outcome;
+    entry.result = event.result;
+    paintQuestion(entry);
+  }
+}
+
+function closeQuestion(id) {
+  const entry = questionCards.get(id);
+  if (!entry || (entry.status !== "open" && entry.status !== "sending")) return;
+  entry.status = "closed";
+  paintQuestion(entry);
+}
+
+function questionSettled(entry) {
+  const result = entry.result || {};
+  const titles = {
+    answered: "question.answered",
+    dismissed: "question.dismissed",
+    aborted: "question.aborted",
+    unavailable: "question.unavailable",
+  };
+  const nodes = [el("div", "q-settled-title", t(titles[entry.status] || "question.closed"))];
+  if (entry.status === "answered" && result.answers) {
+    for (const q of entry.request.questions) {
+      const pick = result.answers[q.id] || {};
+      const parts = (pick.selected || []).slice();
+      if (pick.other) parts.push(pick.other);
+      const line = el("div", "q-settled-line");
+      line.append(el("span", "q-settled-head", q.header), el("span", "", parts.join(", ")));
+      nodes.push(line);
+    }
+  }
+  if (entry.status === "dismissed" && result.note) {
+    nodes.push(el("div", "q-settled-line", t("question.note", { note: result.note })));
+  }
+  return nodes;
+}
+
+`;
+//# sourceMappingURL=dialogs.js.map