samagotchi 0.68.0 → 0.69.0

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

@@ -44,7 +44,7 @@ import { elementOf, emptyAnswerTemplate } from "./turn_html.js";
 import { createBubbles, hintEl, outputBubbleTemplate, setBubbleDelivery } from "./bubbles.js";
 import { createCardsPlace } from "./cards_place.js";
 import { createStageView, FOLD_MS } from "./stage_view.js";
-import { CONTINUE_OPENER, isOpener, continueRefusal, continuedText, openChildrenTemplate } from "./chains.js";
+import { CONTINUE_OPENER, chainNeighbours, isOpener, continueRefusal, continuedText, freshLink, openChildrenTemplate } from "./chains.js";
 import { createTaskStopper } from "./task_stop.js";
 import { appendQuote } from "./annotations.js";
 import { parsePresets } from "./annotate_presets.js";
@@ -83,6 +83,7 @@ import { createDeliveryControl, QUEUE_NEEDS_WORKER } from "./delivery_line.js";
 import { liveSlots } from "./stage_model.js";
 import { currentGen } from "./turn_model.js";
 import { toolName } from "./activity.js";
+import { toastBottom } from "./toast_place.js";
 
 const $ = (s) => document.querySelector(s);
 const topStripEl = $("#topStrip");
@@ -118,7 +119,7 @@ const llmContextControl = createLlmContextControl({
 // drops it too, a failed create keeps it).
 const llmContextNewEl = $("#llmContextNew");
 let newChatLlmContext = null;
-const newChatLlmSummary = () => (modelPickEl.hidden ? null : modelPicker.chosenRow()?.llm_context || null);
+const newChatLlmSummary = () => (selected || modelPickEl.hidden ? null : modelPicker.chosenRow()?.llm_context || null);
 const llmContextNewControl = createLlmContextControl({
   el: llmContextNewEl,
   summary: newChatLlmSummary,
@@ -154,7 +155,7 @@ const reasoningHistoryControl = createReasoningHistoryControl({
 // for the next new chat only (sent with its create, then dropped).
 const thinkingNewEl = $("#thinkingNew");
 let newChatThinking = null;
-const newChatThinkingSummary = () => (modelPickEl.hidden ? null : modelPicker.chosenRow()?.thinking || null);
+const newChatThinkingSummary = () => (selected || modelPickEl.hidden ? null : modelPicker.chosenRow()?.thinking || null);
 const thinkingNewControl = createThinkingControl({
   el: thinkingNewEl,
   summary: newChatThinkingSummary,
@@ -587,11 +588,13 @@ function updateComposerMode() {
   // In a session the box is one line: its minimum follows the class.
   if (document.body.classList.toggle("has-session", !!selected) !== hadSession) {
     hadSession = !hadSession;
+    // Back on the start page: its remembered model, not the last link's.
+    if (!hadSession) restoreStartPick();
     fitPrompt();
     placeToast();
   }
+  syncModelPick();
   if (selected) {
-    modelPicker.close();
     llmContextNewControl.close();
     // The start page's choice was for a new chat: opening a session drops it.
     if (newChatLlmContext) {
@@ -648,6 +651,8 @@ function syncDeliveryLine() {
 
 function setTurnRunning(running) {
   liveTurn.running = !!running;
+  // A fresh link's picker goes now, not at the timing re-read after the turn.
+  if (running && selected) current.turnStarted = true;
   updateComposerMode();
   updateInfoBar();
 }
@@ -1096,6 +1101,9 @@ function updateInfoBar() {
   // mid-press) stay.
   renderInfoBar(infoTextEl, bar);
   updateSessionTitle();
+  // A fresh link's picker follows what the bar follows: its model, its
+  // owner, a next link continued from elsewhere.
+  syncModelPick();
 }
 
 // The open session's title, once on screen (session_title.js): its strip
@@ -1289,6 +1297,10 @@ const streamHandlers = createStreamHandlers({
   onInitEvent: (type, data) => onInitEvent(type, data),
   upsertCard: (card) => upsertCard(card),
   refreshCardBodies: () => refreshCardBodies(),
+  syncModelPick: () => {
+    if (pendingPick) pickRanEarly = true;
+    syncModelPick();
+  },
 });
 
 async function refreshTimingFromSession() {
@@ -1332,6 +1344,9 @@ function handleCreate() {
 // /queue wins over both.
 async function handleSendTurn({ delivery: chosen = null } = {}) {
   if (current.owner === "tui") return;
+  // A fresh link's pick first: its /model is queued in the worker once
+  // acked, and the worker runs queued commands before a turn's input.
+  if (pendingPick) await pendingPick;
   let prompt = turnText(promptEl.value, chips);
   if (!prompt) return;
   const armed = deliveryControl.take();
@@ -1516,10 +1531,24 @@ $("#newBtn").addEventListener("click", () => {
 // ── The start page's model picker ──────────────────────────────────────────
 // The hosts' models from GET /api/models, the choice this browser made last
 // preselected while it is still offered (else the server's default). Hidden
-// until the list is in, and in a session (its model is in the info bar). A
-// host that failed is the picker's tooltip; a route that fails leaves the
-// picker hidden and the server's default in charge. The search list itself
-// is model_picker.js'; a pick sends the focus to the message box.
+// until the list is in, and in a session (its model is in the info bar),
+// but a fresh chain link's (chains.js freshLink): there it shows the link's
+// model and a pick runs /model in the link, remembered neither as this
+// browser's choice nor in Recent. A host that failed is the picker's
+// tooltip; a route that fails leaves the picker hidden and the server's
+// default in charge. The search list itself is model_picker.js'; a pick
+// sends the focus to the message box.
+const START_PICK_TITLE = "The model the new chat starts on";
+let startPickTitle = START_PICK_TITLE;
+// The fresh link the picker shows (null: the start page, or a session it
+// is hidden in), and a link pick's /model still in flight (a send waits).
+let pickLinkId = null;
+let pickSelected = null;
+let pendingPick = null;
+let pendingPickId = null;
+// A command_ran came while the pick was in flight (its sync was skipped):
+// the ack syncs then.
+let pickRanEarly = false;
 const modelPicker = createModelPicker({
   button: modelPickEl,
   panel: $("#modelPanel"),
@@ -1527,12 +1556,70 @@ const modelPicker = createModelPicker({
   list: $("#modelList"),
   composer: $("#composer"),
   center: $("#center"),
-  onPick: () => {
-    renderNewChatLlmContext();
-    renderNewChatThinking();
+  remember: () => !selected,
+  onPick: (name) => {
+    if (selected) pickForLink(name);
+    else {
+      renderNewChatLlmContext();
+      renderNewChatThinking();
+    }
     promptEl.focus();
   },
 });
+// A pick on a fresh link: /model in its worker (its command bubble and the
+// info bar follow from command_ran); refused, the button goes back to the
+// link's model, if the page is still on that link.
+function pickForLink(name) {
+  const id = selected;
+  const run = runSessionCommand(`/model ${name}`).then((ok) => {
+    const ranEarly = pendingPick === run && pickRanEarly;
+    if (pendingPick === run) {
+      pendingPick = null;
+      pendingPickId = null;
+      pickRanEarly = false;
+    }
+    if ((!ok || ranEarly) && selected === id) syncModelPick();
+    return ok;
+  });
+  pendingPick = run;
+  pendingPickId = id;
+  pickRanEarly = false;
+}
+// The button's name, tooltip and label for what the page shows: a fresh
+// link's model, else the start page's (whose choice stays as it is).
+// Toggles the fresh-link class (the CSS shows the button in a session
+// only with it); the panel closes when the link changes or stops being fresh.
+function syncModelPick() {
+  // The list walk only for a link that is fresh otherwise (the info bar
+  // calls this every second while a turn runs).
+  const fresh = !!selected && freshLink(current, { running: liveTurn.running })
+    && !chainNeighbours(allSessions, selected, { continues: current.continues }).next;
+  document.body.classList.toggle("fresh-link", fresh);
+  const linkId = fresh ? selected : null;
+  // Another session (or the start page), or the link stopped being fresh:
+  // a panel left open would come back open where it no longer belongs.
+  if (selected !== pickSelected || linkId !== pickLinkId) modelPicker.close();
+  pickSelected = selected;
+  pickLinkId = linkId;
+  if (fresh) {
+    // A pick in flight keeps its name until its /model is taken (its
+    // command_ran syncs again then).
+    if (!(pendingPick && pendingPickId === selected)) modelPicker.show(current.model);
+    modelPickEl.title = "The model this link starts on";
+    modelPickEl.setAttribute("aria-label", "Model this link starts on");
+  } else {
+    modelPickEl.title = startPickTitle;
+    modelPickEl.setAttribute("aria-label", "Model for the new chat");
+  }
+}
+// Leaving a session: the start page's remembered model again (no fetch).
+function restoreStartPick() {
+  let stored = null;
+  try { stored = localStorage.getItem(MODEL_KEY); } catch (_) {}
+  modelPicker.restore(stored);
+  renderNewChatLlmContext();
+  renderNewChatThinking();
+}
 async function loadModels() {
   let payload;
   try {
@@ -1543,8 +1630,10 @@ async function loadModels() {
   let stored = null;
   try { stored = localStorage.getItem(MODEL_KEY); } catch (_) {}
   if (!modelPicker.setModels(payload, stored)) return;
-  modelPickEl.title = payload.warning ? `The model the new chat starts on · ${payload.warning}` : "The model the new chat starts on";
+  startPickTitle = payload.warning ? `${START_PICK_TITLE} · ${payload.warning}` : START_PICK_TITLE;
   modelPickEl.hidden = false;
+  // A fresh link open meanwhile shows its own model again, not the stored one.
+  syncModelPick();
   renderNewChatLlmContext();
   renderNewChatThinking();
 }
@@ -1819,13 +1908,15 @@ async function continueSelected() {
     markArchived([id], true);
     addCreatedSession(created);
     const next = created.id;
+    // A model fallback's warning stays until closed.
+    const sticky = !!created.model_warning;
     if (selected !== id) {
-      showToast(continuedText(id, created, { opened: false }), { label: "Open", run: () => select(next) });
+      showToast(continuedText(id, created, { opened: false }), { label: "Open", run: () => select(next) }, { sticky });
       return;
     }
     await select(next);
     if (selected === next) fillOpener();
-    showToast(continuedText(id, created));
+    showToast(continuedText(id, created), null, { sticky });
   } catch (e) {
     const refusal = continueRefusal(e, allSessions);
     if (refusal.kind === "open") {
@@ -1912,22 +2003,32 @@ async function setArchived(id, archive, { undo = true } = {}) {
 
 // The toast sits above the session's composer card (measured: it grows with
 // a wrapping footer or a taller box), so it never covers the card's
-// controls, and above the stage while it shows; with no card in sight (the
-// start page, all sessions) the CSS's 24 px from the bottom.
+// controls, and above the stage while it shows and a fresh link's open
+// model panel (toast_place.js); with no card in sight (the start page, all
+// sessions) the CSS's 24 px from the bottom.
 function placeToast() {
-  const gap = 12;
   const dock = document.getElementById("dock");
   const r = dock.getBoundingClientRect();
-  const over = document.body.classList.contains("has-session") && r.height > 0;
-  const stage = document.getElementById("turnStage");
-  const top = stage && !stage.hidden ? Math.min(r.top, stage.getBoundingClientRect().top) : r.top;
-  const bottom = over ? `${Math.round(window.innerHeight - top + gap)}px` : "";
+  const shownTop = (el) => {
+    const box = el && !el.hidden ? el.getBoundingClientRect() : null;
+    return box && box.height > 0 ? box.top : null;
+  };
+  const px = toastBottom({
+    inSession: document.body.classList.contains("has-session") && r.height > 0,
+    viewportHeight: window.innerHeight,
+    dockTop: r.top,
+    tops: [shownTop(document.getElementById("turnStage")), shownTop(document.getElementById("modelPanel"))],
+    toastHeight: document.getElementById("toast").offsetHeight,
+  });
+  const bottom = px === null ? "" : `${px}px`;
   const root = document.documentElement.style;
   if (root.getPropertyValue("--toast-bottom") !== bottom) {
     if (bottom) root.setProperty("--toast-bottom", bottom);
     else root.removeProperty("--toast-bottom");
   }
 }
+// The model panel opening, closing or changing height (its list filters).
+new ResizeObserver(() => placeToast()).observe(document.getElementById("modelPanel"));
 
 // sticky: stays until its action or its ✕ (else gone after 6 s). +text+:
 // words, or a template (chains.js openChildrenTemplate: a link in it, a
@@ -1939,8 +2040,8 @@ function showToast(text, action = null, { sticky = false } = {}) {
   render(html`<span @click=${(e) => { if (e.target.closest?.("a[href]")) hide(); }}>${text}</span>${action
     ? html`<button type="button" class="toast-action" @click=${() => { hide(); action.run(); }}>${action.label}</button>`
     : nothing}${sticky ? html`<button type="button" class="toast-close" title="Dismiss" aria-label="Dismiss" @click=${hide}>✕</button>` : nothing}`, el);
-  placeToast();
   el.hidden = false;
+  placeToast();
   clearTimeout(toastTimer);
   if (!sticky) toastTimer = setTimeout(hide, 6000);
 }

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

@@ -235,13 +235,30 @@ export function openChildrenTemplate(prevId, children, hrefFor) {
 }
 
 // The toast after a continue: the new link, the previous one archived (when
-// the page shows the new one), and how many open delegates moved to it
-// (the answer's moved).
+// the page shows the new one), how many open delegates moved to it (the
+// answer's moved), and the model fallback's warning (model_warning: the
+// previous link's host is gone, the link starts on the default).
 export function continuedText(prevId, created, { opened = true } = {}) {
   const short = String(prevId).slice(0, 8);
   const moved = Array.isArray(created?.moved) ? created.moved.length : 0;
   const parts = [`Continued ${short} in ${String(created?.id || "").slice(0, 8)}`];
   if (opened) parts.push(`${short} is archived`);
   if (moved) parts.push(`${moved} open ${moved === 1 ? "delegate" : "delegates"} moved`);
+  const warning = typeof created?.model_warning === "string" ? created.model_warning.trim() : "";
+  if (warning) parts.push(warning);
   return parts.join("; ");
 }
+
+// A fresh link: a chain link (its `continues`) with no turn yet, so its
+// composer offers the model picker (a pick runs /model in it). However the
+// link was made (continue →, chi send --continues, a reload). Not fresh once
+// a turn started (+state.turnStarted+, set live before the timing re-read
+// brings its record; a failed or canceled first turn counts too), while one
+// runs, when a terminal chi owns it (sending is refused there) or when it is
+// +continued+ itself (a /model there would wake an archived link).
+export function freshLink(state, { running = false, continued = false } = {}) {
+  if (!state?.continues || running || continued || state.turnStarted) return false;
+  if (state.owner === "tui") return false;
+  const timing = state.timing || {};
+  return !(timing.turnRecords || []).length && !timing.activeTurn;
+}

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

@@ -73,6 +73,20 @@ export function familyRowsTemplate(f, { activeId = null, matchIds = null, archiv
 // The widest window index.html lays out as a phone (@media (max-width:600px)).
 const PHONE_MAX_PX = 600;
 
+// The status dots' pulse in +root+ on the document timeline's clock (each
+// animation's start time 0), the phase the cards' --pulse-delay gives
+// theirs (lists_view.js cardAnimStyle): a popover keeps its row nodes
+// across draws, reused by position, so a dot that moves to another node
+// or starts pulsing there (a member inserted above, a status flip) would
+// otherwise start its pulse over, out of step with the rest.
+export function syncPulses(root) {
+  root.querySelectorAll(".dot").forEach((dot) => {
+    for (const a of dot.getAnimations?.() || []) {
+      if (a.startTime !== 0) a.startTime = 0;
+    }
+  });
+}
+
 // The strip's family popover: one #familyPop in body (position: fixed, so
 // the strip's sideways scroll on a phone doesn't clip it), under the chip
 // it was opened from and as wide as that card (300 px at least, inside the
@@ -128,6 +142,7 @@ export function createFamilyPop({ id = "familyPop", doc, win, rowsFor, anchorFor
     }
     // A row inserted before the focused one: the focus stays on its session.
     keepFocus(el, "data-id", () => render(rows, el));
+    syncPulses(el);
     anchor.setAttribute("aria-expanded", "true");
     place(anchor);
     return true;

data/lib/samagotchi/web/public/index.html

@@ -578,7 +578,7 @@ body.has-session #composer{flex-direction:row;align-items:flex-end;padding:10px}
 body.has-session #composer textarea{min-height:0}
 body.has-session #composeHint{display:none}
 body.has-session #composer .actions-col{flex-wrap:nowrap;flex-shrink:0}
-/* The model picker (start page only): reads as a label, "host:model ▾", left of Start; a button under a drawn caret that opens a searchable list (model_picker.js). Its name ellipsizes within max-width. */
+/* The model picker (the start page, and a fresh chain link: app.js syncModelPick): reads as a label, "host:model ▾", left of Start; a button under a drawn caret that opens a searchable list (model_picker.js). Its name ellipsizes within max-width. */
 #composer .actions-col .model-pick{order:0;position:relative;display:inline-block;max-width:min(50%,380px);height:28px;min-height:28px;padding:0 22px 0 8px;border-radius:8px;overflow:hidden;background:transparent;color:var(--text-muted);font-size:12px;line-height:28px;text-align:left;text-overflow:ellipsis;transition:background .12s ease,color .12s ease}
 #composer .actions-col .model-pick:hover,#composer .actions-col .model-pick[aria-expanded="true"]{filter:none;background:color-mix(in srgb,var(--bg-hover) 75%,transparent);color:var(--text-2)}
 #composer .actions-col .model-pick[hidden],body.has-session #composer .actions-col .model-pick{display:none}
@@ -586,7 +586,9 @@ body.has-session #composer .actions-col{flex-wrap:nowrap;flex-shrink:0}
 #composer .actions-col .model-pick.unavailable .model-pick-name{color:var(--text-faint)}
 .model-pick::after{content:"";position:absolute;right:9px;top:50%;width:5px;height:5px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;transform:translateY(-70%) rotate(45deg);pointer-events:none;transition:transform .12s ease}
 .model-pick[aria-expanded="true"]::after{transform:translateY(-20%) rotate(225deg)}
-@media(max-width:600px){#composer .actions-col .model-pick{max-width:60%}}
+/* A fresh link's (body.fresh-link): the session composer is one row and .actions-col is content-sized there, so a px cap keeps the text field's room and Send in view. :not([hidden]) keeps a failed /api/models' hide (this selector outranks the [hidden] one). */
+body.has-session.fresh-link #composer .actions-col .model-pick:not([hidden]){display:inline-block;flex:0 1 auto;min-width:0;max-width:200px}
+@media(max-width:600px){body.has-session.fresh-link #composer .actions-col .model-pick:not([hidden]){max-width:100px}}
 /* The new chat's LLM context chip, after the picker: as quiet as it; accent once a choice is set (the info bar chip's .own). */
 #composer .actions-col .llmctx-new{order:0;flex:0 1 auto;min-width:0;max-width:min(40%,260px);height:24px;min-height:24px;line-height:22px;padding:0 6px;border-radius:6px;border:1px solid transparent;background:transparent;color:var(--text-muted);font-size:11px;font-weight:400;overflow:hidden;text-overflow:ellipsis}
 #composer .actions-col .llmctx-new:hover{filter:none;color:var(--text);border-color:var(--accent-border);background:var(--accent-bg)}
@@ -594,8 +596,8 @@ body.has-session #composer .actions-col{flex-wrap:nowrap;flex-shrink:0}
 #composer .actions-col .llmctx-new[hidden],body.has-session #composer .actions-col .llmctx-new{display:none}
 /* The new chat's thinking chip, after it: shorter text, so a smaller share of the row. */
 #composer .actions-col .think-new{max-width:min(25%,140px)}
-/* Phones: picker · chip · Start on one row (the key hint is gone there); names cut short rather than wrapping, the chip first. */
-@media(max-width:600px){#composer .actions-col:has(.llmctx-new:not([hidden])){flex-wrap:nowrap}#composer .actions-col .model-pick{flex:0 1 auto;min-width:0}#composer .actions-col .llmctx-new{max-width:45%;flex-shrink:4}#composer .actions-col .think-new{max-width:30%}}
+/* Phones (the key hint is gone there): the chips keep their whole text and the row wraps, Start staying right (its margin-left:auto) on the last line; only a model name wider than the row ellipsizes. */
+@media(max-width:600px){#composer .actions-col .model-pick{flex:0 1 auto;min-width:0;max-width:100%}#composer .actions-col .llmctx-new,#composer .actions-col .think-new{flex:0 0 auto;max-width:100%}}
 /* The model search: opaque like #commandList (a list over the conversation
    must stay readable), above the composer, or below it (.down) when the
    start page leaves no room above, or over the composer (.over) when
@@ -603,7 +605,7 @@ body.has-session #composer .actions-col{flex-wrap:nowrap;flex-shrink:0}
 #modelPanel{position:absolute;left:10px;width:min(560px,calc(100% - 20px));bottom:calc(100% + 8px);max-height:360px;border-radius:12px;z-index:21;display:flex;flex-direction:column;overflow:hidden;background:var(--bg-panel);border:1px solid var(--glass-border);box-shadow:inset 0 1px 0 var(--glass-highlight),var(--glass-shadow)}
 #modelPanel.down{bottom:auto;top:calc(100% + 8px)}
 #modelPanel.over{bottom:0}
-#modelPanel[hidden],body.has-session #modelPanel{display:none}
+#modelPanel[hidden],body.has-session:not(.fresh-link) #modelPanel{display:none}
 #modelPanel .model-search{flex:none;display:flex;align-items:center;gap:8px;padding:0 12px;border-bottom:1px solid var(--border)}
 #modelPanel .model-search svg{flex:none;width:14px;height:14px;color:var(--text-faint)}
 #modelSearch{flex:1;min-width:0;height:38px;background:transparent;border:0;color:var(--text);font-size:13px}

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

@@ -46,8 +46,10 @@ function readRecent() {
   }
 }
 
-// +onPick+ runs after a pick (the panel is closed by then).
-export function createModelPicker({ button, panel, input, list, composer, center, onPick }) {
+// +onPick+ runs after a pick (the panel is closed by then). +remember+:
+// whether a pick is this browser's choice for a new chat (stored, and in
+// Recent); false on a fresh chain link, where a pick is that link's only.
+export function createModelPicker({ button, panel, input, list, composer, center, onPick, remember = () => true }) {
   let rows = [];
   let defaultName = "";
   let chosen = "";
@@ -160,10 +162,12 @@ export function createModelPicker({ button, panel, input, list, composer, center
     const row = shown[index];
     if (!row) return;
     setChosen(row.name);
-    try {
-      localStorage.setItem(MODEL_KEY, row.name);
-      localStorage.setItem(RECENT_KEY, JSON.stringify(pushRecent(readRecent(), row.name)));
-    } catch (_) {}
+    if (remember()) {
+      try {
+        localStorage.setItem(MODEL_KEY, row.name);
+        localStorage.setItem(RECENT_KEY, JSON.stringify(pushRecent(readRecent(), row.name)));
+      } catch (_) {}
+    }
     close();
     onPick?.(row.name);
   }
@@ -227,6 +231,17 @@ export function createModelPicker({ button, panel, input, list, composer, center
       setChosen(pickModel(rows, payload.default, stored || chosen));
       return true;
     },
+    // A name on the button, nothing stored (a fresh link's model); one that
+    // isn't a row (an alias, a typed host:id) shows as text, no row chosen.
+    show(name) {
+      setChosen(String(name || ""));
+    },
+    // Back to the start page's choice: +stored+ while offered, else the
+    // default (no fetch; nothing before the list is in).
+    restore(stored) {
+      if (!rows.length) return;
+      setChosen(pickModel(rows, defaultName, stored));
+    },
     chosen: () => chosen,
     // The picked model's row (its llm_context too); null before the list.
     chosenRow: () => rows.find((r) => r.name === chosen) || null,

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

@@ -50,6 +50,11 @@ export function emptySessionState() {
     reasoningHistory: null,
     toolkit: null,
     timing: normalizeTiming(),
+    // A turn started on it while the page had it open (setTurnRunning): a
+    // fresh link's picker goes at once, before the timing re-read brings the
+    // turn's record (chains.js freshLink). Never from a payload, so a resync
+    // of the same session keeps it.
+    turnStarted: false,
     // The event id (or, from an older worker, the event_seq) the session was
     // rendered at (null: no live worker then), where a stream opened later
     // has to start; set by the page's resync, not by the payload.

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

@@ -31,7 +31,7 @@
 //   addCommandBubble(view), addNoteBubble(note), findInTurnRoots(selector),
 //   setUsedMemories(names), showRecap(text), showGuardrailWarning(text, label),
 //   showHookNotice(data), onInitEvent(type, data), upsertCard(card),
-//   refreshCardBodies()   the page's hooks
+//   refreshCardBodies(), syncModelPick()   the page's hooks
 
 import { routeChunk } from "./chunk_router.js";
 import { extractCtxPct, generationTokens } from "./ctx.js";
@@ -55,7 +55,7 @@ export function createStreamHandlers(deps) {
     resync, updateInfoBar, applyPromptOps, showSteers, markRecapStale, setTurnRunning, setLiveStatus, endTurnView,
     appendChunk, readTurnEnd, applyFinalMarkdown, refreshTimingFromSession, makeUserBubble, addEndBubble,
     commandBubble, addCommandBubble, addNoteBubble, findInTurnRoots, setUsedMemories, showRecap,
-    showGuardrailWarning, showHookNotice, onInitEvent, upsertCard, refreshCardBodies,
+    showGuardrailWarning, showHookNotice, onInitEvent, upsertCard, refreshCardBodies, syncModelPick,
   } = deps;
 
   return {
@@ -210,6 +210,9 @@ export function createStreamHandlers(deps) {
         state().served = null;
         updateInfoBar();
       }
+      // A fresh link's picker shows the model the worker kept, a refused
+      // /model too (its pick set the button before the answer).
+      if (view.modelName) syncModelPick?.();
       // /llm-context changed what the next turn runs under.
       if (data.llm_context) {
         state().llmContext = data.llm_context;

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

@@ -258,12 +258,14 @@ function canceledSteps(g, record, tools) {
 }
 
 // A call's row from its tool record alone (no saved parts): the record's
-// called_as too, so "(called as bash)" shows after a reload, as live, and
+// called_as and via too, so "(called as bash)" and "(via call_tool)" show
+// after a reload, as live, and
 // its no_match ("no match" on a grep that found nothing).
 function recordRows(tools, iteration) {
   return tools.filter((r) => Number(r.iteration) === iteration).map((r) => ({
     key: `${iteration}:${r.call_index ?? 0}`, tool: r.tool, status: r.status, duration_ms: r.duration_ms,
     ...(r.called_as ? { called_as: r.called_as } : {}),
+    ...(r.via ? { via: r.via } : {}),
     ...noMatch(r),
   }));
 }

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

@@ -0,0 +1,16 @@
+// Where the toast sits (app.js placeToast measures, this decides): in a
+// session, +gap+ above the highest of the composer card and what opens
+// over it (the stage while it shows, a fresh link's open model panel), so
+// it covers none of them; null elsewhere (the CSS's 24 px from the bottom).
+// When that leaves the toast no room on screen it stays +gap+ from the top
+// (covering what's under it rather than going off screen).
+// @param tops the tops (px from the viewport's top) of what shows over the
+//   card; null for one that doesn't
+// @return {number|null} the toast's bottom offset in px
+export function toastBottom({ inSession, viewportHeight, dockTop, tops = [], toastHeight = 0, gap = 12 }) {
+  if (!inSession) return null;
+  const top = Math.min(dockTop, ...tops.filter((t) => Number.isFinite(t)));
+  const bottom = viewportHeight - top + gap;
+  const cap = viewportHeight - toastHeight - gap;
+  return Math.round(Math.max(0, Math.min(bottom, cap)));
+}

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

@@ -1,9 +1,11 @@
 // The session bar's tools chip: the session's toolkit when it isn't full
 // ("tools lean"), with the tools it leaves out and how to change them in
 // its tooltip. The summary is the session's toolkit ({name, label,
-// left_out, fallback}: Toolkit::Explained#summary; the worker's snapshot or
-// a command_ran; the server's own reading of the session file has no
-// left_out). Changing it is /toolkit (no popover yet).
+// left_out, reachable, removed, fallback}: Toolkit::Explained#summary; the
+// worker's snapshot or a command_ran; the server's own reading of the
+// session file has no lists). Left out is reachable (find_tools and
+// call_tool reach them) and removed (only /toolkit add brings one back).
+// Changing it is /toolkit (no popover yet).
 
 import { html, nothing } from "./vendor/lit-html.js";
 
@@ -13,7 +15,12 @@ export function chipModel(summary) {
   const label = summary.label || summary.name;
   const parts = [`Toolkit: ${label}, the tools this session declares.`];
   if (summary.fallback) parts.push(`${summary.fallback}: every tool is declared (full) until it resolves.`);
-  if (Array.isArray(summary.left_out)) {
+  const reachable = Array.isArray(summary.reachable) ? summary.reachable : [];
+  const removed = Array.isArray(summary.removed) ? summary.removed : [];
+  if (reachable.length) {
+    parts.push(`Reachable with find_tools: ${reachable.join(", ")}.`);
+    if (removed.length) parts.push(`Removed: ${removed.join(", ")}.`);
+  } else if (Array.isArray(summary.left_out)) {
     parts.push(summary.left_out.length ? `Not loaded: ${summary.left_out.join(", ")}.` : "Nothing left out.");
   }
   parts.push("/toolkit lists them; /toolkit NAME, add TOOL or remove TOOL changes them from the next turn.");

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

@@ -100,8 +100,10 @@ export function toolRowInnerTemplate(row, { thumbs = () => nothing, stop = nothi
   const params = shown
     ? html`<span class=${`activity-params${ref?.kind ? " ref" : ""}`} title=${hover || nothing} data-ref-kind=${attr(ref?.kind)} data-ref-path=${attr(ref?.kind && ref.path)} data-ref-line=${attr(ref?.kind && ref.line)} data-ref-end-line=${attr(ref?.kind && ref.end_line)}>${shown}</span>`
     : nothing;
-  // The name the model called the tool by when it was an alias's, dim.
-  const alias = row.called_as ? html`<span class="activity-alias">(called as ${row.called_as})</span>` : nothing;
+  // The name the model called the tool by when it was an alias's, or the
+  // tool it was reached through (call_tool), dim.
+  const alias = row.called_as ? html`<span class="activity-alias">(called as ${row.called_as})</span>`
+    : row.via ? html`<span class="activity-alias">(via ${row.via})</span>` : nothing;
   const duration = formatDuration(row.duration_ms);
   const full = row.status === "running" ? "" : String(row.output || "").replace(/^\[[^\]]*\]\s*/, "");
   const output = full

metadata

@@ -1,7 +1,7 @@
 --- !ruby/object:Gem::Specification
 name: samagotchi
 version: !ruby/object:Gem::Version
-  version: 0.68.0
+  version: 0.69.0
 platform: ruby
 authors:
 - Dmitry Dedov
@@ -640,6 +640,7 @@ files:
 - lib/samagotchi/web/public/thinking_chip.js
 - lib/samagotchi/web/public/thinking_ticker.js
 - lib/samagotchi/web/public/timing.js
+- lib/samagotchi/web/public/toast_place.js
 - lib/samagotchi/web/public/toolkit_chip.js
 - lib/samagotchi/web/public/turn_events.js
 - lib/samagotchi/web/public/turn_html.js