@leftoff/cli 0.9.9-beta.4 → 0.9.9-beta.6

package/docs/SECURITY.md

@@ -111,9 +111,11 @@ Live link is opt-in, per session: only sessions started with `leftoff live` have
 **New session** starts Claude Code on a Mac you pick, headless (`claude -p` with stream-json in and out, run by that Mac's daemon). That is more than answering a prompt (a new agent in your repo, on your Claude plan), so:
 
 - **This Mac's own board** starts it at once. **A phone or another Mac** may start one only when that Mac has *Allow starting sessions from other devices* on (Settings → Privacy & security, off by default) **and** *Trust my paired devices* is on. The switch is kept on that Mac (`~/.config/checkpoints/local/`, not the synced folder, so turning it on one Mac never turns it on another) and only that Mac's own browser can change it (loopback; a phone, the relay or a peer gets 403). Every start from another device shows a notification on the Mac. With the switch off, the request waits up to 5 minutes for a yes on that Mac's board, like Remote Restore. At most 3 wait at once; 3 starts at once, then 1 a minute.
-- **Only repos that Mac has already run Claude Code in** (from its session records; no typed paths). A headless run loads a repo's hooks and `.mcp.json` without the trust dialog, so a folder nobody opened in Claude Code can't be started.
+- **The repo list is folders that Mac has already run Claude Code in** (from its session records; no typed paths). A headless run loads a repo's hooks and `.mcp.json` without the trust dialog, so a folder Claude Code never ran in is treated as a first time:
+  - **Other folder…** browses that Mac's folders: names only (never a file or what's in one), inside your home by real path (a symlink out of home is refused or left out), never the synced Leftoff folder or anything in it, no hidden folders, `node_modules` or `Library`, at most 500 per listing. Another Mac's are read over the peer link (`fs.dirs`, not an open action, the same as any read), a phone's through the relay. Nothing is written.
+  - **A first time starts at once only from that Mac's own board** (loopback, or your hosted board open on it): you are the trust prompt. From a phone or another Mac it **always** waits for a yes on that Mac's board, even with *Allow starting sessions from other devices* on, and the ask and the notification say "first time in <folder>; this runs its hooks". After one run it's in the list like the rest. Home itself is refused; a folder that isn't a git repo can't get a new worktree.
 - **Permission mode `default`, always passed.** Reads in the repo run; every edit and command becomes a Needs-you request (here, the phone, any board; first answer wins) and waits for it, with no 9.5-minute cap since nobody is at a terminal. A request settled any other way is a no. Never `bypassPermissions` or `auto`. AskUserQuestion is answered "ask in words", so Claude asks in plain text and you reply in Live.
