@leftoff/cli 0.9.4 → 0.9.6

package/ui/app.js

@@ -4,6 +4,9 @@ import { goWithFeedback, goState, GIVE_UP_MS } from './go.js'
 import { icon } from './icons.js'
 import { selectHtml, comboHtml, closeMenu, openActionMenu, closeActionMenu, actionMenuKey, openNameSheet } from './picker.js'
 import { SETTINGS, settingsKeyFor } from './settings-nav.js'
+import { changedKeys } from './settings-dirty.js'
+import { looksMd, stripMd, plainCp } from './cp-text.js'
+import { beginWriting, settleWriting, reconcileWriting, dismissWriting, isWriting, writingText, WRITING_SYNC_MS, FRESH_MS } from './writing.js'
 import { inStatus, repoChips, applyFilter, readFilter, saveRepos, filterHash, toggleRepo, chipSelected, splitChips, repoMatches, orderSelectedFirst, searchMatches, saveProject, inProject, projectChips, projectLabel } from './repos.js'
 import { needsItems, needsStrip, needPanel, agentNeedPanel, httpsOnly, agentReplyButton, agentChipHtml, cardBadge, questionAnswer, turnsHtml, dismissedHtml } from './needs.js'
 import { SUMMARY_EXAMPLES, LENGTH_CHOICES } from './summary-examples.js'
@@ -11,7 +14,7 @@ import { mdInline, renderSection } from './changelog-md.js'
 import { cardPrsHtml, sessionPrsSection, prsPageHtml, prsBodyHtml, prRowHtml, prRows, readPrFilter, prsHash } from './prs.js'
 import { wantsSetupBanner, setupCandidate, localLeftoffAnswers, thisOneSuffix } from './viewer.js'
 import { defaultEmoji, PICKER_SET, isEmoji } from './machines.js'
-import { todosSection, sessionTodosSection, cardHandoffChips, sessionFilesSection, docViewerBody, docDownloadHref, docMenuItems, docFileName } from './handoffs.js'
+import { todosSection, sessionTodosSection, cardHandoffChips, sessionFilesSection, docViewerBody, docDownloadHref, docMenuItems, docFileName, renderDoc } from './handoffs.js'
 const $app = document.getElementById('app')
 const state = { sessions: [], health: null, cfg: null, route: null, machine: localStorage.getItem('cp.machine') || '', drafts: {}, pendingAsk: {}, mayAnswer: true, needOpen: {}, needTurns: {} }
 const multi = () => !!(state.health && state.health.machines && state.health.machines.length > 1)
@@ -128,14 +131,23 @@ function cpExtras(cp) {
 }
 
 // more: show the informative / long sections, folded (open: unfolded).
