samagotchi 0.71.0 → 0.73.0

data/lib/samagotchi/turn_note.rb

@@ -198,8 +198,11 @@ module Samagotchi
 
     # The hidden nudge before a retry of an empty answer (EmptyAnswerRetry):
     # the model never sees its empty generation, so it is told what happened.
+    # It asks to go on with the task, like cut_retry: "answer now" made a
+    # mid-task model stop and report before its last steps.
     def empty_retry
-      retry_nudge(message("your last reply had no visible answer. Answer the user's last message now, briefly."))
+      retry_nudge(message("your last reply had no visible answer. Continue the task with your next tool call, " \
+                          "or answer if it is done."))
     end
 
     # The hidden nudge before a retry of a generation a plugin cut

data/lib/samagotchi/version.rb

@@ -1,7 +1,7 @@
 # frozen_string_literal: true
 
 module Samagotchi
-  VERSION = "0.71.0"
+  VERSION = "0.73.0"
   # Sent as the User-Agent of every HTTP request chi makes.
   USER_AGENT = "chi/#{VERSION}"
 end

data/lib/samagotchi/web/app.rb

@@ -46,6 +46,7 @@ require_relative "editor"
 require_relative "message_parts"
 require_relative "session_summary"
 require_relative "../log"
+require_relative "../paths"
 require_relative "../redacted_inspect"
 
 module Samagotchi
@@ -65,6 +66,9 @@ module Samagotchi
       BRIDGE_WAIT_TIMEOUT = 10.0
       # An uploaded image may be this big before it is downscaled.
       MAX_IMAGE_UPLOAD_BYTES = 20 * 1024 * 1024
+      # A POST /api/render body may be this big: a decision message is a few
+      # KB, and the cap bounds the work a page can ask for.
+      MAX_RENDER_BYTES = 64 * 1024
       SESSION_ID_RE = /\A[0-9A-Za-z-]{1,64}\z/
       IMAGE_NAME_RE = /\A[0-9a-f]{16}\.(png|jpe?g|gif|webp)\z/
       IMAGE_TYPES = { "png" => "image/png", "jpg" => "image/jpeg", "jpeg" => "image/jpeg", "gif" => "image/gif",
@@ -157,6 +161,7 @@ module Samagotchi
         ["GET", %r{\A/api/models\z}, :handle_models],
         ["GET", %r{\A/api/history\z}, :handle_history],
         ["GET", %r{\A/api/events\z}, :handle_events],
+        ["POST", %r{\A/api/render\z}, :handle_render],
         ["GET", %r{\A/api/sessions/([^/]+)/stream\z}, :handle_stream],
         ["GET", %r{\A/api/sessions/([^/]+)/output\z}, :handle_output],
         ["POST", %r{\A/api/sessions/([^/]+)/cancel\z}, :handle_cancel],
@@ -678,8 +683,9 @@ module Samagotchi
       # refused beside it (a create takes no reasoning_history). It runs on
       # model (or model_name) when given, else on the previous link's: one
       # whose host is gone falls back to the default, and the 201's
-      # model_warning (null when none) says so. A model it can't start on is
-      # 400 invalid_model, nothing archived.
+      # model_warning (null when none) says so. Its opener is the text the
+      # page prefills (SessionChain.opener_for; null: the page's constant).
+      # A model it can't start on is 400 invalid_model, nothing archived.
       # 409 continued (with next_id, the link that continues it already: the
       # page opens that one), open_children (ids), folder_gone, busy, scratch
       # or owned_by_tui.
@@ -706,7 +712,8 @@ module Samagotchi
         [session.continues, session.id, *moved].each { |sid| @hub&.touch(sid) }
         record_history(body, prompt) if !idle && PromptHistory.shell_line?(prompt.to_s.strip)
         json_response(201, session_to_json(session).merge(bridge_port: port, moved: moved,
-                                                          model_warning: session.model_warning))
+                                                          model_warning: session.model_warning,
+                                                          opener: session.opener))
       end
 
       # SessionManager.continue_session, its refusals as responses: [session,
