samagotchi 0.17.0 → 0.18.1

data/lib/samagotchi/web/app.rb

@@ -9,11 +9,13 @@ require "uri"
 require "rack"
 require "rack/request"
 
+require_relative "../answer_tail"
 require_relative "../bridge_client"
 require_relative "../bridge/bounded_queue"
 require_relative "../bridge/card_store"
 require_relative "../session"
 require_relative "../session_manager"
+require_relative "../session_metrics"
 require_relative "../session_commands"
 require_relative "../steer"
 require_relative "../host_registry"
@@ -177,14 +179,18 @@ module Samagotchi
 
       # API requests at debug level (not the page and its assets): method,
       # path, status, time. Never a body or the query; only a tail=1 read
-      # (the page's end-of-turn re-read) is marked, to tell it from a full one.
+      # (the page's end-of-turn re-read) and a timing=1 one (its fallback
+      # when the merge came up short) are marked, to tell them from a full one.
       def log_request(env, response, started)
         path = env["PATH_INFO"].to_s
         return unless path.start_with?("/api/") && Log.level?(:debug)
 
-        tail = env["QUERY_STRING"].to_s.split("&").include?("tail=1") ? { tail: true } : {}
+        params = env["QUERY_STRING"].to_s.split("&")
+        marks = {}
+        marks[:tail] = true if params.include?("tail=1")
+        marks[:timing] = true if params.include?("timing=1")
         Log.debug(:web, "request", sid: path[%r{\A/api/sessions/([^/]+)}, 1], method: env["REQUEST_METHOD"], path: path,
-                                   status: response[0], **tail,
+                                   status: response[0], **marks,
                                    ms: ((Process.clock_gettime(Process::CLOCK_MONOTONIC) - started) * 1000).round)
       end
 
@@ -518,6 +524,11 @@ module Samagotchi
       end
 
       def handle_show(req, id)
+        # The page's light re-reads: never the whole conversation.
+        return handle_cards_read(id) if req.params["cards"] == "1"
+        return handle_tail_read(req, id) if req.params["tail"] == "1"
+        return handle_timing_read(id) if req.params["timing"] == "1"
+
         session = @session_class.load(id, state_dir: default_state_dir)
         # Read-only preview: selecting a session never spawns a worker.
         # The worker is woken only on POST /turn (handle_turn) via
@@ -531,11 +542,6 @@ module Samagotchi
         # behind it, all at one event_seq the client streams on from.
         live = bridge_get_json(id, "snapshot")
         turn_snapshot = live && live["snapshot"]
-        # ?cards=1: the page's re-read when a card arrives, for its rendered
-        # body (the stream carries the card's plain text only).
-        if req.params["cards"] == "1"
-          return json_response(200, { cards: cards_for_display(turn_snapshot, id) })
-        end
         snapshot = live && live["session_state_snapshot"]
         last_event_seq = snapshot ? snapshot["event_seq"] : bridge_event_seq(id)
         current_turn = turn_snapshot && turn_snapshot["current_turn"]
@@ -543,8 +549,9 @@ module Samagotchi
         # The file's question only while a worker owns the session: one a
         # dead worker saved can't be answered (its turn is gone), nor a chi
         # REPL's (it shares nothing with the web).
+        # A question between turns (the step-limit one) is the snapshot's own.
         pending = if turn_snapshot
-                    current_turn && current_turn["pending_question"]
+                    current_turn ? current_turn["pending_question"] : turn_snapshot["pending_question"]
                   elsif owner&.worker?
                     session.pending_question
                   end
@@ -557,19 +564,6 @@ module Samagotchi
         end
         raw_messages = turn_snapshot ? turn_snapshot["messages"] : session.messages
         timing = timing_payload(id, live_metrics: snapshot && snapshot["metrics"])