-function cpBlock(cp, { showWhen = true, more = false, open = false } = {}) {
+// md (0.9.5): the session page's full view renders a markdown checkpoint (a
+// model's write-up, ui/cp-text.js); everywhere else it's plain, a long one clamped.
+function cpBlock(cp, { showWhen = true, more = false, open = false, md = false } = {}) {
   if (!cp) return '<div class="nocp">No checkpoint yet. One appears when the session goes quiet, or press “Checkpoint now”.</div>'
   const you = /^YOU:/i.test(cp.next || '')
   const n = EXTRA_TITLES.filter(([k]) => (Array.isArray(cp[k]) ? cp[k].length : !!cp[k])).length
-  return '<dl class="cp">' +
-    '<dt>Doing</dt><dd>' + fmtCode(cp.doing) + '</dd>' +
-    '<dt>Stopped</dt><dd>' + fmtCode(cp.stoppedAt) + '</dd>' +
-    '<dt>Next</dt><dd class="next' + (you ? ' you' : '') + '">' + fmtCode(cp.next) + '</dd>' +
+  const dd = (t, cls = '') => {
+    if (md && looksMd(t)) return '<dd class="' + (cls ? cls + ' ' : '') + 'cp-md">' + renderDoc(t) + '</dd>'
+    const plainT = looksMd(t) ? stripMd(t) : String(t == null ? '' : t)
+    const long = (cp.format === 'markdown' || looksMd(t)) ? plainT.length > 160 : plainT.length > 600
+    const c = (cls + (!md && long ? ' clamp' : '')).trim()
+    return '<dd' + (c ? ' class="' + c + '"' : '') + '>' + fmtCode(plainT) + '</dd>'
+  }
+  return '<dl class="cp' + (cp.format === 'markdown' ? ' cp-salvaged' : '') + '">' +
+    '<dt>Doing</dt>' + dd(cp.doing) +
+    '<dt>Stopped</dt>' + dd(cp.stoppedAt) +
+    '<dt>Next</dt>' + dd(cp.next, 'next' + (you ? ' you' : '')) +
     (showWhen ? '<div class="when">' + esc(cp.trigger) + ' checkpoint · ' + esc(ago(cp.createdAt)) + (cp.generator && cp.generator.by ? ' · by ' + esc(cp.generator.by) : '') + '</div>' : '') +
     '</dl>' +
     (more && n ? '<details class="cp-more"' + (open ? ' open' : '') + '><summary>' + (cp.length === 'long' ? 'Recap, decisions, files' : 'Decisions, files, open questions') + ' <span class="faint">· ' + n + ' section' + (n === 1 ? '' : 's') + '</span></summary><div class="cpx">' + cpExtras(cp) + '</div></details>' : '')
@@ -465,6 +477,29 @@ function reachOf(s) {
 // The length "Checkpoint now" writes: yours from Settings → Summaries.
 function defaultLength() { const k = state.cfg && state.cfg.summary && state.cfg.summary.length; return LENGTH_CHOICES.some((o) => o.key === k) ? k : 'informative' }
 const lengthLabel = (k) => (LENGTH_CHOICES.find((o) => o.key === k) || LENGTH_CHOICES[1]).label
+// 0.9.5: "Checkpoint now" in flight stays on screen (ui/writing.js) until it lands
+// or fails; the checkpoint that lands gets a short highlight.
+state.writing = {}
+state.cpFresh = {}
+function writingFor(s) {
+  const w = reconcileWriting(state.writing, s)
+  if (w && w.landed) { state.cpFresh[w.landed] = Date.now(); return null }
+  return w
+}
+const isFresh = (cp) => !!(cp && state.cpFresh[cp.id] && Date.now() - state.cpFresh[cp.id] < FRESH_MS)
+function writingLine(s, w, cls = '') {
+  const busy = w.phase === 'writing' || w.phase === 'syncing'
+  return '<div class="cp-writing ' + w.phase + (cls ? ' ' + cls : '') + '" role="' + (w.phase === 'failed' ? 'alert' : 'status') + '" data-writing="' + esc(s.id) + '">' +
+    (busy ? '<span class="spin" aria-hidden="true"></span>' : w.phase === 'failed' ? icon('info') : icon('history')) +
+    '<span class="wtext">' + esc(writingText(w, lengthLabel)) + '</span>' +
+    (busy ? '' : '<button type="button" class="icon wx" data-action="writing-dismiss" data-id="' + esc(s.id) + '" aria-label="Dismiss" title="Dismiss">' + icon('x') + '</button>') + '</div>'
+}
+// The card's checkpoint area: the writing line above the old checkpoint (dimmed while it's written).
+function cpArea(s, block) {
+  const w = writingFor(s)
+  if (!w) return isFresh(s.latestCheckpoint) ? '<div class="cp-fresh">' + block + '</div>' : block
+  return writingLine(s, w) + (isWriting(state.writing, s.id) ? '<div class="cp-stale" aria-hidden="true">' + block + '</div>' : block)
+}
 // 0.9.4: one row, "Checkpoint now" at your length; its › opens Short /
 // Informative / Long, each with its line, your default ticked.
 function checkpointItems() {
@@ -505,6 +540,11 @@ const sessionMenuItems = (s) => { const r = reachOf(s); return r === 'local' ||
 // length; the chevron opens Short / Informative / Long (our menu, a sheet on a phone).
 function checkpointSplit(s) {
   const def = defaultLength()
+  if (isWriting(state.writing, s.id)) { // 0.9.5: busy until the checkpoint lands
+    return '<span class="split is-writing" role="group" aria-label="Checkpoint now" aria-busy="true">' +
+      '<button type="button" class="btn primary split-main" disabled aria-disabled="true" data-id="' + esc(s.id) + '"><span class="spin" aria-hidden="true"></span>Writing…</button>' +
+      '<button type="button" class="btn primary split-more" disabled aria-disabled="true" aria-label="Checkpoint length">' + icon('chevron-down') + '</button></span>'
+  }
   return '<span class="split" role="group" aria-label="Checkpoint now">' +
     '<button type="button" class="btn primary split-main" data-action="checkpoint" data-id="' + esc(s.id) + '" data-length="' + esc(def) + '" title="' + esc('Checkpoint now · ' + lengthLabel(def) + (s.isLocal ? '' : ' · written on ' + s.machine)) + '">Checkpoint now</button>' +
     '<button type="button" class="btn primary split-more" data-action="cp-lengths" data-id="' + esc(s.id) + '" aria-label="Checkpoint length" title="Choose the length" aria-haspopup="menu" aria-expanded="false">' + icon('chevron-down') + '</button></span>'
@@ -535,7 +575,7 @@ function card(s) {
     '</div>' + pill(s.status) + '</div>' +
     '<div class="meta">' + spaceChip(s) + where(s) + (ln ? '<span class="livenote ' + esc(s.live) + '">' + esc(ln) + '</span>' : '') + (endedNote ? '<span>' + esc(endedNote) + '</span>' : '') + '<span>·</span><span>' + esc(s.turns) + (s.turns === 1 ? ' turn' : ' turns') + (s.historyTurns ? ' · resumed (' + esc(s.historyTurns) + ' before)' : s.startSource === 'resume' && !s.turns ? ' · resumed' : s.empty && s.live !== 'closed' ? ' · no prompt yet' : '') + '</span>' +
       (s.needsInput && s.lastNotification && !s.needsYou ? '<span class="chip">' + esc(s.lastNotification.replace(/_/g, ' ')) + '</span>' : '') + '</div>' +
-    cardPrsHtml(s.prs) + listChips(s) + cardHandoffChips(s) + nb + cpBlock(s.latestCheckpoint) +
+    cardPrsHtml(s.prs) + listChips(s) + cardHandoffChips(s) + nb + cpArea(s, cpBlock(s.latestCheckpoint)) +
     '<a class="cplink" href="#/s/' + encodeURIComponent(s.id) + '">' + (s.checkpointCount ? s.checkpointCount + (s.checkpointCount === 1 ? ' checkpoint' : ' checkpoints') : 'Session history') + ' →</a>' +
     '<div class="actions-row">' + (goButton(s) || (s.status === 'ended' || s.live === 'closed' ? resumeButton(s, s.viewer || { local: state.viewerLocal !== false, ghostty: !!state.ghostty }) : '')) +
       copyResumeIcon(s) +
@@ -790,9 +830,10 @@ async function viewBoard() {
 // 0.8.6: search the board. The words live in the URL (?q=), typing keeps the
 // focus, and matches among closed sessions are one tap away.
 function boardSearch(q, closedHits, n) {
-  return '<div class="board-search-row"><div class="set-search board-search">' + icon('search') + '<input id="boardQ" type="search" placeholder="Find a session: title, repo, branch, folder or id" aria-label="Find a session" autocomplete="off" autocapitalize="off" spellcheck="false" value="' + esc(q) + '"></div>' +
+  return '<div class="board-search-row"><div class="set-search board-search">' + icon('search') + '<input id="boardQ" type="search" enterkeyhint="search" placeholder="Find a session, or anything said in one" aria-label="Find a session, or search what was said in sessions" autocomplete="off" autocapitalize="off" spellcheck="false" value="' + esc(q) + '"></div>' +
     (q ? '<div class="board-search-note">' + (n ? esc(n + (n === 1 ? ' match' : ' matches')) : 'No open or recent session matches.') +
-      (closedHits ? ' <button type="button" class="linkish" data-action="closed-search" data-q="' + esc(q) + '">' + esc(closedHits + ' closed ' + (closedHits === 1 ? 'match' : 'matches')) + ' →</button>' : '') + '</div>' : '') + '</div>'
+      (closedHits ? ' <button type="button" class="linkish" data-action="closed-search" data-q="' + esc(q) + '">' + esc(closedHits + ' closed ' + (closedHits === 1 ? 'match' : 'matches')) + ' →</button>' : '') +
+      ' <a class="linkish tx-board-link" href="#/search?q=' + encodeURIComponent(q) + '">' + icon('message-square') + 'Search what was said →</a></div>' : '') + '</div>'
 }
 // A repaint from a live update (or the 30 s refresh) while you type in the
 // search box keeps the box focused, with what you typed and the caret.
@@ -822,7 +863,11 @@ function boardSearchWire() {
       if (again) { again.focus(); try { again.setSelectionRange(pos, pos) } catch {} }
     }, 160)
   })
-  q.addEventListener('keydown', (ev) => { if (ev.key === 'Escape' && q.value) { ev.preventDefault(); q.value = ''; q.dispatchEvent(new Event('input')) } })
+  q.addEventListener('keydown', (ev) => {
+    if (ev.key === 'Escape' && q.value) { ev.preventDefault(); q.value = ''; q.dispatchEvent(new Event('input')) }
+    // 0.9.6: Enter (Search on the phone's keyboard) opens the full results, transcripts included
+    else if (ev.key === 'Enter' && q.value.trim() && !ev.isComposing) { ev.preventDefault(); clearTimeout(boardQTimer); location.hash = '#/search?q=' + encodeURIComponent(q.value.trim()) }
+  })
 }
 
 // Closed (0.6.7): every ended session on every machine, newest first, with
@@ -952,7 +997,7 @@ function parkedCard(s, viewer) {
   const p = s.parked || {}
   const open = s.status !== 'ended' && s.live !== 'closed'
   const cp = s.latestCheckpoint
-  const note = p.note || (cp && cp.next) || ''
+  const note = p.note || (cp && plainCp(cp.next)) || ''
   const main = open ? goButton(s) : resumeButton(s, viewer)
   return '<article class="card is-parked parked-card" data-id="' + esc(s.id) + '" data-href="' + esc(href) + '">' +
     '<div class="row1"><div class="title"><a href="' + href + '">' + esc(s.title || 'Untitled session') + '</a></div><span class="pill s-parked">parked</span></div>' +
@@ -1206,8 +1251,12 @@ async function viewSession(id) {
   html += '<section class="slists" id="lists">' + sessionListsSection(s) + '</section>'
   html += '<h2>Checkpoints <span class="count">' + s.checkpointCount + '</span></h2>'
   const newestCp = s.checkpoints.filter((cp) => !cp.doubt).reduce((a, b) => (!a || String(b.createdAt) > String(a.createdAt) ? b : a), null)
-  if (!s.checkpoints.length) html += '<div class="empty">No checkpoints yet.</div>'
-  else html += '<div class="timeline">' + cpTimeline(s.checkpoints.filter((cp) => !cp.doubt), newestCp) + '</div>'
+  // 0.9.5: the one being written, at the top of the list until it lands
+  const wr = writingFor(s)
+  const wrRow = wr ? '<div class="tl-item tl-writing">' + writingLine(s, wr, 'tl') + '</div>' : ''
+  const live = s.checkpoints.filter((cp) => !cp.doubt)
+  if (!live.length && !wrRow) html += '<div class="empty">No checkpoints yet.</div>'
+  else html += '<div class="timeline">' + wrRow + cpTimeline(live, newestCp) + '</div>'
   // 0.9.0: checkpoints written while Leftoff had another session's branch for this one: kept, folded away
   const doubted = s.checkpoints.filter((cp) => cp.doubt && cp.doubt !== 'empty')
   if (doubted.length) html += '<details class="tl-doubt"><summary>' + doubted.length + ' checkpoint' + (doubted.length === 1 ? '' : 's') + ' set aside: written with another session’s branch</summary><div class="timeline">' + cpTimeline(doubted, null) + '</div></details>'
@@ -1215,12 +1264,98 @@ async function viewSession(id) {
   if (empties.length) html += '<details class="tl-doubt"><summary>' + empties.length + ' empty checkpoint' + (empties.length === 1 ? '' : 's') + ' set aside: no messages were found when ' + (empties.length === 1 ? 'it was' : 'they were') + ' written</summary><div class="timeline">' + cpTimeline(empties, null) + '</div></details>'
   html += answeredList(s)
   $app.innerHTML = html
+  aroundWire(s.id)
+}
+// ------------------------------------------------------------ search inside transcripts (0.9.6)
+
+// Plain text + [start, end] ranges -> escaped HTML with <mark>s (ranges that
+// overlap, run backwards or past the end are skipped).
+function markedHtml(text, marks) {
+  const t = String(text || '')
+  let h = '', at = 0
+  for (const m of Array.isArray(marks) ? marks : []) {
+    const a = Number(m && m[0]), b = Number(m && m[1])
+    if (!(Number.isInteger(a) && Number.isInteger(b) && a >= at && b > a && b <= t.length)) continue
+    h += esc(t.slice(at, a)) + '<mark>' + esc(t.slice(a, b)) + '</mark>'
+    at = b
+  }
+  return h + esc(t.slice(at))
+}
+const txHref = (h, q) => '#/s/' + encodeURIComponent(h.sessionId) + (h.anchor != null ? '?hit=' + encodeURIComponent(h.anchor) + '&q=' + encodeURIComponent(q) : '')
+const txWho = (h) => h.role === 'assistant' ? 'Claude' : 'You'
+function txSub(h) {
+  return [h.project && h.project.name ? projectLabel(h.project) : h.repoLabel, multi() || (h.machine && state.health && h.machine !== state.health.machine) ? h.machine : '', h.at ? ago(h.at) : '', h.hits > 1 ? h.hits + ' matches' : ''].filter(Boolean).join(' · ')
+}
+const nfmt = (n) => Number(n || 0).toLocaleString()
+// "Still indexing (n of m)", other Macs that weren't searched, or null.
+function txNotes(r) {
+  const out = []
+  const me = (r.machines || []).find((m) => m.self) || {}
+  if (me.status === 'indexing') out.push('Still indexing transcripts' + (me.total ? ' (' + nfmt(me.done) + ' of ' + nfmt(me.total) + ')' : '') + '. Results so far.')
+  if (me.status === 'off') out.push('Transcript search is off on this Mac.')
+  for (const m of r.machines || []) {
+    if (m.self) continue
+    if (m.status === 'indexing') out.push(m.machine + ' is still indexing' + (m.total ? ' (' + nfmt(m.done) + ' of ' + nfmt(m.total) + ')' : '') + '.')
+    else if (m.status === 'unreachable') out.push(m.machine + ' wasn’t searched (not reachable right now).')
+    else if (m.status === 'needs_update') out.push(m.machine + ' wasn’t searched (it needs Leftoff 0.9.6).')
+  }
+  return out
+}
+// One hit as a result row (search page, board).
+function txHitHtml(h, q) {
+  return '<a class="tx-hit" href="' + esc(txHref(h, q)) + '">' +
+    '<span class="tx-title">' + esc(h.title || 'Untitled') + (h.endedAt ? '<span class="tx-tag">closed</span>' : '') + '</span>' +
+    '<span class="tx-sub">' + esc(txSub(h)) + '</span>' +
+    '<span class="tx-snip"><span class="tx-who ' + (h.role === 'assistant' ? 'a' : 'u') + '">' + esc(txWho(h)) + '</span> ' + markedHtml(h.snippet, h.marks) + '</span></a>'
+}
+function txSectionHtml(r, q, { more = null } = {}) {
+  if (!r) return '<h2 class="tx-h">In transcripts</h2><div class="tx-note">Searching transcripts…</div>'
+  const notes = txNotes(r)
+  let h = '<h2 class="tx-h">In transcripts' + (r.results.length ? ' <span class="tx-count">' + esc(r.results.length + (r.results.length === 1 ? ' session' : ' sessions')) + '</span>' : '') + '</h2>'
+  const idx = notes.find((n) => /^Still indexing/.test(n))
+  if (idx) h += '<div class="tx-note tx-indexing" role="status"><span class="spin" aria-hidden="true"></span>' + esc(idx) + '</div>'
+  if (r.results.length) h += '<div class="tx-list">' + r.results.map((x) => txHitHtml(x, q)).join('') + '</div>'
+  else if (!notes.some((n) => /^Still indexing/.test(n))) h += '<div class="tx-note tx-empty">Nothing you or Claude said matches “' + esc(q) + '”.</div>'
+  for (const n of notes) if (n !== idx) h += '<div class="tx-note">' + esc(n) + '</div>'
+  if (more) h += '<div class="tx-more"><a href="' + esc(more) + '">All results for “' + esc(q) + '” →</a></div>'
+  return h
+}
+const txQuery = (q, limit) => api('GET', '/v1/search?in=transcripts&limit=' + limit + '&q=' + encodeURIComponent(q))
+
+// The session page opened from a transcript hit: the message and the turns
+// around it, at the top, scrolled to.
+const aroundCache = new Map()
+async function aroundWire(id) {
+  const r = state.route
+  if (!r || r.name !== 's' || !r.params || r.params.get('hit') == null) return
+  const anchor = r.params.get('hit'), q = r.params.get('q') || ''
+  const key = id + '|' + anchor + '|' + q
+  const head = document.querySelector('#app .pagehead')
+  if (!head) return
+  let box = document.getElementById('txAround')
+  if (!box) { box = document.createElement('section'); box.id = 'txAround'; box.className = 'tx-around'; box.setAttribute('aria-label', 'Found in the transcript'); head.after(box) }
+  const first = !aroundCache.has(key)
+  let d = aroundCache.get(key)
+  if (!d) {
+    box.innerHTML = '<div class="tx-around-head">Found in the transcript</div><div class="tx-note">Loading…</div>'
+    try { d = await api('GET', '/v1/sessions/' + encodeURIComponent(id) + '/around?anchor=' + encodeURIComponent(anchor) + '&q=' + encodeURIComponent(q)) } catch (e) { d = { error: e.message, messages: [] } }
+    aroundCache.set(key, d)
+    if (!document.getElementById('txAround')) return
+  }
+  const close = '<a class="icon x tx-close" href="#/s/' + encodeURIComponent(id) + '" aria-label="Close" title="Close">×</a>'
+  if (!d.messages || !d.messages.length) { box.innerHTML = '<div class="tx-around-head">Found in the transcript' + close + '</div><div class="tx-note">' + esc(d.error ? 'Couldn’t read that part of the transcript: ' + d.error : 'That message isn’t in the index any more (the transcript changed).') + '</div>'; return }
+  box.innerHTML = '<div class="tx-around-head">Found in the transcript' + (q ? ' · “' + esc(q) + '”' : '') + close + '</div>' +
+    d.messages.map((m) => '<div class="tx-msg ' + (m.role === 'assistant' ? 'a' : 'u') + (m.hit ? ' hit' : '') + '"' + (m.hit ? ' id="txHit" tabindex="-1"' : '') + '><div class="tx-msg-head"><span class="tx-who ' + (m.role === 'assistant' ? 'a' : 'u') + '">' + (m.role === 'assistant' ? 'Claude' : 'You') + '</span>' + (m.at ? '<span class="t" title="' + esc(clock(m.at)) + '">' + esc(ago(m.at)) + '</span>' : '') + '</div><div class="tx-msg-text">' + markedHtml(m.text, m.marks) + '</div></div>').join('')
+  if (first) {
+    const hit = document.getElementById('txHit')
+    if (hit) { hit.scrollIntoView({ block: 'center' }); const mk = hit.querySelector('mark'); if (mk && hit.scrollHeight > hit.clientHeight) mk.scrollIntoView({ block: 'center' }) }
+  }
 }
 function cpTimeline(list, newestCp) {
   return list.map((cp) =>
-    '<div class="tl-item ' + esc(cp.trigger) + '"><div class="tl-head"><span class="t">' + esc(clock(cp.createdAt)) + '</span><span class="trig">' + esc(cp.trigger) + '</span><span>' + esc(ago(cp.createdAt)) + '</span>' +
+    '<div class="tl-item ' + esc(cp.trigger) + (isFresh(cp) ? ' cp-fresh' : '') + '"><div class="tl-head"><span class="t">' + esc(clock(cp.createdAt)) + '</span><span class="trig">' + esc(cp.trigger) + '</span><span>' + esc(ago(cp.createdAt)) + '</span>' +
     (cp.generator && cp.generator.by ? '<span>· ' + esc(cp.generator.by) + (cp.generator.model ? ' / ' + esc(cp.generator.model) : '') + (cp.generator.backend === 'ollama' ? ' · Ollama' : '') + '</span>' : '') + '</div>' +
-    cpBlock(cp, { showWhen: false, more: true, open: cp === newestCp }) +
+    cpBlock(cp, { showWhen: false, more: true, open: cp === newestCp, md: true }) +
     (cp.userNote ? '<div class="note">✎ ' + esc(cp.userNote) + '</div>' : '') +
     (cp.filesTouched && cp.filesTouched.length ? '<div class="files">' + cp.filesTouched.map((f) => '<span class="chip mono">' + esc(f) + '</span>').join('') + '</div>' : '') +
     '</div>').join('')
@@ -1765,8 +1900,12 @@ function onPull(v) {
   const was = state.pulls[v.tag]
   state.pulls[v.tag] = v
   if (state.route && state.route.name === 'settings') {
-    if (v.done && (!was || !was.done) && v.use) { const m = document.getElementById('f-model'); if (m) m.value = v.tag; const sel = document.getElementById('f-mode'); if (sel) sel.value = 'ollama' }
-    paintModels()
+    if (v.done && (!was || !was.done) && v.use) {
+      const m = document.getElementById('f-model'); if (m) m.value = v.tag; const sel = document.getElementById('f-mode'); if (sel) sel.value = 'ollama'
+      // the daemon switched the summarizer itself: that's saved, not a change to save (0.9.5)
+      if (saveUi.base) { saveUi.base.provider = 'ollama'; saveUi.base.model = v.tag; saveUi.base.baseUrl = settingsValues().baseUrl }
+    }
+    paintModels(); paintSave()
   }
   if (v.done && (!was || !was.done)) toast(v.use ? 'Downloaded ' + v.tag + '. Checkpoints now summarize with it.' : 'Downloaded ' + v.tag, 6000)
   if (v.error && (!was || !was.error)) toast('Couldn’t download ' + v.tag + ': ' + v.error, 10000)
@@ -1804,7 +1943,7 @@ async function tryLength() {
   try {
     const cp = await api('POST', '/v1/checkpoints/preview', { sessionId: s.id, length: k })
     box.innerHTML = '<div class="ex-head">Your session · ' + esc(s.title || 'Untitled') + ' <span class="faint">' + esc(k) + (cp.generator && cp.generator.by ? ' · by ' + esc(cp.generator.by) + (cp.generator.model ? ' / ' + esc(cp.generator.model) : '') + (cp.generator.backend === 'ollama' ? ' · Ollama' : '') : '') + ' · not saved</span></div>' +
-      cpBlock(cp, { showWhen: false }) + (hasExtras(cp) ? '<div class="cpx">' + cpExtras(cp) + '</div>' : '')
+      cpBlock(cp, { showWhen: false, md: true }) + (hasExtras(cp) ? '<div class="cpx">' + cpExtras(cp) + '</div>' : '')
   } catch (e) { box.innerHTML = lengthExample(k); toast('Couldn’t write it: ' + e.message) }
 }
 
@@ -2164,6 +2303,63 @@ function phonePane(relay, remote, unavailable) {
   return any + advanced('phone', adv.join('') + '<div class="section">Over Tailscale</div>' + ts)
 }
 
+// Settings → Save (0.9.5): Save is on only while the form differs from what was
+// last saved (ui/settings-dirty.js), so a missed "Saved" toast can't leave you
+// guessing. The values are exactly what Save sends.
+const saveUi = { base: null, saving: false, timer: null }
+function settingsValues() {
+  const $ = (id) => document.getElementById(id)
+  const val = (id) => { const el = $(id); return el && el.value != null ? String(el.value) : '' }
+  const on = (id) => { const el = $(id); return !!(el && el.checked) }
+  const prov = val('f-mode') || 'auto'
+  const f = PROVIDER_FIELDS[prov] || PROVIDER_FIELDS.auto
+  const ra = $('f-remote-answers')
+  return {
+    provider: prov,
+    model: (f.model && (val('f-model-other').trim() || val('f-model').trim())) || 'haiku',
+    baseUrl: (f.base && val('f-base').trim()) || null,
+    key: f.key ? val('f-key').trim() : '',
+    dormantAfterMin: Number(val('f-dormant')),
+    minGapMin: Number(val('f-gap')),
+    digest: {
+      time: val('f-time') || null,
+      days: [...document.querySelectorAll('.days .day[aria-pressed="true"]')].map((b) => b.dataset.day),
+      skipEmpty: on('f-skip'),
+      timeZone: val('f-tz') || null,
+    },
+    length: ((document.querySelector('input[name="f-length"]:checked') || {}).value) || 'informative',
+    updates: on('f-updates'),
+    notify: on('f-notify'),
+    remoteAnswers: ra && !ra.disabled ? ra.checked : null,
+  }
+}
+const settingsChanged = () => saveUi.base && document.getElementById('settingsForm') ? changedKeys(saveUi.base, settingsValues()) : []
+// Where each value lives, to name the sections with unsaved changes.
+const SAVE_FIELD = { provider: 'f-mode', model: 'f-model', baseUrl: 'f-base', key: 'f-key', dormantAfterMin: 'f-dormant', minGapMin: 'f-gap', digest: 'f-time', length: 'f-length-example', updates: 'f-updates', notify: 'f-notify', remoteAnswers: 'f-remote-answers' }
+function paintSave() {
+  const box = document.getElementById('setSave')
+  const btn = box && box.querySelector('button[type=submit]')
+  if (!btn) return
+  const keys = settingsChanged()
+  const dirty = keys.length > 0
+  btn.disabled = !dirty || saveUi.saving
+  btn.setAttribute('aria-disabled', String(btn.disabled))
+  btn.title = dirty ? '' : 'Nothing to save'
+  box.classList.toggle('dirty', dirty)
+  const note = document.getElementById('setSaveNote')
+  if (!note) return
+  const secs = []
+  for (const k of keys) {
+    const el = document.getElementById(SAVE_FIELD[k] || '')
+    const pane = el && el.closest('.set-pane')
+    const sec = pane && SETTINGS.find((x) => x.key === pane.dataset.sec)
+    if (sec && !secs.includes(sec.label)) secs.push(sec.label)
+  }
+  note.textContent = saveUi.saving ? 'Saving…' : dirty ? 'Unsaved changes' + (secs.length ? ' in ' + secs.join(', ') : '') : 'Everything’s saved'
+}
+// After the click/key that changed something has done its work (a model card, a day button).
+function queueSave() { clearTimeout(saveUi.timer); saveUi.timer = setTimeout(paintSave, 0) }
+
 async function viewSettings() {
   const [c, , remote, sync, peers, st, , , relay, gh] = await Promise.all([api('GET', '/v1/config'), spacesLoad(), api('GET', '/v1/remote').catch(() => null), api('GET', '/v1/sync').catch(() => null), api('GET', '/v1/peers').catch(() => null), api('GET', '/v1/syncthing').catch(() => null), refreshHealth().catch(() => null), agentsLoad(), api('GET', '/v1/relay').catch(() => null), api('GET', '/v1/gh').catch(() => null)])
   state.relay = relay
@@ -2224,7 +2420,7 @@ async function viewSettings() {
     '<div class="set-main"><div class="set-head"><a class="set-back" href="#/settings">' + icon('chevron-left') + 'Settings</a><h2 id="setTitle"></h2><div class="sub" id="setSub"></div></div>' +
       '<form class="form" id="settingsForm" autocomplete="off">' +
       SETTINGS.map((x) => '<section class="set-pane" data-sec="' + x.key + '" aria-label="' + esc(x.label) + '" hidden>' + panes[x.key] + '</section>').join('') +
-      '<div class="full set-save" id="setSave"><span class="faint">Saves every section to config.json in your Leftoff folder.</span><button class="btn primary" type="submit">' + icon('check') + 'Save</button></div></form></div></div>'
+      '<div class="full set-save" id="setSave"><span class="faint" id="setSaveNote">Saves every section to config.json in your Leftoff folder.</span><button class="btn primary" type="submit" disabled aria-disabled="true">' + icon('check') + 'Save</button></div></form></div></div>'
   showSettingsSection(r)
   paintSettingsDots()
   syncProviderFields()
@@ -2254,6 +2450,10 @@ async function viewSettings() {
     if (ev.key === 'Escape' && f.value) { ev.preventDefault(); f.value = ''; settingsUi.q = ''; settingsFilter() }
     if (ev.key === 'Enter') { ev.preventDefault(); const k = settingsFilter(); if (k) location.hash = '#/settings/' + k }
   })
+  // 0.9.5: what's on screen now is what's saved; Save comes on with the first change.
+  saveUi.base = settingsValues(); saveUi.saving = false; paintSave()
+  const form = document.getElementById('settingsForm')
+  for (const t of ['input', 'change', 'click', 'keyup']) form.addEventListener(t, queueSave)
 }
 
 // ------------------------------------------------------------ sync and other machines (v0.5.2)
@@ -2778,12 +2978,36 @@ async function stAction(action, btn) {
 }
 
 async function viewSearch(q) {
-  const r = await api('GET', '/v1/search?q=' + encodeURIComponent(q))
-  let html = '<div class="pagehead"><div><h1>Search</h1><div class="sub">“' + esc(q) + '” · ' + r.sessions.length + ' sessions, ' + r.checkpoints.length + ' checkpoints</div></div></div>'
-  if (r.sessions.length) html += '<h2>Sessions</h2><div class="grid">' + r.sessions.map(card).join('') + '</div>'
-  if (r.checkpoints.length) html += '<h2>Checkpoints</h2><div class="timeline">' + r.checkpoints.map((cp) => '<div class="tl-item ' + esc(cp.trigger) + '"><div class="tl-head"><span class="t">' + esc(clock(cp.createdAt)) + '</span><a class="tl-title" href="#/s/' + encodeURIComponent(cp.sessionId) + '">' + esc(cp.sessionTitle || 'Untitled') + '</a></div>' + cpBlock(cp, { showWhen: false }) + '</div>').join('') + '</div>'
-  if (!r.sessions.length && !r.checkpoints.length) html += '<div class="empty mt">Nothing matched.</div>'
-  $app.innerHTML = html
+  const form = '<form class="search-page-form" id="searchPageForm" role="search"><div class="set-search">' + icon('search') + '<input id="searchPageQ" type="search" enterkeyhint="search" placeholder="Search sessions and what was said in them" aria-label="Search" autocomplete="off" autocapitalize="off" spellcheck="false" value="' + esc(q) + '"></div><button class="btn primary" type="submit">Search</button></form>'
+  if (!q.trim()) { $app.innerHTML = '<div class="pagehead"><div><h1>Search</h1><div class="sub">Titles, checkpoints, and everything you and Claude said.</div></div></div>' + form; return searchPageWire() }
+  const seq = (viewSearch.seq = (viewSearch.seq || 0) + 1)
+  const [r, tx] = await Promise.all([api('GET', '/v1/search?q=' + encodeURIComponent(q)), txQuery(q, 30).catch(() => null)])
+  if (seq !== viewSearch.seq) return
+  const paint = (tx) => {
+    let html = '<div class="pagehead"><div><h1>Search</h1><div class="sub">“' + esc(q) + '” · ' + r.sessions.length + (r.sessions.length === 1 ? ' session, ' : ' sessions, ') + r.checkpoints.length + (r.checkpoints.length === 1 ? ' checkpoint' : ' checkpoints') + (tx ? ', ' + tx.results.length + ' in transcripts' : '') + '</div></div></div>' + form
+    if (r.sessions.length) html += '<h2>Sessions</h2><div class="grid">' + r.sessions.map(card).join('') + '</div>'
+    html += '<section class="tx-section">' + txSectionHtml(tx || { results: [], machines: [] }, q) + '</section>'
+    if (r.checkpoints.length) html += '<h2>Checkpoints</h2><div class="timeline">' + r.checkpoints.map((cp) => '<div class="tl-item ' + esc(cp.trigger) + '"><div class="tl-head"><span class="t">' + esc(clock(cp.createdAt)) + '</span><a class="tl-title" href="#/s/' + encodeURIComponent(cp.sessionId) + '">' + esc(cp.sessionTitle || 'Untitled') + '</a></div>' + cpBlock(cp, { showWhen: false }) + '</div>').join('') + '</div>'
+    if (!r.sessions.length && !r.checkpoints.length && tx && !tx.results.length && !txNotes(tx).length) html += '<div class="empty mt">Nothing matched.</div>'
+    $app.innerHTML = html
+    searchPageWire()
+  }
+  paint(tx)
+  // still indexing: look again in a moment (results fill in as the index grows)
+  if (tx && (tx.machines || []).some((m) => m.status === 'indexing')) setTimeout(async () => {
+    if (seq !== viewSearch.seq || !state.route || state.route.name !== 'search' || document.activeElement === document.getElementById('searchPageQ')) return
+    const again = await txQuery(q, 30).catch(() => null)
+    if (again && seq === viewSearch.seq && state.route.name === 'search') { paint(again); if ((again.machines || []).some((m) => m.status === 'indexing')) setTimeout(() => { if (seq === viewSearch.seq && state.route.name === 'search') render() }, 3000) }
+  }, 2500)
+}
+function searchPageWire() {
+  const f = document.getElementById('searchPageForm')
+  if (!f) return
+  f.addEventListener('submit', (e) => {
+    e.preventDefault()
+    const v = document.getElementById('searchPageQ').value.trim()
+    location.hash = '#/search' + (v ? '?q=' + encodeURIComponent(v) : '')
+  })
 }
 
 // ------------------------------------------------------------ lists (v0.5.1)
@@ -3169,7 +3393,22 @@ function searchGroups(q, r) {
     if ((r.lists || []).length) groups.push(['Lists', r.lists.slice(0, 4).map((l) => ({ href: listHref(l.ref), title: l.name, sub: [l.repo, l.progress].filter(Boolean).join(' · '), icon: 'list-checks' }))])
     if ((r.todos || []).length) groups.push(['To-dos', r.todos.slice(0, 4).map((t) => ({ href: t.sessionId ? '#/s/' + encodeURIComponent(t.sessionId) : '#/waiting', title: t.text, sub: t.sessionTitle || '', icon: 'circle-check' }))])
     if ((r.files || []).length) groups.push(['Files', r.files.slice(0, 5).map((f) => ({ href: '#/s/' + encodeURIComponent(f.sessionId), title: f.name, sub: f.sessionTitle || '', icon: 'file-text' }))])
-    if (r.checkpoints.length) groups.push(['Checkpoints', r.checkpoints.slice(0, 4).map((cp) => ({ href: '#/s/' + encodeURIComponent(cp.sessionId), title: cp.doing || cp.next || 'Checkpoint', sub: [cp.sessionTitle || 'Untitled', cp.createdAt ? clock(cp.createdAt) : ''].filter(Boolean).join(' · '), icon: 'check' }))])
+    if (r.checkpoints.length) groups.push(['Checkpoints', r.checkpoints.slice(0, 4).map((cp) => ({ href: '#/s/' + encodeURIComponent(cp.sessionId), title: plainCp(cp.doing || cp.next) || 'Checkpoint', sub: [cp.sessionTitle || 'Untitled', cp.createdAt ? clock(cp.createdAt) : ''].filter(Boolean).join(' · '), icon: 'check' }))])
+  }
+  // 0.9.6: what was said in sessions, below the rest of the results
+  if (low && low.length >= 2) {
+    const tx = searchUi.tx && searchUi.tx.q === q ? searchUi.tx.r : null
+    if (!tx) groups.push(['In transcripts', [], '<span class="spin" aria-hidden="true"></span>Searching transcripts…'])
+    else {
+      const notes = txNotes(tx)
+      const items = tx.results.slice(0, 6).map((h) => ({ href: txHref(h, q), title: h.title || 'Untitled', sub: txSub(h), snip: h, icon: 'message-square' }))
+      const indexing = notes.find((n) => /^Still indexing/.test(n))
+      // "still indexing" leads the section (what's below is partial); the rest follows the rows
+      const lead = indexing ? '<span class="spin" aria-hidden="true"></span>' + esc(indexing) : ''
+      const note = (!items.length && !indexing ? 'Nothing you or Claude said matches “' + esc(q) + '”.' : '') +
+        notes.filter((n) => n !== indexing).map((n) => '<span class="tx-note-line">' + esc(n) + '</span>').join('')
+      if (items.length || note || lead) groups.push(['In transcripts', items, note, lead])
+    }
   }
   if (acts.length) groups.push(['Actions', acts.slice(0, low ? 4 : 5)])
   if (sets.length) groups.push(['Settings', sets.slice(0, 5)])
@@ -3203,14 +3442,20 @@ function paintSearch() {
   searchUi.items = []
   let h = ''
   if (q) { searchUi.items.push({ href: '#/search?q=' + encodeURIComponent(q), title: 'All results for “' + q + '”', icon: 'search' }) }
-  for (const [name, items] of groups) { h += '<div class="cmdk-group" role="presentation">' + esc(name) + '</div>'; for (const it of items) { searchUi.items.push(it); h += optHtml(it, searchUi.items.length - 1) } }
-  if (q) h = optHtml(searchUi.items[0], 0) + h
+  const tx = searchUi.tx && searchUi.tx.q === q ? searchUi.tx.r : null
   if (q && q.length >= 2 && !r) h += '<div class="cmdk-note">Searching…</div>'
-  else if (q && r && !r.sessions.length && !r.checkpoints.length && !(r.projects || []).length && !(r.prs || []).length && !(r.files || []).length && !(r.lists || []).length && !(r.todos || []).length) h += '<div class="cmdk-note">Nothing matches “' + esc(q) + '”.</div>'
+  else if (q && r && !r.sessions.length && !r.checkpoints.length && !(r.projects || []).length && !(r.prs || []).length && !(r.files || []).length && !(r.lists || []).length && !(r.todos || []).length && !(tx && tx.results.length)) h += '<div class="cmdk-note">Nothing matches “' + esc(q) + '”' + (tx ? '' : ' by name') + '.</div>'
+  for (const [name, items, note, lead] of groups) {
+    h += '<div class="cmdk-group' + (name === 'In transcripts' ? ' tx-group' : '') + '" role="presentation">' + esc(name) + '</div>'
+    if (lead) h += '<div class="cmdk-note tx-note tx-lead">' + lead + '</div>'
+    for (const it of items) { searchUi.items.push(it); h += optHtml(it, searchUi.items.length - 1) }
+    if (note) h += '<div class="cmdk-note tx-note">' + note + '</div>'
+  }
+  if (q) h = optHtml(searchUi.items[0], 0) + h
   list.innerHTML = h
   // 0.9.0: Enter opens the best match (the first result); ↑ reaches "All results for …"
   setSearchActive(q && searchUi.items.length > 1 ? 1 : searchUi.items.length ? 0 : -1)
-  function optHtml(it, i) { return '<a class="cmdk-opt" role="option" id="cmdk-o' + i + '" data-i="' + i + '" href="' + esc(it.href || '#') + '"' + (it.ext ? ' target="_blank" rel="noopener"' : '') + (it.action ? ' data-palette-action="' + esc(it.action) + '"' : '') + ' aria-selected="false">' + icon(it.icon || 'search') + '<span class="co-text"><span class="co-title">' + esc(it.title) + '</span>' + (it.sub ? '<span class="co-sub">' + esc(it.sub) + '</span>' : '') + '</span></a>' }
+  function optHtml(it, i) { return '<a class="cmdk-opt' + (it.snip ? ' tx-opt' : '') + '" role="option" id="cmdk-o' + i + '" data-i="' + i + '" href="' + esc(it.href || '#') + '"' + (it.ext ? ' target="_blank" rel="noopener"' : '') + (it.action ? ' data-palette-action="' + esc(it.action) + '"' : '') + ' aria-selected="false">' + icon(it.icon || 'search') + '<span class="co-text"><span class="co-title">' + esc(it.title) + '</span>' + (it.sub ? '<span class="co-sub">' + esc(it.sub) + '</span>' : '') + (it.snip ? '<span class="co-snip"><span class="tx-who ' + (it.snip.role === 'assistant' ? 'a' : 'u') + '">' + esc(txWho(it.snip)) + '</span> ' + markedHtml(it.snip.snippet, it.snip.marks) + '</span>' : '') + '</span></a>' }
 }
 function setSearchActive(i) {
   searchUi.active = i
@@ -3224,17 +3469,39 @@ async function runSearch() {
   if (q.length < 2) { paintSearch(); return }
   paintSearch()
   try {
+    // 0.9.6: transcripts in parallel; names and checkpoints paint first
+    const txp = txQuery(q, 6).then((tr) => { if (seq === searchUi.seq) { searchUi.tx = { q, r: tr }; if (searchIsOpen()) paintSearchKeeping() } }, () => { if (seq === searchUi.seq) { searchUi.tx = { q, r: { results: [], machines: [] } }; if (searchIsOpen()) paintSearchKeeping() } })
     const r = await api('GET', '/v1/search?light=1&limit=20&q=' + encodeURIComponent(q))
     if (seq !== searchUi.seq) return
     searchUi.last = { q, r }
+    if (searchIsOpen()) paintSearchKeeping()
+    await txp
+    // still indexing: ask again while the palette stays open on the same words
+    const tx = searchUi.tx && searchUi.tx.q === q ? searchUi.tx.r : null
+    if (tx && (tx.machines || []).some((m) => m.status === 'indexing')) setTimeout(() => { if (seq === searchUi.seq && searchIsOpen()) runSearchAgain(q, seq) }, 2500)
+    return
   } catch { if (seq === searchUi.seq) searchUi.last = { q, r: { sessions: [], checkpoints: [], prs: [], projects: [], lists: [], todos: [], files: [] } } }
   if (searchIsOpen()) paintSearch()
 }
+async function runSearchAgain(q, seq) {
+  try { const tr = await txQuery(q, 6); if (seq !== searchUi.seq) return; searchUi.tx = { q, r: tr }; if (searchIsOpen()) paintSearchKeeping() } catch { return }
+  const tx = searchUi.tx.r
+  if ((tx.machines || []).some((m) => m.status === 'indexing')) setTimeout(() => { if (seq === searchUi.seq && searchIsOpen()) runSearchAgain(q, seq) }, 2500)
+}
+// A repaint when results arrive keeps the row you had moved to (by its link).
+function paintSearchKeeping() {
+  const was = searchUi.items[searchUi.active]
+  const moved = searchUi.moved
+  paintSearch()
+  if (!moved || !was) return
+  const i = searchUi.items.findIndex((it) => it.href === was.href && it.title === was.title)
+  if (i >= 0) setSearchActive(i)
+}
 document.getElementById('searchBtn').addEventListener('click', () => openSearch())
-document.getElementById('q').addEventListener('input', () => { clearTimeout(searchUi.timer); paintSearch(); searchUi.timer = setTimeout(runSearch, 160) })
+document.getElementById('q').addEventListener('input', () => { clearTimeout(searchUi.timer); searchUi.moved = false; paintSearch(); searchUi.timer = setTimeout(runSearch, 160) })
 document.getElementById('q').addEventListener('keydown', (e) => {
   const n = searchUi.items.length
-  if (e.key === 'ArrowDown' || e.key === 'ArrowUp') { e.preventDefault(); if (n) setSearchActive((searchUi.active + (e.key === 'ArrowDown' ? 1 : -1) + n) % n) }
+  if (e.key === 'ArrowDown' || e.key === 'ArrowUp') { e.preventDefault(); searchUi.moved = true; if (n) setSearchActive((searchUi.active + (e.key === 'ArrowDown' ? 1 : -1) + n) % n) }
   else if (e.key === 'Escape') { e.preventDefault(); e.stopPropagation(); closeSearch(); document.getElementById('searchBtn').focus() }
 })
 document.getElementById('cmdk').addEventListener('click', (e) => {
@@ -3511,7 +3778,7 @@ document.addEventListener('click', async (ev) => {
       if (btn.dataset.needsDl) { toast('Download it first: press Download & use'); return }
       document.getElementById('f-model').value = btn.dataset.tag
       const o = document.getElementById('f-model-other'); if (o) o.value = ''
-      return paintModels()
+      paintModels(); return paintSave()
     }
     if (action === 'ollama-start') {
       btn.disabled = true; btn.textContent = 'Starting…'
@@ -3531,11 +3798,11 @@ document.addEventListener('click', async (ev) => {
     if (action === 'day-toggle') {
       const on = btn.getAttribute('aria-pressed') === 'true'
       if (on && document.querySelectorAll('.days .day[aria-pressed="true"]').length === 1) { toast('Pick at least one day'); return }
-      btn.setAttribute('aria-pressed', String(!on)); return
+      btn.setAttribute('aria-pressed', String(!on)); return paintSave()
     }
     if (action === 'days-preset') {
       const want = btn.dataset.days === 'weekdays' ? ['mon', 'tue', 'wed', 'thu', 'fri'] : DAY_KEYS.map(([k]) => k)
-      document.querySelectorAll('.days .day').forEach((b) => b.setAttribute('aria-pressed', String(want.includes(b.dataset.day)))); return
+      document.querySelectorAll('.days .day').forEach((b) => b.setAttribute('aria-pressed', String(want.includes(b.dataset.day)))); return paintSave()
     }
     if (action === 'repo-all') {
       state.moreOpen = false
@@ -3631,17 +3898,29 @@ document.addEventListener('click', async (ev) => {
       const cmd = s ? s.resumeCommand : (await api('GET', '/v1/sessions/' + encodeURIComponent(id))).resumeCommand
       if (await copy(cmd) && btn.classList.contains('copy-resume')) copiedMark(btn)
     } else if (action === 'checkpoint') {
-      // 0.9.2: any length (data-length), and another Mac's session too: its Leftoff writes it
+      // 0.9.2: any length (data-length), and another Mac's session too: its Leftoff writes it.
+      // 0.9.5: "Writing checkpoint…" stays on the card and the session page until it lands or fails.
       const length = btn.dataset.length || null
       const away = s && !s.isLocal ? s.machine : null
-      const was = btn.innerHTML
-      btn.disabled = true; btn.textContent = 'Writing…'
-      if (!btn.isConnected || btn.classList.contains('palette-proxy') || !btn.closest('.split')) toast('Writing ' + (length ? lengthLabel(length).toLowerCase() + ' ' : 'a ') + 'checkpoint' + (away ? ' on ' + away : '') + '…', 40000) // from a menu (closed) or ⌘K
-      let cp
-      try { cp = await api('POST', '/v1/sessions/' + encodeURIComponent(id) + '/checkpoints', { trigger: 'manual', generate: true, ...(length ? { length } : {}) }) }
-      catch (e) { toast(e.message, 6000); if (btn.isConnected) { btn.disabled = false; btn.innerHTML = was } return }
-      toast('Checkpoint saved' + (cp.peer ? ' on ' + cp.peer : '') + ' · Next: ' + cp.next)
+      if (isWriting(state.writing, id)) { toast('Already writing a checkpoint for this session'); return }
+      beginWriting(state.writing, id, { length: length || defaultLength(), lastCpId: (s && s.lastCheckpointId) || null, machine: away })
+      const req = api('POST', '/v1/sessions/' + encodeURIComponent(id) + '/checkpoints', { trigger: 'manual', generate: true, ...(length ? { length } : {}) }).then((cp) => ({ cp }), (e) => ({ e }))
+      await render()
+      // nothing on screen shows it (⌘K from another page): say it once
+      if (![...document.querySelectorAll('[data-writing]')].some((el) => el.dataset.writing === id)) toast('Writing ' + (length ? lengthLabel(length).toLowerCase() + ' ' : 'a ') + 'checkpoint' + (away ? ' on ' + away : '') + '…', 40000)
+      const { cp, e } = await req
+      if (e && e.code === 'peer_slow') {
+        settleWriting(state.writing, id, { slow: true })
+        setTimeout(() => { if (state.writing[id] && !busy() && state.route && /^(board|s)$/.test(state.route.name || 'board')) render() }, WRITING_SYNC_MS + 300)
+        return render()
+      }
+      if (e) { settleWriting(state.writing, id, { error: e.message }); toast(e.message, 6000); return render() }
+      settleWriting(state.writing, id, { ok: true })
+      state.cpFresh[cp.id] = Date.now()
+      toast('Checkpoint saved' + (cp.peer ? ' on ' + cp.peer : '') + ' · Next: ' + plainCp(cp.next))
       render()
+    } else if (action === 'writing-dismiss') {
+      dismissWriting(state.writing, btn.dataset.id || id); render()
     } else if (action === 'cp-lengths') {
       ev.preventDefault(); return openLengthMenu(btn, id)
     } else if (action === 'peer-recheck') {
@@ -4017,33 +4296,27 @@ document.addEventListener('submit', async (ev) => {
     location.hash = it ? it.href : q ? '#/search?q=' + encodeURIComponent(q) : location.hash
   } else if (ev.target.id === 'settingsForm') {
     ev.preventDefault()
+    // 0.9.5: nothing to save while the form matches what's saved (Save is off then too)
+    if (saveUi.saving || !settingsChanged().length) return
+    saveUi.saving = true; paintSave()
     try {
-      const prov = document.getElementById('f-mode').value
-      const f = PROVIDER_FIELDS[prov] || PROVIDER_FIELDS.auto
+      const v = settingsValues()
+      const prov = v.provider
       const prev = (state.cfg && state.cfg.summarizer) || {}
       const changed = String(prev.provider || 'auto').toLowerCase() !== prov
-      const summarizer = {
-        provider: prov,
-        model: (f.model && (((document.getElementById('f-model-other') || {}).value || '').trim() || document.getElementById('f-model').value.trim())) || 'haiku',
-        baseUrl: (f.base && document.getElementById('f-base').value.trim()) || null,
-      }
+      const summarizer = { provider: prov, model: v.model, baseUrl: v.baseUrl }
       // A key setting from another provider must not follow the switch.
       if (changed) { summarizer.apiKeyEnv = null; summarizer.apiKeyFile = null }
-      const key = f.key ? document.getElementById('f-key').value.trim() : ''
-      if (key) await api('PUT', '/v1/config/keys/' + f.key, { key })
+      const key = v.key
+      if (key) await api('PUT', '/v1/config/keys/' + (PROVIDER_FIELDS[prov] || PROVIDER_FIELDS.auto).key, { key })
       await api('PATCH', '/v1/config', {
-        dormantAfterMin: Number(document.getElementById('f-dormant').value),
-        minGapMin: Number(document.getElementById('f-gap').value),
-        digest: {
-          time: document.getElementById('f-time').value || null,
-          days: [...document.querySelectorAll('.days .day[aria-pressed="true"]')].map((b) => b.dataset.day),
-          skipEmpty: document.getElementById('f-skip').checked,
-          timeZone: document.getElementById('f-tz').value || null,
-        },
+        dormantAfterMin: v.dormantAfterMin,
+        minGapMin: v.minGapMin,
+        digest: v.digest,
         summarizer,
-        summary: { length: ((document.querySelector('input[name="f-length"]:checked') || {}).value) || 'informative' },
-        updates: { check: document.getElementById('f-updates').checked },
-        notify: { needsYou: document.getElementById('f-notify').checked },
+        summary: { length: v.length },
+        updates: { check: v.updates },
+        notify: { needsYou: v.notify },
         ...(() => {
           const el = document.getElementById('f-remote-answers')
           if (!el || el.disabled || el.checked === !!(state.cfg.remote && state.cfg.remote.allowAnswers)) return {}
@@ -4051,11 +4324,15 @@ document.addEventListener('submit', async (ev) => {
           return { remote: { allowAnswers: el.checked } }
         })(),
       })
+      // Saved: what's on screen is now what's saved, so Save goes off until the next edit.
+      const kf = document.getElementById('f-key'); if (kf) kf.value = ''
+      saveUi.base = settingsValues()
       toast(key ? 'Saved · key stored in .secret/' : 'Saved'); render(); refreshHealth()
-    } catch (e) { toast(e.message) }
+    } catch (e) { toast(e.message) } finally { saveUi.saving = false; paintSave() }
   }
 })
 
+
 // Live updates over SSE; re-render the current view, at most every 800 ms.
 let pending = null
 const busy = () => !!document.querySelector('.doc-viewer:not([hidden]), .lo-menu, .title input, .repomore[open], .need .deny-form:not([hidden])') || !!(document.activeElement && document.activeElement.closest && document.activeElement.closest('.addform') && document.activeElement.value) || !!(document.activeElement && document.activeElement.closest && document.activeElement.closest('.need') && /^(INPUT|TEXTAREA)$/.test(document.activeElement.tagName))