samagotchi 0.135.0 → 0.136.0

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

@@ -0,0 +1,121 @@
+// The settings panel's rows, drawn by the start page's ⚙ panel
+// (start_settings.js) over a new session's choices and by the session bar's
+// (settings_chip.js) over the open session's own: rows of segments
+// (Thinking, Context), the Context row's Apply and budget disclosure, a
+// line for a choice whose row is hidden, the review files' line. The caller
+// passes the rows it draws (settingsPanelTemplate's +rows+) and applies the
+// picks itself; the segments' data-act ("think:low", "ctx:stale",
+// "ctx-more") is the same for every caller.
+
+import { APPLIES, choiceWords, ownValues, strategyValue } from "./llm_context_chip.js";
+import { DEFAULT, followSegment, segments } from "./level_chip.js";
+import { reviewChipModel } from "./review_start.js";
+import { CONFIG as THINKING } from "./thinking_chip.js";
+import { html, nothing } from "./vendor/lit-html.js";
+
+export { DEFAULT };
+
+const STRATEGIES = [
+  { value: "none", label: "none" },
+  { value: "stale", label: "stale" },
+  { value: "stale,forget", label: "stale + forget", title: "stale + forget (experimental)" },
+];
+
+// The Thinking row's segments (level_chip.js segments over thinking_chip.js'
+// levels): the model's own level first ("default (high)"; "default" while
+// the session has its own), then the levels;
+// the pressed one is the choice. null without the model's thinking (the row
+// is hidden).
+export function thinkingSegments(summary, choice) {
+  return segments(THINKING, summary, choice);
+}
+
+// Whether the summary's +field+ (strategy, apply, budget) is the session's
+// own: the value in force is then not the model's, so a default label
+// doesn't name it.
+const ownField = (summary, field) => summary?.[`${field}_source`] === "session";
+
+// The Context row's segments over the strategies (a choice that isn't one
+// of them, a newer chi's layer, is added); null without the model's
+// llm_context (the row is hidden).
+export function contextSegments(summary, choice) {
+  if (!summary?.strategy) return null;
+  const pressed = Array.isArray(choice?.strategy) ? strategyValue(choice.strategy) : DEFAULT;
+  const list = STRATEGIES.some((s) => s.value === pressed) || pressed === DEFAULT ? STRATEGIES
+    : [...STRATEGIES, { value: pressed, label: pressed }];
+  return [followSegment(summary.strategy, ownField(summary, "strategy")), ...list]
+    .map((s) => ({ ...s, pressed: s.value === pressed }));
+}
+
+// The context choice in a few words ("stale · budget 64000"), or null.
+export function contextWords(choice) {
+  const words = choiceWords(choice);
+  if (!words) return null;
+  return [words.strategy, words.apply && `apply ${words.apply}`, words.budget && `budget ${words.budget}`]
+    .filter(Boolean).join(" · ");
+}
+
+export const segmentsTemplate = (name, label, segs, act) => html`<div class="sset-row"><span class="sset-label"
+  id=${`sset-${name}-label`}>${label}</span><div class="sset-seg" role="group" aria-labelledby=${`sset-${name}-label`}>${
+  segs.map((s) => html`<button type="button" data-act=${`${act}:${s.value}`} aria-pressed=${s.pressed ? "true" : "false"}
+    title=${s.title || nothing}>${s.label}</button>`)}</div></div>`;
+
+const option = (value, label, chosen) => html`<option value=${value} ?selected=${value === chosen}>${label}</option>`;
+
+// The disclosure's fields: the apply rule and the budget, with their own
+// Set (a typed budget needs a commit) and mergeChoice's error under them.
+// Each default names the model's value, unless the session set its own
+// (the summary's value is the session's then).
+export function contextMoreTemplate(summary, choice, error) {
+  const own = ownValues({ own: choice });
+  const budget = summary.budget_tokens ? String(summary.budget_tokens) : "off";
+  const apply = ownField(summary, "apply") ? DEFAULT : `${DEFAULT} (${summary.apply})`;
+  const budgetDefault = ownField(summary, "budget") ? DEFAULT : `${DEFAULT} (${budget})`;
+  return html`<form class="sset-ctx-form"><label class="llmctx-field"><span>Apply</span><span class="select-wrap"><select
+    name="apply">${option(DEFAULT, apply, own.apply)}${APPLIES.map((a) => option(a, a, own.apply))}</select
+    ></span></label><label class="llmctx-field"><span>Budget</span><input name="budget" type="text" inputmode="numeric"
+    autocomplete="off" placeholder=${`${budgetDefault}: 64000, 64k or off`} .value=${own.budget}></label
+    ><div class="ctx-pop-error" role="alert" ?hidden=${!error}>${error || ""}</div
+    ><div class="ctx-pop-actions"><button type="submit" class="llmctx-set">Set</button></div></form>`;
+}
+
+// A choice whose row is hidden (the picked model has no values for it).
+export const sentAnywayTemplate = (text, act) => html`<div class="sset-anyway ctx-pop-meta">${text}
+  <button type="button" class="sset-link" data-act=${act}>Clear</button></div>`;
+
+// One of the panel's rows, null drawing nothing:
+//   {name, label, segments, act}: a row of segments (segmentsTemplate);
+//     with +more+ ({open, summary, choice, error}) the Apply and budget
+//     disclosure under it, its fields while open (contextMoreTemplate)
+//   {anyway, act}: the line for a choice whose row is hidden, its Clear
+//     button's data-act (sentAnywayTemplate)
+function rowTemplate(row) {
+  if (!row) return nothing;
+  if (row.anyway) return sentAnywayTemplate(row.anyway, row.act);
+  const { more } = row;
+  return html`${segmentsTemplate(row.name, row.label, row.segments, row.act)}${more ? html`<div class="sset-ctx-more"
+    ><button type="button" class="sset-link" data-act="ctx-more" aria-expanded=${more.open ? "true" : "false"}>Apply and budget ${
+      more.open ? "▾" : "▸"}</button></div>${more.open ? contextMoreTemplate(more.summary, more.choice, more.error) : nothing}`
+    : nothing}`;
+}
+
+// The review files' line: the files set (Edit, Remove), else Review files….
+function reviewTemplate(review, ruled) {
+  const chip = review.length ? reviewChipModel(review) : null;
+  return html`${ruled ? html`<hr class="sset-rule">` : nothing}<div class="sset-review">${chip
+    ? html`<span class="sset-review-set" title=${chip.title}>Review: ${chip.text.replace(/^review: /, "")}</span
+      ><button type="button" class="sset-link" data-act="review">Edit</button><button type="button" class="sset-link"
+      data-act="review-clear">Remove</button>`
+    : html`<button type="button" class="sset-link" data-act="review" title=${reviewChipModel([]).title}>Review files…</button>`}</div>`;
+}
+
+// The panel: its heading (+kind+ beside it, or none) and close button, the
+// +rows+ (rowTemplate's), the review files' line when +review+ is a list
+// (null: no review line; a rule above it when a row of segments is drawn),
+// and the +note+.
+export function settingsPanelTemplate({ heading, kind = null, rows = [], review = null, note }) {
+  const segmented = rows.some((row) => row?.segments);
+  return html`<div class="ctx-pop-head"><strong>${heading}</strong>${kind ? html`<span class="ctx-pop-kind">${kind}</span>` : nothing
+    }<button type="button" class="ctx-pop-close" data-act="close" aria-label="Close">×</button></div
+    >${rows.map(rowTemplate)}${review ? reviewTemplate(review, segmented) : nothing}<div class="ctx-pop-meta">${note}</div>`;
+}

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