-        # ?tail=1: the page's re-read at the end of a turn wants the final
-        # answer's rendered markdown, the status and the timing, not the
-        # whole history again (nor a render of every earlier answer).
-        if req.params["tail"] == "1"
-          return json_response(200, {
-            tail: true,
-            session: session_json,
-            messages: last_assistant_for_display(raw_messages),
-            markdown_warning: @markdown_renderer.warning,
-            timing: timing
-          })
-        end
-
         json_response(200, {
           session: session_json,
           history: read_history(id),
@@ -585,7 +579,7 @@ module Samagotchi
           plugin_warning: turn_snapshot && turn_snapshot["plugin_warning"],
           # Plugins' slow setup still running (chi.init): the page's init row.
           init_tasks: turn_snapshot ? Array(turn_snapshot["init_tasks"]) : [],
-          cards: cards_for_display(turn_snapshot, id),
+          cards: cards_for_display(turn_snapshot ? turn_snapshot["cards"] : saved_cards(id)),
           # The composer's / autocomplete; the built-ins until a worker
           # names its plugins' too.
           commands: turn_snapshot&.fetch("commands", nil) || SessionCommands.builtin_registry.listing,
@@ -601,14 +595,101 @@ module Samagotchi
         error_response(404, "not_found", e.message)
       end
 
+      # ?cards=1: the page's re-read when a card arrives, for its rendered
+      # body (the stream carries the card's plain text only). The worker's
+      # cards from its light GET tail, else the saved ones; the session file
+      # is only stat'ed (the 404), never parsed.
+      def handle_cards_read(id)
+        return error_response(404, "not_found", "Session not found: #{id}") unless session_exists?(id)
+
+        tail = live_tail(id)
+        json_response(200, { cards: cards_for_display(tail ? tail["cards"] : saved_cards(id)) })
+      end
+
+      # ?tail=1: the page's re-read at the end of a turn wants the final
+      # answer's rendered markdown, the status and the timing, not the whole
+      # history again (nor a render of every earlier answer). Live: the
+      # worker's GET tail alone (no session file read); else the file. The
+      # session part is what the page reads of it (id, status, used memory
+      # names). ?turn_id=: that turn's answer (a queued turn's page re-reads
+      # after the next one started). ?recent=1 (the page since this
+      # release): the timing's records are the newest turn's (#recent_timing),
+      # which the page merges by id; without it, the whole timing as before.
+      def handle_tail_read(req, id)
+        return error_response(404, "not_found", "Session not found: #{id}") unless session_exists?(id)
+
+        turn_id = req.params["turn_id"].to_s.strip
+        turn_id = nil if turn_id.empty?
+        tail = live_tail(id, turn_id: turn_id)
+        state = tail && tail["session_state_snapshot"]
+        if state.is_a?(Hash)
+          session_json = { id: id, status: state["status"], used_memory_names: Array(state["used_memory_names"]) }
+          messages = last_assistant_for_display([tail["answer"]].compact)
+        else
+          session = @session_class.load(id, state_dir: default_state_dir)
+          state = nil
+          session_json = { id: id, status: displayed_status(session), used_memory_names: Array(session.used_memory_names) }
+          messages = last_assistant_for_display(session.messages, turn_id: turn_id)
+        end
+        live_metrics = state && state["metrics"]
+        # Without recent=1: a tab opened before this release (it replaces its
+        # timing with the reply's). Remove this branch after the next release.
+        timing = req.params["recent"] == "1" ? recent_timing(id, live_metrics) : timing_payload(id, live_metrics: live_metrics)
+        json_response(200, {
+          tail: true,
+          session: session_json,
+          messages: messages,
+          markdown_warning: @markdown_renderer.warning,
+          timing: timing
+        })
+      rescue ArgumentError => e
+        error_response(404, "not_found", e.message)
+      end
+
+      # ?timing=1: the whole timing (every record, analytics.json merged with
+      # the live ones) and turn_count, when the page's merge comes up short.
+      # The worker's GET state, never its messages.
+      def handle_timing_read(id)
+        return error_response(404, "not_found", "Session not found: #{id}") unless session_exists?(id)
+
+        state = bridge_get_json(id, "state")
+        json_response(200, { timing: timing_payload(id, live_metrics: state && state["session_state_snapshot"]&.fetch("metrics", nil)) })
+      end
+
+      def session_exists?(id)
+        @session_class.exist?(id, state_dir: default_state_dir)
+      rescue ArgumentError
+        false
+      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
+      # 500, a timeout) is nil: the caller reads the disk, with no second
+      # try at a worker that failed once.
+      # @return [Hash, nil]
+      def live_tail(id, turn_id: nil)
+        status, body = bridge_get(id, turn_id ? "tail?turn_id=#{URI.encode_www_form_component(turn_id)}" : "tail")
+        return body if status == 200 && body.is_a?(Hash)
+        return nil unless status == 404 && body.is_a?(Hash) && body["error"] == "not_found"
+
+        status, live = bridge_get(id, "snapshot")
+        return nil unless status == 200 && live.is_a?(Hash) && live["snapshot"].is_a?(Hash)
+
+        snap = live["snapshot"]
+        { "session_state_snapshot" => live["session_state_snapshot"],
+          "answer" => AnswerTail.find(snap["messages"], turn_id: turn_id),
+          "cards" => snap["cards"], "event_seq" => snap["event_seq"], "event_id" => snap["event_id"] }
+      end
+
       # The worker's last cards and between-turns notices (Bridge
-      # snapshot[:cards]), else (no live worker) the ones the last worker
-      # saved in the session's folder (CardStore.saved), a card's body as
+      # cards: CardStore#list), else (no live worker) the ones the last
+      # worker saved in the session's folder (#saved_cards), a card's body as
       # body_html: rendered markdown when the renderer is on, else the
       # escaped text in a <pre>.
       # @return [Array<Hash>]
-      def cards_for_display(turn_snapshot, id)
-        cards = turn_snapshot ? turn_snapshot["cards"] : saved_cards(id)
+      def cards_for_display(cards)
         Array(cards).filter_map do |card|
           next unless card.is_a?(Hash)
           next card unless card["type"].to_s == "card"
@@ -979,7 +1060,8 @@ module Samagotchi
       end
 
       # GET /api/events: the session list as one SSE stream per tab. The
-      # first frame is the hub's snapshot (scoped by ?dir= as the list is),
+      # first frame is the hub's snapshot (scoped by ?dir= as the list is,
+      # with chi's version),
       # then `session` for an upsert and `session_gone` for a removal, with
       # a `: ping` while idle. Frame ids are the hub's seq, for the log's
       # sake: there is no replay, a reconnect starts with a fresh snapshot.
@@ -1066,6 +1148,15 @@ module Samagotchi
         bridge_client(session_id)&.get_json(path)
       end
 
+      # GET a read path of the session's live Bridge with its status
+      # (BridgeClient#get).
+      # @return [Array(Integer, Object)] [status, parsed body]; [nil, nil]
+      #   with no live bridge or no reply
+      def bridge_get(session_id, path)
+        client = bridge_client(session_id)
+        client ? client.get(path) : [nil, nil]
+      end
+
       # Monotonic SSE cursor for a live bridge session, else nil.
       def bridge_event_seq(session_id)
         bridge_client(session_id)&.event_seq
@@ -1138,9 +1229,12 @@ module Samagotchi
                                 session_dir: @session_class.session_dir(s.id, state_dir: default_state_dir))
       end
 
+      # The whole timing: analytics.json's records merged with a live
+      # worker's (by id), and turn_count, the finished turns (#turn_count).
       def timing_payload(session_id, live_metrics: nil)
         persisted = read_analytics(session_id)
-        source = if live_metrics.is_a?(Hash)
+        live = live_metrics.is_a?(Hash)
+        source = if live
                    persisted.merge(live_metrics).merge(
                      "started_at" => persisted["started_at"] || live_metrics["started_at"],
                      "turn_records" => merge_timing_records(persisted["turn_records"], live_metrics["turn_records"]),
@@ -1149,14 +1243,66 @@ module Samagotchi
                  else
                    persisted
                  end
+        turns = Array(source["turn_records"])
+        timing_from(source, turns, Array(source["tool_records"]), live: live,
+                                                                 turn_count: (live && turn_count(live_metrics)) || turns.size)
+      end
+
+      # The timing a ?tail=1&recent=1 read sends: a live worker's recent
+      # records as its metrics hold them (the newest finished turn's and
+      # the unsaved ones, the running turn's finished calls), no
+      # analytics.json read; with no worker the disk's, trimmed to the
+      # newest turn. turn_count tells the page whether its merge missed one
+      # (it then reads ?timing=1).
+      def recent_timing(session_id, live_metrics)
+        if live_metrics.is_a?(Hash)
+          count = turn_count(live_metrics)
+          # A metrics hash without the count: the whole timing.
+          return timing_payload(session_id, live_metrics: live_metrics) unless count
+
+          turns = Array(live_metrics["turn_records"])
+          tools = Array(live_metrics["tool_records"])
+          # An older worker's metrics hold every record (before they held the
+          # recent ones only, never more than LIVE_RECORDS_CAP turns).
+          turns, tools = newest_turn_records(turns, tools, live_metrics["active_turn"]) if turns.size > SessionMetrics::LIVE_RECORDS_CAP
+          return timing_from(live_metrics, turns, tools, live: true, turn_count: count)
+        end
+
+        persisted = read_analytics(session_id)
+        all = Array(persisted["turn_records"])
+        turns, tools = newest_turn_records(all, Array(persisted["tool_records"]), nil)
+        timing_from(persisted, turns, tools, live: false, turn_count: all.size)
+      end
+
+      # The finished turns a live worker counts: its metrics' turns (the
+      # loaded history, its own and the running one) less the running one.
+      # @return [Integer, nil]
+      def turn_count(metrics)
+        turns = metrics["turns"]
+        return nil unless turns.is_a?(Integer)
+
+        [turns - (metrics["active_turn"] ? 1 : 0), 0].max
+      end
+
+      # The newest turn record and its tool records (and the running turn's
+      # finished calls).
+      def newest_turn_records(turns, tools, active_turn)
+        kept = turns.last(1)
+        ids = kept.filter_map { |r| r["id"] if r.is_a?(Hash) }
+        ids << active_turn["id"] if active_turn.is_a?(Hash) && active_turn["id"]
+        [kept, tools.select { |r| r.is_a?(Hash) && ids.include?(r["turn_id"]) }]
+      end
+
+      def timing_from(source, turn_records, tool_records, live:, turn_count:)
         started_at = source["started_at"]
         last_activity_at = source["last_activity_at"]
         {
           started_at: started_at,
           last_activity_at: last_activity_at,
-          session_duration_ms: session_duration_ms(started_at, last_activity_at, active: live_metrics.is_a?(Hash)),
-          turn_records: Array(source["turn_records"]),
-          tool_records: Array(source["tool_records"]),
+          session_duration_ms: session_duration_ms(started_at, last_activity_at, active: live),
+          turn_records: turn_records,
+          tool_records: tool_records,
+          turn_count: turn_count,
           active_turn: source["active_turn"],
           active_tools: Array(source["active_tools"]),
           # The context last seen and the token sums, for the ctx meter
@@ -1332,14 +1478,10 @@ module Samagotchi
         MessageParts.for_message(list[index], responses, cwd: cwd)
       end
 
-      # The last message messages_for_display shows as an answer, as a list of
-      # at most one: walked backwards so only that one is rendered.
-      def last_assistant_for_display(msgs)
-        Array(msgs).reverse_each do |m|
-          shown = messages_for_display([m]).first
-          return [shown] if shown && shown[:role] == "assistant"
-        end
-        []
+      # The last message messages_for_display shows as an answer
+      # (AnswerTail), as a list of at most one: only that one is rendered.
+      def last_assistant_for_display(msgs, turn_id: nil)
+        messages_for_display([AnswerTail.find(msgs, turn_id: turn_id)].compact)
       end
 
       def parse_json(str)
@@ -1384,7 +1526,9 @@ module Samagotchi
       # folder in a repo, that project's name and root. A bad dir adds
       # nothing here: the list call answers 400 and the page says so.
       def index_data_attributes(req)
-        attrs = { "sessions-dir" => sessions_dir_label, "server-dir" => home_label(Dir.pwd) }
+        # version: the chi that served the page; the events snapshot names
+        # the one serving now (an upgraded chi web after a reconnect).
+        attrs = { "sessions-dir" => sessions_dir_label, "server-dir" => home_label(Dir.pwd), "version" => Samagotchi::VERSION }
         attrs["view"] = view_name(req.params["view"])
         # Always there: an empty one means no presets, not the default.
         attrs["annotate-presets"] = @annotate_presets
@@ -1457,7 +1601,8 @@ module Samagotchi
         end
 
         def each
-          yield frame(nil, "snapshot", sessions: @snapshot)
+          # version: the page compares it with the one it was served by.
+          yield frame(nil, "snapshot", sessions: @snapshot, version: Samagotchi::VERSION)
           last_write = monotonic
           loop do
             event = @queue.pop([@heartbeat, EVENTS_POLL].min)

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

@@ -39,11 +39,12 @@ import { shouldFollowScroll, keepFollowing } from "./scroll.js";
 import { SHORT_WINDOW_QUERY, stripAutoHidden, stripColumns, stripShowParts } from "./strip.js";
 import { applySessionEvent, heldOrder, listedSessions, sortedByUpdated, waitingBadge, waitingFirst, waitingSearchText, withChildrenAfterParents } from "./sessions_list.js";
 import { createNotifications } from "./notifications.js";
+import { updateNotice } from "./update_notice.js";
 import {
-  appendAboveLiveTiming, cancelLineText, elapsedSince, formatDuration, normalizeTiming, turnTimingText,
+  appendAboveLiveTiming, cancelLineText, elapsedSince, formatDuration, mergeTiming, normalizeTiming, turnTimingText,
 } from "./timing.js";
 import { DONE_MS, applyInitEvent, dropDone, initRowHtml, newInitTasks, seedInitTasks } from "./init_row.js";
-import { clientLabel, commandView, emptyAnswerLine, emptyRetryLine, hookNoticeLabel, initWaitLine, isOwn, sessionCommandLine, keepEarlyRestore, newClientId, noticeLine, promptOps, reminderText, restoreAction, restoreOnAck, retryStatusLine, snapshotEvents, turnOutput, webLocalReply, workerGoneText } from "./turn_events.js";
+import { clientLabel, commandView, emptyAnswerLine, emptyRetryLine, hookNoticeLabel, initWaitLine, isOwn, sessionCommandLine, keepEarlyRestore, newClientId, noticeLine, promptOps, reminderText, restoreAction, restoreOnAck, retryStatusLine, snapshotEvents, startPageReply, turnOutput, unknownCommandHint, webLocalReply, workerGoneText } from "./turn_events.js";
 
 const $ = (s) => document.querySelector(s);
 const topStripEl = $("#topStrip");
@@ -101,6 +102,15 @@ function findInTurnRoots(selector) {
 let current = emptySessionState();
 let turnRunning = false;
 let liveTurnTimingEl = null;
+// The running turn's id (turn_started's turn_id, the id of its timing
+// record), so a turn-end re-read finishes that turn's line with that
+// turn's record, whatever started since.
+let liveTurnId = null;
+// The turns this page saw end: the records of its last full render, +1 at
+// each turn's end, never fewer than a merge brought. The live line numbers
+// the next one, so a turn queued behind another reads its own number while
+// the other's re-read is still out.
+let turnsEnded = 0;
 // What the running turn waits on, after its live timing line: a provider
 // retry (generation_retrying) or plugins' setup (plugin_init_wait); "" when
 // it streams again.
@@ -169,6 +179,7 @@ async function refresh() {
 function openSessionEvents() {
   eventsControl = openEvents({
     snapshot: (data) => {
+      noticeUpdate(data.version);
       notifications.noticeSessions("snapshot", data);
       allSessions = applySessionEvent(allSessions, "snapshot", data);
       render();
@@ -199,6 +210,17 @@ function openSessionEvents() {
   });
 }
 
+// chi web was upgraded while this tab stayed open (a snapshot on the
+// reconnect names another version than the one that served the page):
+// a toast offers the reload, never forces it.
+let updateShownFor = null;
+function noticeUpdate(served) {
+  const text = updateNotice(document.body.dataset.version, served, updateShownFor);
+  if (!text) return;
+  updateShownFor = served;
+  showToast(text, { label: "Reload", run: () => location.reload() }, { sticky: true });
+}
+
 // The selected session's card changed: its owner and, without a live
 // stream, its status show in the info bar; a worker whose bridge is up
 // (a turn another client sent woke one, or a replacement after a kill)
@@ -284,7 +306,7 @@ function cardHtml(s, { deletable = false } = {}) {
   const ctx = cardCtxText(s.ctx_pct);
   const ctxHtml = ctx ? `<span class="ctx" title="Context used after the last turn">${escapeHtml(ctx)}</span>` : "";
   const waiting = waitingBadge(s);
-  const waitingHtml = waiting ? `<span class="attn ${waiting.kind}" title="${escapeHtml(waiting.title)}">${escapeHtml(waiting.text)}</span>` : "";
+  const waitingHtml = waiting ? `<span class="attn attn-${waiting.kind}" title="${escapeHtml(waiting.title)}">${escapeHtml(waiting.text)}</span>` : "";
   const dotWord = waiting ? waiting.title : s.status;
   return `<div class="card${s.archived ? " archived" : ""}${waiting ? " waiting" : ""}" data-id="${s.id}" title="${escapeHtml(tip)}${memTitle ? ` · ${escapeHtml(memTitle)}` : ""}"><div class="preview">${preview}</div>${s.recap ? `<div class="recap" title="${escapeHtml(s.recap)}">${escapeHtml(s.recap)}</div>` : ""}<div class="meta"><span class="status dot ${escapeHtml(s.status)}${waiting ? " waiting" : ""}" title="${escapeHtml(dotWord)}" aria-label="${escapeHtml(dotWord)}"></span>${waitingHtml}${timeHtml}${ctxHtml}${folderHtml}${parentChipHtml(s)}${ownerBadgeHtml(s)}${archivedHtml}${s.used_memory_names && s.used_memory_names.length ? `<span title="${escapeHtml(s.used_memory_names.join(", "))}">mem ${s.used_memory_names.length}</span>` : ""}</div>${deletable ? `<button type="button" class="card-del" data-del="${escapeHtml(s.id)}" title="Delete session" aria-label="Delete session ${escapeHtml(s.short_id)}">\u2715</button>` : ""}</div>`;
 }
@@ -605,6 +627,7 @@ function clearSelection() {
   resetSessionState();
   clearTimingInterval();
   liveTurnTimingEl = null;
+  liveTurnId = null;
   setTurnRunning(false);
   closeStream();
   setMarkdownWarning(null);
@@ -658,6 +681,7 @@ function resetTurnView() {
   closeStream();
   clearTimingInterval();
   liveTurnTimingEl = null;
+  liveTurnId = null;
   questionCards.removeQuestion();
   questionCards.forgetContinue();
   unmatchedMerge = false;
@@ -715,6 +739,8 @@ function renderSessionView(data) {
   current.dir = s.working_directory;
   current.owner = s.owner || null;
   current.timing = normalizeTiming(data.timing);
+  turnsEnded = current.timing.turnRecords.length;
+  const activeTurnId = current.timing.activeTurn?.id || null;
   // The saved fill, so a reloaded or stopped session shows it before its
   // next turn (a running turn's replay below streams over it).
   const savedPct = savedCtxPct(data.timing?.context);
@@ -767,7 +793,10 @@ function renderSessionView(data) {
   replay.forEach((event) => streamHandlers[event.type]?.(event));
   if (!data.current_turn) {
     setTurnRunning(current.status === "running");
-    if (turnRunning && current.timing.activeTurn?.started_at) startLiveTurnTiming(current.timing.activeTurn.started_at);
+    if (turnRunning && current.timing.activeTurn?.started_at) startLiveTurnTiming(current.timing.activeTurn.started_at, activeTurnId);
+  } else if (turnRunning) {
+    // The replayed turn_started carries no id: the running turn's record's.
+    liveTurnId = activeTurnId;
   }
   turnDom.flush();
   snapshotCards.current.forEach((card) => upsertCard(card));
@@ -818,13 +847,18 @@ let turnEndRead = Promise.resolve();
 let displayLanded = null;
 async function readTurnEnd() {
   if (!selected) return;
+  const id = selected;
+  // The line and the turn this read is for, before the await: a turn
+  // queued behind this one may start (a new live line) before it lands.
+  const line = { el: liveTurnTimingEl, turnId: liveTurnId };
   try {
-    const d = await getSession(selected, { tail: true });
+    const d = await getSession(id, { tail: true, recent: true, turnId: line.turnId });
+    if (id !== selected) return;
     if (d.session) {
       if (Array.isArray(d.session.used_memory_names)) current.usedMemories = d.session.used_memory_names;
       if (d.session.status) current.status = d.session.status;
-      applyTiming(d.timing);
-      finishLiveTurnTiming(current.timing.turnRecords[current.timing.turnRecords.length - 1]);
+      if (!(await mergeTurnTiming(id, d.timing))) return;
+      finishTurnLine(line);
       setMarkdownWarning(d.markdown_warning);
       if (Array.isArray(d.messages)) applyFinalMarkdown(d.messages);
       updateInfoBar();
@@ -913,6 +947,9 @@ function emptyAnswerEl(emptyAnswer) {
 // left the collapsed block (card.js leavesBlock), where a reload puts them.
 function endTurnView(kind, endText = null, { emptyAnswer = null } = {}) {
   setTurnRunning(false);
+  // Every ended turn has a record (completed, canceled, failed); a worker
+  // gone mid-turn is re-rendered (resync), which counts again.
+  if (kind !== "gone") turnsEnded += 1;
   // A completed turn with no answer: its notice where the answer goes
   // (the turn view places it), else after the turn; before the timing.
   const endNote = emptyAnswer ? emptyAnswerEl(emptyAnswer) : null;
@@ -1356,11 +1393,12 @@ function clearTimingInterval() {
 
 let liveTurnNumber = null;
 
-function startLiveTurnTiming(startedAt = new Date().toISOString()) {
+function startLiveTurnTiming(startedAt = new Date().toISOString(), turnId = null) {
   clearTimingInterval();
-  current.timing.activeTurn = { started_at: startedAt };
-  // The turn records hold the finished turns, so this one comes next.
-  liveTurnNumber = current.timing.turnRecords.length + 1;
+  current.timing.activeTurn = turnId ? { id: turnId, started_at: startedAt } : { started_at: startedAt };
+  liveTurnId = turnId || null;
+  // The turns ended so far, so this one comes next.
+  liveTurnNumber = turnsEnded + 1;
   liveTurnNote = "";
   liveTurnTimingEl = document.createElement("div");
   liveTurnTimingEl.className = "turn-timing live";
@@ -1410,11 +1448,46 @@ function finishLiveTurnTiming(record = null, { canceled = false } = {}) {
   updateInfoBar();
 }
 
-function applyTiming(data) {
-  current.timing = normalizeTiming(data);
-  if (turnRunning && current.timing.activeTurn?.started_at) {
-    startLiveTurnTiming(current.timing.activeTurn.started_at);
+// A turn-end re-read's timing (?tail=1&recent=1: the newest turn's records
+// and turn_count) merged into the page's (mergeTiming); when the merge comes
+// up short, the whole timing (?timing=1). Never (re)starts live timing: a
+// turn that started meanwhile keeps its line and its own active turn.
+// @return false when the session changed meanwhile
+async function mergeTurnTiming(id, data) {
+  const keepActive = () => (turnRunning ? current.timing.activeTurn : null);
+  const merged = mergeTiming(current.timing, data);
+  current.timing = { ...merged.timing, activeTurn: keepActive() };
+  if (merged.short) {
+    try {
+      const full = await getSession(id, { timing: true });
+      if (id !== selected) return false;
+      current.timing = { ...normalizeTiming(full.timing), activeTurn: keepActive() };
+    } catch (_) {
+      if (id !== selected) return false;
+    }
+  }
+  turnsEnded = Math.max(turnsEnded, current.timing.turnRecords.length);
+  return true;
+}
+
+// Finish the timing line a turn-end read captured (+line+: {el, turnId})
+// with that turn's record: its place in the records and its duration (a
+// canceled one says so). No id (an older worker's events): the last
+// record. No record: the line stays as the turn's end left it. The ticker
+// stops only if that line is still the live one.
+function finishTurnLine(line) {
+  const records = current.timing.turnRecords;
+  const record = line.turnId ? records.find((r) => r.id === line.turnId) : records[records.length - 1];
+  if (line.el === liveTurnTimingEl) {
+    current.timing.activeTurn = null;
+    clearTimingInterval();
   }
+  const duration = Number(record?.duration_ms);
+  if (line.el && record && Number.isFinite(duration)) {
+    line.el.classList.remove("live");
+    line.el.textContent = turnTimingText(records.indexOf(record) + 1, duration, { canceled: record.status === "canceled" });
+  }
+  updateInfoBar();
 }
 
 function updateFirstPeek() {
@@ -1538,7 +1611,7 @@ const streamHandlers = {
     clearTimingInterval();
     liveTurnTimingEl = null;
     turnDom.turnStarted({ ...data, promptBubble });
-    startLiveTurnTiming(data.started_at);
+    startLiveTurnTiming(data.started_at, data.turn_id || null);
   }),
   turn_completed: async (data) => {
     endTurnView("completed", null, { emptyAnswer: data.turn_summary?.empty_answer || null });
@@ -1563,7 +1636,7 @@ const streamHandlers = {
     try {
       await turnEndRead;
       if (!selected || !data.display) return;
-      const d = await getSession(selected, { tail: true });
+      const d = await getSession(selected, { tail: true, recent: true });
       if (Array.isArray(d.messages)) applyFinalMarkdown(d.messages);
     } catch (_) {
     } finally {
@@ -1620,7 +1693,9 @@ const streamHandlers = {
       updateInfoBar();
     }
     if (view.resync) await resync();
-    const queued = view.anytime && commandBubble(view.commandId);
+    // A card's action that isn't anytime (the step-limit question's
+    // /continue) has no bubble: nothing to remove.
+    const queued = view.anytime ? commandBubble(view.commandId) : null;
     if (view.hidden) queued?.remove();
     else if (queued) drawCommandBubble(queued, view);
     else addCommandBubble(view);
@@ -1700,11 +1775,13 @@ const streamHandlers = {
 
 async function refreshTimingFromSession() {
   if (!selected) return;
+  const id = selected;
+  const line = { el: liveTurnTimingEl, turnId: liveTurnId };
   try {
-    const data = await getSession(selected, { tail: true });
+    const data = await getSession(id, { tail: true, recent: true, turnId: line.turnId });
+    if (id !== selected) return;
     if (data.session?.status) current.status = data.session.status;
-    applyTiming(data.timing);
-    finishLiveTurnTiming(current.timing.turnRecords[current.timing.turnRecords.length - 1]);
+    if (await mergeTurnTiming(id, data.timing)) finishTurnLine(line);
   } catch (_) {}
 }
 
@@ -1745,6 +1822,13 @@ async function handleSendTurn() {
   // An image-only send's text is its placeholders: not for ↑.
   const typed = promptEl.value.trim() !== "";
   if (!selected) {
+    const local = startPageReply(prompt, { images: chips.length });
+    if (local) {
+      promptEl.value = "";
+      fitPrompt();
+      showNotice(local);
+      return;
+    }
     actionBtn.disabled = true;
     try {
       const s = await createIdleSession({ dir: scope.dir, model: chosenModel(), preview: prompt });
@@ -1758,8 +1842,18 @@ async function handleSendTurn() {
     }
   }
   // A session command by the session's list (the new one's too: select
-  // read it); an unknown /word is a prompt, as in a terminal.
+  // read it); an unknown /word is a prompt, as in a terminal — but a typo
+  // of a command (/modle) gets the hint, not a turn.
   if (!chips.length && sessionCommandLine(prompt, current.commands)) return handleSendCommand(prompt);
+  if (!chips.length) {
+    const typo = unknownCommandHint(prompt, current.commands);
+    if (typo) {
+      addCommandBubble({ label: null, line: prompt, text: typo });
+      promptEl.value = "";
+      fitPrompt();
+      return;
+    }
+  }
   const hint = historyEl.querySelector(".hint");
   if (hint) hint.remove();
   // Sending moves a finished turn out of the stage at once (else the echo
@@ -2190,17 +2284,20 @@ async function setArchived(id, archive, { undo = true } = {}) {
   showToast(`${what} ${short}`, undo ? { label: "Undo", run: () => setArchived(id, !archive, { undo: false }) } : null);
 }
 
+// sticky: stays until its action or its ✕ (else gone after 6 s).
 let toastTimer = null;
-function showToast(text, action = null) {
+function showToast(text, action = null, { sticky = false } = {}) {
   const el = $("#toast");
-  el.innerHTML = `<span>${escapeHtml(text)}</span>${action ? `<button type="button" class="toast-action">${escapeHtml(action.label)}</button>` : ""}`;
+  el.innerHTML = `<span>${escapeHtml(text)}</span>${action ? `<button type="button" class="toast-action">${escapeHtml(action.label)}</button>` : ""}` +
+    (sticky ? `<button type="button" class="toast-close" title="Dismiss" aria-label="Dismiss">✕</button>` : "");
   el.hidden = false;
   el.querySelector(".toast-action")?.addEventListener("click", () => {
     el.hidden = true;
     action.run();
   });
+  el.querySelector(".toast-close")?.addEventListener("click", () => { el.hidden = true; });
   clearTimeout(toastTimer);
-  toastTimer = setTimeout(() => { el.hidden = true; }, 6000);
+  if (!sticky) toastTimer = setTimeout(() => { el.hidden = true; }, 6000);
 }
 
 $("#includeArchived").addEventListener("change", () => {