@@ -909,7 +916,14 @@ module Samagotchi
         state = nil unless state.is_a?(Hash)
         if state
           status, used, notes = state.values_at("status", "used_memory_names", "prompt_notes")
-          messages = last_assistant_for_display([tail["answer"]].compact)
+          # No session file read here: the folder the answer's file refs must
+          # stay under is the worker's (its tail's working_directory), else the
+          # hub's session list entry's (a worker from before the field, or read
+          # through its snapshot); nil then without a hub or before it saw the
+          # session: refs aren't checked.
+          cwd = tail["working_directory"]
+          cwd = @hub&.working_directory(id) unless cwd.is_a?(String) && !cwd.empty?
+          messages = last_assistant_for_display([tail["answer"]].compact, cwd: cwd)
         else
           session = @session_class.load(id, state_dir: default_state_dir)
           status = displayed_status(session)
@@ -949,9 +963,9 @@ module Samagotchi
       end
 
       # The worker's light read (Bridge GET tail): {"session_state_snapshot",
-      # "answer", "cards", "event_seq", "event_id"}. A worker from before the
-      # route answers 404 not_found: its GET snapshot, in the same shape (the
-      # answer by AnswerTail). Anything else (no worker, a refused connect, a
+      # "working_directory", "answer", "cards", "event_seq", "event_id"}. A
+      # worker from before the route answers 404 not_found: its GET snapshot,
+      # in the same shape (the answer by AnswerTail; no working_directory). Anything else (no worker, a refused connect, a
       # 500, a timeout) is nil: the caller reads the disk, with no second
       # try at a worker that failed once.
       # @return [Hash, nil]
@@ -998,6 +1012,24 @@ module Samagotchi
         html || "<pre>#{CGI.escapeHTML(body)}</pre>"
       end
 
+      # POST /api/render {text}: the page's markdown read for a text it
+      # already shows (the stage's asking text, a resolved question card's
+      # reply), session-free. {html: nil} when markdown is off or
+      # commonmarker is missing: the page keeps the raw text.
+      def handle_render(req)
+        too_large = error_response(413, "too_large", "a text to render may be up to #{MAX_RENDER_BYTES / 1024} KB")
+        return too_large if req.content_length.to_i > MAX_RENDER_BYTES
+
+        raw = request_body(req, MAX_RENDER_BYTES + 1).to_s
+        return too_large if raw.bytesize > MAX_RENDER_BYTES
+
+        body = parse_json(raw)
+        return error_response(400, "invalid_json", "give {text}") unless body.is_a?(Hash) && body["text"].is_a?(String)
+
+        html = @markdown_renderer.render(body["text"]) if @markdown_renderer.available?
+        json_response(200, { html: html })
+      end
+
       def handle_question_answer(req, id)
         session = @session_class.load(id, state_dir: default_state_dir) rescue nil
         return error_response(404, "not_found", "Session not found: #{id}") unless session
@@ -1998,12 +2030,7 @@ module Samagotchi
         home_label(File.expand_path(default_state_dir))
       end
 
-      def home_label(dir)
-        home = Dir.home
-        return "~" if dir == home
-
-        dir.start_with?("#{home}/") ? "~#{dir.delete_prefix(home)}" : dir
-      end
+      def home_label(dir) = Paths.tilde(dir)
 
       # <body> data for the page: where sessions are stored, where an
       # all-view new chat starts (the server's cwd), and, when ?dir names a

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

@@ -20,6 +20,7 @@ import {
   getContext,
   detachContext,
   addContext,
+  renderText,
 } from "./data.js";
 import { createContextChips } from "./context_chips.js";
 import {
@@ -38,13 +39,14 @@ import { MODEL_KEY } from "./model_pick.js";
 import { emptySessionState, sessionStateFrom } from "./session_state.js";
 import { createModelPicker } from "./model_picker.js";
 import { chipName, chipsTemplate, imageFiles, restoredChips, thumbsTemplate, turnRefs, turnText, uploadChips } from "./images.js";
-import { normalize, firstPreview, failedTurnText, deleteConfirmText, goneSessionNotice, withLiveStatus, withoutWorker } from "./format.js";
+import { normalize, firstPreview, failedTurnText, deleteConfirmText, goneSessionNotice, cantText, withLiveStatus, withoutWorker } from "./format.js";
 import { createTurnView, turnHistoryNodes } from "./turn_view.js";
 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, chainNeighbours, isOpener, continueRefusal, continuedText, freshLink, openChildrenTemplate } from "./chains.js";