@@ -0,0 +1,26 @@
+// A `!cmd`'s saved user message: the worker appends "!(<command>)\n<output>"
+// for the next turn (session_commands.rb, no turn id, no time). The history
+// draws it as its command bubble (turn_html.js) and the reload's turns
+// leave it out (timing.js turnGroups: a group of its own, no steps, no
+// timing). Pure, no imports: timing.js and turn_html.js both read it, and
+// turn_html.js imports timing.js. A module of its own: static JS is cached
+// at unversioned URLs, and a new export on an old module would blank the
+// page.
+
+// Its command line and its output, or null when the content is any other
+// message. The command sits on the first line inside `!(` `)`; the output
+// is everything after that first newline. A message that merely starts
+// with "!" or "!(" without the newline shape is a plain message.
+export function shellCommandMessage(content) {
+  const text = String(content ?? "");
+  const match = text.match(/^!\((.*)\)\n([\s\S]*)$/);
+  if (!match) return null;
+  return { line: `!${match[1]}`, text: match[2] };
+}
+
+// A history item that is a `!cmd`'s record, not a prompt: a user message of
+// that shape with no turn id (a prompt saves its turn's; session_chain.rb
+// reads the record the same way).
+export function isShellCommandItem(item) {
+  return item?.role === "user" && !item.turn_id && shellCommandMessage(item.content) !== null;
+}

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

@@ -11,57 +11,21 @@
 // instead (settingsLabel()).
 
 import { createChipPopover, SHEET_TALL } from "./chip_popover.js";
