memoir-cli 3.11.3 → 3.14.0

package/src/work/ui/app.js

@@ -0,0 +1,205 @@
+const $ = id => document.getElementById(id);
+const fragment = new URLSearchParams(location.hash.slice(1));
+let token = fragment.get('token');
+// Restricted storage must not break the active launch link. Keep the capability
+// in memory for this page even when the browser refuses session storage.
+try { if (token) sessionStorage.setItem('memoir-view-token', token); else token = sessionStorage.getItem('memoir-view-token'); } catch {}
+if (fragment.has('token')) history.replaceState(null, '', '/');
+let state, selected = 'overview', editing, latestEdit, editorOpener, busy = false, stateRequest = 0, renderAfterEditor = false;
+const labels = { overview: 'Overview', answer: 'Answers', decision: 'Decisions', check: 'Checks', next: 'Next steps', goal: 'Goals', removed: 'Removed' };
+const descriptions = { overview: 'The context your next session will use.', answer: 'Questions already answered, ready for the next session.', decision: 'What was decided, and why.', check: 'What actually ran, and what needs checking again.', next: 'Completed work and the steps still ahead.', goal: 'What this project is working toward.', removed: 'Hidden from the handoff. Earlier versions stay on this computer.' };
+function el(tag, text, className) { const node = document.createElement(tag); if (text !== undefined) node.textContent = text; if (className) node.className = className; return node; }
+function button(text, action, className = '') { const node = el('button', text, className); node.type = 'button'; node.addEventListener('click', action); return node; }
+function date(value) { return new Date(value).toLocaleString([], { dateStyle: 'medium', timeStyle: 'short' }); }
+function notice(message, error = false, undo) {
+  $('notice').replaceChildren(); const node = el('div', undefined, 'notice' + (error ? ' error' : '')); node.append(el('span', message));
+  if (undo) node.append(button('Undo', undo)); $('notice').append(node);
+}
+async function request(route, input) {
+  const controller = new AbortController();
+  const timeout = setTimeout(() => controller.abort(), 15000);
+  try {
+    let response, result;
+    try {
+      response = await fetch(route, { method: input ? 'POST' : 'GET', signal: controller.signal, cache: 'no-store', headers: { Authorization: 'Bearer ' + (token || ''), ...(input ? { 'Content-Type': 'application/json' } : {}) }, ...(input ? { body: JSON.stringify(input) } : {}) });
+      result = await response.json();
+    } catch {
+      const error = new Error(input ? 'The connection was interrupted. The change may already be saved. Your draft is kept; review the latest version before trying again.' : 'Could not refresh. Check that the local Memoir view is still running, then try Refresh.');
+      error.code = input ? 'save_unconfirmed' : 'connection_failed'; throw error;
+    }
+    if (!response.ok) { const error = new Error(result.error || 'Could not save. Refresh and try again.'); error.code = result.code; throw error; } return result;
+  } finally { clearTimeout(timeout); }
+}
+async function refresh() {
+  if (busy || $('editor').open) return;
+  const generation = ++stateRequest;
+  try {
+    const result = await request('/api/state');
+    if (generation !== stateRequest || busy || $('editor').open) return;
+    state = result; render();
+  } catch (error) { if (generation === stateRequest) notice(error.message, true); }
+}
+function nav() {
+  $('navigation').replaceChildren();
+  for (const [key, label] of Object.entries(labels)) {
+    const count = key === 'overview' ? null : key === 'removed' ? state.removed.length : key === 'check' ? state.checks.length : state.records.filter(r => r.kind === key).length;
+    const node = button(label, () => { selected = key; $('search').value = ''; render(); $('section-title').focus(); });
+    if (selected === key) node.setAttribute('aria-current', 'page');
+    if (count !== null) node.append(el('span', count, 'count')); $('navigation').append(node);
+  }
+}
+function metadata(item, check = false) {
+  const details = el('details', undefined, 'metadata'); details.append(el('summary', check ? 'Evidence and covered files' : 'Source and earlier versions'));
+  details.append(el('p', `Saved ${date(item.recorded_at)} · revision ${item.revision}`));
+  if (check) {
+    details.append(el('p', `Exit status: ${item.exit_code ?? 'unavailable'}. Local receipt; not authenticated.`));
+    const list = el('ul'); Object.keys(item.inputs).forEach(file => list.append(el('li', file))); details.append(list);
+    details.append(el('p', 'Output was discarded. Its fingerprint:')); details.append(el('code', item.output_sha256));
+  } else {
+    details.append(el('p', item.source)); if (item.why) details.append(el('p', 'Why: ' + item.why));
+    const history = state.history.filter(r => r.id === item.id && r.revision < item.revision).reverse();
+    for (const old of history) { const row = el('p', `Revision ${old.revision} · ${date(old.recorded_at)}\n${old.text}${old.answer ? '\n' + old.answer : ''}\nSource: ${old.source}`); details.append(row); }
+    if (!history.length) details.append(el('p', 'No earlier versions.'));
+  }
+  return details;
+}
+function recordCard(item, removed = false) {
+  const card = el('article', undefined, 'card' + (item.kind === 'next' && item.status === 'done' ? ' done' : ''));
+  card.dataset.recordId = item.id;
+  const kind = item.kind === 'next' ? (item.status === 'done' ? 'DONE' : 'TO DO') : item.kind === 'answer' ? 'ANSWERED' : item.kind.toUpperCase();
+  card.append(el('span', removed ? 'REMOVED' : kind, 'badge' + (removed ? ' neutral' : '')));
+  card.append(el('h3', item.text)); if (item.answer) card.append(el('p', item.answer, 'answer'));
+  if (item.why && !removed) card.append(el('p', item.why, 'hidden-note'));
+  const actions = el('div', undefined, 'card-actions');
+  if (removed) actions.append(button('Restore to handoff', () => restore(item)));
+  else {
+    actions.append(button('Correct', () => edit(item)));
+    if (item.kind === 'next') actions.append(button(item.status === 'done' ? 'Reopen' : 'Mark done', () => changeStatus(item)));
+    actions.append(button('Remove from handoff', () => remove(item), 'remove'));
+  }
+  card.append(actions, metadata(item)); return card;
+}
+function checkCard(item, removed = false) {
+  const matched = item.freshness === 'inputs-match';
+  const card = el('article', undefined, 'card');
+  card.append(el('span', removed ? 'REMOVED RECEIPT' : matched ? 'PASSED · FILES MATCH' : 'NEEDS RECHECK', 'badge' + (removed ? ' neutral' : matched ? '' : ' warn')));
+  card.append(el('h3', item.title));
+  if (!removed && item.reasons.length) { const reasons = el('ul', undefined, 'reasons'); item.reasons.forEach(reason => reasons.append(el('li', reason))); card.append(reasons); }
+  if (!removed) card.append(el('p', matched ? 'This result still covers the listed files. External settings need their own verification.' : 'Tell the next agent to review these changes before relying on the old result.', 'hidden-note'));
+  else card.append(el('p', 'Run a new authorized check to replace this receipt.', 'hidden-note'));
+  card.append(metadata(item, true)); if (!removed) { const actions = el('div', undefined, 'card-actions'); actions.append(button('Remove from handoff', () => remove(item, 'check'), 'remove')); card.append(actions); }
+  return card;
+}
+function matches(item) { const query = $('search').value.toLowerCase().trim(); return !query || [item.text, item.answer, item.why, item.title, item.id].filter(Boolean).join(' ').toLowerCase().includes(query); }
+function group(kind, items, limit = Infinity) {
+  const section = el('section', undefined, 'group'); const heading = el('div', undefined, 'group-title'); heading.append(el('h3', labels[kind]));
+  if (selected === 'overview') heading.append(button('View all →', () => { selected = kind; render(); $('section-title').focus(); })); section.append(heading);
+  const cards = el('div', undefined, 'cards'); items.filter(matches).slice(0, limit).forEach(item => cards.append(kind === 'check' ? checkCard(item) : recordCard(item))); section.append(cards); return section;
+}
+function render() {
+  if (!state) return;
+  renderAfterEditor = false; $('add').disabled = busy;
+  nav(); $('project').textContent = `${state.project_name} / ${state.branch || 'No Git branch'}`;
+  $('revision').textContent = `Handoff revision ${state.revision}. Refreshed ${new Date().toLocaleTimeString()}.`;
+  $('section-title').textContent = labels[selected]; $('section-description').textContent = descriptions[selected];
+  $('goal').replaceChildren();
+  if (selected === 'overview') { const goal = state.records.filter(r => r.kind === 'goal').sort((a,b) => b.revision - a.revision)[0]; if (goal) { const node = el('div', undefined, 'goal'); node.append(el('p', 'CURRENT GOAL', 'eyebrow'), el('p', goal.text), button('Edit goal', () => edit(goal), 'quiet')); $('goal').append(node); } }
+  const content = $('content'); content.replaceChildren();
+  if (selected === 'removed') {
+    const cards = el('div', undefined, 'cards'); state.removed.filter(r => matches(r.item)).forEach(r => cards.append(r.category === 'check' ? checkCard(r.item, true) : recordCard(r.item, true))); content.append(cards);
+  } else if (selected === 'overview') {
+    for (const kind of ['next','answer','check','decision']) {
+      let items = [...(kind === 'check' ? state.checks : state.records.filter(r => r.kind === kind))].sort((a,b) => b.revision - a.revision);
+      if (kind === 'next') items = [...items].sort((a,b) => (a.status === 'done') - (b.status === 'done') || b.revision - a.revision);
+      if (items.some(matches)) content.append(group(kind, items, 2));
+    }
+  } else content.append(group(selected, selected === 'check' ? state.checks : state.records.filter(r => r.kind === selected)));
+  if (!content.querySelector('.card')) { const empty = el('div', undefined, 'empty'); empty.append(el('strong', $('search').value ? 'No matching memories' : selected === 'removed' ? 'Nothing removed' : 'A fresh start'), el('span', $('search').value ? 'Try a shorter search.' : selected === 'removed' ? 'Items you remove will appear here.' : 'Add an answer, a decision or the next step.')); content.replaceChildren(empty); }
+}
+function kindFields() {
+  $('answer-label').hidden = $('kind').value !== 'answer'; $('answer').required = $('kind').value === 'answer';
+  $('status-label').hidden = $('kind').value !== 'next'; $('text-label').textContent = $('kind').value === 'answer' ? 'Question' : $('kind').value === 'next' ? 'Next step' : $('kind').value === 'goal' ? 'Goal' : 'Decision';
+}
+function edit(item) {
+  if (!state || busy) return;
+  ++stateRequest;
+  editorOpener = document.activeElement; latestEdit = null;
+  // Reuse a new record's ID after an uncertain response. A retry must conflict
+  // with a committed save instead of creating a second copy of the same draft.
+  editing = { item, id: item?.id || 'record.' + crypto.randomUUID(), branch: state.branch };
+  $('review-latest').hidden = true; $('comparison').hidden = true;
+  $('editor-title').textContent = item ? 'Correct memory' : 'Add memory'; $('save').textContent = item ? 'Save correction' : 'Save memory';
+  $('kind').value = item?.kind || 'answer'; $('kind').disabled = !!item;
+  $('text').value = item?.text || ''; $('answer').value = item?.answer || ''; $('why').value = item?.why || ''; $('status').value = item?.status || 'open';
+  $('form-error').textContent = ''; kindFields(); $('editor').showModal(); $('text').focus();
+}
+async function action(input) {
+  if (busy) throw new Error('A change is already being saved.'); busy = true; ++stateRequest;
+  $('add').disabled = true; $('refresh').disabled = true;
+  try { state = await request('/api/action', input); render(); }
+  finally { busy = false; $('add').disabled = !state; $('refresh').disabled = false; }
+}
+async function remove(item, category = 'record') {
+  const branch = state.branch;
+  try { await action({ action:'remove', branch, id:item.id, category, expected_revision:item.revision }); notice('Removed from the handoff. Earlier versions are kept locally.', false, category === 'record' ? () => restore(item, branch) : undefined); }
+  catch (error) { notice(error.message, true); }
+}
+async function restore(item, branch = state.branch) {
+  try { await action({ action:'restore', branch, id:item.id, expected_revision:item.revision }); notice('Restored to the handoff.'); }
+  catch (error) { notice(error.message, true); }
+}
+function fields(item) { return { kind:item.kind, text:item.text, ...(item.answer ? {answer:item.answer} : {}), ...(item.why ? {why:item.why} : {}), status:item.status }; }
+async function changeStatus(item) {
+  try { await action({ action:'save', branch:state.branch, id:item.id, expected_revision:item.revision, fields:{...fields(item),status:item.status === 'done' ? 'open' : 'done'} }); notice(item.status === 'done' ? 'Step reopened.' : 'Step marked done.'); }
+  catch (error) { notice(error.message, true); }
+}
+function editorSaving(saving) {
+  for (const id of ['text', 'answer', 'why', 'status', 'save', 'cancel', 'cancel-top', 'review-latest', 'keep-draft']) $(id).disabled = saving;
+  $('kind').disabled = saving || !!editing?.item;
+}
+$('edit-form').addEventListener('submit', async event => {
+  event.preventDefault(); if (!editing || busy) return;
+  const submitted = editing;
+  submitted.saving = true; editorSaving(true); $('form-error').textContent = '';
+  try {
+    const kind = $('kind').value;
+    await action({ action:'save', branch:submitted.branch, id:submitted.id, expected_revision:submitted.item?.revision || 0, fields:{kind,text:$('text').value, ...(kind === 'answer' ? {answer:$('answer').value} : {}), ...($('why').value ? {why:$('why').value} : {}),status:kind === 'next' ? $('status').value : 'open'} });
+    if (editing === submitted) $('editor').close();
+    notice(submitted.item ? 'Correction saved. The next session will use this version.' : 'Memory saved for the next session.');
+  } catch (error) { if (editing === submitted) { $('form-error').textContent = error.message; $('review-latest').hidden = !['refresh_required', 'save_unconfirmed'].includes(error.code); } }
+  finally { submitted.saving = false; if (editing === submitted || !editing) editorSaving(false); }
+});
+$('review-latest').addEventListener('click', async () => {
+  if (!editing || busy) return;
+  const reviewed = editing, generation = ++stateRequest;
+  try {
+    const latest = await request('/api/state');
+    if (editing !== reviewed || generation !== stateRequest) return;
+    if (latest.branch !== reviewed.branch) throw new Error('The project is on a different branch. Copy any draft you need, then close this editor and refresh to review that branch.');
+    state = latest; renderAfterEditor = true;
+    const item = latest.records.find(record => record.id === reviewed.id);
+    if (!item) throw new Error(reviewed.item || latest.removed.some(record => record.item.id === reviewed.id) ? 'This item was removed. Your draft is still here. Close the editor and refresh, then use Removed to review or restore it.' : 'This new memory is not in the saved handoff yet. Your draft is kept. Try Save memory again.');
+    latestEdit = { item, id:item.id, branch: latest.branch };
+    $('latest-text').textContent = item.text + (item.answer ? '\n\n' + item.answer : '') + (item.why ? '\n\nWhy: ' + item.why : '') + (item.kind === 'next' ? '\nProgress: ' + item.status : '');
+    $('comparison').hidden = false; $('keep-draft').focus();
+  } catch (error) { if (editing === reviewed && generation === stateRequest) $('form-error').textContent = error.message; }
+});
+$('keep-draft').addEventListener('click', () => {
+  if (!latestEdit) return;
+  editing = latestEdit; latestEdit = null; $('comparison').hidden = true; $('review-latest').hidden = true;
+  $('kind').value = editing.item.kind; $('kind').disabled = true; kindFields();
+  $('save').textContent = 'Save correction';
+  $('form-error').textContent = 'Latest version reviewed. Save correction when your draft is ready.'; $('text').focus();
+});
+$('editor').addEventListener('close', () => {
+  ++stateRequest;
+  if (renderAfterEditor) render();
+  const card = [...document.querySelectorAll('[data-record-id]')].find(node => node.dataset.recordId === editing?.item?.id);
+  (editorOpener?.isConnected ? editorOpener : card?.querySelector('button') || (editing?.item?.kind === 'goal' && $('goal').querySelector('button')) || $('add')).focus();
+  editing = null; latestEdit = null;
+});
+$('editor').addEventListener('cancel', event => { if (editing?.saving) event.preventDefault(); });
+$('kind').addEventListener('change', kindFields); $('cancel').addEventListener('click', () => $('editor').close()); $('cancel-top').addEventListener('click', () => $('editor').close());
+$('add').addEventListener('click', () => edit()); $('refresh').addEventListener('click', refresh); $('search').addEventListener('input', render);
+document.addEventListener('visibilitychange', () => { if (!document.hidden && !$('editor').open && !busy) refresh(); });
+refresh();

