@leftoff/cli 0.6.8 → 0.6.9

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

@@ -1,6 +1,6 @@
 {
   "name": "leftoff",
-  "version": "0.6.8",
+  "version": "0.6.9",
   "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

@@ -494,7 +494,7 @@ const SESSION_ORDER = ['id', 'title', 'title_source', 'machine', 'cwd', 'repo',
 export const SESSION_EXTRA = ['inTurn', 'needsInput', 'backgroundTasks', 'turnsSinceCheckpoint', 'dormantStretch',
   'finalCheckpointDone', 'firstPrompt', 'lastPreview', 'lastNotification', 'lastEventAt', 'statusChanges', 'folder',
   'pid', 'tty', 'pidStartedAt', 'pidSource', 'term', 'closedAt', 'answers', 'lastNotificationMessage', 'needsInputAt', 'question', 'questionAt',
-  'startSource', 'historyTurns', 'healedAt', 'healedVia', 'archivedReason', 'backend']
+  'startSource', 'historyTurns', 'healedAt', 'healedVia', 'archivedReason', 'backend', 'prLinks', 'prUnlinked']
 
 export const SESSION_FIELDS = ['id', 'title', 'titleSource', 'machine', 'cwd', 'repo', 'transcriptPath', 'model', 'surface', 'capture',
   'status', 'startedAt', 'lastActivityAt', 'lastHeartbeatAt', 'endedAt', 'endReason', 'turns', 'lastCheckpointId',

package/mod/hooks/register.js

@@ -27,7 +27,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.6.8' // keep in step with .claude-plugin/plugin.json
+const MOD_VERSION = '0.6.9' // keep in step with .claude-plugin/plugin.json
 
 const st = {
   internal: false,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@leftoff/cli",
-  "version": "0.6.8",
+  "version": "0.6.9",
   "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

@@ -1379,3 +1379,65 @@ a.need-pr:hover { border-color: var(--line-strong); }
 @media (max-width: 640px) { .form .set-advbody { gap: 12px 18px; } }
 .form .set-advbody > .section:first-child { border-top: 0; padding-top: 0; margin-top: 0; }
 .form .hint.nomt { margin-top: 0; }
+
+/* PRs (0.6.9): a card's PRs, the session page's list and Link a PR, the PRs tab */
+.pr-num { font-weight: 700; font-family: var(--mono); }
+.pr-state { font-weight: 600; color: var(--green); }
+.pr-state.draft, .pr-state.closed { color: var(--muted); }
+.pr-state.merged { color: var(--accent); }
+.pr-checks { color: var(--muted); white-space: nowrap; }
+.pr-checks.pass { color: var(--green); }
+.pr-checks.fail { color: var(--red); }
+.pr-checks.pending { color: var(--yellow); }
+.card-prs { display: flex; flex-direction: column; gap: 4px; margin: 8px 0 2px; min-width: 0; }
+.cpr { display: flex; align-items: center; gap: 7px; min-width: 0; font-size: 12.5px; color: var(--text); text-decoration: none; background: var(--card2); border: 1px solid var(--line); border-radius: 8px; padding: 4px 9px; }
+a.cpr:hover { border-color: var(--line-strong); }
+.cpr .pr-title { flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; overflow-wrap: normal; }
+.cpr .pr-num, .cpr .pr-state, .cpr .pr-checks { flex: none; }
+.cpr.more { color: var(--muted); justify-content: center; }
+.prs-filters { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin: 4px 0 14px; }
+.prgroup { margin-bottom: 18px; }
+.prgroup h2 { font-size: 14px; margin: 14px 0 8px; }
+.prgroup.attention h2 { color: var(--red); }
+.prrow { display: flex; gap: 10px; align-items: flex-start; background: var(--card); border: 1px solid var(--line); border-radius: 12px; padding: 10px 12px; margin-bottom: 8px; min-width: 0; }
+.prrow.slim { background: var(--card2); }
+.pr-main { flex: 1 1 auto; min-width: 0; }
+.pr-line1 { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 9px; font-size: 12.5px; }
+.pr-att { color: var(--red); font-weight: 600; }
+.pr-review { color: var(--muted); }
+.pr-review.approved { color: var(--green); }
+.pr-review.changes_requested { color: var(--red); }
+.prrow .pr-title { font-weight: 500; margin-top: 3px; overflow-wrap: anywhere; }
+.prrow .pr-title a { color: var(--text); text-decoration: none; }
+.prrow .pr-title a:hover { text-decoration: underline; }
+.pr-meta { font-size: 12px; color: var(--faint); margin-top: 2px; overflow-wrap: anywhere; }
+.pr-sessions { display: flex; flex-direction: column; gap: 4px; margin-top: 6px; }
+.pr-sess { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; font-size: 13px; min-width: 0; }
+.pr-sess .sesslink { color: var(--accent); text-decoration: none; overflow-wrap: anywhere; }
+.pr-sess .sesslink::before { content: '↳ '; color: var(--faint); }
+.pr-actions { display: flex; flex-direction: column; gap: 6px; flex: none; align-items: stretch; }
+.prlist { margin-bottom: 8px; }
+.prlink { display: flex; gap: 8px; margin: 6px 0 16px; }
+.prlink input { flex: 1 1 auto; min-width: 0; font-size: 16px; }
+.prs-gh { margin-top: 6px; }
+.prs-foot { font-size: 12px; margin-top: 6px; }
+@media (max-width: 639.98px) {
+  .tabs { grid-template-columns: repeat(6, minmax(0, 1fr)); }
+  .prrow { flex-direction: column; gap: 8px; }
+  .pr-actions { flex-direction: row; flex-wrap: wrap; }
+}
+
+/* 0.6.9: "Closed (N) →" under the Board's grid */
+.closed-link { margin: 18px 0 6px; text-align: center; }
+.closed-link .linkish { color: var(--muted); font-size: 13.5px; padding: 8px 12px; }
+.closed-link .linkish:hover { color: var(--text); }
+
+/* 0.6.9: the Board's stat tiles read as filters you can tap: a lift on hover,
+   a press on touch, and the picked one clearly on (accent ring, tint, number). */
+.stat { transition: border-color .15s, background .15s, transform .12s, box-shadow .15s; -webkit-tap-highlight-color: transparent; }
+@media (hover: hover) { .stat:hover { transform: translateY(-1px); border-color: var(--accent); box-shadow: var(--card-shadow), 0 4px 14px rgba(0, 0, 0, .12); } }
+.stat:active { transform: scale(.97); }
+.stat:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
+.stat.on { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent), var(--card-shadow); background: color-mix(in srgb, var(--accent) 12%, var(--card)); }
+.stat.on .n { color: var(--accent); }
+.stat.on .k { color: var(--text); }

package/ui/app.js

@@ -8,6 +8,7 @@ import { inStatus, repoChips, applyFilter, readFilter, saveRepos, filterHash, to
 import { needsItems, needsStrip, needPanel, agentNeedPanel, httpsOnly, agentReplyButton, agentChipHtml, cardBadge, questionAnswer, turnsHtml, dismissedHtml } from './needs.js'
 import { SUMMARY_EXAMPLES, LENGTH_CHOICES } from './summary-examples.js'
 import { mdInline, renderSection } from './changelog-md.js'
+import { cardPrsHtml, sessionPrsSection, prsPageHtml } from './prs.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)
@@ -297,7 +298,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>' +
-    listChips(s) + nb + cpBlock(s.latestCheckpoint) +
+    cardPrsHtml(s.prs) + listChips(s) + nb + 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) +
       '<button type="button" class="btn" data-action="resume">Copy resume</button>' +
@@ -414,7 +415,7 @@ async function viewBoard() {
   const needs = needsItems(sessions)
   html += needsStrip(needs, needOpts())
   html += '<div class="stats">' + Object.entries(FILTERS).map(([k, fl]) =>
-    '<button type="button" class="stat' + (filter === k ? ' on' : '') + '" data-action="filter" data-filter="' + k + '"><div class="n">' + count(k) + '</div><div class="k"><span class="pill ' + fl.cls + '" aria-hidden="true"></span>' + esc(fl.label) + '</div></button>').join('') + '</div>'
+    '<button type="button" class="stat' + (filter === k ? ' on' : '') + '" data-action="filter" data-filter="' + k + '" aria-pressed="' + (filter === k) + '" title="' + esc(filter === k ? 'Showing ' + fl.label.toLowerCase() + ' · tap to show all' : 'Show ' + fl.label.toLowerCase()) + '"><div class="n">' + count(k) + '</div><div class="k"><span class="pill ' + fl.cls + '" aria-hidden="true"></span>' + esc(fl.label) + '</div></button>').join('') + '</div>'
   html += spaceTabs(spaces, sp, spCounts, 'board-space', allShown.length)
   if (filter === 'closed') {
     html += await closedSection(f, sp)
@@ -432,6 +433,8 @@ async function viewBoard() {
     html += '<div class="grid mt">' + list.map(card).join('') + '</div>'
   }
   html += emptyFold(applyFilter(sp ? empties.filter((s) => s.space === sp) : empties, { repos: f.repos }))
+  // 0.6.9: the Closed view was only a small stat tile; a quiet way in under the grid too.
+  if (closedCount > 0) html += '<div class="closed-link"><button type="button" class="linkish" data-action="filter" data-filter="closed">Closed (' + esc(closedCount) + ') →</button></div>'
   $app.innerHTML = banners() + html
   revealStat()
 }
@@ -744,6 +747,7 @@ async function viewSession(id) {
     fact('Open?', s.live === 'open' ? 'open' + (s.liveVia === 'pid' ? ' (process ' + s.pid + ' running)' : ' (heartbeat)') : s.live === 'closed' ? 'closed ' + ago(s.closedAt) : 'unknown') +
     fact('Terminal', (s.terminal ? s.terminal.label : '—') + (s.tty ? ' · ' + s.tty.replace('/dev/', '') : '') + ' · tab cp:' + (s.shortId || '')) + '</div>'
   html += spacePicker(s, spv, 'session', s.id)
+  html += '<section class="sprs" id="prs">' + sessionPrsSection(s, { mayEdit: !s.agent }) + '</section>'
   if (s.needsYou) html += '<section class="needs-strip one" aria-label="Needs you"><div class="needs-head"><h2>Needs you</h2></div><div class="needs-list">' + needPanel({ ...s.needsYou, session: s }, needOpts({ compact: true })) + '</div></section>'
   if (s.statusChanges && s.statusChanges.length) {
     html += '<div class="striplabel">Status history</div><div class="strip">' + s.statusChanges.slice(-24).map((c) => '<span class="s-' + esc(c.status) + '" title="' + esc(clock(c.at)) + '">' + esc(LABEL[c.status] || c.status) + '</span>').join('') + '</div>'
@@ -782,6 +786,42 @@ function spacePicker(s, spv, kind, key) {
 }
 function fact(k, v, cls) { return '<div class="fact' + (cls ? ' ' + cls : '') + '"><div class="k">' + esc(k) + '</div><div class="v" title="' + esc(v) + '">' + esc(v) + '</div></div>' }
 
+// PRs (0.6.9): Mine (PRs linked to your sessions, grouped) and Team (every open
+// PR in the repos your sessions are in). The daemon fetches with gh (or asks
+// the Mac that has it) and caches ~5 min; while it loads we look again shortly.
+const prsUi = { fresh: false, polls: 0, timer: null, data: {} }
+async function viewPrs() {
+  const params = (state.route && state.route.params) || new URLSearchParams()
+  let view = params.get('view')
+  if (!view) { try { view = localStorage.getItem('leftoff.prsView') } catch {} }
+  view = view === 'team' ? 'team' : 'mine'
+  const opts = { view, mayEdit: true, sessionAction: prSessionAction }
+  if (!prsUi.data[view]) $app.innerHTML = banners() + prsPageHtml(null, opts)
+  const fresh = prsUi.fresh; prsUi.fresh = false
+  let d
+  try { d = await api('GET', '/v1/prs?view=' + view + (fresh ? '&fresh=1' : ''), undefined, { timeoutMs: 30000 }) }
+  catch (e) { if (e.code === 'login_required') throw e; d = { error: 'Couldn’t load PRs: ' + e.message } }
+  if (!(state.route && state.route.name === 'prs')) return
+  if (d && d.groups) {
+    // Go / Resume on a row look the session up like a card does.
+    for (const g of d.groups) for (const r of g.rows || []) for (const x of r.sessions || []) if (!state.sessions.some((y) => y.id === x.id)) state.sessions.push(x)
+    d.multiMachine = new Set(state.sessions.map((x) => x.machine).filter(Boolean)).size > 1
+  }
+  prsUi.data[view] = d
+  $app.innerHTML = banners() + prsPageHtml(d, opts)
+  clearTimeout(prsUi.timer)
+  if (d && d.loading && prsUi.polls < 6) { prsUi.polls++; prsUi.timer = setTimeout(() => { if (state.route && state.route.name === 'prs') render() }, 2500) }
+  else if (!(d && d.loading)) prsUi.polls = 0
+}
+function prSessionAction(s) {
+  if (s.live === 'closed' || s.status === 'ended') {
+    const b = resumeButton(s, s.viewer || { local: state.viewerLocal !== false, ghostty: !!state.ghostty })
+    return b ? b.replace('class="btn primary"', 'class="btn sm"') : ''
+  }
+  const g = goButton(s)
+  return g && !/disabled/.test(g) ? g.replace('class="btn go', 'class="btn sm go') : ''
+}
+
 // Timeline (0.4.3): the board's repo chips (same remembered pick), a session
 // filter and a trigger filter. #/timeline?repo=a,b&session=<id>&trigger=manual
 const TRIGGER_FILTERS = { manual: { label: 'Manual', test: (t) => t === 'manual' }, auto: { label: 'Automatic', test: (t) => t !== 'manual' && t !== 'session_end' }, closed: { label: 'Closed', test: (t) => t === 'session_end' } }
@@ -2374,6 +2414,7 @@ async function render() {
     if (r.name === 's' && r.arg) await viewSession(r.arg)
     else if (r.name === 'waiting') await viewWaiting()
     else if (r.name === 'timeline') await viewTimeline()
+    else if (r.name === 'prs') await viewPrs()
     else if (r.name === 'digest') await viewDigest(r.arg, r.params.get('machine'))
     else if (r.name === 'catchup') await viewCatchup(r.arg)
     else if (r.name === 'lists') await viewLists(r.arg)
@@ -2551,7 +2592,7 @@ window.addEventListener('resize', () => { placeStatus() })
 // ⌘K search: a centered panel with the results grouped as you type. Enter on
 // nothing picked opens the full results page (#/search?q=…), as before.
 const searchUi = { seq: 0, items: [], active: -1, timer: null, last: null }
-const PAGES = [['Board', '#/'], ['Needs you', '#/waiting'], ['Lists', '#/lists'], ['Timeline', '#/timeline'], ['Digest', '#/digest'], ['Catch me up', '#/catchup/new'], ['What’s new', '#/whats-new'], ['Settings', '#/settings']]
+const PAGES = [['Board', '#/'], ['Needs you', '#/waiting'], ['Lists', '#/lists'], ['PRs', '#/prs'], ['Timeline', '#/timeline'], ['Digest', '#/digest'], ['Catch me up', '#/catchup/new'], ['What’s new', '#/whats-new'], ['Settings', '#/settings']]
 const searchIsOpen = () => !document.getElementById('cmdk').hidden
 function openSearch(prefill) {
   const box = document.getElementById('cmdk'), q = document.getElementById('q')
@@ -2662,6 +2703,14 @@ document.addEventListener('click', async (ev) => {
   const s = state.sessions.find((x) => x.id === id) || (closedUi.data && closedUi.data.sessions.find((x) => x.id === id))
   try {
     if (action === 'copy-cmd') { await copy(btn.dataset.cmd); return }
+    // PRs (0.6.9)
+    if (action === 'prs-view') { const v = btn.dataset.view === 'team' ? 'team' : 'mine'; try { localStorage.setItem('leftoff.prsView', v) } catch {} location.hash = v === 'team' ? '#/prs?view=team' : '#/prs'; return }
+    if (action === 'prs-refresh') { btn.disabled = true; prsUi.fresh = true; return render() }
+    if (action === 'pr-unlink') {
+      btn.disabled = true
+      try { await api('POST', '/v1/sessions/' + encodeURIComponent(btn.dataset.id) + '/prs', { ref: btn.dataset.url, unlink: true }); toast('Unlinked') } catch (e) { btn.disabled = false; toast(e.message, 5000); return }
+      return render()
+    }
     if (action === 'gh-check') {
       btn.disabled = true
       try { state.gh = await api('GET', '/v1/gh?fresh=1') } catch { state.gh = null }
@@ -3089,6 +3138,15 @@ function goClick(btn, id, s) {
 }
 
 document.addEventListener('submit', async (ev) => {
+  if (ev.target.dataset && ev.target.dataset.prLink) {
+    ev.preventDefault()
+    const input = ev.target.querySelector('input[name=ref]')
+    const ref = input.value.trim()
+    if (!ref) { input.focus(); return }
+    const b = ev.target.querySelector('button'); if (b) b.disabled = true
+    try { const r = await api('POST', '/v1/sessions/' + encodeURIComponent(ev.target.dataset.prLink) + '/prs', { ref }); input.value = ''; toast('Linked #' + String(r.url || '').split('/').pop()) ; await render() } catch (e) { toast(e.message, 5000) } finally { if (b) b.disabled = false }
+    return
+  }
   if (ev.target.dataset && ev.target.dataset.listAdd) {
     ev.preventDefault()
     const input = ev.target.querySelector('input[name=text]')
@@ -3154,7 +3212,7 @@ let stream = null
 function connect() {
   if (stream) { try { stream.close() } catch {} }
   const es = stream = new EventSource('/v1/stream')
-  for (const t of ['session.updated', 'checkpoint.created', 'digest.created', 'spaces.updated', 'catchup.created', 'needs.updated', 'restore.updated', 'lists.updated', 'peers.updated', 'agents.updated', 'relay.updated']) es.addEventListener(t, soon)
+  for (const t of ['session.updated', 'checkpoint.created', 'digest.created', 'spaces.updated', 'catchup.created', 'needs.updated', 'restore.updated', 'lists.updated', 'peers.updated', 'agents.updated', 'relay.updated', 'prs.updated']) es.addEventListener(t, soon)
   // v0.5.8: standup text prefetched for a digest is stale once spaces or the digest change
   for (const t of ['spaces.updated', 'digest.created', 'checkpoint.created']) es.addEventListener(t, () => { digestUi.standups = {} })
   es.addEventListener('model.pull', (ev) => { try { onPull(JSON.parse(ev.data)) } catch {} })

package/ui/index.html

@@ -29,6 +29,7 @@
       <a href="#/" data-route="board"><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"><rect width="7" height="9" x="3" y="3" rx="1"/> <rect width="7" height="5" x="14" y="3" rx="1"/> <rect width="7" height="9" x="14" y="12" rx="1"/> <rect width="7" height="5" x="3" y="16" rx="1"/></svg><span class="lbl">Board</span></a>
       <a href="#/waiting" data-route="waiting" id="needsTab"><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="M10.268 21a2 2 0 0 0 3.464 0"/> <path d="M3.262 15.326A1 1 0 0 0 4 17h16a1 1 0 0 0 .74-1.673C19.41 13.956 18 12.499 18 8A6 6 0 0 0 6 8c0 4.499-1.411 5.956-2.738 7.326"/></svg><span class="lbl">Needs you</span><span class="lbl-short">Needs</span><span class="navcount" id="needsCount" hidden></span></a>
       <a href="#/lists" data-route="lists" id="listsTab"><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="M13 5h8"/> <path d="M13 12h8"/> <path d="M13 19h8"/> <path d="m3 17 2 2 4-4"/> <path d="m3 7 2 2 4-4"/></svg><span class="lbl">Lists</span><span class="navcount" id="listsCount" hidden></span></a>
+      <a href="#/prs" data-route="prs" id="prsTab"><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="18" cy="18" r="3"/> <circle cx="6" cy="6" r="3"/> <path d="M13 6h3a2 2 0 0 1 2 2v7"/> <line x1="6" x2="6" y1="9" y2="21"/></svg><span class="lbl">PRs</span></a>
       <a href="#/timeline" data-route="timeline"><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="M3 12a9 9 0 1 0 9-9 9.75 9.75 0 0 0-6.74 2.74L3 8"/> <path d="M3 3v5h5"/> <path d="M12 7v5l4 2"/></svg><span class="lbl">Timeline</span></a>
       <a href="#/digest" data-route="digest"><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="M15 18h-5"/> <path d="M18 14h-8"/> <path d="M4 22h16a2 2 0 0 0 2-2V4a2 2 0 0 0-2-2H8a2 2 0 0 0-2 2v16a2 2 0 0 1-4 0v-9a2 2 0 0 1 2-2h2"/> <rect width="8" height="4" x="10" y="6" rx="1"/></svg><span class="lbl">Digest</span></a>
     </nav>

package/ui/prs.js

@@ -0,0 +1,128 @@
+// The PRs tab and PR rows (0.6.9). Pure HTML builders, no fetching: app.js
+// loads /v1/prs and /v1/sessions/:id and paints with these. Sessions and PRs
+// are many-to-many; a row shows every session it is linked to.
+const esc = (s) => String(s == null ? '' : s).replace(/[&<>"']/g, (c) => ({ '&': '&amp;', '<': '&lt;', '>': '&gt;', '"': '&quot;', "'": '&#39;' })[c])
+const safeUrl = (u) => (/^https:\/\/github\.com\//.test(String(u || '')) ? String(u) : '')
+
+export function shortAgo(iso, now = Date.now()) {
+  const t = Date.parse(iso || '')
+  if (!t) return ''
+  const s = Math.max(0, Math.round((now - t) / 1000))
+  if (s < 60) return 'now'
+  if (s < 3600) return Math.round(s / 60) + 'm'
+  if (s < 86400) return Math.round(s / 3600) + 'h'
+  return Math.round(s / 86400) + 'd'
+}
+
+// ✓ 3/3, ✕ 1 failing, ◌ 2 running — the class says which.
+export function checksHtml(ck, { compact = false } = {}) {
+  if (!ck || !ck.total) return ''
+  const cls = ck.failed ? 'fail' : ck.pending ? 'pending' : 'pass'
+  const ic = { fail: '✕', pending: '◌', pass: '✓' }[cls]
+  const full = ck.summary || (ck.total - ck.failed - ck.pending) + '/' + ck.total + ' checks passed'
+  // On a card: ✕ 1/3 (failing of all), ◌ 1/2 (passed so far), ✓ 3/3.
+  const short = (ck.failed ? ck.failed : ck.total - ck.failed - ck.pending) + '/' + ck.total
+  return '<span class="pr-checks ' + cls + '"' + (compact ? ' title="' + esc(full) + '" aria-label="' + esc(full) + '"' : '') + '><span aria-hidden="true">' + ic + '</span> ' + esc(compact ? short : full) + '</span>'
+}
+const STATE = { open: 'Open', draft: 'Draft', merged: 'Merged', closed: 'Closed' }
+export function stateHtml(state) {
+  if (!state) return ''
+  return '<span class="pr-state ' + esc(state) + '">' + esc(STATE[state] || state) + '</span>'
+}
+const REVIEW = { approved: 'Approved', changes_requested: 'Changes requested', review_required: 'Review needed' }
+
+// A session card's PRs: one compact line each (#, title, state, checks), three at most.
+export function cardPrsHtml(prs) {
+  const list = (prs || []).filter((p) => p && p.number)
+  if (!list.length) return ''
+  const shown = list.slice(0, 3)
+  const more = list.length - shown.length
+  return '<div class="card-prs">' + shown.map((p) => {
+    const url = safeUrl(p.url)
+    const inner = '<span class="pr-num">#' + esc(p.number) + '</span>' + stateHtml(p.state) + '<span class="pr-title">' + esc(p.title || p.repo || '') + '</span>' + checksHtml(p.checks, { compact: true })
+    return url ? '<a class="cpr" href="' + esc(url) + '" target="_blank" rel="noopener noreferrer" title="' + esc((p.repo ? p.repo + ' ' : '') + '#' + p.number + ' on GitHub') + '">' + inner + '</a>' : '<span class="cpr">' + inner + '</span>'
+  }).join('') + (more > 0 ? '<a class="cpr more" href="#/prs">+' + more + ' more</a>' : '') + '</div>'
+}
+
+// The session page: its PRs with Unlink, and "Link a PR" (a text box: a URL or #number).
+export function sessionPrsSection(s, { mayEdit = true } = {}) {
+  const list = (s.prs || []).filter((p) => p && p.number)
+  let h = '<h2>Pull requests' + (list.length ? ' <span class="count">' + list.length + '</span>' : '') + '</h2>'
+  if (list.length) {
+    h += '<div class="prlist">' + list.map((p) => {
+      const url = safeUrl(p.url)
+      return '<div class="prrow slim"><div class="pr-main">' +
+        '<div class="pr-line1"><span class="pr-num">#' + esc(p.number) + '</span>' + stateHtml(p.state) + checksHtml(p.checks) + '</div>' +
+        '<div class="pr-title">' + (url ? '<a href="' + esc(url) + '" target="_blank" rel="noopener noreferrer">' + esc(p.title || 'Pull request #' + p.number) + ' ↗</a>' : esc(p.title || '')) + '</div>' +
+        '<div class="pr-meta">' + esc(p.repo || '') + (p.via ? ' · ' + esc(VIA[p.via] || p.via) : '') + '</div></div>' +
+        (mayEdit ? '<button type="button" class="btn sm" data-action="pr-unlink" data-id="' + esc(s.id) + '" data-url="' + esc(p.url) + '">Unlink</button>' : '') + '</div>'
+    }).join('') + '</div>'
+  } else h += '<div class="nocp">No pull requests linked yet. They link on their own from gh pr create, PR links in the chat, or the branch.</div>'
+  if (mayEdit) h += '<form class="prlink" data-pr-link="' + esc(s.id) + '" autocomplete="off"><input name="ref" type="text" inputmode="url" placeholder="Link a PR: paste its link or #number" aria-label="Link a PR: paste its link or #number" autocapitalize="off" spellcheck="false"><button type="submit" class="btn">Link</button></form>'
+  return h
+}
+const VIA = { created: 'opened here', mentioned: 'mentioned', branch: 'this branch', manual: 'linked by hand' }
+
+// gh missing or signed out: the 0.6.5 status line with the fix to copy.
+export function ghLineHtml(g) {
+  if (!g || g.status === 'ready') return ''
+  const what = g.status === 'signed-out' ? 'gh is installed but not signed in to GitHub, so PRs can’t load.' : 'GitHub’s gh isn’t on this Mac, so PRs can’t load.'
+  let h = '<div class="ghcell prs-gh"><div class="ghrow"><span class="chip warn">' + (g.status === 'signed-out' ? 'Signed out' : 'Missing') + '</span><span class="ghwhat">' + what + '</span>' +
+    '<button type="button" class="linkish" data-action="prs-refresh">Check again</button></div>'
+  if (g.fix && g.fix.cmd) h += '<div class="joinline ghfix"><code class="cmd">' + esc(g.fix.cmd) + '</code><button type="button" class="btn sm" data-action="copy-cmd" data-cmd="' + esc(g.fix.cmd) + '">Copy</button></div>'
+  if (g.fix && g.fix.url) h += '<div class="hint">Install gh from <a href="' + esc(g.fix.url) + '" target="_blank" rel="noopener">cli.github.com</a>, then run this.</div>'
+  return h + '</div>'
+}
+
+function sessionLinks(r, opts) {
+  const ss = r.sessions || []
+  if (!ss.length) return ''
+  return '<div class="pr-sessions">' + ss.slice(0, 4).map((s) => {
+    const act = opts.sessionAction ? opts.sessionAction(s) : ''
+    return '<span class="pr-sess"><a href="#/s/' + encodeURIComponent(s.id) + '" class="sesslink">' + esc(s.title || 'Untitled session') + '</a>' + (s.machine && opts.showMachine ? '<span class="faint"> · ' + esc(s.machine) + '</span>' : '') + act + '</span>'
+  }).join('') + (ss.length > 4 ? '<span class="faint">+' + (ss.length - 4) + '</span>' : '') + '</div>'
+}
+
+// One PR row on the PRs tab.
+export function prRowHtml(r, { team = false, now = Date.now(), mayEdit = true, sessionAction = null, showMachine = false } = {}) {
+  const p = r.pr || {}
+  const url = safeUrl(p.url)
+  const line1 = '<span class="pr-num">#' + esc(p.number) + '</span>' + stateHtml(p.state) + checksHtml(p.checks) +
+    (r.attention && r.attention !== 'Checks failing' ? '<span class="pr-att">' + esc(r.attention) + '</span>' : p.review && REVIEW[p.review] ? '<span class="pr-review ' + esc(p.review) + '">' + REVIEW[p.review] + '</span>' : '')
+  const meta = team
+    ? [p.author ? '@' + p.author : '', p.createdAt ? 'opened ' + shortAgo(p.createdAt, now) + ' ago' : '', p.branch || ''].filter(Boolean)
+    : [p.repo, p.branch, p.state === 'merged' && p.mergedAt ? 'merged ' + shortAgo(p.mergedAt, now) + ' ago' : p.updatedAt ? 'updated ' + shortAgo(p.updatedAt, now) + ' ago' : ''].filter(Boolean)
+  const unlinkTo = !team && mayEdit && (r.sessions || []).length === 1 ? r.sessions[0] : null
+  return '<article class="prrow" data-pr="' + esc(p.url) + '"><div class="pr-main">' +
+    '<div class="pr-line1">' + line1 + '</div>' +
+    '<div class="pr-title">' + (url ? '<a href="' + esc(url) + '" target="_blank" rel="noopener noreferrer">' + esc(p.title || '') + '</a>' : esc(p.title || '')) + '</div>' +
+    '<div class="pr-meta">' + meta.map(esc).join(' · ') + '</div>' +
+    sessionLinks(r, { sessionAction, showMachine }) + '</div>' +
+    '<div class="pr-actions">' + (url ? '<a class="btn sm" href="' + esc(url) + '" target="_blank" rel="noopener noreferrer">GitHub ↗</a>' : '') +
+    (unlinkTo ? '<button type="button" class="btn sm" data-action="pr-unlink" data-id="' + esc(unlinkTo.id) + '" data-url="' + esc(p.url) + '" title="Unlink from this session">Unlink</button>' : '') + '</div></article>'
+}
+
+// The whole tab: Mine / Team switch, the gh line, groups.
+export function prsPageHtml(d, { view = 'mine', now = Date.now(), mayEdit = true, sessionAction = null } = {}) {
+  let h = '<div class="pagehead"><div><h1>Pull requests</h1><div class="sub">' + (view === 'team' ? 'Every open PR in the repos you work in.' : 'PRs linked to your sessions.') + '</div></div></div>'
+  h += '<div class="filters prs-filters"><div class="seg" role="group" aria-label="Whose PRs">' +
+    [['mine', 'Mine'], ['team', 'Team']].map(([k, l]) => '<button type="button" data-action="prs-view" data-view="' + k + '" aria-pressed="' + (view === k) + '">' + l + '</button>').join('') +
+    '</div><button type="button" class="linkish" data-action="prs-refresh">Refresh</button></div>'
+  if (!d) return h + '<div class="empty">Loading pull requests…</div>'
+  if (d.error) return h + '<div class="banner warn"><span>' + esc(d.error) + '</span></div>'
+  if (d.gh && d.gh.status !== 'ready') return h + ghLineHtml(d.gh)
+  const groups = (d.groups || []).filter((g) => g.rows.length || (view === 'team' && g.failed))
+  const showMachine = !!d.multiMachine
+  if (!groups.length) {
+    h += '<div class="empty">' + (d.loading ? 'Loading pull requests…' : view === 'team' ? (d.repos && d.repos.length ? 'No open PRs in ' + esc(d.repos.join(', ')) + '.' : 'None of your sessions are in a GitHub repo yet.') : 'No PRs linked to your sessions yet. They link on their own when a session runs gh pr create, mentions a PR, or works on a branch with an open PR.') + '</div>'
+  } else {
+    for (const g of groups) {
+      h += '<section class="prgroup' + (g.key === 'attention' ? ' attention' : '') + '"><h2>' + esc(g.label) + ' <span class="count">' + g.rows.length + '</span></h2>'
+      if (g.failed && !g.rows.length) h += '<div class="hint">Couldn’t load this repo’s PRs right now.</div>'
+      h += g.rows.map((r) => prRowHtml(r, { team: view === 'team', now, mayEdit, sessionAction, showMachine })).join('') + '</section>'
+    }
+  }
+  const foot = [d.servedBy && d.machine && d.servedBy !== d.machine ? 'From ' + d.servedBy + '’s gh' : '', d.loading ? 'Updating…' : d.updatedAt ? 'Updated ' + shortAgo(d.updatedAt, now) + (shortAgo(d.updatedAt, now) === 'now' ? '' : ' ago') : ''].filter(Boolean)
+  if (foot.length) h += '<div class="prs-foot faint">' + esc(foot.join(' · ')) + '</div>'
+  return h
+}