@leftoff/cli 0.9.1 → 0.9.4

package/docs/SECURITY.md

@@ -89,6 +89,10 @@ None of this touches the board's data: everything under [What the relay can see]
 
 A relayed request is replayed against the Mac's own board from inside the daemon (proved with a secret that never leaves memory) and counts as a **remote device**, with the same rules as a phone over Tailscale: it can read the board; answering prompts and pairing new devices need Settings → Privacy & security → *Trust my paired devices* on that Mac (`remote.allowAnswers`; 403 `trust_off` while it's off); revoking a paired device works from any paired device, itself included, since it only cuts access; Go, moving the folder, Syncthing, turning the relay on or off and the trust switch itself are refused (this Mac's business, loopback only). The daemon still listens only on 127.0.0.1: the relay connection is outbound.
 
+### Direct when on the same Mac (0.9.3)
+
+When your hosted board is open on a Mac that runs Leftoff, the page sends the same sealed requests straight to that Mac's daemon at `http://127.0.0.1:7429/v1/relay/direct` instead of to the relay. Nothing new is trusted: the daemon opens them with the same per-device key (and the same replay and time checks), runs them the same way (a remote device, the rules above), and seals the answer. The page only switches after the daemon says it's on your account and a sealed round trip through it works, so another Leftoff on that port (someone else's account) can't serve your board: it can't open the request or forge the answer. The door is loopback only, never through a proxy, off when Use from anywhere is off, and answers CORS for exactly one origin, `https://<your name>.leftoff.dev` (with Chrome's Private Network Access header); any other page gets a 403 it can't read. If the direct path fails, the request goes through the relay once more and the board stays on the relay until a later check finds the direct path again.
+
 ### Logging
 
 The Worker never logs request or response bodies (it can't read them anyway) and stores only what's listed above, in your Durable Object. `wrangler.toml` turns Workers observability (request logs) off. Cloudflare's edge keeps its usual metadata for any site (IP, hostname, path such as `/_relay/api`, status), under its own policies.

package/docs/peer-protocol.md

@@ -55,6 +55,9 @@ Each command is one envelope. It's JSON and travels the same way over every tran
 | `ask.answer` | `askId`, `body` | `engine.answerAsk()`: the board's Allow / Deny / answer code path |
 | `session.reply` | `sessionId`, `text` | `engine.postReply()`: the board's reply box |
 | `session.go` | `sessionId` | `engine.jump()`: the board's Go |
+| `session.checkpoint` | `sessionId`, `length?`, `userNote?`, `next?` | `engine.generateCheckpoint()`: Checkpoint now (0.9.2); returns the checkpoint, which the asking board lists at once |
+| `session.patch` | `sessionId`, `title?`, `pinned?`, `archived?` | `engine.patchSession()`: rename, Pin, Archive (0.9.2) |
+| `session.title.auto` | `sessionId` | `engine.regenerateTitle()`: Regenerate title (0.9.2) |
 
 Answers are recorded in the session's `answers.md` as *from studio's board (direct)* or *(through the relay)*.
 

package/mod/.claude-plugin/plugin.json

@@ -1,6 +1,6 @@
 {
   "name": "leftoff",
-  "version": "0.9.1",
+  "version": "0.9.4",
   "description": "Leftoff (formerly Checkpoints): WTF was I working on? Tracks every Claude Code session on this machine, writes a 3-line checkpoint when one goes quiet, and adds /cp (checkpoint now), /cp-name and a /leftoff pane. Talks to the local Leftoff daemon on 127.0.0.1:7429 and falls back to writing markdown in ~/checkpoints.",
   "author": {
     "name": "Joel"

package/mod/hooks/core.js

@@ -1354,6 +1354,13 @@ export function parseCheckpointReply(text) {
   return { ...out, ...parseSections(rest) }
 }
 
+// 0.9.2: a checkpoint written with nothing to go on: no prompt and no reply were
+// found (the heuristic's placeholder lines). Never saved; old ones are set aside.
+export function isEmptyCheckpoint(cp) {
+  return !!cp && /^No prompt captured yet\.?$/.test(String(cp.doing || '').trim()) && /^No reply captured yet\.?$/.test(String(cp.stoppedAt || '').trim())
+}
+export const NOTHING_TO_CHECKPOINT = 'Nothing to checkpoint yet — no messages found for this session'
+
 // No model available: build a checkpoint from the last prompt and the last reply.
 // Informative / long add what can be read off the transcript without a model:
 // the files edited (with the tool), the failed tool calls, the questions asked.

package/mod/hooks/register.js

@@ -14,7 +14,7 @@
 // each event is registered once per matcher.
 import {
   DEFAULT_CONFIG, DEFAULT_PORT, mergeConfig, resolveMachine, applyEvent, checkpointDue, buildCheckpointPrompt,
-  parseCheckpointReply, heuristicCheckpoint, renderCheckpointMd, checkpointId, checkpointFileName,
+  parseCheckpointReply, heuristicCheckpoint, isEmptyCheckpoint, NOTHING_TO_CHECKPOINT, renderCheckpointMd, checkpointId, checkpointFileName,
   sessionFolderName, id8, clip, toIso, resumeCommand, repoName,
   shortId, formatTabTitle, parseTabTitle, detectTerminal, parseProcLine, trailingQuestion,
   parseCheckpointArgs, SUMMARY_LENGTHS, parseBulletList, parseCatchupArgs,
@@ -28,7 +28,7 @@ const END_TIMEOUT_MS = 1000
 const MODEL_TIMEOUT_MS = 20000
 
 // Module state. $.state is not used: the pane redraws with $.ui.invalidate.
-const MOD_VERSION = '0.9.1' // keep in step with .claude-plugin/plugin.json
+const MOD_VERSION = '0.9.4' // keep in step with .claude-plugin/plugin.json
 
 const st = {
   internal: false,
@@ -652,6 +652,8 @@ async function makeCheckpoint($, trigger, userNote, length, opts = {}) {
       parsed = heuristicCheckpoint(messages, record, { length: ctx.length })
       generator = { by: 'heuristic' }
     }
+    // 0.9.2: nothing to go on (no prompt, no reply): don't save a placeholder over the last real one
+    if (isEmptyCheckpoint(parsed)) { if (trigger === 'manual') $.ui.toast(NOTHING_TO_CHECKPOINT, { timeoutMs: 6000 }); return null }
     if (opts.next) parsed = { ...parsed, next: opts.next }
     const cp = {
       sessionId: st.sessionId, createdAt: nowIso(), trigger, machine: st.machine,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leftoff/cli",
-  "version": "0.9.1",
+  "version": "0.9.4",
   "description": "Leftoff: WTF was I working on? Tracks every Claude Code session, writes a 3-line checkpoint when one goes quiet, and gives you a daily digest and a board, on your Mac and (optionally) your phone.",
   "keywords": [
     "claude",

package/ui/app.css

@@ -1775,3 +1775,61 @@ html.dv-open .lo-menu { z-index: 62; }
 .pr-more-sess > summary { list-style: none; cursor: pointer; display: inline; }
 .pr-more-sess > summary::-webkit-details-marker { display: none; }
 .pr-more-sess[open] > summary { display: none; }
+
+/* 0.9.2: the ⋯ menu's sub lines, its plain note (a Mac that can't be reached),
+   the row of other checkpoint lengths, and the split "Checkpoint now" button. */
+.lo-act.has-sub { align-items: flex-start; white-space: normal; }
+.lo-act.has-sub .ic { margin-top: 2px; }
+.lo-act-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
+.lo-act-sub { font-size: 12.5px; color: var(--muted); font-weight: 400; line-height: 1.35; }
+.lo-act-note { display: flex; align-items: flex-start; gap: 10px; padding: 8px 10px 10px; margin-bottom: 4px; border-bottom: 1px solid var(--line); color: var(--text2); font-size: 13.5px; line-height: 1.4; white-space: normal; }
+.lo-act-note .ic { width: 16px; height: 16px; flex: none; margin-top: 2px; color: var(--muted); }
+.lo-menu.sheet .lo-act-note { font-size: 15px; padding: 10px 10px 12px; }
+.lo-menu.sheet .lo-act-sub { font-size: 14px; }
+/* 0.9.4: a row with a second page (Checkpoint now ›), the iOS way: the row
+   does its action, the › at its right edge (its own target, a hairline before
+   it) slides the menu to the page; ‹ title goes back. Fixed width on a
+   desktop so the page change only eases the height. */
+.lo-actmenu.has-pages { overflow-x: hidden; }
+.lo-menu.lo-actmenu.has-pages:not(.sheet) { width: min(312px, calc(100vw - 16px)); max-width: none; }
+.lo-act-split { display: flex; align-items: stretch; position: relative; }
+.lo-act-split .lo-act-main { flex: 1 1 auto; min-width: 0; }
+.lo-act-next { flex: none; display: flex; align-items: center; justify-content: center; width: 40px; margin-left: 2px; padding: 0; border: 0; border-radius: 8px; background: none; color: var(--muted); cursor: pointer; position: relative; }
+.lo-act-next::before { content: ""; position: absolute; left: -1px; top: 9px; bottom: 9px; width: 1px; background: var(--line); }
+.lo-act-next .ic { width: 16px; height: 16px; }
+.lo-act-next:hover, .lo-act-next:focus { outline: none; background: var(--bg2); color: var(--text); }
+[data-theme="dark"] .lo-act-next:hover, [data-theme="dark"] .lo-act-next:focus, :root:not([data-theme="light"]) .lo-act-next:hover, :root:not([data-theme="light"]) .lo-act-next:focus { background: var(--line); }
+.lo-act-next:focus-visible { box-shadow: inset 0 0 0 2px var(--focus); }
+.lo-act-split:hover .lo-act-next::before, .lo-act-split:focus-within .lo-act-next::before { opacity: 0; }
+.lo-act-back { color: var(--text); font-weight: 600; border-bottom: 1px solid var(--line); border-radius: 8px 8px 0 0; margin-bottom: 4px; }
+.lo-act-back .ic { color: var(--accent); }
+.lo-act-page .lo-act.has-sub { padding-top: 9px; padding-bottom: 9px; }
+.lo-act-page .lo-act.on { font-weight: 600; }
+.lo-act .lo-act-check { color: var(--accent); }
+.lo-act .lo-act-sub { white-space: normal; }
+.lo-vh { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; }
+.lo-menu.lo-act-sizing { transition: height .2s cubic-bezier(.2, .8, .2, 1), top .2s cubic-bezier(.2, .8, .2, 1); overflow-y: hidden; }
+@keyframes lo-page-fwd { from { opacity: 0; transform: translateX(18px); } to { opacity: 1; transform: none; } }
+@keyframes lo-page-back { from { opacity: 0; transform: translateX(-18px); } to { opacity: 1; transform: none; } }
+.lo-act-page.lo-in-fwd { animation: lo-page-fwd .2s cubic-bezier(.2, .8, .2, 1); }
+.lo-act-page.lo-in-back { animation: lo-page-back .2s cubic-bezier(.2, .8, .2, 1); }
+.lo-menu.sheet .lo-act-next { width: 52px; min-height: 44px; }
+.lo-menu.sheet .lo-act-next .ic { width: 20px; height: 20px; }
+.lo-menu.sheet .lo-act-next::before { top: 12px; bottom: 12px; }
+.lo-menu.sheet .lo-act-page .lo-act.has-sub { padding-top: 12px; padding-bottom: 12px; }
+/* a phone keeps :hover on the last row tapped; only focus highlights there */
+@media (hover: none) { :root .lo-act:hover:not(:focus), :root .lo-act-next:hover:not(:focus) { background: none; } }
+@media (prefers-reduced-motion: reduce) { .lo-act-page.lo-in-fwd, .lo-act-page.lo-in-back { animation: none; } .lo-menu.lo-act-sizing { transition: none; } }
+.split { display: inline-flex; align-items: stretch; }
+.split .btn.split-main { border-top-right-radius: 0; border-bottom-right-radius: 0; }
+.split .btn.split-more { border-top-left-radius: 0; border-bottom-left-radius: 0; padding: 0 8px; margin-left: 1px; display: inline-flex; align-items: center; }
+.split .btn.split-more .ic { width: 15px; height: 15px; margin: 0; }
+@media (pointer: coarse) { .split .btn.split-more { min-width: 40px; justify-content: center; } }
+.more-wrap { display: inline-flex; }
+/* 0.9.2: the popover's Theme control never wraps: it gets its own row under
+   the label, three equal segments, whatever the popover's width. */
+.statuspop .sp-theme { flex-wrap: wrap; row-gap: 6px; }
+.statuspop .sp-theme .sp-k { width: 100%; }
+.statuspop .sp-theme .theme { flex: 1 1 100%; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); flex-wrap: nowrap; }
+.statuspop .sp-theme .theme button { justify-content: center; white-space: nowrap; min-width: 0; height: 30px; padding: 0 6px; }
+@media (pointer: coarse) { .statuspop .sp-theme .theme button { height: 36px; font-size: 13px; } }

package/ui/app.js

@@ -370,11 +370,12 @@ function goButton(s) {
   // Another machine's session (v0.5.2): Go runs there, through its Leftoff, when it allows it.
   if (!s.isLocal) {
     if (!j.peer) return ''
-    const label = 'Go on ' + s.machine + ' ↗'
-    if (state.viewerLocal === false) return '<button type="button" class="btn go" disabled title="Go only works from a Mac’s own browser">' + esc(label) + '</button>'
-    if (!j.supported) return '<span class="go-off"><button type="button" class="btn go" disabled title="' + esc(j.reason || '') + '">' + esc(label) + '</button><span class="why">' + esc(peerWhy(j)) + '</span></span>'
+    // 0.9.2: "Go ↗" like a local card (a phone cut "Go on <machine>" short); the machine is in its title and label
+    const label = 'Go ↗', on = 'Go on ' + s.machine
+    if (state.viewerLocal === false) return '<button type="button" class="btn go" disabled aria-label="' + esc(on) + '" title="' + esc(on + ': Go only works from a Mac’s own browser') + '">' + esc(label) + '</button>'
+    if (!j.supported) return '<span class="go-off"><button type="button" class="btn go" disabled aria-label="' + esc(on) + '" title="' + esc(j.reason || '') + '">' + esc(label) + '</button><span class="why">' + esc(peerWhy(j)) + '</span></span>'
     const st = goState.get(s.id)
-    return '<button type="button" class="btn go' + (st && st.cls ? ' ' + st.cls : '') + '" data-action="go" data-id="' + esc(s.id) + '"' + (st && st.disabled ? ' disabled' : '') + ' data-idle="' + esc(label) + '" title="' + esc('Bring this session’s tab to the front on ' + s.machine) + '">' + esc(st ? st.label : label) + '</button>'
+    return '<button type="button" class="btn go' + (st && st.cls ? ' ' + st.cls : '') + '" data-action="go" data-id="' + esc(s.id) + '"' + (st && st.disabled ? ' disabled' : '') + ' data-idle="' + esc(label) + '" aria-label="' + esc(on) + '" title="' + esc('Bring this session’s tab to the front on ' + s.machine) + '">' + esc(st ? st.label : label) + '</button>'
   }
   if (state.viewerLocal === false) return '<button type="button" class="btn go" disabled title="Go switches tabs on the machine running Leftoff, so it only works from that machine’s own browser (localhost)">Go ↗</button>'
   if (!j.supported) return '<button type="button" class="btn go" disabled title="' + esc('Can’t jump: ' + (j.reason || 'unsupported terminal')) + '">Go ↗</button>'
@@ -419,35 +420,108 @@ function copyResumeIcon(s) {
   return '<button type="button" class="btn icon-btn copy-resume" data-action="resume" data-id="' + esc(s.id) + '" aria-label="Copy resume command" title="Copy resume command">' + icon('copy') + '</button>'
 }
 // items: [{ action, label, icon, title, attrs }]
-function moreMenu(s, items) {
-  items = items.concat([projectMenuItem(s)]).filter(Boolean) // 0.9.0: Add to project… on every card with a repo
+// 0.9.2: an item may also be { note } (a plain line, no button) and carry a sub line.
+// 0.9.4: or { …item, more: { title, items } }: the row does its action, and a ›
+// at its right edge opens a second page of items (e.g. the checkpoint lengths,
+// each with { sub, on }).
+function moreMenu(s, items, { project = true, title = '' } = {}) {
+  items = items.concat([project ? projectMenuItem(s) : null]).filter(Boolean) // 0.9.0: Add to project… on every card with a repo
   if (!items.length) return ''
-  return '<button type="button" class="btn icon-btn more" data-action="card-more" data-id="' + esc(s.id) + '" aria-label="More actions" title="More actions" aria-haspopup="menu" aria-expanded="false">' + icon('ellipsis') + '</button>' +
-    '<template class="more-items">' + items.map((it) => '<button type="button" data-action="' + esc(it.action) + '" data-id="' + esc(s.id) + '"' +
-      Object.entries(it.attrs || {}).map(([k, v]) => ' ' + k + '="' + esc(v) + '"').join('') + (it.title ? ' title="' + esc(it.title) + '"' : '') + '>' +
-      (it.icon ? icon(it.icon) : '') + esc(it.label) + '</button>').join('') + '</template>'
+  const btn = (it) => '<button type="button" data-action="' + esc(it.action) + '" data-id="' + esc(s.id) + '"' +
+    Object.entries(it.attrs || {}).map(([k, v]) => ' ' + k + '="' + esc(v) + '"').join('') + (it.title ? ' title="' + esc(it.title) + '"' : '') + (it.sub ? ' data-sub="' + esc(it.sub) + '"' : '') + (it.on ? ' data-on="' + esc(it.onLabel || 'on') + '"' : '') + '>' +
+    (it.icon ? icon(it.icon) : '') + esc(it.label) + '</button>'
+  return '<button type="button" class="btn icon-btn more" data-action="card-more" data-id="' + esc(s.id) + '"' + (title ? ' data-menu-title="' + esc(title) + '"' : '') + ' aria-label="More actions" title="More actions" aria-haspopup="menu" aria-expanded="false">' + icon('ellipsis') + '</button>' +
+    '<template class="more-items">' + items.map((it) => it.note ? '<div class="more-note">' + (it.icon ? icon(it.icon) : '') + esc(it.note) + '</div>'
+      : it.more ? '<div class="more-split" data-more-title="' + esc(it.more.title) + '">' + btn(it) + '<div class="more-sub">' + it.more.items.map(btn).join('') + '</div></div>' : btn(it)).join('') + '</template>'
 }
 function openCardMenu(btn) {
   const tpl = btn.parentElement && btn.parentElement.querySelector('template.more-items')
   if (!tpl) return
   const card = btn.closest('.card')
-  const title = card && card.querySelector('.title a') ? card.querySelector('.title a').textContent.trim() : ''
-  const items = [...tpl.content.querySelectorAll('button')].map((b) => {
+  const title = btn.dataset.menuTitle || (card && card.querySelector('.title a') ? card.querySelector('.title a').textContent.trim() : '')
+  const toItem = (b) => {
     const svg = b.querySelector('svg')
     const attrs = {}
-    for (const a of b.attributes) if (a.name.startsWith('data-') || a.name === 'title') attrs[a.name] = a.value
-    return { label: b.textContent.trim(), icon: svg ? svg.outerHTML : '', attrs }
-  })
+    for (const a of b.attributes) if ((a.name.startsWith('data-') && a.name !== 'data-sub' && a.name !== 'data-on') || a.name === 'title') attrs[a.name] = a.value
+    return { label: b.textContent.trim(), icon: svg ? svg.outerHTML : '', attrs, ...(b.dataset.sub ? { sub: b.dataset.sub } : {}), ...(b.dataset.on ? { on: true, onLabel: b.dataset.on } : {}) }
+  }
+  const items = [...tpl.content.children].map((el) => {
+    if (el.classList.contains('more-note')) { const svg = el.querySelector('svg'); return { note: el.textContent.trim(), icon: svg ? svg.outerHTML : '' } }
+    if (el.classList.contains('more-split')) return { ...toItem(el.querySelector(':scope > button')), more: { title: el.dataset.moreTitle || '', items: [...el.querySelectorAll('.more-sub > button')].map(toItem) } }
+    return el.tagName === 'BUTTON' ? toItem(el) : null
+  }).filter(Boolean)
   lastMenuAnchor = btn
   openActionMenu(btn, items, { title })
 }
-const sessionMenuItems = (s) => s.isLocal ? [
-  { action: 'checkpoint', label: 'Checkpoint now', icon: 'bookmark-plus' },
+// 0.9.2: what this board can do with a session: 'local'; 'peer', through the
+// Mac it lives on (the same path as answering and Go); 'away', when that Mac
+// can't be reached from here. Agent records are read-only (null).
+function reachOf(s) {
+  if (!s || s.agent || /^agent:/.test(String(s.id || ''))) return null
+  if (s.isLocal) return 'local'
+  const p = s.peer || {}
+  return p.ok || p.code === 'checking' ? 'peer' : 'away'
+}
+// 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.4: one row, "Checkpoint now" at your length; its › opens Short /
+// Informative / Long, each with its line, your default ticked.
+function checkpointItems() {
+  const def = defaultLength()
+  return [
+    { action: 'checkpoint', label: 'Checkpoint now', icon: 'bookmark-plus', title: 'Checkpoint now · ' + lengthLabel(def), attrs: { 'data-length': def },
+      more: { title: 'Checkpoint length', items: LENGTH_CHOICES.map((o) => ({ action: 'checkpoint', label: o.label, sub: o.blurb, on: o.key === def, onLabel: 'your default', attrs: { 'data-length': o.key } })) } },
+  ]
+}
+// The ⋯ menu when the Mac a session lives on can't be reached: why, in plain
+// words, and what you can do (switch the board to that Mac, or check again).
+function awayNote(s) {
+  const m = s.machine || 'another Mac', c = s.peer && s.peer.code
+  return c === 'not_allowed' ? 'Lives on ' + m + ', which doesn’t take actions from other Macs (Settings → Privacy & security on ' + m + ')'
+    : c === 'key_changed' ? 'Lives on ' + m + ', whose key changed; confirm it in Settings → Privacy & security'
+    : c === 'no_key' ? 'Lives on ' + m + ', which needs a newer Leftoff for this'
+    : c === 'off' ? 'Lives on ' + m + '; actions on other Macs are off here'
+    : asleepOnRelay(m) ? 'Lives on ' + m + ', which is asleep right now'
+    : 'Lives on ' + m + ', which isn’t reachable right now'
+}
+function asleepOnRelay(m) { const st = window.leftoffRelay && state.relayStatus; const x = st && (st.macs || []).find((y) => y.machine === m); return !!(x && !x.online) }
+function awayMenuItems(s) {
+  const m = s.machine
+  const canSwitch = !!window.leftoffRelay && m && m !== window.leftoffRelay.mac && !asleepOnRelay(m)
+  return [
+    { note: awayNote(s), icon: 'wifi-off' },
+    canSwitch ? { action: 'relay-mac', label: 'Switch to ' + m + '’s board', icon: 'monitor', attrs: { 'data-mac': m } } : null,
+    { action: 'peer-recheck', label: 'Check again', icon: 'refresh-cw', attrs: { 'data-machine': m || '' } },
+  ].filter(Boolean)
+}
+const sessionMenuItems = (s) => { const r = reachOf(s); return r === 'local' || r === 'peer' ? [
+  ...checkpointItems(),
   { action: 'pin', label: s.pinned ? 'Unpin' : 'Pin', icon: s.pinned ? 'pin-off' : 'pin' },
   { action: 'title-auto', label: 'Regenerate title', icon: 'refresh-cw', title: 'A new title from the latest messages (like /cp-name --auto)' },
   { action: 'archive', label: 'Archive', icon: 'archive' },
-] : []
-const roNote = (t) => '<span class="ro" title="' + esc(t) + '">' + esc(t) + '</span>'
+] : r === 'away' ? awayMenuItems(s) : [] }
+// 0.9.2: "Checkpoint now" on a session's page: the main part writes your
+// length; the chevron opens Short / Informative / Long (our menu, a sheet on a phone).
+function checkpointSplit(s) {
+  const def = defaultLength()
+  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>'
+}
+function openLengthMenu(btn, id) {
+  const def = defaultLength()
+  lastMenuAnchor = btn
+  openActionMenu(btn, LENGTH_CHOICES.map((o) => ({ label: o.label + (o.key === def ? ' · your default' : ''), sub: o.blurb, icon: o.key === def ? icon('check') : icon('bookmark-plus'), cls: o.key === def ? 'on' : '',
+    attrs: { 'data-action': 'checkpoint', 'data-id': id, 'data-length': o.key } })), { title: 'Checkpoint now' })
+}
+const roNote = (t, tip) => '<span class="ro" title="' + esc(tip || t) + '">' + esc(t) + '</span>'
+// 0.9.2: a short line on another Mac's card (the full story is its title and the ⋯ menu)
+function remoteNote(s) {
+  if (reachOf(s) === 'peer') return roNote('via ' + s.machine, 'Lives on ' + s.machine + ' · checkpoints, answering and Go work through it')
+  if (/class="go-off"/.test(goButton(s))) return '' // the grey Go already says why
+  return roNote(s.machine + ' unreachable', awayNote(s) + ' · read-only here')
+}
 
 function card(s) {
   if (s.agent) return agentCard(s)
@@ -465,7 +539,7 @@ function card(s) {
     '<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) +
-      (s.isLocal ? moreMenu(s, sessionMenuItems(s)) : roNote(s.peer && s.peer.ok ? 'lives on ' + s.machine + ' · answering and Go work through it' : 'read-only here · lives on ' + s.machine)) +
+      (s.isLocal ? '' : remoteNote(s)) + moreMenu(s, sessionMenuItems(s)) +
     '</div></article>'
 }
 
@@ -1102,11 +1176,11 @@ async function viewSession(id) {
   const [spv] = await Promise.all([api('GET', '/v1/spaces').catch(() => null), loadProjects()])
   let html = '<a class="back" href="#/">← All sessions</a>'
   // 0.8.9: rename in place: tap the title or the pencil (this Mac's sessions; like /cp-name, your name wins over automatic ones)
-  const canRename = s.isLocal !== false && !s.agent && !/^agent:/.test(String(s.id || ''))
+  const canRename = reachOf(s) === 'local' || reachOf(s) === 'peer' // 0.9.2: another Mac's session renames through it
   html += '<div class="pagehead"><div>' + (canRename
     ? '<div class="title s-title" data-id="' + esc(s.id) + '"><h1><span class="s-title-text" role="button" tabindex="0" data-action="rename" data-id="' + esc(s.id) + '" data-title="' + esc(s.title || '') + '" title="Rename">' + esc(s.title || 'Untitled session') + '</span></h1><button type="button" class="icon rename-pen" data-action="rename" data-id="' + esc(s.id) + '" data-title="' + esc(s.title || '') + '" aria-label="Rename" title="Rename">' + icon('pencil') + '</button></div>'
     : '<h1>' + esc(s.title || 'Untitled session') + '</h1>') + '<div class="sub">' + pill(s.status) + ' ' + spaceChip(s, { force: true }) + projChip(s) + wtChips(s) + (canProject(s) ? '<button type="button" class="chip proj-add" data-action="project-menu" data-key="' + esc(s.repoKey) + '" data-repo="' + esc(s.repoLabel || s.repoName || '') + '" title="' + esc(s.repoProject ? 'Move ' + (s.repoLabel || 'this repo') + ' to another project, or out of it' : 'Add ' + (s.repoLabel || 'this repo') + ' to a project') + '">' + (s.repoProject ? 'Change project' : '+ Project') + '</button>' : '') + ' &nbsp;' + esc(s.titleSource ? s.titleSource + ' title' : '') + '</div></div>' +
-    '<div class="actions">' + goButton(s) + (s.status === 'ended' || s.live === 'closed' ? resumeButton(s, s.viewer || { local: state.viewerLocal !== false, ghostty: !!state.ghostty }) : '') + '<a class="btn" href="#/timeline?session=' + encodeURIComponent(s.id) + '">' + icon('history') + 'Open in Timeline</a><button type="button" class="btn" data-action="resume" data-id="' + esc(s.id) + '">Copy resume</button>' + (s.isLocal ? '<button type="button" class="btn primary" data-action="checkpoint" data-id="' + esc(s.id) + '">Checkpoint now</button>' : '') + '</div></div>'
+    '<div class="actions">' + goButton(s) + (s.status === 'ended' || s.live === 'closed' ? resumeButton(s, s.viewer || { local: state.viewerLocal !== false, ghostty: !!state.ghostty }) : '') + '<a class="btn" href="#/timeline?session=' + encodeURIComponent(s.id) + '">' + icon('history') + 'Open in Timeline</a><button type="button" class="btn" data-action="resume" data-id="' + esc(s.id) + '">Copy resume</button>' + (reachOf(s) === 'local' || reachOf(s) === 'peer' ? checkpointSplit(s) : reachOf(s) === 'away' ? '<span class="more-wrap">' + moreMenu(s, awayMenuItems(s), { project: false, title: s.title || 'This session' }) + '</span>' : '') + '</div></div>'
   html += '<div class="facts">' +
     fact('Machine', mEmoji(s.machine) + ' ' + s.machine + (thisOneSuffix(s.machine, state.health) || (s.isLocal ? '' : ' (synced)'))) + fact('Repo', (s.repoName || '—') + (branch ? ' · ' + branch : '')) + (s.repoProject ? fact('Project', projectLabel(s.repoProject)) : '') + (s.worktree ? fact('Worktree', '⑂ ' + s.worktree.name + (s.worktree.branch ? ' · ' + s.worktree.branch : ''), 'wrap') : '') + (s.startedIn ? fact('Started in', s.startedIn) : '') + fact('Directory', s.cwd || '—') + fact('Last activity', ago(s.lastActivityAt)) + fact('Started', clock(s.startedAt)) +
     fact('Turns', s.turns + ' (' + s.turnsSinceCheckpoint + ' since checkpoint)' + (s.historyTurns ? ' · resumed, ' + s.historyTurns + ' before' : '')) + fact('Capture', s.capture || '—') + fact('Model', s.modelLabel || s.model || '—', 'wrap') + fact('Session id', s.id) +
@@ -1135,8 +1209,10 @@ async function viewSession(id) {
   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.0: checkpoints written while Leftoff had another session's branch for this one: kept, folded away
-  const doubted = s.checkpoints.filter((cp) => cp.doubt)
+  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>'
+  const empties = s.checkpoints.filter((cp) => cp.doubt === 'empty') // 0.9.2
+  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
 }
@@ -2960,19 +3036,27 @@ function paintStatus() {
   const pref = window.cpTheme ? window.cpTheme.pref() : 'system'
   const row = (k, v, cls) => '<div class="sp-row"><span class="sp-k">' + esc(k) + '</span><span class="sp-v' + (cls ? ' ' + cls : '') + '">' + v + '</span></div>'
   const syncWarn = !!settingsDots().sync
-  pop.innerHTML = '<div class="sp-head"><span class="dot ' + (h ? 'up' : 'down') + '"></span><b>' + esc(h ? h.machine : 'Leftoff') + '</b><span class="faint">' + (h ? (window.leftoffRelay ? 'through the relay' : 'this Mac') : 'offline') + '</span></div>' +
+  pop.innerHTML = '<div class="sp-head"><span class="dot ' + (h ? 'up' : 'down') + '"></span><b>' + esc(h ? h.machine : 'Leftoff') + '</b><span class="faint sp-route">' + (h ? routeLabel() : 'offline') + '</span></div>' +
     (h ? row('Sessions', esc(h.sessionsOpen + ' open') + ' <span class="faint">of ' + esc(h.sessionsTotal) + '</span>') +
       (h.needsYou ? row('Needs you', '<a href="#/waiting">' + esc(h.needsYou) + ' waiting</a>') : '') +
       row('Summaries', esc(h.summarizer + (h.summarizerDetail && h.summarizerDetail.model ? ' · ' + h.summarizerDetail.model : '')) + ' <a href="#/settings/models">Change</a>') +
       relayRows(row) +
       ((h.machines || []).length > 1 && !window.leftoffRelay ? row('Macs', esc(h.machines.join(', '))) : '') +
       row('Sync', '<a href="#/settings/sync">' + esc(syncLine()) + '</a>', syncWarn ? 'warnish' : '') +
-      row('Version', esc('v' + h.version) + (h.update && h.update.available ? ' · <a href="#/settings/updates">v' + esc(h.update.remoteVersion || '?') + ' available</a>' : ' · <a href="#/whats-new">What’s new</a>'))
+      row('Version', esc('v' + h.version) + (h.update && h.update.available ? ' · <a href="#/settings/updates">v' + esc(h.update.remoteVersion || '?') + ' available</a>' : '')) // 0.9.2: What’s new is the button below
       : '<p class="faint">The daemon isn’t answering.</p>') +
     '<div class="sp-row sp-theme"><span class="sp-k">Theme</span><div class="theme" role="group" aria-label="Theme">' + ['light', 'dark', 'system'].map((t) => '<button type="button" data-theme-set="' + t + '" aria-pressed="' + (pref === t) + '">' + THEME_ICONS[t] + (t === 'system' ? 'System' : t[0].toUpperCase() + t.slice(1)) + '</button>').join('') + '</div></div>' +
     '<div class="sp-links"><a href="#/settings">' + icon('settings') + 'Settings</a><a href="#/whats-new">' + icon('sparkles') + 'What’s new</a></div>'
   placeStatus()
 }
+// 0.9.3: the quiet marker for how this board reaches its Mac. On your hosted
+// board: "direct · this Mac" (its own daemon over 127.0.0.1) or "via relay".
+function routeLabel() {
+  const lr = window.leftoffRelay
+  if (!lr) return 'this Mac'
+  return lr.route === 'direct' ? 'direct · this Mac' : 'via relay'
+}
+window.addEventListener('leftoff-route', () => { if (statusOpen()) paintStatus() })
 // Through the relay (v0.6.0): which Mac this board comes from, and a switcher.
 function relayRows(row) {
   const lr = window.leftoffRelay
@@ -3055,7 +3139,11 @@ function paletteActions() {
   const sid = state.route && state.route.name === 's' ? state.route.arg : null
   const s = sid ? (state.sessions || []).find((x) => x.id === sid) : null
   if (s) {
-    if (s.isLocal && !s.agent) out.push({ action: 'checkpoint', id: s.id, title: 'Checkpoint now', sub: s.title || 'this session', icon: 'bookmark-plus' })
+    if (reachOf(s) === 'local' || reachOf(s) === 'peer') { // 0.9.2: any length, and through the Mac it lives on
+      const def = defaultLength()
+      out.push({ action: 'checkpoint', id: s.id, length: def, title: 'Checkpoint now', sub: (s.title || 'this session') + ' · ' + lengthLabel(def), icon: 'bookmark-plus' })
+      for (const o of LENGTH_CHOICES) if (o.key !== def) out.push({ action: 'checkpoint', id: s.id, length: o.key, title: 'Checkpoint now (' + o.label.toLowerCase() + ')', sub: o.blurb, icon: 'bookmark-plus' })
+    }
     if (!s.agent) out.push({ action: 'resume', id: s.id, title: 'Copy resume command', sub: s.title || 'this session', icon: 'copy' })
     if (canProject(s)) out.push({ action: 'project-menu', key: s.repoKey, repo: s.repoLabel || '', title: s.repoProject ? 'Change project…' : 'Add to project…', sub: s.repoLabel || '', icon: 'folder' })
   }
@@ -3097,6 +3185,7 @@ function runPaletteItem(it) {
   if (it.id) b.dataset.id = it.id
   if (it.key) b.dataset.key = it.key
   if (it.repo) b.dataset.repo = it.repo
+  if (it.length) b.dataset.length = it.length
   b.className = 'palette-proxy'
   const anchor = document.getElementById('searchBtn')
   if (anchor) { lastMenuAnchor = anchor }
@@ -3542,10 +3631,27 @@ 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
+      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')) toast('Writing a checkpoint…', 20000) // from the ⋯ menu (closed) or ⌘K
-      const cp = await api('POST', '/v1/sessions/' + encodeURIComponent(id) + '/checkpoints', { trigger: 'manual', generate: true })
-      toast('Checkpoint saved · Next: ' + cp.next)
+      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)
+      render()
+    } else if (action === 'cp-lengths') {
+      ev.preventDefault(); return openLengthMenu(btn, id)
+    } else if (action === 'peer-recheck') {
+      const m = btn.dataset.machine
+      toast('Checking ' + (m || 'the other Mac') + '…', 8000)
+      try {
+        const o = await api('POST', '/v1/peers/check', {})
+        const p = (o.peers || []).find((x) => x.name === m || x.machine === m)
+        toast(p && p.usable && p.usable.ok ? m + ' is reachable again' : 'Still can’t reach ' + (m || 'it') + (p && p.usable && p.usable.reason ? ': ' + p.usable.reason : ''), 6000)
+      } catch (e) { toast(e.message, 5000) }
       render()
     } else if (action === 'pin') {
       await api('PATCH', '/v1/sessions/' + encodeURIComponent(id), { pinned: !(s && s.pinned) }); render()

package/ui/direct.js

@@ -0,0 +1,114 @@
+// 0.9.3: "direct when on the same Mac". The hosted board (<user>.leftoff.dev)
+// open on a Mac that runs Leftoff asks that Mac's own daemon over
+// http://127.0.0.1:7429 instead of through the relay; the address bar stays.
+//
+// The request is the very envelope the relay would carry (ui/relay-crypto.js),
+// posted to /v1/relay/direct (src/direct.js) instead of /_relay/api. So going
+// direct needs no new trust: the daemon opens it with this browser's paired
+// key, and the board only believes an answer that opens with the same key.
+// Before it switches, the board checks: the daemon says it is on this account
+// (user) and a Mac you didn't steer away from (picked), and a sealed round
+// trip through it works (verify). A stranger's Leftoff on the port fails all
+// of it, and the browser refuses it anyway (CORS is for this Mac's own name).
+//
+// When anything about the direct path fails (the daemon stopped, Safari
+// refusing http://127.0.0.1 from an https page, a Local Network Access
+// "Block"), the call goes again through the relay once, quietly, and the board
+// stays on the relay until a later probe (every minute, or when the tab comes
+// back) finds the direct path again. Plain logic, no DOM: unit tested.
+import { LOCAL_PORT, isPhoneUa } from './viewer.js'
+
+export const DIRECT_PATH = '/v1/relay/direct'
+export const PROBE_EVERY_MS = 60000
+export const FOCUS_GAP_MS = 10000
+export function directUrl(port = LOCAL_PORT) { return 'http://127.0.0.1:' + port + DIRECT_PATH }
+
+export class DirectError extends Error { constructor(code, message) { super(message || code); this.code = code } }
+
+// What the local daemon said -> its machine when it may serve this board, else null.
+export function directMatch(info, { user, picked } = {}) {
+  if (!info || info.app !== 'leftoff' || !info.direct || typeof info.machine !== 'string' || !info.machine) return null
+  if (!user || String(info.user || '').toLowerCase() !== String(user).toLowerCase()) return null
+  if (picked && picked !== info.machine) return null
+  return info.machine
+}
+
+// A sealed request's body may only be read once; a fallback needs it again.
+export function aborted(signal) { return !!(signal && signal.aborted) }
+
+export class DirectRoute {
+  constructor({ user, port = LOCAL_PORT, fetchImpl, now = () => Date.now(), ua = '', maxTouchPoints = 0, every = PROBE_EVERY_MS, focusGap = FOCUS_GAP_MS } = {}) {
+    this.user = user; this.port = port; this.fetchImpl = fetchImpl; this.now = now
+    // a phone or tablet never runs Leftoff: don't ask (and don't trip a permission prompt)
+    this.never = isPhoneUa(ua, { maxTouchPoints })
+    this.every = every; this.focusGap = focusGap
+    this.on = false; this.machine = null; this.checkedAt = 0; this.inflight = null; this.lastError = null; this.latencyMs = null
+  }
+  get url() { return directUrl(this.port) }
+
+  // -> the machine (direct confirmed, not yet switched on) or null. Never throws.
+  probe({ picked = null, verify = null, timeoutMs = 1500 } = {}) {
+    if (this.never) return Promise.resolve(null)
+    if (this.inflight) return this.inflight
+    this.inflight = (async () => {
+      this.checkedAt = this.now()
+      const t0 = this.now()
+      let info
+      try {
+        const r = await this.fetchImpl(this.url, { mode: 'cors', credentials: 'omit', cache: 'no-store', signal: timeoutSignal(timeoutMs) })
+        if (r.status !== 200) return null
+        info = await r.json()
+      } catch { return null }
+      const m = directMatch(info, { user: this.user, picked })
+      if (!m) return null
+      if (verify) { let ok = false; try { ok = await verify(m) } catch { ok = false } if (!ok) return null }
+      this.latencyMs = Math.max(0, Math.round(this.now() - t0))
+      return m
+    })().finally(() => { this.inflight = null })
+    return this.inflight
+  }
+  use(machine) { this.on = true; this.machine = machine; this.lastError = null }
+  drop(err) { this.on = false; this.lastError = err ? (err.code || err.message || String(err)) : null; this.checkedAt = this.now() }
+  // time for another look? (focus: sooner, but not on every click into the window)
+  due({ focus = false } = {}) {
+    if (this.never || this.on || this.inflight) return false
+    return this.now() - this.checkedAt >= (focus ? this.focusGap : this.every)
+  }
+
+  // POST the sealed envelope; -> the sealed response envelope. Throws DirectError.
+  async send(env, { signal } = {}) {
+    let r
+    try {
+      r = await this.fetchImpl(this.url, { method: 'POST', mode: 'cors', credentials: 'omit', cache: 'no-store', headers: { 'content-type': 'application/json' }, body: JSON.stringify({ env }), signal })
+    } catch (e) { if (aborted(signal)) throw e; throw new DirectError('unreachable', e && e.message) }
+    if (r.status !== 200) throw new DirectError('http_' + r.status)
+    let j
+    try { j = await r.json() } catch { throw new DirectError('bad_response') }
+    if (!j || !j.env) throw new DirectError('bad_response')
+    return j.env
+  }
+}
+
+// One call: direct when it's on, else (or when direct fails) the relay, once.
+// A call the page itself aborted is not retried.
+export async function directOrRelay({ route, direct, relay, signal, onDrop = () => {} }) {
+  if (route && route.on) {
+    try { return await direct() } catch (e) {
+      if (aborted(signal)) throw e
+      route.drop(e)
+      try { onDrop(e) } catch {}
+    }
+  }
+  return relay()
+}
+
+// A sealed response -> a fetch Response (204/304 carry no body).
+export function toResponse(out) {
+  const nullBody = out.s === 204 || out.s === 205 || out.s === 304
+  return new Response(nullBody ? null : out.b, { status: out.s, headers: out.h })
+}
+
+function timeoutSignal(ms) {
+  if (typeof AbortSignal !== 'undefined' && AbortSignal.timeout) return AbortSignal.timeout(ms)
+  const c = new AbortController(); setTimeout(() => c.abort(), ms); return c.signal
+}

package/ui/icons.js

@@ -31,6 +31,9 @@ export const ICONS = {
   "shield": "<path d=\"M20 13c0 5-3.5 7.5-7.66 8.95a1 1 0 0 1-.67-.01C7.5 20.5 4 18 4 13V6a1 1 0 0 1 1-1c2 0 4.5-1.2 6.24-2.72a1.17 1.17 0 0 1 1.52 0C14.51 3.81 17 5 19 5a1 1 0 0 1 1 1z\"/>",
   "info": "<circle cx=\"12\" cy=\"12\" r=\"10\"/> <path d=\"M12 16v-4\"/> <path d=\"M12 8h.01\"/>",
   "chevron-right": "<path d=\"m9 18 6-6-6-6\"/>",
+  "chevron-down": "<path d=\"m6 9 6 6 6-6\"/>",
+  "wifi-off": "<path d=\"M12 20h.01\"/> <path d=\"M8.5 16.429a5 5 0 0 1 7 0\"/> <path d=\"M5 12.859a10 10 0 0 1 5.17-2.69\"/> <path d=\"M19 12.859a10 10 0 0 0-2.007-1.523\"/> <path d=\"M2 8.82a15 15 0 0 1 4.177-2.643\"/> <path d=\"M22 8.82a15 15 0 0 0-11.288-3.764\"/> <path d=\"m2 2 20 20\"/>",
+  "monitor": "<rect width=\"20\" height=\"14\" x=\"2\" y=\"3\" rx=\"2\"/> <line x1=\"8\" x2=\"16\" y1=\"21\" y2=\"21\"/> <line x1=\"12\" x2=\"12\" y1=\"17\" y2=\"21\"/>",
   "chevron-left": "<path d=\"m15 18-6-6 6-6\"/>",
   "mail": "<rect width=\"20\" height=\"16\" x=\"2\" y=\"4\" rx=\"2\"/> <path d=\"m22 7-8.97 5.7a1.94 1.94 0 0 1-2.06 0L2 7\"/>",
   "search": "<circle cx=\"11\" cy=\"11\" r=\"8\"/> <path d=\"m21 21-4.3-4.3\"/>",