-- **Other Macs** reach it over the signed, encrypted peer link (`session.start`, `session.start.get`, `session.headless`; not open actions, so the target Mac's *Allow other machines* applies too).
+- **Other Macs** reach it over the signed, encrypted peer link (`session.start`, `session.start.get`, `session.headless`, `fs.dirs`; not open actions, so the target Mac's *Allow other machines* applies too).
 - **Nothing new in the folder.** The card, its title and checkpoints as for any session, plus `startedFrom` (device and how it came, not the prompt) and the run's state. Stream output, stdin and stderr stay in the daemon's memory; Claude's transcript stays in `~/.claude` on that Mac; the Live thread and attachments stay where Live keeps them (`~/.config/checkpoints`).
 - **Keeping the Mac awake.** While a turn runs, the daemon holds `caffeinate -i -w <pid>` (idle sleep waits; a closed lid on battery still sleeps). Stop interrupts the turn, closes stdin, then SIGINT, then SIGTERM. A daemon that stops pauses its sessions.
 - **Logged:** one daemon-log line per start, stop and permission request (session id and tool, never prompt text).

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

@@ -1,6 +1,6 @@
 {
   "name": "leftoff",
-  "version": "0.9.9-beta.4",
+  "version": "0.9.9-beta.6",
   "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

@@ -914,8 +914,8 @@ export function applyEvent(s, ev) {
       s.inTurn = false
       s.activeSince = null
       s.needsInput = false
-      if (d.countTurn !== false) s.turns = (s.turns || 0) + 1 // false: Codex already counted it at the start
-      s.turnsSinceCheckpoint = (s.turnsSinceCheckpoint || 0) + 1
+      if (d.countTurn !== false && !d.again) s.turns = (s.turns || 0) + 1 // false: Codex already counted it at the start
+      if (!d.again) s.turnsSinceCheckpoint = (s.turnsSinceCheckpoint || 0) + 1 // again (0.9.9): a late report of a turn already ended and counted
       s.backgroundTasks = Number(d.backgroundTasks || 0) + Number(d.sessionCrons || 0)
       if (d.lastAssistantPreview) s.lastPreview = clip(d.lastAssistantPreview, 280)
       // Claude ended the turn on a question to you (v0.4.4): the board offers a reply.

package/mod/hooks/register.js

@@ -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.9-beta.4' // keep in step with .claude-plugin/plugin.json
+const MOD_VERSION = '0.9.9-beta.6' // keep in step with .claude-plugin/plugin.json
 
 const st = {
   internal: false,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leftoff/cli",
-  "version": "0.9.9-beta.4",
+  "version": "0.9.9-beta.6",
   "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

@@ -2869,7 +2869,6 @@ del.gd-x { background: var(--gd-del-word); }
 .start-ask { padding: 10px 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--bg2); font-size: 13.5px; display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
 .start-ask.wait { border-color: var(--yellow); background: var(--tint-yellow); }
 .start-ask.bad { border-color: var(--red); background: var(--tint-red); }
-.btn.start-new { min-height: 36px; }
 .headless-bar { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin: 4px 0 10px; padding: 8px 12px; border-radius: 10px; border: 1px solid var(--line); background: var(--bg2); font-size: 13px; color: var(--text2); }
 .headless-bar .grow { flex: 1 1 200px; display: inline-flex; align-items: center; gap: 6px; min-width: 0; }
 .headless-bar.running { border-color: var(--green); background: var(--tint-green); }
@@ -2880,6 +2879,75 @@ del.gd-x { background: var(--gd-del-word); }
   .start-opts { grid-template-columns: 1fr; }
   .start-where { grid-template-columns: 1fr 1fr; }
   .start-opt { min-height: 48px; }
-  .btn.start-new { min-height: 44px; }
   .start-ask-banner .btn, .start-ask .btn { min-height: 44px; }
 }
+
+/* 0.9.9 New session: a + in the top bar on a phone (next to search); on a
+   desktop the button in the board's header row, like the buttons beside it */
+.topright .newbtn { display: none; }
+.newbtn .lbl { display: none; }
+.newbtn[data-tip]::after { content: attr(data-tip); display: none; position: absolute; top: calc(100% + 4px); right: 0; width: max-content; padding: 4px 8px; border-radius: 7px; background: var(--card2); border: 1px solid var(--line-strong); box-shadow: var(--toast-shadow); color: var(--text2); font-size: 12px; line-height: 1.3; font-weight: 500; white-space: nowrap; pointer-events: none; z-index: 20; }
+@media (hover: hover) { .newbtn[data-tip]:hover::after { display: block; } }
+@media (max-width: 640px) {
+  .topright .newbtn { display: grid; place-items: center; width: 44px; height: 44px; }
+  .pagehead .actions .start-new { display: none; }
+}
+/* A request banner on a phone (start or Restore asked from another device,
+   the restore banner): the words use the whole width, the buttons a row of
+   their own below, 44px tall */
+@media (max-width: 640px) {
+  .start-ask-banner > .grow, .restore-ask > .grow, .banner.restore:not(.open) > .grow, .pair-ask > .grow { flex: 1 1 100%; }
+  .start-ask-banner > .btn, .restore-ask > .btn, .banner.restore:not(.open) > .btn:not(.x), .pair-ask > .btn { flex: 1 1 0; justify-content: center; min-height: 44px; }
+  .restore-ask > .rs-m { flex: 1 1 100%; }
+}
+
+/* 0.9.9 Other folder…: the inline folder browser (full width; no popover) */
+.start-other .start-opt-main { display: inline-flex; align-items: center; gap: 6px; }
+.start-other .ic { width: 16px; height: 16px; color: var(--muted); }
+.start-other { border-style: dashed; }
+.start-badge { display: inline-block; margin-left: 4px; padding: 0 6px; border-radius: 6px; border: 1px solid var(--line); font-size: 11px; font-weight: 600; line-height: 18px; color: var(--muted); background: var(--bg2); vertical-align: 1px; }
+.start-badge.git { color: var(--green); border-color: color-mix(in srgb, var(--green) 40%, var(--line)); }
+.start-badge.new { color: var(--yellow); border-color: color-mix(in srgb, var(--yellow) 50%, var(--line)); }
+.start-first { color: var(--text); }
+.start-browse { display: flex; flex-direction: column; gap: 10px; padding: 12px; border: 1px solid var(--line); border-radius: 12px; background: var(--bg2); min-width: 0; }
+.sb-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 2px; min-width: 0; }
+.sb-crumb { min-height: 44px; min-width: 44px; padding: 0 8px; border: 0; border-radius: 8px; background: none; color: var(--accent); font: inherit; font-size: 14px; cursor: pointer; overflow-wrap: anywhere; text-align: left; }
+.sb-crumb[aria-current] { color: var(--text); font-weight: 600; cursor: default; }
+.sb-crumb:hover:not([aria-current]) { background: var(--card); }
+.sb-sep { color: var(--faint); }
+.sb-here { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
+.sb-here .btn { min-height: 44px; }
+.sb-cur { flex: 1 1 160px; min-width: 0; font-size: 13px; color: var(--text2); overflow-wrap: anywhere; }
+.sb-cur-name { font-family: var(--mono); font-size: 12.5px; }
+.sb-cuts { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; }
+.sb-cuts-l { font-size: 12px; color: var(--muted); }
+.sb-cut { min-height: 44px; min-width: 44px; padding: 0 12px; border: 1px solid var(--line); border-radius: 22px; background: var(--card); color: var(--text2); font: inherit; font-family: var(--mono); font-size: 12.5px; cursor: pointer; }
+.sb-cut:hover { border-color: var(--line-strong); }
+.sb-list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 6px; max-height: 360px; overflow: auto; }
+.sb-dir { width: 100%; min-height: 44px; display: flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid var(--line); border-radius: 9px; background: var(--card); color: var(--text); font: inherit; font-size: 14px; text-align: left; cursor: pointer; min-width: 0; }
+.sb-dir:hover { border-color: var(--line-strong); }
+.sb-dir .ic { width: 16px; height: 16px; flex: none; color: var(--muted); }
+.sb-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
+.sb-dir .sb-go { color: var(--faint); }
+.sb-foot { display: flex; justify-content: flex-end; }
+.sb-foot .btn { min-height: 44px; }
+.sb-crumb:focus-visible, .sb-cut:focus-visible, .sb-dir:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+/* Go to a folder: type a path you know */
+.sb-path { display: flex; flex-direction: column; gap: 4px; margin: 0; }
+.sb-path-l { font-size: 12px; color: var(--muted); }
+.sb-path-row { display: flex; gap: 8px; min-width: 0; }
+.sb-path-in { flex: 1 1 auto; min-width: 0; min-height: 44px; padding: 0 12px; border: 1px solid var(--line); border-radius: 9px; background: var(--card); color: var(--text); font: inherit; font-family: var(--mono); font-size: 16px; }
+.sb-path-in:focus-visible { outline: 2px solid var(--accent); outline-offset: 1px; }
+.sb-path-in[aria-invalid="true"] { border-color: var(--red); }
+.sb-path-row .btn { min-height: 44px; min-width: 44px; justify-content: center; }
+.sb-path-err { margin: 0; }
+.start-custom .start-opt-main { white-space: normal; }
+@media (max-width: 640px) {
+  .start-browse { padding: 10px; margin-left: -4px; margin-right: -4px; }
+  .sb-list { grid-template-columns: 1fr; max-height: none; overflow: visible; }
+  .sb-here .sb-use { flex: 1 1 100%; justify-content: center; }
+}
+
+/* 0.9.9 asked at pairing time: may other devices start sessions here? */
+.pair-ask .grow { min-width: 0; }
+@media (pointer: coarse) { .pair-ask > .btn { min-height: 44px; } }

package/ui/app.js

@@ -16,7 +16,7 @@ import { navHideStep, NAVHIDE_TYPING } from './navhide.js'
 import { openLightbox } from './lightbox.js' // 0.9.8: the image preview
 import { openPdfView, pdfThumb } from './pdfview.js' // 0.9.8: the PDF preview (pdf.js loads on the first PDF)
 import { isBlank, composerKey, isTouchUi, composerHeight, composerBoxHtml } from './composer.js' // 0.9.8 the Live composer
-import { startPageHtml, startPick, startAsksBanner, headlessBarHtml, startsSettingHtml, startViewerLocal as startViewerAt } from './start.js' // 0.9.9 New session
+import { startPageHtml, startPick, startAsksBanner, headlessBarHtml, startsSettingHtml, startViewerLocal as startViewerAt, startTexts, fillStartTexts, browseTarget, startPairAskHtml, typedPath } from './start.js' // 0.9.9 New session
 import { attachPlan, skippedText, shortName, prepareFile, uploadFile, fetchAttachment, fmtSize, attachKind, pastedName, ATTACH_MAX_FILES } from './attach.js' // 0.9.8 attachments
 import { wireTips } from './tips.js'
 import { mountUpdateBar, takeCarry } from './update-bar.js' // 0.9.8 "Leftoff updated · Refresh"
@@ -841,6 +841,7 @@ async function viewBoard() {
     '<a class="btn primary" href="#/catchup/new">' + icon('coffee') + 'Catch me up</a>' +
     '<a class="btn" href="#/digest">' + icon('newspaper') + 'Today’s digest →</a></div></div>'
   html += syncDetails() + staleLine(sessions)
+  html += startPairAskHtml(state.starts, { esc, local: startViewerLocal(state.starts && state.starts.viewer), busy: startUi.pairBusy }) // 0.9.9: asked once, at pairing time
   html += restoreAsksBanner() + startAsksBanner(state.starts, { esc, icon, local: startViewerLocal(state.starts && state.starts.viewer), clock, busy: startUi.busy }) + restoreBanner()
   // Needs you (v0.4.4): every session waiting on you, whatever the filters, longest wait first.
   const needs = needsItems(sessions)
@@ -945,6 +946,7 @@ function boardSearchWire() {
       try { history.replaceState(null, '', hashFor(state.boardFilter || { repos: [], status: null })) } catch {}
       state.route = parseRoute()
       await viewBoard() // the box isn't rebuilt, so the caret stays wherever you've typed to since
+      fillStartTexts($app, startTexts(state.starts, {}))
     }, 160)
   })
   q.addEventListener('keydown', (ev) => {
@@ -4155,6 +4157,7 @@ async function render() {
     else await viewBoard()
     tabsAfterRender()
     fillHeadlessErrors()
+    if (r.name !== 'new') fillStartTexts($app, startTexts(state.starts, {})) // 0.9.9: a waiting start's folder, as text
     // a Needs-you Reply composer (0.9.8) fits a restored multi-line draft
     for (const ta of $app.querySelectorAll('.reply-composer .composer-input')) fitComposer(ta)
   } catch (e) {
@@ -4167,15 +4170,55 @@ async function render() {
 
 // this Mac's own browser, or the hosted board open on it (the direct door)
 function startViewerLocal(v) { return startViewerAt(v, state.viewerLocal !== false) }
-const startUi = { data: null, machine: null, repo: null, where: 'repo', allRepos: false, ask: null, busy: new Set(), sending: false, poll: null }
+const startUi = { data: null, machine: null, repo: null, where: 'repo', allRepos: false, ask: null, busy: new Set(), sending: false, poll: null, browse: null, custom: null }
 async function viewNewSession() {
   try { startUi.data = await api('GET', '/v1/start') } catch (e) { if (!startUi.data) throw e }
   const fa = document.activeElement
   const kf = fa && fa.classList && fa.classList.contains('start-text') ? { a: fa.selectionStart, b: fa.selectionEnd } : null
   $app.innerHTML = startPageHtml(startUi.data, startUi, { esc, icon, emoji: mEmoji, local: startViewerLocal(startUi.data.viewer), clock, draft: (state.drafts && state.drafts.start) || '', busy: startUi.sending })
+  fillStartTexts($app, startTexts(startUi.data, startUi)) // folder names and paths: text, never markup
+  { const pi = $app.querySelector('.sb-path-in'); if (pi && startUi.browse && startUi.browse.typed && pi.value !== startUi.browse.typed) pi.value = startUi.browse.typed } // what you were typing survives a redraw
   const ta = $app.querySelector('.start-text')
   if (ta) { fitComposer(ta); if (kf && !ta.disabled) { ta.focus({ preventScroll: true }); try { ta.setSelectionRange(kf.a, kf.b) } catch {} } }
 }
+// Other folder…: list one folder on the picked Mac (that Mac's own disk, over the peer link for another Mac)
+async function startBrowse(machine, p, { typed = false } = {}) {
+  const seq = (startUi.browseSeq = (startUi.browseSeq || 0) + 1)
+  const prev = startUi.browse && startUi.browse.machine === machine ? startUi.browse : {}
+  startUi.browse = { ...prev, machine, loading: true, error: null, pathError: null }
+  if (state.route && state.route.name === 'new') render()
+  try {
+    const d = await api('GET', '/v1/start/dirs?machine=' + encodeURIComponent(machine) + (p ? '&path=' + encodeURIComponent(p) : ''), undefined, { timeoutMs: 20000 })
+    if (seq !== startUi.browseSeq || !startUi.browse) return
+    startUi.browse = { machine, loading: false, error: null, pathError: null, typed: typed ? '' : startUi.browse.typed, data: d }
+  } catch (e) {
+    if (seq !== startUi.browseSeq || !startUi.browse) return
+    // a typed path that isn't one you can open: said under the box, and the folder you were in stays
+    startUi.browse = typed ? { ...startUi.browse, loading: false, pathError: e.message } : { ...startUi.browse, loading: false, error: e.message }
+  }
+  if (state.route && state.route.name === 'new') {
+    await render() // the page re-reads before it redraws: focus after
+    const pi = typed && startUi.browse.pathError ? $app.querySelector('.sb-path-in') : null
+    const f = pi || (startUi.browseFocus ? $app.querySelector('.sb-crumb[aria-current]') : null)
+    if (f) f.focus({ preventScroll: true })
+  }
+}
+// "Go to a folder": Enter or Go takes the browser there (the Mac checks it like any other step)
+document.addEventListener('submit', (ev) => {
+  const f = ev.target && ev.target.closest && ev.target.closest('form[data-form="start-browse-path"]')
+  if (!f) return
+  ev.preventDefault()
+  const b = startUi.browse, inp = f.querySelector('.sb-path-in')
+  const want = typedPath(inp ? inp.value : '')
+  if (!b) return
+  if (!want) { startUi.browse = { ...b, pathError: 'Type a folder, like ~/code/web.' }; render().then(() => { const pi = $app.querySelector('.sb-path-in'); if (pi) pi.focus() }); return }
+  startUi.browseFocus = true
+  startBrowse(b.machine, want, { typed: true })
+})
+document.addEventListener('input', (ev) => {
+  if (!ev.target || !ev.target.classList || !ev.target.classList.contains('sb-path-in') || !startUi.browse) return
+  startUi.browse.typed = ev.target.value // kept across the board's redraws
+})
 // Claude Code's own words when a session it ran stopped with an error: text, never markup.
 const headlessErrors = new Map()
 function fillHeadlessErrors() {
@@ -5356,10 +5399,50 @@ document.addEventListener('click', async (ev) => {
     // 0.9.9 New session: the page's choices, the send, a yes or no for a start waiting here, Stop and Resume
     if (action === 'start-pick') {
       const k = btn.dataset.k, v = btn.dataset.v
-      if (k === 'machine') { startUi.machine = v; startUi.repo = null; startUi.allRepos = false } else if (k === 'repo') startUi.repo = v; else if (k === 'where') startUi.where = v === 'worktree' ? 'worktree' : 'repo'
+      if (k === 'machine') { startUi.machine = v; startUi.repo = null; startUi.allRepos = false; startUi.browse = null; startUi.custom = null } else if (k === 'repo') startUi.repo = v; else if (k === 'where') startUi.where = v === 'worktree' ? 'worktree' : 'repo'
       return render()
     }
+    // Other folder…: open the browser at ~, walk it, use a folder
+    if (action === 'start-browse') {
+      const pick = startPick(startUi.data, startUi)
+      if (!pick.m) return
+      if (startUi.browse && startUi.browse.machine === pick.m.machine) { startUi.browse = null; return render() }
+      startUi.browseFocus = false
+      return startBrowse(pick.m.machine, null)
+    }
+    if (action === 'start-browse-go' || action === 'start-browse-up') {
+      const b = startUi.browse
+      const to = action === 'start-browse-up' ? (b && b.data && b.data.parent ? { path: b.data.parent } : null) : browseTarget(b, btn)
+      if (!b || !to) return
+      startUi.browseFocus = true
+      return startBrowse(b.machine, to.path)
+    }
+    if (action === 'start-browse-close') { startUi.browse = null; return render() }
+    if (action === 'start-browse-use') {
+      const b = startUi.browse, d = b && b.data
+      if (!d || !d.parent) return
+      const known = startPick(startUi.data, { ...startUi, machine: b.machine }).m
+      if (d.ran || (known && known.repos.some((r) => r.path === d.path))) startUi.custom = null
+      else startUi.custom = { machine: b.machine, path: d.path, name: d.crumbs[d.crumbs.length - 1].name, label: d.label, git: !!d.git }
+      startUi.repo = d.path
+      if (!d.git) startUi.where = 'repo'
+      startUi.browse = null
+      render()
+      const ta = $app.querySelector('.start-text'); if (ta && !ta.disabled) ta.focus({ preventScroll: true })
+      return
+    }
     if (action === 'start-all-repos') { startUi.allRepos = true; return render() }
+    if (action === 'pair-ask-yes' || action === 'pair-ask-no') {
+      if (startUi.pairBusy) return
+      startUi.pairBusy = true
+      try {
+        const r = await api('POST', '/v1/starts/pair-ask', { yes: action === 'pair-ask-yes' })
+        toast(r.answered === 'yes' ? 'Other devices can start sessions here' + (r.trustTurnedOn ? ' (Trust my paired devices is on too)' : '') : 'OK, they’ll ask here first', 4000)
+      } catch (e) { toast(e.message, 5000) }
+      startUi.pairBusy = false
+      try { state.starts = await api('GET', '/v1/starts') } catch {}
+      return render()
+    }
     if (action === 'start-again') { startUi.ask = null; return render() }
     if (action === 'start-send') return startSend(btn)
     if (action === 'start-ask-confirm' || action === 'start-ask-decline') {
@@ -6107,7 +6190,7 @@ document.addEventListener('submit', async (ev) => {
 
 // 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]), .tip: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)) || !!(document.activeElement && document.activeElement.closest && document.activeElement.closest('.live-box') && document.activeElement.value) || !!(document.activeElement && document.activeElement.closest && document.activeElement.closest('.start-box') && document.activeElement.value)
+const busy = () => !!document.querySelector('.doc-viewer:not([hidden]), .tip: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)) || !!(document.activeElement && document.activeElement.closest && document.activeElement.closest('.live-box') && document.activeElement.value) || !!(document.activeElement && document.activeElement.closest && document.activeElement.closest('.start-box') && document.activeElement.value) || !!(document.activeElement && document.activeElement.classList && document.activeElement.classList.contains('sb-path-in') && document.activeElement.value)
 // Settings isn't redrawn by live updates: it would wipe what you're editing,
 // and the QR code you're scanning (v0.4.6). Its sections fetch their own state.
 function soon() { if (pending) return; pending = setTimeout(() => { pending = null; if (!busy() && !(state.route && ['settings', 'setup'].includes(state.route.name)) && !(state.route && state.route.name === 'catchup' && cuUi.open)) render(); refreshHealth() }, 800) }

package/ui/index.html

@@ -36,6 +36,7 @@
     </nav>
     <div class="topright">
       <button type="button" class="searchbtn" id="searchBtn" title="Search (⌘K)" aria-label="Search" aria-haspopup="dialog" aria-keyshortcuts="Meta+K Control+K /"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><circle cx="11" cy="11" r="8"/> <path d="m21 21-4.3-4.3"/></svg><span class="sb-lbl">Search</span><kbd class="sb-kbd" id="searchKbd">⌘K</kbd></button>
+      <a href="#/new" data-route="new" id="newTab" class="iconbtn newbtn" data-tip="New session" aria-label="New session"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M5 12h14"/> <path d="M12 5v14"/></svg><span class="lbl">New session</span></a>
       <button type="button" class="health" id="health" title="Status" aria-haspopup="dialog" aria-expanded="false" aria-controls="statusPop"><span class="dot"></span><span class="label">connecting…</span></button>
       <a href="#/whats-new" data-route="whats-new" id="wnTab" class="iconbtn" title="What’s new" aria-label="What’s new"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M11.017 2.814a1 1 0 0 1 1.966 0l1.051 5.558a2 2 0 0 0 1.594 1.594l5.558 1.051a1 1 0 0 1 0 1.966l-5.558 1.051a2 2 0 0 0-1.594 1.594l-1.051 5.558a1 1 0 0 1-1.966 0l-1.051-5.558a2 2 0 0 0-1.594-1.594l-5.558-1.051a1 1 0 0 1 0-1.966l5.558-1.051a2 2 0 0 0 1.594-1.594z"/> <path d="M20 2v4"/> <path d="M22 4h-4"/> <circle cx="4" cy="20" r="2"/></svg><span class="lbl">What’s new</span><span class="newdot" hidden></span></a>
       <a href="#/settings" data-route="settings" id="setTab" class="iconbtn" title="Settings" aria-label="Settings"><svg class="ic" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2" stroke-linecap="round" stroke-linejoin="round" aria-hidden="true" focusable="false"><path d="M9.671 4.136a2.34 2.34 0 0 1 4.659 0 2.34 2.34 0 0 0 3.319 1.915 2.34 2.34 0 0 1 2.33 4.033 2.34 2.34 0 0 0 0 3.831 2.34 2.34 0 0 1-2.33 4.033 2.34 2.34 0 0 0-3.319 1.915 2.34 2.34 0 0 1-4.659 0 2.34 2.34 0 0 0-3.32-1.915 2.34 2.34 0 0 1-2.33-4.033 2.34 2.34 0 0 0 0-3.831A2.34 2.34 0 0 1 6.35 6.051a2.34 2.34 0 0 0 3.319-1.915"/> <circle cx="12" cy="12" r="3"/></svg><span class="lbl">Settings</span><span class="topdot" hidden></span></a>

package/ui/start.js

@@ -21,8 +21,11 @@ export function startPick(data, ui = {}) {
   const ms = (data && data.machines) || []
   const m = ms.find((x) => x.machine === ui.machine && x.online) || ms.find((x) => x.here && x.online && x.repos.length) || ms.find((x) => x.online && x.repos.length) || ms.find((x) => x.here) || ms[0] || null
   const repos = m ? m.repos : []
-  const repo = repos.find((r) => r.path === ui.repo) || repos[0] || null
-  return { m, repo, where: ui.where === 'worktree' ? 'worktree' : 'repo' }
+  // Other folder…: a folder that Mac hasn't run Claude Code in (ui.custom), picked in the browser
+  const custom = m && ui.custom && ui.custom.machine === m.machine && ui.custom.path === ui.repo && !repos.some((r) => r.path === ui.custom.path) ? { ...ui.custom, isNew: true } : null
+  const repo = repos.find((r) => r.path === ui.repo) || custom || repos[0] || null
+  const where = ui.where === 'worktree' && !(repo && repo.git === false) ? 'worktree' : 'repo'
+  return { m, repo, where }
 }
 
 // What happens when you press ↑, in one sentence (or why you can't).
@@ -31,7 +34,10 @@ export function startRule(data, pick, { local = true } = {}) {
   if (!m) return { ok: false, text: 'No Mac to start on.' }
   if (!local && !data.trust) return { ok: false, text: 'Turn on Trust my paired devices on a Mac first (Settings → Privacy & security), so you can answer its prompts from here.' }
   if (!m.online) return { ok: false, text: m.machine + ' is offline right now.' }
-  if (!pick.repo) return { ok: false, text: m.machine + ' hasn’t run Claude Code in a repo yet. Open Claude Code there once and it shows up here.' }
+  if (!pick.repo) return { ok: false, text: m.machine + ' hasn’t run Claude Code in a repo yet. Pick Other folder…, or open Claude Code there once and it shows up here.' }
+  // a folder that Mac hasn't run Claude Code in: its hooks run, so only a person at that Mac says yes
+  if (pick.repo.isNew && m.here && local) return { ok: true, text: 'First time Claude Code runs in this folder on this Mac: it starts right away and runs the folder’s hooks and MCP servers.' }
+  if (pick.repo.isNew) return { ok: true, text: 'First time in this folder on ' + m.machine + ', so someone there confirms it first (it runs the folder’s hooks), even with “Allow starting sessions from other devices” on.' }
   if (m.here && local) return { ok: true, text: 'It starts right away on this Mac.' }
   if (m.here && m.allowRemote === true) return { ok: true, text: 'It starts right away, and ' + m.machine + ' shows a notification.' }
   if (m.here) return { ok: true, text: 'Someone at ' + m.machine + ' confirms it first (up to 5 minutes). To skip that, turn on “Allow starting sessions from other devices” in its Settings.' }
@@ -54,7 +60,7 @@ function opt({ k, v, label, sub = '', on = false, disabled = false, esc }) {
 // The waiting line after a start that has to be confirmed at the Mac.
 export function startAskLine(ask, { clock = (x) => x } = {}) {
   if (!ask) return null
-  if (ask.state === 'pending') return { tone: 'wait', text: 'Waiting for a yes on ' + ask.machine + ' (until ' + clock(ask.expiresAt) + '). It shows on that Mac’s board and as a notification.' }
+  if (ask.state === 'pending') return { tone: 'wait', text: 'Waiting for a yes on ' + ask.machine + ' (until ' + clock(ask.expiresAt) + '). It shows on that Mac’s board and as a notification.' + (ask.firstTime ? ' A first time in a folder always asks there.' : '') }
   if (ask.state === 'starting') return { tone: 'wait', text: 'Starting on ' + ask.machine + '…' }
   if (ask.state === 'declined') return { tone: 'bad', text: 'Declined on ' + ask.machine + '.' }
   if (ask.state === 'expired') return { tone: 'bad', text: 'Nobody confirmed it on ' + ask.machine + ' in time.' }
@@ -78,19 +84,25 @@ export function startPageHtml(data, ui = {}, { esc, icon, emoji = () => '', loca
   const repos = pick.m ? pick.m.repos : []
   const all = !!ui.allRepos || repos.length <= REPOS_SHOWN + 1
   const shown = all ? repos : repos.slice(0, REPOS_SHOWN).concat(pick.repo && repos.indexOf(pick.repo) >= REPOS_SHOWN ? [pick.repo] : [])
+  const custom = pick.repo && pick.repo.isNew ? pick.repo : null
+  const browsing = !!(pick.m && ui.browse && ui.browse.machine === pick.m.machine)
   h += '<section class="start-sec"><h2 class="start-h">Repo</h2>'
-  if (!repos.length) h += '<p class="start-empty">' + esc(pick.m ? pick.m.machine + ' hasn’t run Claude Code in a repo yet.' : 'No Mac yet.') + '</p>'
-  else {
+  if (!repos.length && !custom) h += '<p class="start-empty">' + esc(pick.m ? pick.m.machine + ' hasn’t run Claude Code in a repo yet.' : 'No Mac yet.') + '</p>'
+  if (pick.m) {
     h += '<div class="start-opts" role="radiogroup" aria-label="Repo">' + shown.map((r) => opt({ k: 'repo', v: r.path, on: !!pick.repo && r.path === pick.repo.path, esc,
-      label: esc(r.name) + (r.branch ? ' <span class="start-branch">' + esc(r.branch) + '</span>' : ''), sub: esc(r.path.replace(/^\/Users\/[^/]+/, '~')) + (r.lastAt ? ' · ' + esc(ago(r.lastAt, now)) : '') })).join('') + '</div>'
+      label: esc(r.name) + (r.branch ? ' <span class="start-branch">' + esc(r.branch) + '</span>' : ''), sub: esc(r.path.replace(/^\/Users\/[^/]+/, '~')) + (r.lastAt ? ' · ' + esc(ago(r.lastAt, now)) : '') + (r.git === false ? ' · not a git repo' : '') })).join('') +
+      // the folder picked with Other folder… (its name and path go in as text: [data-st], startTexts)
+      (custom ? '<button type="button" class="start-opt start-custom" role="radio" aria-checked="true" data-action="start-pick" data-k="repo" data-v="' + esc(custom.path) + '"><span class="start-opt-main"><span data-st="custom-name"></span> <span class="start-badge new">first time here</span>' + (custom.git ? '' : ' <span class="start-badge">not a git repo</span>') + '</span><span class="start-opt-sub" data-st="custom-path"></span></button>' : '') +
+      (pick.m.online ? '<button type="button" class="start-opt start-other" data-action="start-browse" aria-expanded="' + browsing + '"' + (browsing ? ' aria-controls="start-browse"' : '') + '><span class="start-opt-main">' + icon('folder') + 'Other folder…</span><span class="start-opt-sub">Browse ' + esc(pick.m.machine) + '’s folders</span></button>' : '') + '</div>'
     if (!all) h += '<button type="button" class="btn start-more" data-action="start-all-repos">Show all ' + repos.length + '</button>'
-    h += '<p class="start-hint">Only repos ' + esc(pick.m.machine) + ' has already run Claude Code in.</p>'
+    if (browsing) h += startBrowseHtml(ui.browse, { esc, icon, machine: pick.m.machine })
+    if (repos.length) h += '<p class="start-hint">Listed: repos ' + esc(pick.m.machine) + ' has already run Claude Code in. Other folder… picks any folder in your home there; the first time, ' + (pick.m.here && local ? 'starting it is your yes to its hooks.' : 'someone at ' + esc(pick.m.machine) + ' says yes first.') + '</p>'
   }
   h += '</section>'
   // Where
   h += '<section class="start-sec"><h2 class="start-h">Where</h2><div class="start-opts start-where" role="radiogroup" aria-label="Where">' +
     opt({ k: 'where', v: 'repo', on: pick.where === 'repo', esc, label: 'In the repo', sub: 'on its current branch' }) +
-    opt({ k: 'where', v: 'worktree', on: pick.where === 'worktree', esc, label: 'New worktree', sub: 'its own branch and folder' }) +
+    opt({ k: 'where', v: 'worktree', on: pick.where === 'worktree', esc, label: 'New worktree', sub: pick.repo && pick.repo.git === false ? 'needs a git repo' : 'its own branch and folder', disabled: !!(pick.repo && pick.repo.git === false) }) +
     '</div></section>'
   // First message
   h += '<section class="start-sec"><h2 class="start-h" id="start-msg-h">First message</h2><div class="start-box">' +
@@ -103,6 +115,84 @@ export function startPageHtml(data, ui = {}, { esc, icon, emoji = () => '', loca
   return h
 }
 
+// Other folder…: the inline folder browser for one Mac (no popover; full width
+// on a phone). Folder names and paths come from that Mac's disk, so they go in
+// as text afterwards ([data-st], startTexts / fillStartTexts), never as markup.
+// b: { machine, loading, error, data: the GET /v1/start/dirs answer }
+export function startBrowseHtml(b, { esc, icon = () => '', machine = '' } = {}) {
+  let h = '<div class="start-browse" id="start-browse" role="region" aria-label="Folders on ' + esc(machine) + '">'
+  const d = b && b.data
+  // or type one you know (~/src/project, or a full path): the browser goes there; the same rules as walking to it
+  const goTo = '<form class="sb-path" data-form="start-browse-path" novalidate><label class="sb-path-l" for="sb-path-in">Go to a folder</label><div class="sb-path-row">' +
+    '<input type="text" id="sb-path-in" class="sb-path-in" name="path" placeholder="~/code/web" autocomplete="off" autocapitalize="off" autocorrect="off" spellcheck="false" enterkeyhint="go"' + (b && b.pathError ? ' aria-invalid="true" aria-describedby="sb-path-err"' : '') + '>' +
+    '<button type="submit" class="btn">Go</button></div>' +
+    (b && b.pathError ? '<p class="start-rule bad sb-path-err" id="sb-path-err" role="alert" data-st="path-err"></p>' : '') + '</form>'
+  if (!d) h += goTo
+  if (d) {
+    h += '<nav class="sb-crumbs" aria-label="Folder">' + d.crumbs.map((c, i) => (i ? '<span class="sb-sep" aria-hidden="true">/</span>' : '') +
+      '<button type="button" class="sb-crumb" data-action="start-browse-go" data-crumb="' + i + '"' + (i === d.crumbs.length - 1 ? ' aria-current="location"' : '') + ' data-st="crumb-' + i + '"></button>').join('') + '</nav>'
+    h += '<div class="sb-here">' +
+      (d.parent ? '<button type="button" class="btn sb-up" data-action="start-browse-up" aria-label="Up one folder">' + icon('chevron-left') + 'Up</button>' : '') +
+      '<span class="sb-cur"><span class="sb-cur-name" data-st="cur"></span>' + (d.git ? ' <span class="start-badge git">git</span>' : ' <span class="start-badge">not a git repo</span>') + '</span>' +
+      '<button type="button" class="btn primary sb-use" data-action="start-browse-use"' + (d.parent ? '' : ' disabled') + '>Use this folder</button></div>'
+    h += goTo
+    if (d.shortcuts && d.shortcuts.length > 1) h += '<div class="sb-cuts"><span class="sb-cuts-l">Jump to</span>' + d.shortcuts.map((c, i) => '<button type="button" class="sb-cut" data-action="start-browse-go" data-cut="' + i + '" data-st="cut-' + i + '"></button>').join('') + '</div>'
+    if (!d.entries.length) h += '<p class="start-empty">No folders in here.</p>'
+    else h += '<ul class="sb-list">' + d.entries.map((e, i) => '<li><button type="button" class="sb-dir" data-action="start-browse-go" data-entry="' + i + '">' + icon('folder') + '<span class="sb-name" data-st="entry-' + i + '"></span>' + (e.git ? '<span class="start-badge git">git</span>' : '') + icon('chevron-right', 'ic sb-go') + '</button></li>').join('') + '</ul>'
+    if (d.capped) h += '<p class="start-hint">Showing the first ' + esc(String(d.entries.length)) + ' of ' + esc(String(d.total)) + ' folders.</p>'
+  }
+  if (b && b.loading) h += '<p class="start-hint" role="status">Loading ' + esc(machine) + '’s folders…</p>'
+  if (b && b.error) h += '<p class="start-rule bad" role="alert">' + esc(b.error) + '</p>'
+  h += '<p class="start-hint">Folders only, by name: hidden ones, node_modules and Library are left out, and so is the synced Leftoff folder.</p>' +
+    '<div class="sb-foot"><button type="button" class="btn" data-action="start-browse-close">Cancel</button></div></div>'
+  return h
+}
+
+// What you typed in "Go to a folder", as a path to ask for: no spaces around
+// it, no quotes a copy brought along, a shell's "\ " back to a space, no
+// trailing slash. "~" stays "~"; the Mac resolves it (src/dirs.js checkFolder).
+export function typedPath(v) {
+  let t = String(v == null ? '' : v).trim()
+  if (/^(['"]).*\1$/.test(t) && t.length >= 2) t = t.slice(1, -1).trim()
+  t = t.replace(/\\ /g, ' ')
+  if (t.length > 1) t = t.replace(/\/+$/, '') || '/'
+  return t
+}
+
+// The text for every [data-st] on the page: names and paths from a Mac's disk.
+export function startTexts(data, ui = {}) {
+  const t = {}
+  const pick = startPick(data, ui)
+  if (pick.repo && pick.repo.isNew) { t['custom-name'] = pick.repo.name || ''; t['custom-path'] = pick.repo.label || pick.repo.path || '' }
+  const d = ui.browse && ui.browse.data
+  if (d) {
+    t.cur = d.label || d.path || ''
+    d.crumbs.forEach((c, i) => { t['crumb-' + i] = c.name })
+    ;(d.shortcuts || []).forEach((c, i) => { t['cut-' + i] = c.label })
+    d.entries.forEach((e, i) => { t['entry-' + i] = e.name })
+  }
+  if (ui.browse && ui.browse.pathError) t['path-err'] = ui.browse.pathError
+  for (const a of (data && Array.isArray(data.pending) ? data.pending : [])) if (a.firstTime) t['ask-folder-' + a.id] = a.folder || ''
+  return t
+}
+
+export function fillStartTexts(root, texts) {
+  if (!root || !root.querySelectorAll) return 0
+  let n = 0
+  for (const el of root.querySelectorAll('[data-st]')) { el.textContent = texts[el.getAttribute('data-st')] || ''; n++ }
+  return n
+}
+
+// The folder a browser click means: { path } from a crumb, a shortcut or an entry.
+export function browseTarget(b, el) {
+  const d = b && b.data
+  if (!d || !el || !el.dataset) return null
+  if (el.dataset.crumb != null) return d.crumbs[Number(el.dataset.crumb)] || null
+  if (el.dataset.cut != null) return (d.shortcuts || [])[Number(el.dataset.cut)] || null
+  if (el.dataset.entry != null) return d.entries[Number(el.dataset.entry)] || null
+  return null
+}
+
 // A request waiting on THIS Mac: its board shows it with Start and Decline
 // (only this Mac's own browser may answer).
 export function startAsksBanner(info, { esc, icon, local = true, clock = (x) => x, busy = new Set() } = {}) {
@@ -110,12 +200,30 @@ export function startAsksBanner(info, { esc, icon, local = true, clock = (x) =>
   if (!asks.length) return ''
   return asks.map((a) => {
     const b = busy.has(a.id)
-    return '<div class="banner warn start-ask-banner" role="alert" data-ask="' + esc(a.id) + '"><span class="grow"><b>' + esc(a.who || 'Another device') + ' asks to start a session</b> in ' + esc(a.repo) + (a.where === 'worktree' ? ' (new worktree)' : '') + ' on ' + esc(info.machine || 'this Mac') + ': “' + esc(a.prompt) + '” <span class="rs-m">Until ' + esc(clock(a.expiresAt)) + '.</span></span>' +
+    const where = a.firstTime ? '<span data-st="ask-folder-' + esc(a.id) + '"></span>' : esc(a.repo)
+    return '<div class="banner warn start-ask-banner' + (a.firstTime ? ' first' : '') + '" role="alert" data-ask="' + esc(a.id) + '"><span class="grow"><b>' + esc(a.who || 'Another device') + ' asks to start a session</b> in ' + where + (a.where === 'worktree' ? ' (new worktree)' : '') + ' on ' + esc(info.machine || 'this Mac') + ': “' + esc(a.prompt) + '”' +
+      (a.firstTime ? ' <b class="start-first">First time in this folder; this runs its hooks.</b>' : '') + ' <span class="rs-m">Until ' + esc(clock(a.expiresAt)) + '.</span></span>' +
       (local ? '<button type="button" class="btn primary" data-action="start-ask-confirm" data-id="' + esc(a.id) + '"' + (b ? ' aria-disabled="true"' : '') + '>' + icon('play') + (b ? 'Starting…' : 'Start it') + '</button>' +
         '<button type="button" class="btn" data-action="start-ask-decline" data-id="' + esc(a.id) + '"' + (b ? ' aria-disabled="true"' : '') + '>Decline</button>' : '<span class="rs-m">Someone at that Mac confirms it there.</span>') + '</div>'
   }).join('')
 }
 
+// Asked once on THIS Mac's board when it pairs a phone or sees a new Mac:
+// may it start sessions here? No is the default (first, and what doing
+// nothing means); Yes turns on the switch, and Trust my paired devices if it's
+// off (the words say so). Never shown off this Mac.
+export function startPairAskHtml(info, { esc, local = true, busy = false } = {}) {
+  const a = info && info.pairAsk
+  if (!a || !local) return ''
+  const mac = info.machine || 'this Mac'
+  const who = a.kind === 'mac' ? (a.name || 'your other Mac') : 'your phone'
+  const what = a.kind === 'mac' ? 'Let ' + who + ' start sessions here?' : 'Let your phone start sessions here?'
+  const yes = 'Yes turns on “Allow starting sessions from other devices” for ' + mac + (info.trust ? '' : ', and Trust my paired devices so you can answer its prompts there') + '. It applies to every paired phone and Mac; change it any time in Settings → Privacy & security.'
+  return '<div class="banner info pair-ask" role="region" aria-label="' + esc(what) + '"><span class="grow"><b>' + esc(what) + '</b> ' + esc(a.kind === 'mac' ? who + ' could start Claude Code on ' + mac + ' with nobody here;' : 'It could start Claude Code on ' + mac + ' with nobody here;') + ' its edits and commands still wait for you in Needs you. ' + esc(yes) + '</span>' +
+    '<button type="button" class="btn" data-action="pair-ask-no"' + (busy ? ' aria-disabled="true"' : '') + '>No</button>' +
+    '<button type="button" class="btn" data-action="pair-ask-yes"' + (busy ? ' aria-disabled="true"' : '') + '>Yes, allow</button></div>'
+}
+
 // The session page's line for a session Leftoff runs: where it runs, who
 // started it, and Stop / Resume. The error (Claude Code's own words) is put
 // in with textContent by app.js ([data-headless-err]).