-import { APPLIES, choiceWords, mergeChoice, ownValues, strategyValue } from "./llm_context_chip.js";
+import { mergeChoice, ownValues } from "./llm_context_chip.js";
 import { readSubjects, reviewChipModel, reviewFormTemplate } from "./review_start.js";
-import { LEVELS } from "./thinking_chip.js";
-import { html, nothing, render } from "./vendor/lit-html.js";
-
-export const DEFAULT = "default";
+import {
+  contextSegments, contextWords, DEFAULT, settingsPanelTemplate, thinkingSegments,
+} from "./settings_panel.js";
+import { render } from "./vendor/lit-html.js";
+
+// The panel's rows (settings_panel.js), named here too: the start page and
+// its specs read them from this module.
+export { contextSegments, contextWords, DEFAULT, thinkingSegments };
 export const NOTE = "For this new session only.";
 export const PANEL_LABEL = "Session settings";
 const NO_THINKING = "the picked model has no thinking setting; it is sent anyway";
 const NO_LLM_CONTEXT = "the picked model has no LLM context values; it is sent anyway";
 
-const STRATEGIES = [
-  { value: "none", label: "none" },
-  { value: "stale", label: "stale" },
-  { value: "stale,forget", label: "stale + forget", title: "stale + forget (experimental)" },
-];
-
-// The first segment: follow the model, its value in brackets ("default
-// (high)"; a model with no level of its own, "default" alone).
-const followSegment = (value) => ({ value: DEFAULT, label: value === DEFAULT ? DEFAULT : `${DEFAULT} (${value})`,
-                                    title: `Follow the model (${value})` });
-
-// The Thinking row's segments: the model's own level first ("default
-// (high)"), then the levels; the pressed one is the choice. null without
-// the model's thinking (the row is hidden).
-export function thinkingSegments(summary, choice) {
-  if (!summary?.level) return null;
-  const pressed = choice || DEFAULT;
-  return [followSegment(summary.level),
-    ...LEVELS.map((level) => ({ value: level, label: level }))].map((s) => ({ ...s, pressed: s.value === pressed }));
-}
-
-// The Context row's segments over the strategies (a choice that isn't one
-// of them, a newer chi's layer, is added); null without the model's
-// llm_context (the row is hidden).
-export function contextSegments(summary, choice) {
-  if (!summary?.strategy) return null;
-  const pressed = Array.isArray(choice?.strategy) ? strategyValue(choice.strategy) : DEFAULT;
-  const list = STRATEGIES.some((s) => s.value === pressed) || pressed === DEFAULT ? STRATEGIES
-    : [...STRATEGIES, { value: pressed, label: pressed }];
-  return [followSegment(summary.strategy), ...list].map((s) => ({ ...s, pressed: s.value === pressed }));
-}
-
-// The context choice in a few words ("stale · budget 64000"), or null.
-export function contextWords(choice) {
-  const words = choiceWords(choice);
-  if (!words) return null;
-  return [words.strategy, words.apply && `apply ${words.apply}`, words.budget && `budget ${words.budget}`]
-    .filter(Boolean).join(" · ");
-}
-
 // The row's override chips: what is set for the new session, each
 // {text, title} or null. A choice the picked model shows no row for (its
 // summary is null) stays, its title saying it is sent anyway.
@@ -92,53 +56,26 @@ export function settingsLabel(over) {
   return { set: set.length > 0, label: set.length ? `${PANEL_LABEL}: ${set.map((o) => o.text).join(", ")}` : PANEL_LABEL };
 }
 