package/src/work/ui/index.html

@@ -0,0 +1,30 @@
+<!doctype html>
+<html lang="en">
+<head><meta charset="utf-8"><meta name="viewport" content="width=device-width, initial-scale=1"><title>Memoir · Project memory</title><link rel="stylesheet" href="/style.css"><script src="/app.js" defer></script></head>
+<body>
+<a class="skip-link" href="#section-title">Skip to project memory</a>
+<aside class="sidebar"><a class="brand" href="/" aria-label="Memoir home"><span class="mark">m</span> memoir</a><p class="eyebrow">PROJECT MEMORY</p><nav id="navigation" aria-label="Memory categories"></nav><div class="sidebar-note"><span class="local-dot"></span> On this computer<p>Your project context.<br>Your decisions to keep.</p></div></aside>
+<main>
+  <header class="topbar"><div id="project">Opening project…</div><button id="refresh" class="quiet">Refresh</button></header>
+  <section class="intro"><p class="eyebrow">A LITTLE CONTEXT GOES A LONG WAY</p><h1>Pick up where you left off.</h1><p class="subtitle">See what’s remembered. Keep what’s useful. Correct what isn’t.</p></section>
+  <div id="notice" role="status" aria-live="polite"></div>
+  <section id="goal" aria-label="Current goal"></section>
+  <div class="section-heading"><div><h2 id="section-title" tabindex="-1">Overview</h2><p id="section-description">The context your next session will use.</p></div><button id="add" class="primary" disabled>+ Add memory</button></div>
+  <label class="search-label"><span class="sr-only">Search saved project context</span><input id="search" type="search" placeholder="Find an answer, decision or next step…" autocomplete="off"></label>
+  <div id="content" aria-live="polite"></div>
+  <footer>Project records only. Check results cover their listed files; they don’t grant permission to publish. <span id="revision"></span></footer>
+</main>
+<dialog id="editor" aria-labelledby="editor-title"><form id="edit-form">
+  <div class="dialog-heading"><h2 id="editor-title">Correct memory</h2><button type="button" id="cancel-top" class="quiet" aria-label="Close editor">×</button></div>
+  <label>Type<select id="kind"><option value="answer">Answered question</option><option value="decision">Decision</option><option value="next">Next step</option><option value="goal">Goal</option></select></label>
+  <label><span id="text-label">Question</span><textarea id="text" rows="3" maxlength="2000" required></textarea></label>
+  <label id="answer-label">Answer<textarea id="answer" rows="3" maxlength="2000"></textarea></label>
+  <label>Why this matters <span class="optional">(optional)</span><textarea id="why" rows="2" maxlength="2000"></textarea></label>
+  <label id="status-label">Progress<select id="status"><option value="open">To do</option><option value="done">Done</option></select></label>
+  <p class="hint">Only save project context. Keep credentials and personal details out. Corrections keep earlier versions.</p>
+  <p id="form-error" class="form-error" role="alert"></p>
+  <button type="button" id="review-latest" class="quiet" hidden>Review latest version</button>
+  <section id="comparison" class="comparison" hidden aria-label="Latest saved version"><h3>Latest saved version</h3><pre id="latest-text"></pre><p>Your draft is still in the fields above. Compare it before continuing.</p><button type="button" id="keep-draft" class="quiet">Keep my draft and continue</button></section>
+  <div class="dialog-actions"><button type="button" id="cancel" class="quiet">Cancel</button><button type="submit" id="save" class="primary">Save correction</button></div>
+</form></dialog>
+</body></html>