+import { reducedMotion, STAGE_GAP } from "./stage_frame.js";
+import { chainNeighbours, continueRefusal, continuedText, freshLink, openChildrenTemplate, openerText, openTitle } from "./chains.js";
 import { createTaskStopper } from "./task_stop.js";
 import { appendQuote } from "./annotations.js";
 import { parsePresets } from "./annotate_presets.js";
@@ -230,8 +232,25 @@ const viewArgs = {
   taskStop: createTaskStopper({ sessionId: () => selected, features: () => current.workerFeatures }),
 };
 const turnDom = view === "stage"
-  ? createStageView({ ...viewArgs, isNearBottom: () => atHistoryEnd(), dockEl: $("#dock"), centerEl: $("#center"), composerEl })
+  ? createStageView({
+    ...viewArgs, isNearBottom: () => atHistoryEnd(), dockEl: $("#dock"), centerEl: $("#center"), composerEl,
+    renderMarkdown, linkRefs: linkRefsIn,
+  })
   : createTurnView(viewArgs);
+// A text the page already shows as its markdown HTML (POST /api/render,
+// sanitised there), or null: markdown off here (no request), or a failed
+// read (the raw text stays).
+function renderMarkdown(text) {
+  if (pageCapabilities.display !== true) return Promise.resolve(null);
+  return renderText(text)
+    .then((d) => (typeof d?.html === "string" && d.html ? d.html : null))
+    .catch(() => null);
+}
+// The `path:line` refs in one rendered text (the stage's asking slot, a
+// kept reply), as linkTextRefs links the answers'.
+function linkRefsIn(el) {
+  linkRefs(el, touchedFiles(turnRoots()), current.dir);
+}
 // Where a running turn's rows can be: the history, and the stage while it
 // holds a turn (lookups by id, copy, annotate, card actions).
 function turnRoots() {
@@ -292,6 +311,8 @@ const questionCards = createQuestionCards({
   scrollToEnd: () => { historyEl.scrollTop = historyEl.scrollHeight; },
   removeHintIfEmpty: () => removeHintIfEmpty(),
   askingText: () => turnDom.askingText(),
+  renderMarkdown,
+  linkRefs: linkRefsIn,
 });
 // The history's bubbles (bubbles.js): output, end lines, every client's
 // prompts, the recap, warnings and notices, command and note bubbles.
@@ -313,8 +334,6 @@ const {
 // The plugin cards and a snapshot's notices in the history (cards_place.js).
 const cards = createCardsPlace({
   historyEl,
-  appendToHistory: (el) => appendToHistory(el),
-  isNearBottom: () => isNearBottom(),
   turnDom,
   findInTurnRoots: (selector) => findInTurnRoots(selector),
   selected: () => selected,
@@ -1063,7 +1082,7 @@ async function restartWorker() {
     const result = await restartSession(id);
     showToast(result.version ? `Restarted on chi ${result.version}` : "Restarting: the new worker is starting");
   } catch (e) {
-    showToast(`Can't restart: ${String(e.message).replace(/ \(\d+\)$/, "")}`, null, { sticky: true });
+    showToast(cantText("restart", e), null, { sticky: true });
   } finally {
     restartingIds.delete(id);
     updateInfoBar();
@@ -1108,12 +1127,12 @@ function updateInfoBar() {
 
 // The open session's title, once on screen (session_title.js): its strip
 // card says it when the strip is shown and has one; else the top bar. The
-// browser tab names it too. It follows the card's: a chain link opened with
-// the opener reads its chain's first link's title (cardTitle).
+// browser tab names it too. It follows the card's (openTitle): a chain link
+// reads its card's title (cardTitle), whatever opener it was sent.
 function updateSessionTitle() {
   const shown = selected ? lists.sessionsById().get(selected) : null;
   const first = current.firstPreview || "";
-  const raw = !selected ? "" : (shown && isOpener(first) ? lists.cardTitle(shown) : first);
+  const raw = !selected ? "" : openTitle({ shown, first, cardTitle: (s) => lists.cardTitle(s) });
   const title = raw === "\u2014" ? "" : raw; // "—": no first message yet
   const text = topBarTitle({
     title,
@@ -1482,6 +1501,8 @@ const composerCommands = createComposerCommands({
   followWokenWorker: () => followWokenWorker(),
   refreshHistory: () => refreshHistory(),
   failed: (line, text) => addCommandBubble({ label: null, line, text, failed: true }),
+  // As handleSendTurn says a turn's failure after a switch.
+  failedElsewhere: (line, text) => alert(`${line}: ${text}`),
   ownedByTui: () => {
     current.owner = "tui";
     updateComposerMode();
@@ -1742,7 +1763,6 @@ const centerEl = $("#center");
 // A leaving stage (the hand-off's slide) no longer counts: the reserve eases
 // down over the slide (index.html, #center.reserve-easing).
 const stageEl = view === "stage" ? turnDom.root : null;
-const STAGE_GAP = 10;
 function dockReserve() {
   const shown = stageEl && !stageEl.hidden && !stageEl.classList.contains("leaving");
   return dockEl.offsetHeight + (shown ? stageEl.offsetHeight + STAGE_GAP : 0);
@@ -1760,7 +1780,7 @@ function updateReserve({ fromStage = false } = {}) {
   const changed = centerEl.style.getPropertyValue("--dock-h") !== reserve;
   if (changed) centerEl.style.setProperty("--dock-h", reserve);
   if (changed && follow) {
-    if (fromStage) easeScrollTo(historyEl, historyEnd, { ms: leaving ? FOLD_MS : FOLLOW_MS, reduce: matchMedia("(prefers-reduced-motion: reduce)").matches });
+    if (fromStage) easeScrollTo(historyEl, historyEnd, { ms: leaving ? FOLD_MS : FOLLOW_MS, reduce: reducedMotion() });
     else if (historyEl.dataset.following === undefined) historyEl.scrollTop = historyEl.scrollHeight;
   }
   placeToast();
@@ -1864,12 +1884,11 @@ $("#infoStopBtn").addEventListener("click", async () => {
   stoppingId = id;
   try {
     await stopSession(id);
-    if (id === selected) {
-      // The worker is gone: don't wait for its stream to notice.
-      streamControl?.close();
-      current.status = "stopped";
-      workerGone(id);
-    }
+    if (id === selected) stoppedWorker(id);
+  } catch (e) {
+    // A refusal (a terminal holds it) or a worker that won't stop: said, as
+    // a failed restart is.
+    showToast(cantText(`stop ${id.slice(0, 8)}`, e), null, { sticky: true });
   } finally {
     stoppingId = null;
   }
@@ -1889,7 +1908,8 @@ $("#infoArchiveBtn").addEventListener("click", () => {
 // ── Continue (session chains) ───────────────────────────────────────────────
 // Continue → starts the next link of the open session's chain (the server
 // waits up to 30 s for its recap, archives it, starts the new one with the
-// recap as a note) and opens it with the opener in the composer, not sent.
+// recap as a note) and opens it with the opener in the composer, not sent
+// (fillOpener: the previous link's own first message when it continues one).
 // A link continued already opens that next link; its open delegates move
 // to the new link (the toast counts them); a refusal for open delegates
 // that can't move names them, each a link.
@@ -1915,7 +1935,7 @@ async function continueSelected() {
       return;
     }
     await select(next);
-    if (selected === next) fillOpener();
+    if (selected === next) fillOpener(created);
     showToast(continuedText(id, created), null, { sticky });
   } catch (e) {
     const refusal = continueRefusal(e, allSessions);
@@ -1933,10 +1953,12 @@ async function continueSelected() {
   }
 }
 
-// The new link's composer: the opener, unless a draft is there (it stays).
-function fillOpener() {
+// The new link's composer: the opener (openerText: the previous link's own,
+// else the constant), unless a draft is there (it stays). +created+: the
+// continue's 201.
+function fillOpener(created) {
   if (promptEl.value.trim() || chips.length) return;
-  promptEl.value = CONTINUE_OPENER;
+  promptEl.value = openerText(created);
   fitPrompt();
   promptEl.focus();
   promptEl.setSelectionRange(promptEl.value.length, promptEl.value.length);
@@ -1963,6 +1985,14 @@ function markArchived(ids, archived) {
 // and a batch share. The ids in the answer flip in the list at once. When
 // the open session's worker was stopped (it, or a delegate of the archived
 // one), its stream ending is a stop, not a lost worker.
+// The open session's worker was stopped from here (the stop button, an
+// archive): don't wait for its stream to notice.
+function stoppedWorker(id) {
+  streamControl?.close();
+  current.status = "stopped";
+  workerGone(id);
+}
+
 // @return {ok: true, result} | {ok: false, error}
 async function archiveOne(id, archive) {
   // A live worker in the tree is stopped by the archive: the open
@@ -1972,12 +2002,7 @@ async function archiveOne(id, archive) {
   try {
     const result = archive ? await archiveSession(id) : await unarchiveSession(id);
     markArchived(archive ? result.archived : result.unarchived, archive);
-    if (mine && mine === selected && (result.stopped || []).includes(mine)) {
-      // Its worker is gone: don't wait for its stream to notice.
-      streamControl?.close();
-      current.status = "stopped";
-      workerGone(mine);
-    }
+    if (mine && mine === selected && (result.stopped || []).includes(mine)) stoppedWorker(mine);
     return { ok: true, result };
   } catch (error) {
     return { ok: false, error };

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

@@ -9,6 +9,7 @@ import { BADGES, elementOf, noteBubbleTemplate, stateBadgeTemplate, steerRowTemp
 import { thumbsTemplate } from "./images.js";
 import { appendAboveLiveTiming, STOPPED_LINE_CLASS } from "./timing.js";
 import { keepFollowing } from "./scroll.js";
+import { linkedLine } from "./notice_links.js";
 import { hookNoticeLabel, isReportClient, promptOps } from "./turn_events.js";
 import { drawCommandBubble } from "./commands.js";
 
@@ -53,10 +54,11 @@ export function guardrailWarningTemplate(text, label = "guardrails") {
 
 // A hook's line to the user (event[:notify]), in the warning colour for
 // level warn; +cls+ adds a kind's class (llm_context_edited's). +bubble+:
-// one of the history's own, else a row of a turn's step.
+// one of the history's own, else a row of a turn's step. Its http(s) URLs
+// are links (notice_links.js).
 export function hookNoticeTemplate({ line, level = null, cls = null, title = null }, { bubble = true } = {}) {
   const klass = (bubble ? "bubble hook-notice" : "hook-notice") + (level === "warn" ? " warn" : "") + (cls ? ` ${cls}` : "");
-  return html`<div class=${klass} title=${title || nothing}>${line}</div>`;
+  return html`<div class=${klass} title=${title || nothing}>${linkedLine(line)}</div>`;
 }
 
 // A hook notice's line: its own (a snapshot's notice), else "<hook>: text".
@@ -285,7 +287,7 @@ export function createBubbles({
   }
 
   return {
-    removeHintIfEmpty, appendChunk, addEndBubble, makeUserBubble, bubbleById, applyPromptOps, showRecap,
+    removeHintIfEmpty, placeFollowing, appendChunk, addEndBubble, makeUserBubble, bubbleById, applyPromptOps, showRecap,
     markRecapStale, showGuardrailWarning, showSteers, showHookNotice, addCommandBubble, commandBubble, addNoteBubble,
   };
 }

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

@@ -32,22 +32,20 @@ export function turnAnswerEl(turnEls) {
 }
 
 // @param historyEl the history
-// @param appendToHistory (el) puts +el+ at the history's end (or the stage's)
-// @param isNearBottom () => whether the history follows its end
 // @param turnDom the running turn's view (its card(el) takes a turn's card)
 // @param findInTurnRoots (selector) => the matching elements in the history
 //   and the stage
 // @param selected () => the open session's id
 // @param clientId this tab's id in the session's events
 // @param questionCards the history's question cards (question_cards.js)
-// @param bubbles {removeHintIfEmpty, showGuardrailWarning, showHookNotice}
+// @param bubbles {removeHintIfEmpty, placeFollowing, showGuardrailWarning, showHookNotice}
 //   (bubbles.js createBubbles)
 // @param followWokenWorker () follows the worker a card's command woke
 // @param api {getSession, sendCommand} (data.js)
 // @return {cardElement(id), upsertCard(card, {before}), placeSnapshotCards(entries),
 //   refreshCardBodies(), onCardAction(event)}
 export function createCardsPlace({
-  historyEl, appendToHistory, isNearBottom, turnDom, findInTurnRoots, selected, clientId, questionCards, bubbles,
+  historyEl, turnDom, findInTurnRoots, selected, clientId, questionCards, bubbles,
   followWokenWorker, api = { getSession, sendCommand },
 }) {
   function cardElement(id) {
@@ -73,10 +71,7 @@ export function createCardsPlace({
     const el = drawCard(document.createElement(isNoticeCard(card) ? "details" : "div"), card);
     const asks = (card.actions || []).some((a) => a && a.command);
     if (card.in_turn && !before && !asks && turnDom.card(el)) return;
-    const follow = isNearBottom();
-    if (before) historyEl.insertBefore(el, before);
-    else appendToHistory(el);
-    if (follow) historyEl.scrollTop = historyEl.scrollHeight;
+    bubbles.placeFollowing(el, before);
   }
 
   // A snapshot's cards and notices, each above the first turn after it; a
@@ -170,8 +165,9 @@ export function createCardsPlace({
     button.disabled = true;
     api.sendCommand(id, button.dataset.command, { clientId, card: true })
       .then(() => {
-        // The command woke the worker: follow its stream if none is open.
-        followWokenWorker();
+        // The command woke the worker: follow its stream if none is open
+        // (and the page still shows that session).
+        if (selected() === id) followWokenWorker();
       })
       .catch((error) => {
         err.textContent = error.message;

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

@@ -13,9 +13,18 @@ import { archivedBadge, rowBadgesTemplate, rowDotTemplate } from "./families_vie
 import { html, nothing } from "./vendor/lit-html.js";
 
 // The opener a new link's composer is filled with (never sent: the user
-// edits or sends it). The same for every chain.
+// edits or sends it) when the continue brings none of its own.
 export const CONTINUE_OPENER = "Continue where we left off.";
 
+// What a new link's composer is filled with: the continue's own opener
+// (+created+, the 201: the previous link's first typed message, when that
+// link continues one), else CONTINUE_OPENER. So whatever the user sent on
+// the last link comes back on the next one.
+export function openerText(created) {
+  const own = created?.opener;
+  return typeof own === "string" && own.trim() ? own : CONTINUE_OPENER;
+}
+
 // Whether +text+ (a title or a first message) is the opener and nothing
 // else, trimmed: "Continue where we left off. Then fix X" is a title of its own.
 export function isOpener(text) {
@@ -41,6 +50,17 @@ export function chainTitle(s, byId) {
   return isOpener(at.first_preview || at.last_prompt) ? own : previewForCard(at);
 }
 
+// The open session's title (app.js updateSessionTitle: the top bar and the
+// tab) from +first+, its first message: it follows its card. A chain link
+// (+shown+, its summary, has continues) reads +cardTitle+(shown) whatever
+// its first message: a web link inherits its chain's title, and its first
+// message is an opener (the constant or the user's own). Else +first+,
+// unless it is the opener. +shown+ null: not listed yet, +first+.
+export function openTitle({ shown, first, cardTitle }) {
+  if (shown && (shown.continues || isOpener(first))) return cardTitle(shown);
+  return first;
+}
+
 const createdMs = (s) => {
   const ms = Date.parse(s?.created_at || "");
   return Number.isNaN(ms) ? 0 : ms;
@@ -206,7 +226,7 @@ export function chainRowsTemplate(f, { activeId = null, now = Date.now() } = {})
 export function continueRefusal(error, sessions = []) {
   const body = error?.body || {};
   if (error?.code === "continued" && body.next_id) return { kind: "open", id: body.next_id };
-  const text = String(error?.message || "refused").replace(/\s*\(\d{3}\)$/, "");
+  const text = String(error?.message || "refused");
   if (error?.code === "open_children" && Array.isArray(body.ids) && body.ids.length) {
     const byId = new Map(sessions.map((s) => [s.id, s]));
     const children = body.ids.map((id) => {

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

@@ -84,10 +84,12 @@ export function createChipPopover({ id, className, width: widest, el, anchor: an
     show(data, false);
   }
 
+  // The click goes on to the document: another chip's popover (or the
+  // context popover) open meanwhile closes there. This one's own closer
+  // leaves its chip's click alone.
   el.addEventListener("click", (e) => {
     const anchor = e.target.closest(anchorSel);
     if (!anchor) return;
-    e.stopPropagation();
     if (isOpen()) close();
     else open(anchor);
   });

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

@@ -60,20 +60,26 @@ export function routeSessionLine(prompt, { commands = [], images = 0, delivery =
 //   followWokenWorker()  the command woke the worker: follow its stream
 //   refreshHistory()
 //   failed(line, text)   a failed command's bubble
+//   failedElsewhere(line, text)   a command to a session no longer open failed
 //   ownedByTui()         a plain terminal holds the session
 //   composer: {busy(), clear(), done()}   the composer's send button and text
 export function createComposerCommands(deps) {
-  const { session, clientId, sendCommand, followWokenWorker, refreshHistory, failed, ownedByTui, composer } = deps;
+  const { session, clientId, sendCommand, followWokenWorker, refreshHistory, failed, failedElsewhere, ownedByTui,
+          composer } = deps;
 
-  // A line typed in the composer (routeComposerLine's {command}).
+  // The page may open another session while a command is in flight: what
+  // follows is about the session it went to (+id+), so the open one's
+  // worker, owner and history are left alone then.
   async function send(line) {
+    const id = session();
     composer.busy();
     try {
-      await sendCommand(session(), line, { clientId });
+      await sendCommand(id, line, { clientId });
       composer.clear();
       refreshHistory();
-      followWokenWorker();
+      if (session() === id) followWokenWorker();
     } catch (e) {
+      if (session() !== id) return failedElsewhere(line, e.message);
       if (e.code === "owned_by_tui") {
         ownedByTui();
         return;
@@ -93,10 +99,11 @@ export function createComposerCommands(deps) {
     if (!id) return false;
     try {
       await sendCommand(id, line, { clientId });
-      followWokenWorker();
+      if (session() === id) followWokenWorker();
       return true;
     } catch (e) {
-      failed(line, e.message);
+      if (session() === id) failed(line, e.message);
+      else failedElsewhere(line, e.message);
       return false;
     }
   }

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

@@ -9,6 +9,8 @@
 
 import { html, nothing, render } from "./vendor/lit-html.js";
 import { keepFocus } from "./keep_focus.js";
+import { popoverPlace } from "./chip_popover.js";
+import { cantText } from "./format.js";
 
 // "now", "3m", "2h", "4d" since an ISO time; "" for none.
 export function ageText(iso, now = Date.now()) {
@@ -177,13 +179,24 @@ export function createContextChips({ el, api, toast = () => {}, doc = document,
     render(popoverTemplate(row, { text }), pop);
   }
 
-  // Above the chip, inside the window with a 16px gutter.
+  // At the chip as the session bar's chips place theirs (popoverPlace):
+  // above it, or below when the room above is short; capped to the room
+  // (it scrolls), inside the window with a 16px gutter.
   function place(chip) {
-    const rect = chip.getBoundingClientRect();
     const width = Math.min(380, win.innerWidth - 32);
     pop.style.width = `${width}px`;
-    pop.style.left = `${Math.max(16, Math.min(rect.left, win.innerWidth - width - 16))}px`;
-    pop.style.bottom = `${Math.max(16, win.innerHeight - rect.top + 8)}px`;
+    pop.style.maxHeight = "";
+    const at = popoverPlace(chip.getBoundingClientRect(), { width, height: pop.offsetHeight,
+                                                            innerWidth: win.innerWidth, innerHeight: win.innerHeight });
+    pop.style.left = `${at.left}px`;
+    pop.style.top = at.top === undefined ? "" : `${at.top}px`;
+    pop.style.bottom = at.bottom === undefined ? "" : `${at.bottom}px`;
+    if (at.maxHeight !== undefined) pop.style.maxHeight = `${at.maxHeight}px`;
+  }
+
+  function placeAtOpenChip() {
+    const chip = openName && el.querySelector(".ctx-chip.open");
+    if (chip) place(chip);
   }
 
   function open(name, chip) {
@@ -231,7 +244,7 @@ export function createContextChips({ el, api, toast = () => {}, doc = document,
     } catch (e) {
       if (id !== sessionId || openName !== ADD) return;
       // The same form again: what the user typed stays; the URL gets focus.
-      drawAdd({ busy: false, error: String(e.message).replace(/ \(\d+\)$/, "") });
+      drawAdd({ busy: false, error: e.message });
       pop.querySelector('input[name="url"]')?.focus();
     }
   }
@@ -255,8 +268,10 @@ export function createContextChips({ el, api, toast = () => {}, doc = document,
       if (!row) return;
       text = data.text || "";
       fill(row);
+      // The text makes it taller: placed again.
+      placeAtOpenChip();
     } catch (e) {
-      toast(`Can't read ${name}: ${String(e.message).replace(/ \(\d+\)$/, "")}`);
+      toast(cantText(`read ${name}`, e));
     }
   }
   async function detach() {
@@ -271,14 +286,15 @@ export function createContextChips({ el, api, toast = () => {}, doc = document,
       close();
       await refresh();
     } catch (e) {
-      toast(`Can't detach ${row.name}: ${String(e.message).replace(/ \(\d+\)$/, "")}`);
+      toast(cantText(`detach ${row.name}`, e));
     }
   }
 
   el.addEventListener("click", (e) => {
     const chip = e.target.closest(".ctx-chip");
     if (!chip) return;
-    e.stopPropagation();
+    // On to the document: a session-bar chip's popover closes (the close
+    // below leaves clicks in +el+ alone).
     if (chip.dataset.act === "add") {
       if (openName === ADD) close();
       else openAdd(chip);
@@ -301,10 +317,7 @@ export function createContextChips({ el, api, toast = () => {}, doc = document,
   doc.addEventListener("keydown", (e) => {
     if (e.key === "Escape" && openName) close();
   });
-  win.addEventListener("resize", () => {
-    const chip = openName && el.querySelector(".ctx-chip.open");
-    if (chip) place(chip);
-  });
+  win.addEventListener("resize", placeAtOpenChip);
   win.addEventListener("focus", () => refresh());
   // The ages move on by themselves.
   win.setInterval(() => { if (rows.length) drawChips(); }, 60_000);

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

@@ -6,7 +6,11 @@ export function api(path, opts = {}) {
   }).then(async (r) => {
     const j = await r.json().catch(() => ({}));
     if (!r.ok) {
-      const error = new Error(`${j.detail || j.error || r.statusText} (${r.status})`);
+      // The server's words as they are: what the page shows the user. The
+      // status goes in only when it sent none (a proxy's bare 502, a crash's
+      // 500): then it is all there is to go on.
+      const words = j.detail || j.error;
+      const error = new Error(words || `${r.statusText || "HTTP error"} (${r.status})`);
       error.status = r.status;
       // The server's error code ({error: "owned_by_tui", detail}): what
       // the page matches on, never the message's words.
@@ -116,6 +120,15 @@ export function sendCommand(id, line, { clientId, card = false, ...opts } = {})
   });
 }
 
+// A text's markdown as sanitised HTML ({ html }; null with markdown off).
+export function renderText(text, opts = {}) {
+  return api("/api/render", {
+    method: "POST",
+    body: JSON.stringify({ text }),
+    ...opts,
+  });
+}
+
 export function cancelTurn(id, opts = {}) {
   return api(`/api/sessions/${id}/cancel`, {
     method: "POST",