-const segmentsTemplate = (name, label, segments, act) => html`<div class="sset-row"><span class="sset-label"
-  id=${`sset-${name}-label`}>${label}</span><div class="sset-seg" role="group" aria-labelledby=${`sset-${name}-label`}>${
-  segments.map((s) => html`<button type="button" data-act=${`${act}:${s.value}`} aria-pressed=${s.pressed ? "true" : "false"}
-    title=${s.title || nothing}>${s.label}</button>`)}</div></div>`;
-
-const option = (value, label, chosen) => html`<option value=${value} ?selected=${value === chosen}>${label}</option>`;
-
-// The disclosure's fields: the apply rule and the budget, with their own
-// Set (a typed budget needs a commit) and mergeChoice's error under them.
-function contextMoreTemplate(summary, choice, error) {
-  const own = ownValues({ own: choice });
-  const budget = summary.budget_tokens ? String(summary.budget_tokens) : "off";
-  return html`<form class="sset-ctx-form"><label class="llmctx-field"><span>Apply</span><span class="select-wrap"><select
-    name="apply">${option(DEFAULT, `${DEFAULT} (${summary.apply})`, own.apply)}${APPLIES.map((a) => option(a, a, own.apply))}</select
-    ></span></label><label class="llmctx-field"><span>Budget</span><input name="budget" type="text" inputmode="numeric"
-    autocomplete="off" placeholder=${`${DEFAULT} (${budget}): 64000, 64k or off`} .value=${own.budget}></label
-    ><div class="ctx-pop-error" role="alert" ?hidden=${!error}>${error || ""}</div
-    ><div class="ctx-pop-actions"><button type="submit" class="llmctx-set">Set</button></div></form>`;
-}
-
-// A choice whose row is hidden (the picked model has no values for it).
-const sentAnywayTemplate = (text, act) => html`<div class="sset-anyway ctx-pop-meta">${text}
-  <button type="button" class="sset-link" data-act=${act}>Clear</button></div>`;
-
-// The main view. +state+: {thinking: {summary, choice}, llmContext: {summary,
-// choice}, review: subjects or null (no review row), more: the disclosure
-// open, error: the context Set's}.
+// The main view (settings_panel.js settingsPanelTemplate over the new
+// session's choices). +state+: {thinking: {summary, choice}, llmContext:
+// {summary, choice}, review: subjects or null (no review row), more: the
+// disclosure open, error: the context Set's}.
 export function panelTemplate({ thinking, llmContext, review = null, more = false, error = null }) {
   const think = thinkingSegments(thinking.summary, thinking.choice);
   const ctx = contextSegments(llmContext.summary, llmContext.choice);
   const ctxAnyway = !ctx && contextWords(llmContext.choice);
-  const reviewChip = review?.length ? reviewChipModel(review) : null;
-  return html`<div class="ctx-pop-head"><strong>New session</strong
-    ><button type="button" class="ctx-pop-close" data-act="close" aria-label="Close">×</button></div
-    >${think ? segmentsTemplate("think", "Thinking", think, "think") : nothing
-    }${!think && thinking.choice ? sentAnywayTemplate(`Thinking ${thinking.choice}: ${NO_THINKING}.`, "think-clear") : nothing
-    }${ctx ? html`${segmentsTemplate("ctx", "Context", ctx, "ctx")}<div class="sset-ctx-more"><button type="button" class="sset-link"
-      data-act="ctx-more" aria-expanded=${more ? "true" : "false"}>Apply and budget ${more ? "▾" : "▸"}</button></div
-      >${more ? contextMoreTemplate(llmContext.summary, llmContext.choice, error) : nothing}` : nothing
-    }${ctxAnyway ? sentAnywayTemplate(`Context ${ctxAnyway}: ${NO_LLM_CONTEXT}.`, "ctx-clear") : nothing
-    }${review ? html`${think || ctx ? html`<hr class="sset-rule">` : nothing}<div class="sset-review">${reviewChip
-      ? html`<span class="sset-review-set" title=${reviewChip.title}>Review: ${reviewChip.text.replace(/^review: /, "")}</span
-        ><button type="button" class="sset-link" data-act="review">Edit</button><button type="button" class="sset-link"
-        data-act="review-clear">Remove</button>`
-      : html`<button type="button" class="sset-link" data-act="review" title=${reviewChipModel([]).title}>Review files…</button>`}</div>`
-      : nothing
-    }<div class="ctx-pop-meta">${NOTE}</div>`;
+  return settingsPanelTemplate({
+    heading: "New session",
+    rows: [
+      think ? { name: "think", label: "Thinking", segments: think, act: "think" } : null,
+      !think && thinking.choice ? { anyway: `Thinking ${thinking.choice}: ${NO_THINKING}.`, act: "think-clear" } : null,
+      ctx ? { name: "ctx", label: "Context", segments: ctx, act: "ctx",
+              more: { open: more, summary: llmContext.summary, choice: llmContext.choice, error } } : null,
+      ctxAnyway ? { anyway: `Context ${ctxAnyway}: ${NO_LLM_CONTEXT}.`, act: "ctx-clear" } : null,
+    ],
+    review,
+    note: NOTE,
+  });
 }
 
 // The panel on chip_popover.js' shell, a bottom sheet on a phone. +el+:

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

@@ -1,16 +1,9 @@
-// The session bar's thinking chip: the level the next turn runs at ("think
-// low"; "· session" when the session set its own), and a popover with a
-// level select that runs /thinking in the session's worker (the command's
-// reply shows in the conversation, like a typed one). The level and where
-// it came from are the session's thinking (SettingExplained#summary:
-// {level, source, own}; the worker's snapshot, a command_ran, or the
-// server's own reading of the session file). A config on level_chip.js.
-//
-// The start page's new session sets its level in the ⚙ panel instead
-// (start_settings.js, over LEVELS).
+// Thinking as a level setting (level_chip.js): the levels the settings
+// panels' Thinking row offers (settings_panel.js; the start page's ⚙ panel,
+// the session bar's, settings_chip.js) and the /thinking line a session's
+// pick runs in its worker.
 
 import * as level from "./level_chip.js";
