heyquilt 0.3.121 → 0.3.138

package/src/ui/session.js

@@ -6,7 +6,7 @@ import { TOKEN, I, state, $, esc, basename, bytes, clock, ago, avatar, colorFor,
 import { openInvite, renderTabs, markRead, go } from './app.js'
 import { renderFeed } from './feed.js'
 import { renderLoom, resetLoom, focusFile, showsLoom } from './loom.js'
-import { buildLoom, foldAiLanes } from './loom-model.js'
+import { buildLoom, foldAiLanes, aiWorking } from './loom-model.js'
 import { railModel } from './rail-model.js'
 import { renderRail, openLocks, closeLocks } from './rail.js'
 import { feedbackDockHtml, bindFeedback } from './feedback.js'
@@ -14,6 +14,7 @@ import { conversations } from './feed-convs.js'
 import { closeTreeMenu } from './tree.js'
 import { renderFileView, renderFileTabs } from './fileview.js'
 import { rolledOff, diffLines } from './diffview.js'
+import { searchMarkup, searchTabMarkup, liveByPerson, fileReadsNeeded, SEARCH_ICON } from './quiltview.js'
 import { changesMarkup, bindChanges, unbindChanges, changesChanged, fileChanges, loadChanges, changedCount, unseenChanges, markChangesSeen } from './changes.js'
 import { chipCounts } from './changes-seen.js'
 import { quiltMark } from './mark.js'
@@ -25,10 +26,10 @@ import { accessFormValues, accessSaveBody, grantsLoading, grantsLoaded, grantsFa
 import { workspaceFilePicker } from './files.js'
 import { sessionAgentsHtml } from './agent-place.js'
 import { renderCatchUp, bindCatchUp } from './catchup.js'
-import { branchMenuHtml, upstreamText, needsHand } from './branches.js'
 import { boxSummary, boxesOf, unplaced, boxesSig, boxListHtml, boxFoldHtml } from './boxes.js'
 import { gitControl, gitStatusParts, gitSegHtml } from './git-rule.js'
-import { callButtonMarkup, callPinMarkup, mountCall, unmountCall, renderCall, callCards } from './voice.js'
+import { inSeam, makeQuiltWords, seamChip, squareCard, squarePanelHtml, seamSettingsHtml, openSquareButton, squaresSideHtml, SEAM_SIDE_HINT } from './seam-model.js'
+import { callButtonMarkup, callPinMarkup, screenStageMarkup, mountCall, unmountCall, renderCall, callCards } from './voice.js'
 
 let current = null // session id being shown
 let timers = []
@@ -55,7 +56,9 @@ function ws (id) {
       convSel: {}, // person -> pinned conversation id (absent: follow the newest)
       fileTabs: [],
       fileSel: null,
-      fileTab: {}, // file path -> 'changes' when its Changes tab is shown (absent: the file)
+      fileTab: {}, // file path -> 'changes' or 'blame' when that tab is shown (absent: the file)
+      searchTabs: [], // code searches open as tabs, in a session linked to a quilt (quiltview.js)
+      searchSel: null,
       expanded: {},
       boxesCollapsed: false, // the Boxes pane (who is working on what) starts open; folded, it is a rail of locks (rail.js)
       stale: {}, // file path -> changed while not visible
@@ -137,6 +140,7 @@ export function mountSession (id) {
           <button class="pop-item" role="menuitem" id="leave-btn">Leave this session</button>
         </div>
       </div>
+      <form class="qt-topsearch" id="qt-topsearch" role="search" hidden>${SEARCH_ICON}<input id="qt-topsearch-q" name="q" placeholder="Search the code on main" aria-label="Search the code on main" autocomplete="off" spellcheck="false"></form>
       <span class="spacer"></span>
       <span class="relay-problem" id="relay-problem" role="status" hidden></span>
       <span class="access-pill" id="access-pill" hidden></span>
@@ -183,12 +187,14 @@ export function mountSession (id) {
       </aside>
       <main class="ws-main">
         <div class="requests catchup" id="catchup" role="region" aria-label="While you were away" hidden></div>
+        <div class="requests square" id="square-card" role="status" aria-label="Seam" hidden></div>
         <div class="requests github" id="github-card" role="region" aria-label="GitHub" hidden></div>
         <div class="requests" id="requests" hidden></div>
         <div class="ws-mainbar" id="mainbar" hidden>
           <div class="ws-tabs" id="main-tabs" role="tablist"></div>
         </div>
         <div class="ws-content" id="main"></div>
+        ${screenStageMarkup()}
       </main>
       <aside class="ws-chat" id="chat-pane" aria-label="Chat">
         <div class="chat-resize" id="chat-resize" role="separator" aria-orientation="vertical" aria-label="Resize chat" title="Drag to resize · double-click to collapse" tabindex="0"></div>
@@ -228,6 +234,7 @@ export function mountSession (id) {
   // Report a bug / Suggest a feature at the bottom of the Boxes pane (feedback.js): onto this session's board.
   bindFeedback($('.ws-boxes'), { session: () => current, where: () => state.sessions.get(current)?.status?.sessionName || 'a session' })
   bindGithubCard()
+  bindSquareCard()
   bindMain()
   bindTreeEvents()
   applyTreeCollapsed()
@@ -390,6 +397,15 @@ function bindMenu (btn, menu, onPick) {
 }
 
 function bindTop () {
+  $('#qt-topsearch').onsubmit = (e) => {
+    e.preventDefault()
+    const box = $('#qt-topsearch-q')
+    const q = box.value.trim()
+    if (!q) return
+    box.value = ''
+    box.blur()
+    openSearch(q)
+  }
   $('#tasks-btn').onclick = () => {
     const w = ws(current)
     if (w.mode === 'tasks') w.mode = w.aiSel ? 'ai' : w.fileSel ? 'files' : 'ai'
@@ -420,6 +436,8 @@ function bindTop () {
         value: st.agentCommits || 'branches',
         rule: st.agentCommitsBy && st.agentCommitsBy.mode ? st.agentCommitsBy : null,
         words: st.gitForEveryone && st.gitForEveryone.words,
+        // In Seam the card says so instead of git's choice (git-rule.js thisSessionGitHtml).
+        ...(inSeam(st) ? { seam: st.quilt.slug || st.quilt.id } : {}),
         open: (tab) => openSessionSettings(tab)
       }
     })
@@ -478,7 +496,7 @@ function bindTop () {
 /** The Session settings window's controls: your AI chat's sharing, and (for the owner) who can get in and what they may do. */
 function bindSessionSettings (root) {
   root.addEventListener('change', (e) => { if (e.target.matches('[data-github-sync], [data-large-to-relay]')) gitSettingChange(e) })
-  root.addEventListener('click', (e) => { if (e.target.closest('[data-gh-connect]')) connectGithub(); else if (e.target.closest('[data-agent-commits]')) gitSettingChange(e) })
+  root.addEventListener('click', (e) => { if (e.target.closest('[data-gh-connect]')) connectGithub(); else if (e.target.closest('[data-make-quilt]')) makeQuilt(e.target.closest('[data-make-quilt]')); else if (e.target.closest('[data-agent-commits]')) gitSettingChange(e) })
   root.addEventListener('change', async (e) => {
     if (e.target.matches('[data-share]')) {
       const on = e.target.checked
@@ -637,19 +655,99 @@ function agentLine (p) {
 // ------------------------------------------------------------- branches --
 let branchSyncing = false
 
+/** One line on how a branch stands against its upstream ('' without one). */
+export function upstreamText (u) {
+  if (!u || !u.name) return ''
+  const n = (k, w) => `${k} ${w}${k === 1 ? '' : 's'}`
+  // A failed fetch: what git last knew is stale, so never "up to date".
+  if (u.fetchOk === false) return `can't fetch ${u.name}: ${u.fetchError || 'git fetch failed'}`
+  const by = u.mergedBy ? `; being merged by ${u.clashMine ? 'your AI' : u.mergedBy}` : ''
+  if (u.diverged) return `diverged from ${u.name}: ${n(u.ahead, 'commit')} here, ${n(u.behind, 'commit')} there${by}`
+  const clash = Array.isArray(u.conflicts) ? u.conflicts.length : u.conflicts
+  if (clash) return `${n(u.behind, 'commit')} behind ${u.name}; ${n(clash, 'file')} clash with the session's work${by}`
+  if (u.waiting) return `${n(u.behind, 'commit')} behind ${u.name}; waiting: ${u.waiting}`
+  if (u.behind) return `${n(u.behind, 'commit')} behind ${u.name}`
+  if (u.ahead) return `${n(u.ahead, 'commit')} ahead of ${u.name}`
+  return `up to date with ${u.name}`
+}
+
+/** Whether the label should draw the eye: this folder is behind and Quilt can't bring it in by itself. */
+export function needsHand (u) {
+  return !!(u && (u.diverged || u.fetchOk === false || (Array.isArray(u.conflicts) ? u.conflicts.length : u.conflicts)))
+}
+
+/**
+ * The git panel's head in a session still on git: this folder's branch, how it stands against its
+ * upstream, and Check. The list of every branch (the branch menu, src/ui/branches.js) went in 16's R2:
+ * which branch a folder is on is git's, and new sessions are quilts.
+ */
+export function folderBranchHtml ({ git, syncing = false }) {
+  if (!git) return ''
+  const u = git.upstream
+  return `<div class="br-here br-compact">
+      <div class="br-line">${I.branch}<b class="br-name">${esc(git.key)}</b>${u ? `<span class="br-sub${needsHand(u) ? ' warn' : ''}" title="${esc(upstreamText(u))}">${esc(upstreamText(u))}</span>` : ''}${u ? `<button type="button" class="btn sm ghost br-sync" data-branch-sync ${syncing ? 'disabled' : ''} title="Look for new commits on ${esc(u.name || 'the upstream')}">${I.refresh}<span>${syncing ? 'Checking' : 'Check'}</span></button>` : ''}</div>
+      ${u && Array.isArray(u.conflicts) && u.conflicts.length ? `<ul class="br-clash">${u.conflicts.slice(0, 6).map((c) => `<li><code>${esc(c.path)}</code> ${esc(c.why)}</li>`).join('')}</ul><div class="br-hint">Ask your AI to pull and resolve these: Quilt brings nothing in until they're settled.</div>` : ''}
+      ${u && u.diverged ? '<div class="br-hint">Quilt never merges git history: ask your AI to pull or rebase, and the session takes in the result.</div>' : ''}
+    </div>`
+}
+
+let squareBusy = '' // 'commit' or 'merge' while the square panel's button runs (layout 3)
+
 function renderBranchMenu () {
   const st = sum().status
   const menu = $('#branch-menu')
-  menu.hidden = !st.git && !(st.branches || []).length
-  // Inside the git panel the branch list folds, so the changes below stay in reach; kept open across redraws.
-  const open = !!menu.querySelector('details.br-all[open]')
-  menu.innerHTML = branchMenuHtml({ git: st.git, branches: st.branches || [], me: st.me.name, syncing: branchSyncing, fold: true })
-  if (open) menu.querySelector('details.br-all')?.setAttribute('open', '')
+  // In Seam: the square this folder follows, and committing and merging it. The branch documents kept
+  // for a move back are read-only, and git is set aside here: none of them is listed.
+  if (inSeam(st)) {
+    menu.hidden = false
+    const html = squarePanelHtml(st, { busy: squareBusy })
+    if (menu.dataset.html === html) return
+    // A commit message being typed survives the redraw.
+    const typing = menu.querySelector('[data-square-commit] input')
+    const kept = typing ? { value: typing.value, focused: document.activeElement === typing } : null
+    menu.dataset.html = html
+    menu.innerHTML = html
+    const box = kept && menu.querySelector('[data-square-commit] input')
+    if (box) { box.value = kept.value; if (kept.focused) box.focus() }
+    return
+  }
+  delete menu.dataset.html
+  menu.hidden = !st.git
+  menu.innerHTML = folderBranchHtml({ git: st.git, syncing: branchSyncing })
+}
+
+/** The square panel's Commit and Merge onto main (layout 3): Seam's own tools, as this member (control.js seamTool). */
+async function squareAct (tool, message = '') {
+  const id = current
+  squareBusy = tool === 'seam_merge' ? 'merge' : tool === 'open_square' ? 'open' : 'commit'
+  renderBranchMenu()
+  renderSquareCard()
+  try {
+    const r = await api('POST', `/api/sessions/${id}/seam`, { tool, args: message ? { message } : {} })
+    toast(r.text, 8000)
+    return true
+  } catch (err) { toast(err.message, 8000); return false } finally {
+    squareBusy = ''
+    if (id === current && !$('#git-panel').hidden) renderBranchMenu()
+    if (id === current) renderSquareCard()
+  }
 }
 
 function bindBranchMenu () {
   const menu = $('#branch-menu')
+  menu.addEventListener('submit', async (e) => {
+    const form = e.target.closest('[data-square-commit]')
+    if (!form) return
+    e.preventDefault()
+    const input = form.querySelector('input')
+    const message = input.value.trim()
+    if (!message || squareBusy) return
+    if (await squareAct('seam_commit', message)) { input.value = ''; const now = menu.querySelector('[data-square-commit] input'); if (now) now.value = '' }
+  })
   menu.addEventListener('click', async (e) => {
+    // Merge commits what isn't committed yet first: with the words typed in the box, if any.
+    if (e.target.closest('[data-square-open]')) { if (!squareBusy) squareAct('open_square'); return }
+    if (e.target.closest('[data-square-merge]')) { if (!squareBusy) squareAct('seam_merge', (menu.querySelector('[data-square-commit] input')?.value || '').trim()); return }
     if (!e.target.closest('[data-branch-sync]') || branchSyncing) return
     branchSyncing = true
     renderBranchMenu()
@@ -665,9 +763,21 @@ function renderTop () {
   if (!current || !$('#people-btn')) return
   renderTabs()
   const st = sum().status
+  // Code search, only in a session linked to a quilt (the relay reads Seam for it).
+  const search = $('#qt-topsearch')
+  if (search) search.hidden = !st.quilt
   const g = st.git
   const label = $('#git-branch')
-  if (label) {
+  const seam = inSeam(st) ? seamChip(st) : null
+  // In Seam nobody asks a person with git to commit: whoever is on a square commits it.
+  $('#ask-commit').hidden = !!seam
+  if (label && seam) {
+    // In Seam: the square this folder follows, by the name Seam gives it.
+    label.hidden = !seam.label
+    label.innerHTML = seam.label ? `<span class="branch-name">${esc(seam.label)}</span>` : ''
+    label.dataset.title = seam.title
+    if (!$('#git-panel').hidden) renderBranchMenu()
+  } else if (label) {
     label.hidden = !g
     if (g) {
       // Moving to another branch: said at once. Git busy: only once it has lasted a moment.
@@ -700,6 +810,7 @@ function renderTop () {
   renderCall()
   renderAccess()
   renderCatchUp($('#catchup'), st.catchUp, { colors: new Map([st.me, ...st.peers].map((p) => [p.name, p.color])) })
+  renderSquareCard()
   renderGithubCard()
   renderGitChip()
   $('#sess-name').textContent = st.sessionName || basename(sum().dir)
@@ -868,12 +979,27 @@ function renderGitChip () {
   const dot = $('#git-dot')
   dot.hidden = !!say || !(live && live.dot)
   dot.className = `sd${live && live.dot ? ` ${live.dot}` : ''}`
+  const branch = $('#git-branch')
+  const seam = inSeam(st) ? seamChip(st) : null
+  // In Seam the session's own record of changes stopped at the switch (its branch document is kept read-only):
+  // the number is the square's work not committed yet, and the panel lists that instead.
+  const chg = $('#chg-panel')
+  if (chg) chg.hidden = !!seam
+  if (seam) {
+    $('#chg-count').textContent = seam.count
+    $('#git-chg').hidden = !seam.count
+    $('#git-sep').hidden = branch.hidden || !seam.count
+    chip.title = [seam.title, seam.countLine, 'Click for your square.'].filter(Boolean).join('\n')
+    chip.setAttribute('aria-label', seam.aria)
+    $('#git-panel').setAttribute('aria-label', 'Square')
+    if (!$('#git-panel').hidden) renderCommitPanel()
+    return
+  }
   // The number is your own work not committed (once that's known; before that, every file changed in
   // the session). What others changed since you last opened this panel goes in the tooltip, not the
   // number, with the session's total.
   const own = mineCount()
   const { n, lines: counts } = chipCounts({ own, total: changedCount(), fresh: unseenChanges() })
-  const branch = $('#git-branch')
   $('#chg-count').textContent = n
   $('#git-chg').hidden = !n
   $('#git-sep').hidden = branch.hidden || !n
@@ -882,6 +1008,7 @@ function renderGitChip () {
     ...counts,
     open.length ? open.map((r) => `${shownName(authorOf(r), owners(sum()))}: ${r.message}`).join('\n') : live ? live.line : gh ? githubWords(gh) : ''
   ].filter(Boolean)
+  $('#git-panel').setAttribute('aria-label', 'Branch, GitHub and changes')
   chip.title = [...lines, 'Click for branches, GitHub and every change.'].join('\n')
   chip.setAttribute('aria-label', `Source control${branch.hidden ? '' : `: ${st.git.key}`}${n ? own === null ? `, ${n} changed` : `, ${n} of yours not committed` : ''}${say ? `, ${say}` : live ? `, ${live.chip}` : ''}`)
   if (!$('#git-panel').hidden) renderCommitPanel()
@@ -934,6 +1061,7 @@ function myBranchOf (st) {
 
 /** Where this branch stands with GitHub (GitHub as a node: relay-sync.js syncStatus), in a few words, with how to read it. */
 function syncWords (st) {
+  if (inSeam(st)) return null
   const b = myBranchOf(st)
   const r = b && b.relay
   const s = r && r.sync
@@ -1019,6 +1147,45 @@ function gitCardHtml (st) {
 }
 
 /** Session settings, for the owner: syncing with GitHub, large files, and git for this session. */
+/**
+ * "Make this a quilt" (Seam's plans/quilt-source-control/16, flag 9), for the session's owner while its
+ * code is still on git: one button. With no git remote the relay makes the quilt and moves the files
+ * into its squares at once; with one, it becomes a quilt with its history (makeQuiltWords).
+ */
+function makeQuiltHtml (st) {
+  if (inSeam(st)) return ''
+  // Everyone hears that live sync stopped at the forced date; only the owner gets the button.
+  if (!st.access?.owner) return st.force && st.force.stopped ? `<div class="pm-section"><div class="pm-title">Seam</div><div class="pm-card git-card"><p class="git-line warn">${esc(st.force.stopped.why || '')}</p></div></div>` : ''
+  const words = makeQuiltWords({ quilt: st.quilt || null, remote: !!githubStateOf(st) || !!(st.git && st.git.upstream), moving: !!st.moving, force: st.force || null, importing: st.importing || null, shadow: st.shadow || null })
+  return `<div class="pm-section"><div class="pm-title">Seam</div><div class="pm-card git-card">
+    <div class="git-head"><h4>Make this a quilt</h4><span class="pill">Seam</span></div>
+    ${words.note ? `<p class="git-line warn">${esc(words.note)}</p>` : ''}
+    <p class="git-line">${esc(words.text)}</p>
+    ${makeQuiltSteps ? `<div class="git-line"><p>${esc(makeQuiltSteps[0])}</p>${makeQuiltSteps.length > 1 ? `<ol>${makeQuiltSteps.slice(1).map((l) => `<li>${esc(l.replace(/^\d+\. /, ''))}</li>`).join('')}</ol>` : ''}</div>` : ''}
+    <button type="button" class="btn primary" data-make-quilt ${words.disabled ? 'disabled' : ''}>${esc(words.button)}</button>
+  </div></div>`
+}
+
+/** The last answer's steps (lines), shown on the card: what the owner or the repository's GitHub owner does next. */
+let makeQuiltSteps = null
+
+async function makeQuilt (btn) {
+  makeQuiltSteps = null
+  btn.disabled = true
+  btn.textContent = 'Moving into Seam…'
+  try {
+    const r = await api('POST', `/api/sessions/${current}/quilt-make`, {})
+    const lines = String(r.text || 'The session is a quilt now.').split('\n')
+    // Steps for someone to take (the GitHub owner's ruleset) stay on the card until the next click; a plain answer is a toast.
+    if (lines.length > 2 && r.quilt && r.quilt.stage) makeQuiltSteps = lines
+    toast(lines[0])
+  } catch (err) {
+    const lines = String(err.message).split('\n')
+    if (lines.length > 1) makeQuiltSteps = lines
+    toast(lines[0])
+  } finally { renderSessionSettings({ force: true }) }
+}
+
 function githubSettingsHtml (st) {
   if (!st.access?.owner) return ''
   const sync = st.access.githubSync
@@ -1041,6 +1208,7 @@ async function openLiveSession (room) {
 
 /** The session's repository on GitHub and whether a member's connection lets agents commit there, from the relay's branch list. */
 function githubStateOf (st) {
+  if (inSeam(st)) return null // GitHub only receives Seam's export of main: nothing to connect or sync here
   const list = st.branches || []
   const b = (st.git && list.find((x) => x.name === st.git.key)) || list.find((x) => x.default) || null
   const r = b && b.relay
@@ -1066,6 +1234,22 @@ const GH_DISMISS_MS = 7 * 24 * 60 * 60 * 1000
 const ghDismissKey = (repo) => `quilt.github.notnow.${repo}`
 let ghConnecting = null // the repo a Connect click is waiting on (polling the account)
 
+/**
+ * In a session that is a quilt at layout 3: one plain line on where this folder's work goes (the
+ * square it follows, and how to commit it; session-follow.js), or why an edit reached nobody.
+ */
+function renderSquareCard () {
+  const el = $('#square-card')
+  if (!el) return
+  const st = sum().status
+  const card = squareCard(st)
+  el.hidden = !card
+  const html = card ? `<div class="gh-card"><div class="gh-text"><b>${esc(card.title)}</b><span>${esc(card.text)}</span></div>${card.open && st.access?.role !== 'viewer' ? `<div class="gh-acts">${openSquareButton(st, squareBusy)}</div>` : ''}</div>` : ''
+  if (el._html === html) return
+  el._html = html
+  el.innerHTML = html
+}
+
 function renderGithubCard () {
   const el = $('#github-card')
   if (!el) return
@@ -1086,6 +1270,12 @@ function renderGithubCard () {
   el.innerHTML = html
 }
 
+/** The square card's button: a folder whose branch has no square opens one (layout 3). */
+function bindSquareCard () {
+  const el = $('#square-card')
+  if (el) el.addEventListener('click', (e) => { if (e.target.closest('[data-square-open]') && !squareBusy) squareAct('open_square') })
+}
+
 function bindGithubCard () {
   const el = $('#github-card')
   if (!el) return
@@ -1472,7 +1662,7 @@ function peopleRows (st, { fold = false } = {}) {
     return person(`<div class="pm-row">
       <button class="pm-open" data-person="${esc(p.name)}" title="Open ${p.isMe ? 'your' : `${esc(p.name)}'s`} AI chat">${avatar(p.name, p.color, p.online)}
         <span class="pm-main">
-          <span class="pm-name">${esc(p.isMe ? `${p.name} (you)` : p.name)}${p.voice ? `<span class="tag call-tag" title="In the voice call${p.voice.muted ? ', muted' : ''}">${p.voice.muted ? I.micOff : I.mic}call</span>` : ''}${p.kind === 'agent' ? `<span class="tag bot">${I.bot}agent</span>` : ''}${toolsOf(p).map((t) => `<span class="tag">${esc(t)}</span>`).join('')}</span>
+          <span class="pm-name">${esc(p.isMe ? `${p.name} (you)` : p.name)}${p.voice ? `<span class="tag call-tag" title="In the voice call${p.voice.muted ? ', muted' : ''}${p.voice.sharing ? ', sharing a screen' : ''}">${p.voice.sharing ? I.screenShare : p.voice.muted ? I.micOff : I.mic}call</span>` : ''}${p.kind === 'agent' ? `<span class="tag bot">${I.bot}agent</span>` : ''}${toolsOf(p).map((t) => `<span class="tag">${esc(t)}</span>`).join('')}</span>
           ${p.focus && !p.isMe ? `<span class="pm-sub pm-what">${esc(p.focus)}</span>` : ''}
           ${editing}
           ${agentLine(p) ? `<span class="pm-sub">${agentLine(p)}</span>` : ''}
@@ -1542,15 +1732,20 @@ function renderBoxesSide () {
   if (!el || !s) return
   const st = s.status
   const { selfRow, myAiRow, otherRows, awayRows } = peopleRows(st, { fold: true })
-  const n = boxView.data.boxes.length
+  // In Seam there are no boxes (every edit is live in its square): the pane shows the squares and who is on each.
+  const seam = inSeam(st)
+  const title = el.closest('.ws-boxes')?.querySelector('.pane-title')
+  if (title) title.textContent = seam ? 'Squares' : 'Boxes'
+  el.closest('.ws-boxes')?.setAttribute('aria-label', seam ? 'Squares: who is on which, and what is not committed' : 'Boxes: who is working on what')
+  const n = seam ? 0 : boxView.data.boxes.length
   const count = $('#box-count')
   if (count) { count.textContent = n ? String(n) : ''; count.title = n ? `${n} file${n === 1 ? '' : 's'} boxed: changed, not in everyone's folder yet` : '' }
-  const html = `<div class="pm-list bs-list">
+  const html = `${seam ? squaresSideHtml(st) : ''}<div class="pm-list bs-list">
       ${selfRow}${myAiRow}
       ${otherRows}
       ${awayRows.length ? `<div class="pm-sep"></div><div class="bs-head">Away</div>${awayRows.join('')}` : ''}
     </div>
-    <p class="bs-hint">${boxView.data.on ? 'A box is a file someone is changing that isn\'t in everyone\'s folder yet. Click someone\'s boxes to see the files, and a file to see its change.' : 'What everyone is working on. Their unfinished files show here as boxes.'}</p>`
+    <p class="bs-hint">${seam ? SEAM_SIDE_HINT : boxView.data.on ? 'A box is a file someone is changing that isn\'t in everyone\'s folder yet. Click someone\'s boxes to see the files, and a file to see its change.' : 'What everyone is working on. Their unfinished files show here as boxes.'}</p>`
   if (el.dataset.html === html) return
   const top = el.scrollTop
   el.innerHTML = html
@@ -1713,7 +1908,8 @@ function renderSessionSettings ({ force = false } = {}) {
   const active = box.contains(document.activeElement) && document.activeElement.closest('.pm-member') ? document.activeElement : null
   if (!force && active && box.querySelector('.pm-member.edit')) return
   const refocus = active && active.name ? [active.closest('.pm-member').dataset.key, active.name] : null
-  const vc = githubSettingsHtml(st) + githubTokenHtml(st.access)
+  // In Seam the git and GitHub settings are put away (the relay keeps them for a move back): where the history is instead.
+  const vc = inSeam(st) ? seamSettingsHtml(st) : makeQuiltHtml(st) + githubSettingsHtml(st) + githubTokenHtml(st.access)
   box.innerHTML = ssTab === 'chat' ? sharingHtml(st)
     : ssTab === 'vc' ? (vc || '<div class="pm-empty">Only the session owner changes how this session works with GitHub.</div>')
       : membersHtml(st, ssTab)
@@ -1727,6 +1923,12 @@ function bindMain () {
     const tab = e.target.closest('[data-tab]')
     const w = ws(current)
     if (tab && tab.dataset.kind === 'loom') { openLoom(); return }
+    if (close && close.dataset.kind === 'search') {
+      e.stopPropagation()
+      closeSearch(close.dataset.close)
+      return
+    }
+    if (tab && tab.dataset.kind === 'search') { openSearch(tab.dataset.tab); return }
     if (close) {
       e.stopPropagation()
       const key = close.dataset.close
@@ -1763,10 +1965,27 @@ function bindMain () {
     if (c) pickConv(c.dataset.conv)
     const t = e.target.closest('[data-fvtab]')
     if (t) showFileTab(t.dataset.fvtab)
+    // A file's History and Blame, and search hits, in a session linked to a quilt.
+    const qp = e.target.closest('[data-qt-patch]')
+    if (qp) togglePatch(ws(current).fileSel, qp.dataset.qtPatch)
+    const qb = e.target.closest('[data-qt-blame]')
+    if (qb) showPatch(ws(current).fileSel, qb.dataset.qtBlame)
+    const qf = e.target.closest('[data-qt-file]')
+    if (qf) openFile(qf.dataset.qtFile, { tab: 'changes' })
+    const qh = e.target.closest('[data-qt-hit]')
+    if (qh) openFile(qh.dataset.qtHit, { tab: 'file', line: Number(qh.dataset.line) || null })
     const f = e.target.closest('[data-fv]')
     if (f && f.dataset.fv === 'claim') claimPath(ws(current).fileSel, '')
     if (f && f.dataset.fv === 'release') releasePattern(f.dataset.pattern)
   })
+  // Searching again from a search tab's own field.
+  $('#main').addEventListener('submit', (e) => {
+    const form = e.target.closest('[data-qt-search-form]')
+    if (!form) return
+    e.preventDefault()
+    const q = String(new FormData(form).get('q') || '').trim()
+    if (q) openSearch(q, { replace: ws(current).searchSel })
+  })
 }
 
 function openLoom () {
@@ -1805,8 +2024,8 @@ function pickConv (conv) {
   renderMain()
 }
 
-/** Opens a file tab; `tab: 'changes'` shows its Changes tab, otherwise the tab it was on. */
-function openFile (path, { tab } = {}) {
+/** Opens a file tab; `tab: 'changes'` shows its Changes tab, otherwise the tab it was on. `line`: bring that line into view (a search hit). */
+function openFile (path, { tab, line = null } = {}) {
   const w = ws(current)
   if (!w.fileTabs.includes(path)) w.fileTabs.push(path)
   w.fileSel = path
@@ -1814,7 +2033,10 @@ function openFile (path, { tab } = {}) {
   if (!w.fileTab) w.fileTab = {}
   if (tab === 'changes') w.fileTab[path] = 'changes'
   else if (tab === 'file') delete w.fileTab[path]
+  if (line) goLine.set(fileKey(path), line)
+  else goLine.delete(fileKey(path))
   loadHistory(path)
+  if (fileTabOf(path) === 'blame') loadBlame(path)
   const wasStale = w.stale[path]
   delete w.stale[path]
   saveWs(current)
@@ -1833,22 +2055,24 @@ function renderMainBar () {
   const fileOn = (path) => w.mode === 'files' && w.fileSel === path
   const loomOn = w.mode === 'ai' && !w.aiSel
   const st = sum().status
-  const anyWorking = [st.me, ...st.peers].some((p) => p?.agent && p.agent.sharing !== false && p.agent.status === 'working')
+  const anyWorking = [st.me, ...st.peers].some((p) => !!p && aiWorking(p))
   const loomTab = `<div class="ws-tab loom-tab${loomOn ? ' on' : ''}" role="tab" aria-selected="${loomOn}" tabindex="0" data-kind="loom" data-tab="loom" title="Everyone's AI conversations, chat and task notes at once">
       <span class="ico">${I.users}</span><span class="nm">Everyone</span>${anyWorking ? '<span class="pulse" title="An AI is working"></span>' : ''}</div>`
   el.innerHTML = loomTab + (w.aiTabs.length ? '<span class="ws-tab-sep"></span>' : '') + w.aiTabs.map((name) => {
     const p = personInfo(name)
-    const working = p.agent && p.agent.sharing !== false && p.agent.status === 'working'
+    const working = aiWorking(p)
     return `<div class="ws-tab${aiOn(name) ? ' on' : ''}" role="tab" aria-selected="${aiOn(name)}" tabindex="0" data-kind="ai" data-tab="${esc(name)}" title="${esc(p.isMe ? 'Your AI chat' : `${name}'s AI chat`)}">
       ${avatar(name, p.color, p.online)}<span class="nm">${esc(p.isMe ? 'Your AI' : `${name}'s AI`)}</span>${working ? '<span class="pulse" title="AI is working"></span>' : ''}
       <button class="x" data-kind="ai" data-close="${esc(name)}" aria-label="Close ${esc(name)}">${I.x}</button></div>`
   }).join('') + (w.fileTabs.length ? '<span class="ws-tab-sep"></span>' : '') +
   w.fileTabs.map((path) => `<div class="ws-tab${fileOn(path) ? ' on' : ''}" role="tab" aria-selected="${fileOn(path)}" tabindex="0" data-kind="file" data-tab="${esc(path)}" title="${esc(path)}">
       <span class="ico">${I.file}</span><span class="nm">${esc(basename(path))}</span>${w.stale[path] ? '<span class="changed" title="Changed"></span>' : ''}
-      <button class="x" data-kind="file" data-close="${esc(path)}" aria-label="Close ${esc(basename(path))}">${I.x}</button></div>`).join('')
+      <button class="x" data-kind="file" data-close="${esc(path)}" aria-label="Close ${esc(basename(path))}">${I.x}</button></div>`).join('') +
+  ((w.searchTabs || []).length && !w.fileTabs.length ? '<span class="ws-tab-sep"></span>' : '') +
+  (w.searchTabs || []).map((q) => searchTabMarkup(q, w.mode === 'search' && w.searchSel === q)).join('')
   // On Everyone with nothing else open, the row would only name the view you are in: hide it until
   // there is a tab to switch to (or, on the Tasks board, Everyone to go back to).
-  $('#mainbar').hidden = loomOn && !w.aiTabs.length && !w.fileTabs.length
+  $('#mainbar').hidden = loomOn && !w.aiTabs.length && !w.fileTabs.length && !(w.searchTabs || []).length
 }
 
 // A card being renamed, or a drag in progress, must not be rebuilt under the pointer.
@@ -2490,6 +2714,17 @@ function renderMain () {
     return
   }
   if (w.mode === 'merge') w.mode = 'ai' // a compare tab from before Quilt merged on its own
+  if (w.mode === 'search' && !(w.searchSel && (w.searchTabs || []).includes(w.searchSel))) w.mode = w.fileSel ? 'files' : 'ai'
+  if (w.mode === 'search') {
+    if (!searches.has(`${current}\n${w.searchSel}`)) loadSearch(w.searchSel) // a tab put back after a reload
+    const html = searchMarkup({ q: w.searchSel, result: searches.get(`${current}\n${w.searchSel}`) || null })
+    // Status ticks redraw the main area: an unchanged search keeps its field, focus and scroll.
+    if (el.firstElementChild && el.firstElementChild.classList.contains('qt-search') && el.dataset.qtSearch === html) return
+    el.innerHTML = html
+    el.dataset.qtSearch = html
+    return
+  }
+  delete el.dataset.qtSearch
   if (w.mode === 'ai') {
     if (!w.aiSel) {
       const people = st.peers
@@ -2522,11 +2757,17 @@ function renderMain () {
   } else {
     if (!w.fileSel) {
       el.innerHTML = `<div class="main-empty"><div class="ill">${I.file}</div><h3>Open a file</h3>
-        <p class="hint">Open one from the git panel's changes, or a box's change from the Boxes list. Lines your partners change light up as they happen.</p></div>`
+        <p class="hint">${inSeam(sum().status) ? 'Search the code at the top and open a file from there, or open one from the Boxes list.' : 'Open one from the git panel\'s changes, or a box\'s change from the Boxes list. Lines your partners change light up as they happen.'}</p></div>`
       return
     }
     const cached = state.files.get(fileKey(w.fileSel))
     if (!cached) loadFileOnce(w.fileSel) // a tab put back after a reload has nothing read yet
+    // A tab put back after a reload, on any segment, reads what that segment shows.
+    const fk = fileKey(w.fileSel)
+    for (const need of fileReadsNeeded({ tab: fileTabOf(w.fileSel), linked: quiltLinked(), history: histories.get(fk), blame: blames.has(fk) ? blames.get(fk) : undefined, busy: historyLoads.has(fk) ? new Set(['history']) : undefined })) {
+      if (need === 'history') loadHistory(w.fileSel)
+      else loadBlame(w.fileSel)
+    }
     renderFileView(el, {
       path: w.fileSel,
       file: cached ? cached.file : null,
@@ -2535,6 +2776,8 @@ function renderMain () {
       prevText: cached ? cached.prevText : null,
       tab: fileTabOf(w.fileSel),
       history: histories.get(fileKey(w.fileSel)) || null,
+      quilt: quiltFileView(w.fileSel),
+      line: takeLine(w.fileSel, cached),
       summary: fileChanges(w.fileSel),
       people: { who: (name) => name === me() ? 'you' : name, colorOf: (name) => personInfo(name).color },
       chatHref: treeMeta(w.fileSel)?.chat ? fileCardHref(current, treeMeta(w.fileSel).chat.id, TOKEN) : null,
@@ -2547,18 +2790,147 @@ function renderMain () {
 /** Links to a session's file bytes for the preview, or to download them (GET /api/sessions/<id>/raw). */
 const rawHrefFor = (id) => (path, download = false) => `/api/sessions/${encodeURIComponent(id)}/raw?path=${encodeURIComponent(path)}&t=${encodeURIComponent(TOKEN || '')}${download ? '&download=1' : ''}`
 const fileKey = (path) => `${current}\n${path}`
-const fileTabOf = (path) => (ws(current).fileTab || {})[path] === 'changes' ? 'changes' : 'file'
+const fileTabOf = (path) => {
+  const t = (ws(current).fileTab || {})[path]
+  return t === 'changes' ? 'changes' : t === 'blame' && quiltLinked() ? 'blame' : 'file'
+}
 
 function showFileTab (tab) {
   const w = ws(current)
   if (!w.fileSel) return
   if (!w.fileTab) w.fileTab = {}
-  if (tab === 'changes') w.fileTab[w.fileSel] = 'changes'
+  if (tab === 'changes' || tab === 'blame') w.fileTab[w.fileSel] = tab
   else delete w.fileTab[w.fileSel]
   saveWs(current)
   renderMain()
   $('#main .fv-tabs [aria-selected="true"]')?.focus()
   if (tab === 'changes') loadHistory(w.fileSel)
+  if (tab === 'blame') loadBlame(w.fileSel)
+}
+
+// ------------------------------------- History, Blame and search (a linked quilt) --
+// In a session linked to a quilt (Seam), the relay reads it for the app: a file's patches, who
+// wrote each line, and code search over main (src/server.js quiltBlame, quiltSearch, quiltShow).
+const quiltLinked = () => !!sum().status.quilt
+const patchLists = new Map() // fileKey -> { patches, quilt, note } (absent: the session isn't linked)
+const openPatches = new Map() // fileKey -> the History row opened: a commit, or live:<name>
+const patchData = new Map() // `${session}\n${commit}\n${path}` -> { files, diff } or { error }
+const blames = new Map() // fileKey -> the relay's blame answer
+const blameTimers = new Map()
+const searches = new Map() // `${session}\n${q}` -> the relay's search answer
+const goLine = new Map() // fileKey -> a line to bring into view once (a search hit)
+
+/** What the file view shows of a linked file's History and Blame, or null when the session isn't linked. */
+function quiltFileView (path) {
+  if (!quiltLinked()) return null
+  const list = patchLists.get(fileKey(path)) || { patches: null, quilt: sum().status.quilt }
+  const open = openPatches.get(fileKey(path)) || null
+  const live = liveByPerson(histories.get(fileKey(path)) || [])
+  return {
+    ...list,
+    open,
+    shown: open && !open.startsWith('live:') ? patchData.get(`${current}\n${open}\n${path}`) || null : null,
+    blame: blames.get(fileKey(path)) || null,
+    liveBy: live.length ? live[0].by : (treeMeta(path)?.edited?.by || '')
+  }
+}
+
+/** The line a search hit opened the file at, given once its text is there. */
+function takeLine (path, cached) {
+  const line = goLine.get(fileKey(path))
+  if (!line || !cached || !cached.file || fileTabOf(path) !== 'file') return null
+  goLine.delete(fileKey(path))
+  return line
+}
+
+/** Opens or closes a row of a file's History; a patch's diff is read the first time. */
+function togglePatch (path, which) {
+  if (!path) return
+  const key = fileKey(path)
+  if (openPatches.get(key) === which) openPatches.delete(key)
+  else openPatches.set(key, which)
+  renderMain()
+  if (openPatches.get(key) === which && !which.startsWith('live:')) loadPatch(path, which)
+}
+
+/** Blame's patch number: that patch, opened in the file's History. */
+function showPatch (path, commit) {
+  if (!path) return
+  openPatches.set(fileKey(path), commit)
+  showFileTab('changes')
+  loadPatch(path, commit)
+  requestAnimationFrame(() => $('#main .qt-patch.on')?.scrollIntoView({ block: 'nearest' }))
+}
+
+async function loadPatch (path, commit) {
+  const id = current
+  const k = `${id}\n${commit}\n${path}`
+  if (patchData.has(k)) return
+  let shown
+  try {
+    const r = await api('GET', `/api/sessions/${id}/patch?commit=${encodeURIComponent(commit)}&path=${encodeURIComponent(path)}`)
+    shown = r.patch ? r.patch : r.working ? null : { error: r.quilt === null ? 'This session is no longer linked to a quilt.' : 'Seam did not send this patch.' }
+    if (!shown) { setTimeout(() => { if (id === current && openPatches.get(`${id}\n${path}`) === commit) loadPatch(path, commit) }, 2000); return }
+  } catch (err) { shown = { error: err.message } }
+  patchData.set(k, shown)
+  if (id === current && ws(id).fileSel === path && fileTabOf(path) === 'changes') renderMain()
+}
+
+/** Who wrote each line of a file: asked again every 2 s while Seam works it out the first time. */
+async function loadBlame (path, tries = 0) {
+  const id = current
+  const key = fileKey(path)
+  clearTimeout(blameTimers.get(key))
+  if (!blames.has(key)) blames.set(key, null) // being read
+  let r
+  try { r = await api('GET', `/api/sessions/${id}/blame?path=${encodeURIComponent(path)}`) } catch (err) { r = { error: err.message } }
+  if (id !== current) return
+  if (r.quilt === null) r = { error: 'This session is no longer linked to a quilt.' }
+  blames.set(key, r)
+  if (r.working && tries < 60) blameTimers.set(key, setTimeout(() => { if (id === current && ws(id).fileSel === path && fileTabOf(path) === 'blame') loadBlame(path, tries + 1) }, 2000))
+  if (ws(id).fileSel === path && fileTabOf(path) === 'blame') renderMain()
+}
+
+/** Opens a code search as a tab (in place of `replace`, a search searched again from its own field). */
+async function openSearch (q, { replace = null } = {}) {
+  const w = ws(current)
+  if (!w.searchTabs) w.searchTabs = []
+  const at = replace ? w.searchTabs.indexOf(replace) : -1
+  if (!w.searchTabs.includes(q)) { if (at >= 0) w.searchTabs.splice(at, 1, q); else w.searchTabs.push(q) } else if (at >= 0 && replace !== q) w.searchTabs.splice(at, 1)
+  w.searchSel = q
+  w.mode = 'search'
+  saveWs(current)
+  renderMainBar()
+  renderMain()
+  renderTreePane()
+  loadSearch(q)
+}
+
+async function loadSearch (q, tries = 0) {
+  const id = current
+  const k = `${id}\n${q}`
+  if (!tries && searches.has(k) && !searches.get(k)?.error) return
+  if (!tries) searches.set(k, null) // being read
+  let r
+  try { r = await api('GET', `/api/sessions/${id}/search?q=${encodeURIComponent(q)}`) } catch (err) { r = { error: err.message } }
+  searches.set(k, r)
+  if (r.working && tries < 30) setTimeout(() => { if (ws(id).searchTabs?.includes(q)) loadSearch(q, tries + 1) }, 2000)
+  if (id === current && ws(id).mode === 'search' && ws(id).searchSel === q) renderMain()
+}
+
+function closeSearch (q) {
+  const w = ws(current)
+  const i = (w.searchTabs || []).indexOf(q)
+  if (i !== -1) w.searchTabs.splice(i, 1)
+  searches.delete(`${current}\n${q}`)
+  if (w.searchSel === q) {
+    w.searchSel = w.searchTabs[Math.min(i, w.searchTabs.length - 1)] || null
+    if (!w.searchSel && w.mode === 'search') w.mode = w.fileSel ? 'files' : 'ai'
+  }
+  saveWs(current)
+  renderMainBar()
+  renderMain()
+  renderTreePane()
 }
 
 // ------------------------------------------------------- a file's changes --
@@ -2571,17 +2943,27 @@ function scheduleHistory (path) {
   historyTimers.set(path, setTimeout(() => { historyTimers.delete(path); loadHistory(path) }, 500))
 }
 
+const historyLoads = new Set() // fileKey -> its history is being read (or failed just now: asked again 5 s later)
 async function loadHistory (path) {
   const id = current
+  const key = `${id}\n${path}`
+  historyLoads.add(key)
+  let read = false
   try {
-    const { entries } = await api('GET', `/api/sessions/${id}/history?path=${encodeURIComponent(path)}`)
+    const { entries, patches, quilt, note } = await api('GET', `/api/sessions/${id}/history?path=${encodeURIComponent(path)}`)
     if (id !== current) return
     histories.set(`${id}\n${path}`, entries)
+    read = true
+    if (patches) patchLists.set(`${id}\n${path}`, { patches, quilt, ...(note ? { note } : {}) })
+    else patchLists.delete(`${id}\n${path}`)
     const w = ws(id)
     if (w.mode !== 'files' || w.fileSel !== path) return
-    if (fileTabOf(path) === 'changes') renderMain()
-    else renderFileTabs($('#main'), { tab: 'file', history: entries, summary: fileChanges(path) }) // the count only: freshly changed lines stay lit
-  } catch {}
+    if (fileTabOf(path) !== 'file') renderMain()
+    else renderFileTabs($('#main'), { tab: 'file', history: entries, summary: fileChanges(path), quilt: quiltFileView(path) }) // the count only: freshly changed lines stay lit
+  } catch {} finally {
+    if (read) historyLoads.delete(key)
+    else setTimeout(() => historyLoads.delete(key), 5000)
+  }
 }
 
 function treeMeta (path) {
@@ -3201,7 +3583,7 @@ function bindMentions (input) {
   const update = () => {
     const s = sum()
     if (!s) return close()
-    const asks = relayPrompts(input.value, { owner: !!s.status.access?.owner })
+    const asks = relayPrompts(input.value, { owner: !!s.status.access?.owner, seam: inSeam(s.status) })
     if (asks.length) { at = null; return show(asks.map((q) => ({ question: q.text }))) }
     const found = mentionAt(input.value, input.selectionStart)
     if (!found) return close()