samagotchi 0.53.0 → 0.55.0

data/lib/samagotchi/web/public/llm_context_chip.js

@@ -12,6 +12,8 @@
 // choice for the next create only (POST /api/sessions' llm_context), never
 // remembered: nothing is sent unless the user sets one.
 
+import { html, nothing } from "./vendor/lit-html.js";
+
 export const STRATEGIES = [
   { value: "none", label: "none" },
   { value: "stale", label: "stale" },
@@ -70,11 +72,12 @@ export function chipModel(summary, { kind = SESSION } = {}) {
   return { text: `llm ctx ${summary.strategy}${own ? ` · ${kind}` : ""}`, title, own };
 }
 
-export function chipHtml(summary, escapeHtml) {
+// The session bar's chip (a lit-html template; info_bar.js), nothing
+// without a summary.
+export function chipTemplate(summary) {
   const chip = chipModel(summary);
-  if (!chip) return "";
-  return `<button type="button" class="model llmctx-chip${chip.own ? " own" : ""}" title="${escapeHtml(chip.title)}" ` +
-    `aria-haspopup="dialog">${escapeHtml(chip.text)}</button>`;
+  if (!chip) return nothing;
+  return html`<button type="button" class=${`model llmctx-chip${chip.own ? " own" : ""}`} title=${chip.title} aria-haspopup="dialog">${chip.text}</button>`;
 }
 
 // The /llm-context line for the form's values. With +initial+ (the values
@@ -201,8 +204,8 @@ export function popoverPlace(rect, { width, height, innerWidth, innerHeight }) {
   return height > room ? { ...place, maxHeight: room } : place;
 }
 
-// The chip's popover. el: where the chip is drawn (#infoText, redrawn every
-// tick: clicks are delegated); summary(): the open session's llm_context;
+// The chip's popover. el: where the chip is drawn (#infoText, info_bar.js:
+// clicks are delegated); summary(): the open session's llm_context;
 // session(): the open session's id; running(): a turn runs; run(line):
 // sends the command.
 // The start page's (kind NEW_CHAT): summary() is the picked model's,

data/lib/samagotchi/web/public/question_card.js

@@ -145,7 +145,9 @@ export function truncate(text, n = 80) {
 // asks its tool and command: "execute: rm -rf tmp → Denied").
 export function summaryText(pq, { answer = null, cancelled = false, reason = "" } = {}) {
   if (cancelled || answer) {
-    const result = resultText(pq, { answer, cancelled, reason }).replace(/^Answered: /, "");
+    // A deny's typed reason stays out of the one-liner (the body line has it).
+    const result = !cancelled && deniedReason(pq, answer) ? "Denied"
+      : resultText(pq, { answer, cancelled, reason }).replace(/^Answered: /, "");
     const relay = relayView(pq);
     const asked = summaryAsked(pq);
     const text = asked ? `${truncate(asked, 60)} → ${result}` : result;
@@ -165,6 +167,12 @@ function summaryAsked(pq) {
   return String(pq.question || pq.header || "").split("\n")[0];
 }
 
+// The reason typed with an approval's deny ("" when none, or not a deny).
+export function deniedReason(pq, answer) {
+  if (approvalAllowed(pq, answer) !== false) return "";
+  return answer && answer.freeform ? String(answer.freeform) : "";
+}
+
 // Whether the answer allowed the call (the card turns green) or denied it.
 export function approvalAllowed(pq, answer) {
   if (!isApproval(pq)) return null;

data/lib/samagotchi/web/public/question_cards.js

@@ -15,11 +15,12 @@
 import { dismissQuestion, sendAnswer, sendCommand } from "./data.js";
 import { diffHtml } from "./diff_view.js";
 import {
-  answerErrorText, approvalAllowed, approvalView, CONTINUE_REASON_PLACEHOLDER, isContinue, nextCardAction,
+  answerErrorText, approvalAllowed, approvalView, CONTINUE_REASON_PLACEHOLDER, deniedReason, isContinue, nextCardAction,
   relayedToView, resultText, summaryText,
 } from "./question_card.js";
 import { sessionHash } from "./route.js";
-import { clientLabel, continueLine, isOwn } from "./turn_events.js";
+import { clientLabel, isOwn } from "./turn_events.js";
+import { continueLine } from "./commands.js";
 
 // @param sessionId () => the open session's id (answers go there)
 // @param clientId this tab's id in the session's events
@@ -339,8 +340,10 @@ export function createQuestionCards({
     if (summary) summary.textContent = summaryText(pending, { answer, cancelled, reason });
     // 4.02: a reopened card's summary already carries the result (the
     // snapshot re-renders it resolved), and the body line repeats it. It
-    // stays for a hand-toggled card, whose expanded body the user looks at.
-    if (summary && !questionEl.dataset.toggled) note.classList.add("hidden");
+    // stays for a hand-toggled card, whose expanded body the user looks at,
+    // and for a deny with a reason: the summary says only "Denied".
+    const keepNote = questionEl.dataset.toggled || (!cancelled && deniedReason(pending, answer));
+    if (summary && !keepNote) note.classList.add("hidden");
     if (!questionEl.dataset.toggled) questionEl.open = false;
     pending = null;
   }

data/lib/samagotchi/web/public/refs.js

@@ -0,0 +1,134 @@
+// Refs: quiet links from what a turn touched to the thing itself. A ref is
+// a kind and a target: today a file tool's row title (the server's FileRef,
+// {kind: "file", path, line?, end_line?}) and that row's diff lines (the
+// same file at a line). The DOM carries data-ref-kind and the target's
+// attributes, never what a click does: that is an action, kept per kind in
+// REF_ACTIONS, and a click runs the first one available to this viewer. A
+// ref with none (a phone: no editor) stays plain text; the page marks the
+// kinds that have one on its body (refs-<kind>), which the hover styling
+// keys on.
+
+import { escapeHtml } from "./format.js";
+
+// The data attributes a ref's element carries.
+export function refAttrs(ref) {
+  if (!ref?.kind) return "";
+  const attr = (name, value) => (value ? ` data-ref-${name}="${escapeHtml(String(value))}"` : "");
+  return ` data-ref-kind="${escapeHtml(ref.kind)}"${attr("path", ref.path)}${attr("line", ref.line)}${attr("end-line", ref.end_line)}`;
+}
+
+// The URL +template+ ({path}, {line}; web.editor) opens +path+ at +line+
+// (1 when none) with: each path segment encoded, the slashes kept. "" with
+// no template or path.
+export function editorUrl(template, path, line) {
+  if (!template || !path) return "";
+  const encoded = String(path).split("/").map(encodeURIComponent).join("/");
+  return template.replaceAll("{path}", encoded).replaceAll("{line}", String(line || 1));
+}
+
+// What a ref can do, per kind, in order: the first available one is a
+// click's. +viewer+ is what this page's viewer can do ({editor, editorUrl}:
+// the server's capabilities.editor and editor_url).
+export const REF_ACTIONS = Object.freeze({
+  file: Object.freeze([
+    Object.freeze({
+      id: "editor",
+      available: (viewer) => viewer?.editor === true && !!viewer.editorUrl,
+      url: (target, viewer) => editorUrl(viewer.editorUrl, target.path, target.line),
+      // The hover hint: it opens the file as it is now.
+      hint: (target) => `Open the current file in your editor${target.line ? ` at line ${target.line}` : ""}`,
+    }),
+  ]),
+});
+
+// The first action +viewer+ has for a ref of +kind+, else null.
+export function refAction(kind, viewer, actions = REF_ACTIONS) {
+  return (actions[kind] || []).find((action) => action.available(viewer)) || null;
+}
+
+// The kinds that have an action for +viewer+ (the page's refs-<kind> classes).
+export function availableKinds(viewer, actions = REF_ACTIONS) {
+  return Object.keys(actions).filter((kind) => refAction(kind, viewer, actions));
+}
+
+// What a click on +el+ points at: {kind, path, line, owner} or null. A row
+// title opens its file at the lines the call named (an edit without any at
+// its first changed line); a diff line (or a hunk header) in a row with a
+// ref opens the row's file at that line. A diff line outside a row (an
+// approval card's dry run) is none.
+export function refTarget(el) {
+  const title = el?.closest?.("[data-ref-kind]");
+  if (title) {
+    const owner = title.closest(".activity-row");
+    return { ...targetOf(title), line: Number(title.dataset.refLine) || firstChange(owner), owner: owner || title };
+  }
+  const diffLine = el?.closest?.(".diff-line[data-line]");
+  const owner = diffLine?.closest(".activity-row");
+  const ref = owner?.querySelector("[data-ref-kind]");
+  if (!ref) return null;
+  return { ...targetOf(ref), line: Number(diffLine.dataset.line), owner };
+}
+
+function targetOf(el) {
+  return { kind: el.dataset.refKind, path: el.dataset.refPath || "" };
+}
+
+// An edit/write without a line range opens at its first changed line (its
+// diff knows it, the call doesn't); null without a diff.
+function firstChange(row) {
+  const line = row?.querySelector(".diff-line.diff-add[data-line], .diff-line.diff-del[data-line]");
+  return line ? Number(line.dataset.line) : null;
+}
+
+// A drag that selected text in the clicked ref's row isn't a click on the
+// ref. A selection elsewhere on the page (or a collapsed one) doesn't count.
+function selectingIn(owner, selection) {
+  if (!selection || selection.isCollapsed || !owner) return false;
+  return [selection.anchorNode, selection.focusNode].some((node) => node && owner.contains(node));
+}
+
+function defaultOpen(url) {
+  // The e2e seam (spec/e2e): a spec defines it before the page loads.
+  if (typeof window.__chiRefOpen === "function") window.__chiRefOpen(url);
+  else window.location.href = url;
+}
+
+// One delegated listener on +root+ for every ref on the page. +viewer+()
+// is read per click and hover, so a capabilities change (another session,
+// a reload) is seen; +open+(url) opens an action's URL.
+export function installRefClicks(root, viewer, { open = defaultOpen, selection = () => window.getSelection?.() } = {}) {
+  root.addEventListener("click", (e) => {
+    if (e.button !== 0 || e.defaultPrevented) return;
+    const target = refTarget(e.target);
+    if (!target) return;
+    const action = refAction(target.kind, viewer());
+    if (!action) return;
+    if (selectingIn(target.owner, selection())) return;
+    const url = action.url(target, viewer());
+    if (!url) return;
+    e.preventDefault();
+    e.stopPropagation();
+    open(url);
+  });
+  // The hover hint, on the ref's own element, worked out on each hover
+  // (the viewer can change): its own title (a row title's hover) first,
+  // then the action's hint when there is one.
+  root.addEventListener("mouseover", (e) => {
+    const target = refTarget(e.target);
+    if (!target) return;
+    const el = e.target.closest("[data-ref-kind]") || e.target.closest(".diff-line[data-line]");
+    if (!el) return;
+    if (el.dataset.refTitle === undefined) el.dataset.refTitle = el.getAttribute("title") || "";
+    const own = el.dataset.refTitle;
+    const action = refAction(target.kind, viewer());
+    const title = [own, action ? action.hint(target) : ""].filter(Boolean).join("\n");
+    if (title) el.setAttribute("title", title);
+    else el.removeAttribute("title");
+  });
+}
+
+// The body's classes for +viewer+: refs-<kind> for each kind with an action.
+export function setRefKinds(body, viewer, actions = REF_ACTIONS) {
+  const kinds = availableKinds(viewer, actions);
+  for (const kind of Object.keys(actions)) body.classList.toggle(`refs-${kind}`, kinds.includes(kind));
+}

data/lib/samagotchi/web/public/restore.js

@@ -0,0 +1,81 @@
+// Pure helpers for a failed turn's prompt handed back (prompt_restored):
+// what goes back into this tab's composer, and when (a restore that comes
+// before its /turn ack waits for it). Split out of turn_events.js.
+
+import { clientLabel, isOwn, withImages } from "./turn_events.js";
+
+// What a prompt_restored (the worker rolled a failed turn back and handed its
+// prompt back) does in this tab: `refill` is the text for an empty composer,
+// only for a prompt this page sent (`sentIds`, its acks' enqueued_ids), so a
+// replay after a reload never refills stale text; `own`/`label` mark the
+// failed bubble shown again after the resync.
+export function restoreAction(event, { myId, sentIds, composerEmpty }) {
+  const origin = event?.origin || {};
+  const own = isOwn(origin.client_id, myId);
+  const sent = own && !!origin.enqueued_id && sentIds.has(origin.enqueued_id);
+  // The images go back as chips with the text.
+  return withImages({
+    refill: sent && composerEmpty ? event.prompt : null,
+    own,
+    label: own ? null : clientLabel(origin.client_id),
+  }, sent && composerEmpty ? event.images : null);
+}
+
+// A turn that fails fast can have its prompt_restored come over the stream
+// before the /turn ack names its enqueued_id: `early` (a Map) keeps such a
+// restore of this tab's own prompt by that id, and the ack takes it back
+// (restoreOnAck), so the prompt goes into the composer the ack would clear.
+export function keepEarlyRestore(event, early, { myId, sentIds }) {
+  const origin = event?.origin || {};
+  const id = origin.enqueued_id;
+  if (!isOwn(origin.client_id, myId) || !id || sentIds.has(id)) return false;
+  early.set(id, event);
+  return true;
+}
+
+// The ack's enqueued_id (already in sentIds) was restored early: what the
+// composer gets back (as restoreAction for an empty composer), else null.
+export function restoreOnAck(enqueuedId, early, { myId, sentIds }) {
+  const event = enqueuedId && early.get(enqueuedId);
+  if (!event) return null;
+  early.delete(enqueuedId);
+  return restoreAction(event, { myId, sentIds, composerEmpty: true });
+}
+
+// The /turn this kept entry was for failed: no ack comes, so nothing would
+// take it back. The whole map goes: this tab sends one turn at a time, so
+// every entry waits for an ack that is now never coming (an older one is
+// left over from a send that failed the same way).
+export function dropEarlyRestores(early) {
+  const count = early.size;
+  early.clear();
+  return count;
+}
+
+// The composer's text with a restored prompt put back into it: the restored
+// text alone when nothing is typed, else the typed text with the restored
+// prompt under it (the user typed between the restore and the ack; their
+// text must not be replaced).
+export function restoreInto(refill, current) {
+  const restored = String(refill ?? "");
+  const typed = String(current ?? "");
+  if (!restored) return typed;
+  if (!typed.trim()) return restored;
+  return `${typed.replace(/\n+$/, "")}\n${restored}`;
+}
+
+// What the composer holds once a /turn ack lands (4.13): the composer still
+// carries the text that was just sent, so that text goes (it is the history's
+// now) — but text typed since the send stays, and a prompt restored before
+// this ack (restoreOnAck's refill) is put back without replacing it. The
+// sent text is trimmed (turnText), so the composer's is too before they are
+// compared: a trailing newline or space must not keep the message; and an
+// image-only send (placeholders sent) leaves nothing worth keeping.
+// @param sent the text the turn was sent with
+// @param current the composer's text as the ack lands
+// @param refill the prompt an early restore handed back, if any
+export function composerAfterAck({ sent = "", current = "", refill = "" } = {}) {
+  const typed = String(current ?? "").trim();
+  const kept = !typed || typed === String(sent ?? "").trim() ? "" : current;
+  return restoreInto(refill, kept);
+}

data/lib/samagotchi/web/public/session_state.js

@@ -4,6 +4,8 @@
 // the previous session set, its "delegated by" parent, its commands, never
 // shows for the next one).
 
+import { savedCtxPct } from "./ctx.js";
+import { firstPreview, previewForCard } from "./format.js";
 import { normalizeTiming } from "./timing.js";
 
 export function emptySessionState() {
@@ -46,3 +48,53 @@ export function emptySessionState() {
     timing: normalizeTiming(),
   };
 }
+
+// The fields a session's payload (GET /sessions/:id) sets, read from it
+// alone. ctxPct is left out when the payload has no saved fill, ctxWindow
+// and ctxWindowSource when it has no window: the page keeps what it had
+// (a running turn's replay streams over it).
+export function sessionStateFrom(data) {
+  const s = data.session;
+  const state = {
+    status: s.status,
+    model: s.model_name,
+    served: s.served_model ? [s.served_model, s.served_model_for, s.served_expected_by || null] : null,
+    dir: s.working_directory,
+    owner: s.owner || null,
+    timing: normalizeTiming(data.timing),
+  };
+  // The saved fill, so a reloaded or stopped session shows it before its
+  // next turn.
+  const savedPct = savedCtxPct(data.timing?.context, s.llm_context?.budget_tokens);
+  if (savedPct !== null) state.ctxPct = savedPct;
+  if (data.timing?.context?.window_tokens) {
+    state.ctxWindow = data.timing.context.window_tokens;
+    state.ctxWindowSource = data.timing.context.window_source || null;
+  }
+  state.firstPreview = sessionFirstPreview(data);
+  state.usedMemories = s.used_memory_names || [];
+  state.preloadedMemories = s.preloaded_memory_names || [];
+  state.mutedMemories = s.muted_memory_names || [];
+  state.promptNotes = Array.isArray(s.prompt_notes) ? s.prompt_notes : [];
+  state.llmContext = s.llm_context || null;
+  state.thinking = s.thinking || null;
+  state.parentId = s.parent_id || null;
+  state.continues = s.continues || null;
+  state.commands = Array.isArray(data.commands) ? data.commands : [];
+  return state;
+}
+
+// The info bar's title: the first user message when the payload has
+// messages, else the card's preview, else the first prompt of its history.
+function sessionFirstPreview(data) {
+  const s = data.session;
+  let preview = s.first_preview || previewForCard(s);
+  if (data.messages && data.messages.length) {
+    const first = data.messages.find((m) => m.role === "user");
+    if (first && first.content) preview = firstPreview(first.content);
+  } else if (!preview && data.history && data.history.length) {
+    const txt = firstPreview(data.history[0]);
+    if (txt) preview = txt;
+  }
+  return preview;
+}