-import { html, nothing } from "./vendor/lit-html.js";
 
 export const LEVELS = ["off", "low", "medium", "high"];
 
@@ -19,42 +12,11 @@ export const CONFIG = Object.freeze({
   prefix: "think",
   command: "/thinking",
   levels: LEVELS,
-  anchor: "[data-think-chip]",
-  formClass: "think-form",
-  popoverClass: "think-popover",
-  nowClass: "think-now",
-  when: () => "From the next turn's start. On Gemma the whole prompt is read again; a hosted API reads the whole conversation again.",
+  cost: "A thinking change: on Gemma the whole prompt is read again; a hosted API reads the whole conversation again.",
 });
 
-export const { nowText } = level;
-
-// The chip: its text, tooltip and whether the session set its own; null
-// without a summary (an older worker). The default with nothing set
-// anywhere shows too ("think default"): the chip is where the level is set.
-export function chipModel(summary) {
-  return level.chipModel(CONFIG, summary);
-}
-
-// 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 nothing;
-  return html`<button type="button" class=${`model think-chip${chip.own ? " own" : ""}`} title=${chip.title} data-think-chip aria-haspopup="dialog">${chip.text}</button>`;
-}
-
-// The /thinking line for a select value, with --yes (level_chip.js
-// commandLine); null when it is what the form opened with.
+// The /thinking line for a level, with --yes (level_chip.js commandLine);
+// null when it is the session's (+initial+).
 export function commandLine(choice, initial = null) {
   return level.commandLine(CONFIG, choice, initial);
 }
-
-// The popover's form (level_chip.js formTemplate).
-export function formTemplate(summary, opts) {
-  return level.formTemplate(CONFIG, summary, opts);
-}
-
-// The chip's popover (level_chip.js createLevelControl).
-export function createThinkingControl({ id = "thinkingPopover", ...opts }) {
-  return level.createLevelControl({ cfg: CONFIG, id, ...opts });
-}

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