package/src/work/ui/style.css

@@ -0,0 +1,3 @@
+:root{color-scheme:light;--ink:#22362d;--muted:#657469;--paper:#f8f9f5;--line:#dee4d9;--green:#315e46;--soft:#e8efe5;--warn:#8b5b15;--warn-bg:#fff4dc;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;font-size:15px}*{box-sizing:border-box}body{margin:0;background:var(--paper);color:var(--ink);line-height:1.55}button,input,select,textarea{font:inherit}button{cursor:pointer;border:1px solid transparent;border-radius:8px;padding:9px 14px;font-weight:600;color:inherit;background:white}button:hover{filter:brightness(.97)}button:disabled{opacity:.5;cursor:default}:focus-visible{outline:3px solid #77a2d7;outline-offset:3px}.sidebar{position:fixed;inset:0 auto 0 0;width:230px;border-right:1px solid var(--line);padding:34px 24px;background:#f1f4ed;display:flex;flex-direction:column}.brand{display:flex;align-items:center;gap:10px;font-size:27px;font-weight:650;letter-spacing:-1px;text-decoration:none;color:var(--ink);margin-bottom:48px}.mark{display:inline-grid;place-content:center;background:var(--green);color:#fff;width:34px;height:34px;border-radius:10px;font-family:Georgia,serif;font-size:32px;line-height:1}.eyebrow{font-size:10px;font-weight:750;letter-spacing:1.7px;color:var(--muted);margin:0 0 13px}nav{display:grid;gap:5px}nav button{display:flex;justify-content:space-between;text-align:left;background:transparent;font-weight:500;padding:11px 12px}nav button[aria-current=page]{background:#dfe8da;font-weight:650}nav .count{font-size:12px;border-radius:10px;min-width:22px;text-align:center;color:var(--muted)}.sidebar-note{margin-top:auto;font-size:12px;color:var(--muted)}.sidebar-note p{font-size:12px;line-height:1.7}.local-dot{display:inline-block;width:6px;height:6px;background:#6b8c58;border-radius:50%;margin-right:6px}main{margin-left:230px;max-width:1370px;padding:0 55px 24px}.topbar{height:80px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;font-size:13px;color:var(--muted)}.quiet{background:transparent;border-color:var(--line);font-size:13px}.intro{padding:43px 0 29px}h1{font-size:clamp(29px,3vw,42px);line-height:1.2;letter-spacing:-1.4px;margin:0 0 12px;font-weight:600}.subtitle{margin:0;color:var(--muted);font-size:15px}.goal{padding:20px 24px;background:#eaf0e5;border:1px solid #d6e0cc;border-radius:12px;margin-bottom:30px}.goal .eyebrow{margin-bottom:6px}.goal p{margin:0;font-size:16px;max-width:900px}.goal button{margin-top:12px}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:15px;margin:25px 0 17px}h2{font-size:20px;letter-spacing:-.4px;margin:0}.section-heading p{color:var(--muted);font-size:13px;margin:4px 0 0}.primary{background:var(--green);color:white;font-size:13px;padding:11px 16px}.search-label{display:block;margin-bottom:23px}input[type=search]{background:white;border:1px solid var(--line);border-radius:8px;padding:12px 15px;width:100%;max-width:460px;font-size:13px}.group{margin-bottom:27px}.group-title{display:flex;justify-content:space-between;align-items:center;margin-bottom:11px}.group h3{font-size:14px;margin:0}.group-title button{font-size:12px;padding:4px 8px;background:transparent;color:var(--muted)}.cards{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.card{border:1px solid var(--line);border-radius:11px;background:white;padding:20px;min-width:0}.card h3,.card h4{font-size:14px;margin:8px 0;font-weight:650;line-height:1.5;overflow-wrap:anywhere}.card p{margin:7px 0;overflow-wrap:anywhere}.card .answer{font-size:15px;white-space:pre-wrap}.badge{display:inline-flex;padding:3px 8px;border-radius:5px;background:var(--soft);color:var(--green);font-size:10px;letter-spacing:.5px;font-weight:650}.badge.warn{background:var(--warn-bg);color:var(--warn)}.badge.neutral{background:#f0f2ef;color:var(--muted)}.card-actions{display:flex;gap:8px;margin-top:16px;flex-wrap:wrap}.card-actions button{font-size:12px;padding:6px 11px;background:#f8faf6;border-color:var(--line)}.card-actions .remove{color:var(--muted);background:transparent;border-color:transparent}.metadata{font-size:12px;color:var(--muted);margin-top:13px}.metadata p{white-space:pre-wrap}.metadata summary{cursor:pointer}.metadata ul{padding-left:19px}.metadata code{font-size:11px;word-break:break-all}.reasons{border-left:2px solid #d9ac62;padding-left:11px;color:var(--warn);font-size:12px;list-style:none}.empty{padding:33px;border:1px dashed var(--line);border-radius:10px;color:var(--muted);text-align:center}.empty strong{display:block;color:var(--ink);margin-bottom:4px}.notice{padding:12px 16px;background:#edf3e8;border:1px solid #d7e1cf;border-radius:8px;font-size:13px;margin-bottom:18px;display:flex;align-items:center;justify-content:space-between;gap:12px}.notice.error{background:#fff1e9;color:#943a1b;border-color:#edccbc}.notice button{font-size:12px;background:transparent;text-decoration:underline}.hidden-note{color:var(--muted);font-size:12px}.done .answer{text-decoration:line-through;color:var(--muted)}footer{margin:30px 0 0;border-top:1px solid var(--line);padding-top:17px;color:var(--muted);font-size:11px}footer span{display:block;margin-top:4px}dialog{border:1px solid var(--line);border-radius:15px;padding:27px;width:min(560px,calc(100% - 32px));max-height:90vh;color:var(--ink);box-shadow:0 15px 80px #11221122}dialog::backdrop{background:#1c302c66}dialog form{display:grid;gap:15px}.dialog-heading,.dialog-actions{display:flex;align-items:center;justify-content:space-between;gap:10px}.dialog-heading h2{font-size:23px}.dialog-heading button{font-size:22px;padding:0 10px}.dialog-actions{justify-content:flex-end;margin-top:8px}label{display:grid;gap:6px;font-size:13px;font-weight:600}textarea,select{width:100%;border:1px solid #cbd4c6;border-radius:7px;padding:9px 11px;font-size:14px;color:var(--ink);background:white}textarea{resize:vertical}label[hidden]{display:none}.hint,.optional{font-size:12px;font-weight:400;color:var(--muted)}.hint{margin:0}.form-error{color:#943a1b;font-size:13px;margin:0}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}@media(min-width:1450px){main{margin-left:230px;padding-right:85px;padding-left:85px}}@media(max-width:900px){.sidebar{width:190px;padding:25px 15px}main{margin-left:190px;padding:0 25px 25px}.cards{grid-template-columns:1fr}.intro{padding-top:30px}}@media(max-width:600px){.sidebar{position:static;width:auto;padding:17px 18px;display:block;border-right:0;border-bottom:1px solid var(--line)}.brand{font-size:22px;margin:0 0 15px}.mark{width:27px;height:27px;font-size:26px}.sidebar>.eyebrow,.sidebar-note{display:none}nav{display:flex;overflow-x:auto;gap:4px}nav button{white-space:nowrap;gap:8px;padding:8px;font-size:12px}main{margin:0;padding:0 18px 18px}.topbar{height:62px}.section-heading{align-items:flex-start}.section-heading .primary{white-space:nowrap}.intro{padding-top:28px}.goal{padding:18px}.cards{grid-template-columns:1fr}h1{letter-spacing:-.8px}.goal p{font-size:14px}}
+
+[hidden]{display:none!important}.skip-link{position:fixed;top:-100px;left:12px;z-index:10;padding:12px;background:white;color:var(--ink)}.skip-link:focus{top:12px}.comparison{padding:14px;background:var(--soft);border-radius:8px;font-size:13px}.comparison h3{margin:0 0 8px;font-size:14px}.comparison pre{white-space:pre-wrap;overflow-wrap:anywhere;font:inherit}.topbar>div{overflow-wrap:anywhere;min-width:0}.metadata li{overflow-wrap:anywhere}

package/src/work/view.js

@@ -0,0 +1,93 @@
+// A bounded local editor, never a shell or general filesystem endpoint.
+import http from 'node:http';
+import fs from 'node:fs/promises';
+import crypto from 'node:crypto';
+import { z } from 'zod';
+import { workRoot, reviewWork, recordWork, retractWork, restoreWork } from './store.js';
+import { workErrorMessage } from './errors.js';
+
+const assets = new Map([
+  ['/', ['index.html', 'text/html; charset=utf-8']],
+  ['/app.js', ['app.js', 'text/javascript; charset=utf-8']],
+  ['/style.css', ['style.css', 'text/css; charset=utf-8']],
+]);
+const actionSchema = z.object({
+  action: z.enum(['save', 'remove', 'restore']),
+  branch: z.string().max(1024).nullable(),
+  id: z.string().regex(/^[a-zA-Z0-9][a-zA-Z0-9._-]{0,79}$/),
+  expected_revision: z.number().int().nonnegative(),
+  category: z.enum(['record', 'check']).default('record'),
+  fields: z.object({ kind: z.enum(['goal', 'answer', 'decision', 'next']), text: z.string().min(1).max(2000), answer: z.string().max(2000).optional(), why: z.string().max(2000).optional(), status: z.enum(['open', 'done']).default('open') }).strict().optional(),
+}).strict();
+
+const headers = {
+  'Cache-Control': 'no-store', 'X-Content-Type-Options': 'nosniff',
+  'Referrer-Policy': 'no-referrer', 'X-Frame-Options': 'DENY',
+  'Cross-Origin-Resource-Policy': 'same-origin', 'Cross-Origin-Opener-Policy': 'same-origin',
+  'Permissions-Policy': 'camera=(), microphone=(), geolocation=()',
+  'Content-Security-Policy': "default-src 'none'; script-src 'self'; style-src 'self'; connect-src 'self'; img-src 'none'; base-uri 'none'; object-src 'none'; frame-ancestors 'none'; form-action 'none'",
+};
+function reply(res, status, value, type = 'application/json; charset=utf-8') {
+  res.writeHead(status, { ...headers, 'Content-Type': type });
+  res.end(type.startsWith('application/json') ? JSON.stringify(value) : value);
+}
+async function body(req) {
+  const parts = []; let bytes = 0;
+  for await (const chunk of req) {
+    bytes += chunk.length;
+    if (bytes > 16384) throw new Error('Request is too large. Nothing was saved.');
+    parts.push(chunk);
+  }
+  return JSON.parse(Buffer.concat(parts).toString());
+}
+
+export async function startWorkView(project, { port = 0 } = {}) {
+  if (!Number.isInteger(port) || port < 0 || port > 65535) throw new Error('Choose a port between 0 and 65535.');
+  const root = await workRoot(project);
+  await reviewWork(root); // Refuse damaged data before announcing a working view.
+  const token = crypto.randomBytes(32).toString('base64url');
+  const expectedAuth = Buffer.from('Bearer ' + token);
+  let origin;
+  const server = http.createServer(async (req, res) => {
+    try {
+      // Reject alternate Host names (including DNS rebinding) and cross-site
+      // browser requests. No CORS permission is granted, including preflight.
+      if (req.headers.host !== new URL(origin).host) return reply(res, 403, { error: 'This view only accepts its local address.' });
+      if (req.headers.origin && req.headers.origin !== origin || req.headers['sec-fetch-site'] && !['same-origin', 'none'].includes(req.headers['sec-fetch-site'])) return reply(res, 403, { error: 'Open the local Memoir view directly.' });
+      const url = new URL(req.url, origin);
+      const asset = assets.get(url.pathname);
+      if (req.method === 'GET' && asset && !url.search) return reply(res, 200, await fs.readFile(new URL('./ui/' + asset[0], import.meta.url)), asset[1]);
+      if (!url.pathname.startsWith('/api/')) return reply(res, 404, { error: 'Not found.' });
+      const auth = Buffer.from(req.headers.authorization || '');
+      if (auth.length !== expectedAuth.length || !crypto.timingSafeEqual(auth, expectedAuth)) return reply(res, 401, { error: 'Reopen the view with its local link.' });
+      if (req.method === 'GET' && url.pathname === '/api/state' && !url.search) return reply(res, 200, await reviewWork(root));
+      if (req.method !== 'POST' || url.pathname !== '/api/action' || url.search) return reply(res, 405, { error: 'This action is unavailable.' });
+      if (req.headers.origin !== origin || req.headers['content-type'] !== 'application/json') return reply(res, 403, { error: 'Save changes from the local view.' });
+      const input = actionSchema.parse(await body(req));
+      const guard = { expectedBranch: input.branch };
+      if (input.action === 'save') {
+        if (input.category !== 'record' || !input.fields) return reply(res, 400, { error: 'Only project records can be edited.' });
+        const { answer, why, ...fields } = input.fields;
+        await recordWork(root, { ...fields, ...(answer ? { answer } : {}), ...(why ? { why } : {}), id: input.id, expected_revision: input.expected_revision, scope: 'project', source: 'Saved in the local project view; previous versions remain in history.' }, guard);
+      } else if (input.action === 'remove') {
+        await retractWork(root, input, guard);
+      } else {
+        if (input.category !== 'record') return reply(res, 400, { error: 'Run a new authorized check to replace a removed receipt.' });
+        await restoreWork(root, input, guard);
+      }
+      return reply(res, 200, await reviewWork(root));
+    } catch (error) {
+      const message = workErrorMessage(error);
+      const conflict = /branch changed|Record changed|Record was removed|expected revision|before retracting/.test(message);
+      if (!res.headersSent && !res.destroyed) reply(res, 409, conflict
+        ? { error: 'Another session changed this item or branch. Review the latest version before saving. Your draft has been kept.', code: 'refresh_required' }
+        : { error: message });
+    }
+  });
+  server.requestTimeout = 10000; server.headersTimeout = 10000; server.keepAliveTimeout = 1000;
+  await new Promise((resolve, reject) => {
+    server.once('error', reject);
+    server.listen(port, '127.0.0.1', () => { origin = `http://127.0.0.1:${server.address().port}`; resolve(); });
+  });
+  return { server, origin, url: `${origin}/#token=${token}`, close: () => new Promise(resolve => { server.close(resolve); server.closeIdleConnections?.(); }) };
+}