@@ -28,7 +28,7 @@ export function timeGapEl(text) {
 
 // The history items a group (timing.js turnGroups) holds, by index.
 function groupIndexes(group) {
-  if (group.kind === "note" || group.kind === "steer") return [group.i];
+  if (group.kind === "note" || group.kind === "steer" || group.kind === "command") return [group.i];
   if (group.kind === "answer") return [group.answer];
   const steps = group.steps || [];
   return [
@@ -54,11 +54,14 @@ export function groupTimes(group, items) {
 
 // For each group, the divider text before it, or null. A group with no
 // known time draws none and hides the gap across it (no divider measured
-// over a stretch whose times are unknown).
+// over a stretch whose times are unknown). A `!cmd`'s record is saved with
+// no time: it draws none and the gap is measured across it (it ran in that
+// stretch).
 export function groupGaps(groups, items, now = Date.now()) {
   let prevEnd = null;
   return groups.map((group) => {
     const { start, end } = groupTimes(group, items);
+    if (group.kind === "command" && start === null) return null;
     const text = prevEnd !== null && start !== null ? gapText(prevEnd, start, now) : null;
     prevEnd = end;
     return text;

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

@@ -1,3 +1,5 @@
+import { isShellCommandItem } from "./shell_command.js";
+
 export function formatDuration(milliseconds) {
   const ms = Number(milliseconds);
   if (!Number.isFinite(ms) || ms < 0) return "";
@@ -148,8 +150,10 @@ export function turnRecordAt(timing, index) {
 }
 
 // A history item that starts a turn: a prompt, or the note a context wake
-// turn starts with (turn_start).
-const startsTurn = (item) => item?.role === "user" || (item?.role === "note" && item.turn_start === true);
+// turn starts with (turn_start). A `!cmd`'s record (shell_command.js) is a
+// user message but no prompt: no turn, no record, no timing.
+const startsTurn = (item) =>
+  (item?.role === "user" && !isShellCommandItem(item)) || (item?.role === "note" && item.turn_start === true);
 
 // For each history item, the turn index its timing shows under, or null. A
 // turn with tool calls holds several assistant messages; only the last one
@@ -181,7 +185,9 @@ export function timedTurnIndexes(items) {
 // assistant message). Assistant messages before any prompt are answers on
 // their own. A turn that ended with no answer (the server's empty_answer
 // item) has no answer: its texts are steps, and `emptyAnswer` is that
-// item's index. The turn index counts prompts, as timedTurnIndexes does. The
+// item's index. A `!cmd`'s record is a group of its own (`command`, its
+// index): no steps, no record, no turn index. The turn index counts
+// prompts, as timedTurnIndexes does. The
 // user's lines merged into the running turn (`merged`, the server's
 // Steer::INPUT_KIND) stay in it: the turn's `merged` list.
 export function turnGroups(items, timing) {
@@ -191,6 +197,10 @@ export function turnGroups(items, timing) {
   items.forEach((item, i) => {
     if (item?.role === "note" && !startsTurn(item)) {
       groups.push({ kind: "note", i });
+    } else if (isShellCommandItem(item)) {
+      // A `!cmd`'s record: its bubble alone, between the turns.
+      groups.push({ kind: "command", i });
+      turn = null;
     } else if (item?.role === "steer") {
       if (turn) turn.steers.push(i);
       else groups.push({ kind: "steer", i });

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

@@ -1,20 +1,34 @@
-// 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, 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). A kit with a prompt text has
-// it on the summary too (prompt), and the tooltip ends with it.
+// The session bar's 🧰 chip, after ⚙: the session's toolkit. "🧰" alone
+// while the session is on config's default kit (toolkit.default, full
+// unless set; GET /api/sessions/:id's session.toolkit_default), "🧰 lean"
+// on another; the tooltip names the kit, the tools it leaves out and how to
+// change them. No popover: /toolkit changes it. The summary is the
+// session's toolkit ({name, label, left_out, reachable, removed, fallback}:
+// Toolkit::Explained#summary, null on full; 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). A kit with a prompt text has it on
+// the summary too (prompt), and the tooltip ends with it.
 
 import { html, nothing } from "./vendor/lit-html.js";
 
-// The chip's text and tooltip; null without a summary (full).
-export function chipModel(summary) {
-  if (!summary) return null;
+const FULL = "full";
+const CHANGE = "/toolkit lists them; /toolkit NAME, add TOOL or remove TOOL changes them from the next turn.";
+
+// The chip's text ("" while on the default kit: 🧰 alone), tooltip and
+// whether it is the default. +summary+: the session's (null: full);
+// +defaultKit+: config's toolkit.default (null: not known, full).
+export function chipModel(summary, defaultKit = null) {
+  const fallbackKit = defaultKit || FULL;
+  if (!summary) {
+    const isDefault = fallbackKit === FULL;
+    const title = isDefault ? `Toolkit: ${FULL} (the default), every tool is declared. ${CHANGE}`
+      : `Toolkit: ${FULL}, every tool is declared (the default is ${fallbackKit}). ${CHANGE}`;
+    return { text: isDefault ? "" : FULL, title, isDefault };
+  }
   const label = summary.label || summary.name;
-  const parts = [`Toolkit: ${label}, the tools this session declares.`];
+  const isDefault = !summary.fallback && label === fallbackKit;
+  const parts = [`Toolkit: ${label}${isDefault ? " (the default)" : ""}, the tools this session declares.`];
   if (summary.fallback) parts.push(`${summary.fallback}: every tool is declared (full) until it resolves.`);
   if (Array.isArray(summary.groups)) {
     parts.push(`Source groups: ${summary.groups.length ? summary.groups.join(", ") : "none"}.`);
@@ -27,15 +41,17 @@ export function chipModel(summary) {
   } 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.");
+  parts.push(CHANGE);
   if (summary.prompt) parts.push(`Prompt: ${summary.prompt}`);
-  return { text: `tools ${label}${summary.fallback ? " ?" : ""}`, title: parts.join(" ") };
+  return { text: isDefault ? "" : `${label}${summary.fallback ? " ?" : ""}`, title: parts.join(" "), isDefault };
 }
 
-// The session bar's chip (a lit-html template; info_bar.js), nothing on
-// full.
-export function chipTemplate(summary) {
-  const chip = chipModel(summary);
-  if (!chip) return nothing;
-  return html`<span class="model tools-chip" title=${chip.title}>${chip.text}</span>`;
+// The session bar's chip (a lit-html template; info_bar.js): +toolkit+ is
+// {summary, defaultKit}; nothing without it. 🧰 is drawn as the start
+// page's toolkit icon (the glyph stays the text; index.html's CSS).
+export function chipTemplate(toolkit) {
+  if (!toolkit) return nothing;
+  const chip = chipModel(toolkit.summary, toolkit.defaultKit);
+  return html`<span class=${`model tools-chip${chip.isDefault ? " default" : ""}`} title=${chip.title}><span
+    class="chip-icon tc-kit" aria-hidden="true">🧰</span>${chip.text ? ` ${chip.text}` : ""}</span>`;
 }

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

@@ -840,6 +840,8 @@ export function turnHistoryNodes(items, timing, { thumbs, workingSet = false, no
     if (group.kind === "note") { parts.push(noteBubbleTemplate(items[group.i])); continue; }
     if (group.kind === "steer") { parts.push(steerTemplate(group.i, true)); continue; }
     if (group.kind === "answer") { parts.push(answerTemplate(group.answer, nothing)); continue; }
+    // A `!cmd`'s record: its command bubble, no steps, no timing.
+    if (group.kind === "command") { parts.push(userTemplate(items[group.i])); continue; }
     turnOrdinal += 1;
     const prompt = items[group.user];
     // A context wake turn starts with its note.
@@ -881,8 +883,11 @@ export function turnHistoryNodes(items, timing, { thumbs, workingSet = false, no
     // followed by the text that answered it when that isn't the answer: a
     // small model tells its user about a report before its next tool call,
     // and that step's text would stay folded in the block.
+    // A report's fold key (answer_fold.js), as its reply's: the turn's id
+    // and its place after the opening; none in a turn saved before turn ids.
+    const lineKey = (i) => (group.turnId && items[i]?.source === "delegate_report" ? `${group.turnId}:input:${i - group.user}` : null);
     parts.push((group.merged || []).map((i) =>
-      html`${userTemplate(items[i], { state: "steered", step: items[i].step })}${reportReplyTemplate(i, group)}`));
+      html`${userTemplate(items[i], { state: "steered", step: items[i].step, lineKey: lineKey(i) })}${reportReplyTemplate(i, group)}`));
     // A turn that ended with no answer: chi's muted notice where the answer
     // would be, before the timing, as live.
     if (group.emptyAnswer != null) parts.push(html`${emptyAnswerTemplate(items[group.emptyAnswer])}${timingTemplate(group)}`);

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

@@ -328,7 +328,7 @@ export function promptOps(event, { myId, known, unmatchedMerge = false, wakeStar
     case "pending_input_merged":
       if (!unmatchedMerge || !event.content) return [];
       if (unmatchedMerge === "report") {
-        return [{ op: "add", enqueuedId: null, prompt: event.content, state: wakeStart ? null : "steered", label: clientLabel(REPORT_CLIENT) }];
+        return [{ op: "add", enqueuedId: null, prompt: event.content, state: wakeStart ? null : "steered", label: clientLabel(REPORT_CLIENT), source: "delegate_report" }];
       }
       return [{ op: "add", enqueuedId: null, prompt: event.content, state: "steered", label: null }];
     default:

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

@@ -214,18 +214,8 @@ export function stateBadgeTemplate(state, delivery = null) {
   return html`<span class="state-badge">${text}${remove}</span>`;
 }
 
-// A `!cmd`'s saved user message (the worker appends "!(<command>)\n<output>"
-// for the next turn): its command line and its output, or null when the
-// content is any other message. The command sits on the first line inside
-// `!(` `)`; the output is everything after that first newline. A message
-// that merely starts with "!" or "!(" without the newline shape is a plain
-// message.
-export function shellCommandMessage(content) {
-  const text = String(content ?? "");
-  const match = text.match(/^!\((.*)\)\n([\s\S]*)$/);
-  if (!match) return null;
-  return { line: `!${match[1]}`, text: match[2] };
-}
+// A `!cmd`'s saved user message as its line and output (shell_command.js).
+export { shellCommandMessage } from "./shell_command.js";
 
 // A `!cmd`'s history bubble: the same markup the live page draws for a
 // command (app.js's drawCommandBubble): the line, the output in a
@@ -316,12 +306,24 @@ export function steerRowTemplate({ source, text } = {}, { bubble = false } = {})
 // colour) in place of +label+. A turn's opening carries its Revise stamp
 // (+message.revises+: data-revises, revise_stack.js) and whether it was a
 // Verify turn (+message.verify+: data-verify, no Revise on its answer).
-export function userBubbleTemplate(message, { label = null, state = null, step = null, thumbs = nothing, own = false, enqueuedId = null, key = null, delivery = null, author = null } = {}) {
+// +message.source+ (a delegate report's "delegate_report") is its
+// data-source; +lineKey+, a merged line's fold key (answer_fold.js:
+// data-line-key, the reload's "<turn id>:input:<place>").
+export function userBubbleTemplate(message, { label = null, state = null, step = null, thumbs = nothing, own = false, enqueuedId = null, key = null, delivery = null, author = null, lineKey = null } = {}) {
   const named = BADGES[state] ? state : null;
   const from = author
     ? html`<span class="origin-label author-badge" title=${authorBadgeTitle(author.name, author.mode)} data-unnamed=${author.unnamed ? "1" : nothing}>${authorBadgeText(author.name, author.mode)}</span>`
     : label ? html`<span class="origin-label">${label}</span>` : nothing;
-  return html`<div class=${`bubble user${named ? ` ${named}` : ""}${author ? " by-participant" : ""}`} title=${timeTitle(message?.at)} style=${author ? `--author-color:${author.color}` : nothing} data-author=${author?.author || nothing} data-participant-mode=${author?.mode || nothing} data-user-state=${named || nothing} data-step=${step ? Number(step) : nothing} data-copy-source=${copySource({ ...message, role: "user" })} data-user-content=${key !== null ? key : nothing} data-turn-id=${message?.turn_id || nothing} data-revises=${(message?.turn_id && message?.revises?.turn_id) || nothing} data-verify=${message?.turn_id && message?.verify ? "1" : nothing} data-own=${own ? "1" : nothing} data-enqueued-id=${enqueuedId || nothing} data-delivery=${delivery || nothing}>${from}<div class="user-message">${userBodyTemplate(message?.content)}${thumbs}</div>${stateBadgeTemplate(named, delivery)}</div>`;
+  return html`<div class=${`bubble user${named ? ` ${named}` : ""}${author ? " by-participant" : ""}`} title=${timeTitle(message?.at)} style=${author ? `--author-color:${author.color}` : nothing} data-author=${author?.author || nothing} data-participant-mode=${author?.mode || nothing} data-user-state=${named || nothing} data-step=${step ? Number(step) : nothing} data-copy-source=${copySource({ ...message, role: "user" })} data-user-content=${key !== null ? key : nothing} data-turn-id=${message?.turn_id || nothing} data-revises=${(message?.turn_id && message?.revises?.turn_id) || nothing} data-verify=${message?.turn_id && message?.verify ? "1" : nothing} data-own=${own ? "1" : nothing} data-enqueued-id=${enqueuedId || nothing} data-delivery=${delivery || nothing} data-source=${message?.source || nothing} data-line-key=${lineKey || nothing}>${from}${userMessageTemplate(message, thumbs)}${stateBadgeTemplate(named, delivery)}</div>`;
+}
+
+// A user line's text: plain (its quotes set apart), or the server's
+// rendered markdown when the line has it (a delegate report's,
+// message_display.rb; a live line has none until a reload). Its copy
+// source stays the raw text either way (data-copy-source).
+function userMessageTemplate(message, thumbs) {
+  if (typeof message?.html === "string") return html`<div class="user-message markdown" .innerHTML=${message.html}></div>`;
+  return html`<div class="user-message">${userBodyTemplate(message?.content)}${thumbs}</div>`;
 }
 
 // The notice of a turn that ended with no answer (the server's

data/lib/samagotchi/web/session_create.rb

@@ -69,7 +69,7 @@ module Samagotchi
         return error if error
 
         # llm_context: the session's own LLM context values before its first
-        # turn (the start page's llm ctx chip; chi --llm-context), read
+        # turn (the start page's ⚙ panel; chi --llm-context), read
         # before anything spawns so a bad one spawns nothing.
         llm_context, error = request_llm_context(body["llm_context"])
         return error if error

data/lib/samagotchi/web/session_show.rb

@@ -13,6 +13,7 @@ require_relative "../session_commands"
 require_relative "../session_metrics"
 require_relative "../session_setting"
 require_relative "../system_one/log"
+require_relative "../toolkit"
 
 module Samagotchi
   module Web
@@ -151,14 +152,16 @@ module Samagotchi
         else
           session_json = session_json.merge(saved_served_model(session, persisted))
         end
-        # The per-session settings' chips (the info bar's llm ctx, think,
-        # reasoning and tools): the worker's, else worked out here from the
+        # The per-session settings' chips (the info bar's ⚙ chip: llm ctx, think
+        # and reasoning; the tools chip): the worker's, else worked out here from the
         # session file (SessionSetting#snapshot_value, #saved_summary).
         SessionSetting::ALL.each do |setting|
           chip = setting.snapshot_value(snapshot) { setting.saved_summary(session, registry: host_registry) }
           session_json = session_json.merge(setting.key => chip)
         end
-        session_json
+        # The 🧰 chip reads the session's toolkit against config's default:
+        # on it, the chip is 🧰 alone (a toolkit summary is nil on full only).
+        session_json.merge(toolkit_default: Toolkit.configured.name)
       end
 
       # ?cards=1: the page's re-read when a card arrives, for its rendered