@supersuit/suggest-a-change 0.1.9 → 0.1.11

package/CHANGELOG.md

@@ -1,5 +1,15 @@
 # Changelog
 
+## Unreleased
+
+## 0.1.11 (2026-10-18)
+
+- **A second tab no longer takes over the first tab's recording.** Two tabs share one IndexedDB, and a tab that opened while another was recording ran `recoverTakes` over the live take: it deleted its marker and chunks, so every second said after that had no marker and was lost if the recording tab then died (freedom-app-template#1). Each second of a take now refreshes `beatAt` on its marker, and `recoverTakes` leaves a take that beat within `LIVE_TAKE_MS` (5 s, exported) exactly as it is; it is made whole on an open after it goes quiet. `recoverTakes(store, claim, { now, liveMs })` takes the clock for tests. An app reopened within 5 s of a crash recovers that take on its next open instead of this one; nothing is lost.
+
+## 0.1.10 (2026-10-17)
+
+- **What goes with it is one small line.** The sheet no longer draws a section with a legend, an explainer and four switches above Send. Every diagnostic (the app's version, the time, the screen size, the phone type) goes with every report, beside the screen's name and address, and one muted line says what goes and to whom. Whoever acts on a report needs all of them, so leaving one out only ever cost a round trip. The `Words` keys the switches used (`withLegend`, `alwaysSent`, `include`, `screenName`) stay, so an app that overrides them still typechecks.
+
 ## 0.1.9 (2026-10-17)
 
 - **The door helpers are exported from `./server`.** `json`, `signIn`, `notFound`, `cappedText` and `peek` are what an app's own route wrapper needs to answer as the handlers do and never read a body past a cap. Two apps (cofounders-template, first-years-template) carried byte-identical copies; they now import these. The handlers use the same functions, so there is one copy of the door. No behaviour change.

package/README.md

@@ -69,7 +69,7 @@ Styling: structure only, class names prefixed `sac-`. `@supersuit/suggest-a-chan
 | `--sac-backdrop` | `rgba(0, 0, 0, 0.45)` | the dim behind the sheet |
 | `--sac-focus` | `#1a56db` | focus rings |
 
-The four diagnostics are the app's version, the time, the screen size and the phone type; the app's version and the phone type are on by default and the time and screen size are off (the report's id and the app's own received time already say when it was sent), and the screen's name and address are always sent and shown as such.
+The four diagnostics are the app's version, the time, the screen size and the phone type. All four go with every report, with the screen's name and address, and the sheet says so in one small line above Send rather than a section of switches.
 
 **Identity.** Every screen asks `adapters.identity()` when it mounts, whenever it is handed a different `adapters` object, and whenever the host calls `refreshIdentity()` (exported from `"./client"`; call it after a sign-in, sign-out or account switch). When the account differs, the old account's rows leave the screen and its waiting reports stay on the phone, to be sent only while that account is signed in; every send re-confirms the account first. Keep `adapters` stable where you can; a parent that rebuilds it every render is safe, only slower (one `identity()` call per render).
 

package/dist/client/recorder.d.ts

@@ -1,5 +1,15 @@
 import type { Store } from './idb.ts';
 export declare function pickMime(): string;
+/**
+ * A take whose last second landed this recently is LIVE in some page, never abandoned. Two tabs
+ * share one IndexedDB, so a second tab opening while the first records would otherwise "recover"
+ * the first tab's take mid-recording: delete its marker and chunks, and leave every second said
+ * after that with no marker, lost if that tab then dies (freedom-app-template#1). Each second of a
+ * take refreshes `beatAt`, so a take nobody is recording goes quiet within a second and is made
+ * whole on the next open after this window. Chunks arrive every 1000 ms; the margin covers a busy
+ * main thread.
+ */
+export declare const LIVE_TAKE_MS = 5000;
 export interface Recorded {
     key: string;
     blob: Blob;
@@ -14,7 +24,11 @@ export declare function startTake(store: Store, key: string, questionId: string)
 }>;
 /** Takes the app was closed in the middle of, made whole again. */
 /** `claim` limits the recovery to takes the caller owns (by question id); the rest are left exactly as they are for their owner. */
-export declare function recoverTakes(store: Store, claim?: (questionId: string) => boolean): Promise<{
+/** A take still beating (another tab recording it, LIVE_TAKE_MS) is left exactly as it is; it is recovered on an open after it goes quiet. */
+export declare function recoverTakes(store: Store, claim?: (questionId: string) => boolean, { now, liveMs }?: {
+    now?: number;
+    liveMs?: number;
+}): Promise<{
     questionId: string;
     key: string;
     ms: number;

package/dist/client/recorder.js

@@ -6,6 +6,16 @@ export function pickMime() {
             return m;
     return '';
 }
+/**
+ * A take whose last second landed this recently is LIVE in some page, never abandoned. Two tabs
+ * share one IndexedDB, so a second tab opening while the first records would otherwise "recover"
+ * the first tab's take mid-recording: delete its marker and chunks, and leave every second said
+ * after that with no marker, lost if that tab then dies (freedom-app-template#1). Each second of a
+ * take refreshes `beatAt`, so a take nobody is recording goes quiet within a second and is made
+ * whole on the next open after this window. Chunks arrive every 1000 ms; the margin covers a busy
+ * main thread.
+ */
+export const LIVE_TAKE_MS = 5000;
 export async function startTake(store, key, questionId) {
     const stream = await navigator.mediaDevices.getUserMedia({ audio: { echoCancellation: true, noiseSuppression: true, autoGainControl: true } });
     const mime = pickMime();
@@ -14,13 +24,16 @@ export async function startTake(store, key, questionId) {
     const started = Date.now();
     const chunks = [];
     const writes = [];
-    await store.put('kv', `rec:${key}`, { questionId, mime: type, startedAt: started });
+    const meta = { questionId, mime: type, startedAt: started, beatAt: started };
+    await store.put('kv', `rec:${key}`, meta);
     rec.ondataavailable = (e) => {
         if (!e.data?.size)
             return;
         const seq = chunks.length;
         chunks.push(e.data);
         writes.push(store.put('blobs', `${key}#${String(seq).padStart(5, '0')}`, e.data).catch(() => { }));
+        // The heartbeat another tab's recovery reads (LIVE_TAKE_MS).
+        writes.push(store.put('kv', `rec:${key}`, { ...meta, beatAt: Date.now() }).catch(() => { }));
     };
     rec.start(1000);
     const meter = makeMeter(stream);
@@ -100,7 +113,8 @@ function makeMeter(stream) {
 }
 /** Takes the app was closed in the middle of, made whole again. */
 /** `claim` limits the recovery to takes the caller owns (by question id); the rest are left exactly as they are for their owner. */
-export async function recoverTakes(store, claim) {
+/** A take still beating (another tab recording it, LIVE_TAKE_MS) is left exactly as it is; it is recovered on an open after it goes quiet. */
+export async function recoverTakes(store, claim, { now = Date.now(), liveMs = LIVE_TAKE_MS } = {}) {
     const out = [];
     // By prefix: this runs before the first paint, and `kv` also holds every saved view.
     const metas = (await store.all('kv', 'rec:')).filter((r) => r.key.startsWith('rec:'));
@@ -110,6 +124,9 @@ export async function recoverTakes(store, claim) {
     for (const { key: metaKey, value: m } of metas) {
         if (claim && !claim(m.questionId))
             continue;
+        const beat = Number(m.beatAt ?? m.startedAt);
+        if (Number.isFinite(beat) && now - beat < liveMs)
+            continue;
         const key = metaKey.slice(4);
         const parts = blobs.filter((b) => b.key.startsWith(`${key}#`)).sort((a, b) => a.key.localeCompare(b.key));
         if (parts.length) {

package/dist/client/sheet.js

@@ -69,8 +69,6 @@ export function SuggestSheet({ adapters, where, onClose, initial }) {
     const [answers, setAnswers] = useState({ ...NO_ANSWERS, happened: initial?.happened ?? '' });
     const [voice, setVoice] = useState([]);
     const [media, setMedia] = useState([]);
-    // The design's example line is the default: version, screen name (always) and phone type. The time and the screen size are opt-in.
-    const [on, setOn] = useState({ appVersion: true, at: false, screen: false, device: true });
     const [error, setError] = useState('');
     const [announce, setAnnounce] = useState('');
     const [sent, setSent] = useState(null);
@@ -253,17 +251,16 @@ export function SuggestSheet({ adapters, where, onClose, initial }) {
         await rt?.store.del('kv', metaKey(v.key));
         setAnnounce(S.voiceNoteRemoved);
     }
-    // What goes with it: exactly the contract's four diagnostics, each with a switch that really removes it.
-    // Where the person was (the screen's name and address) is what the report is about, so it is always sent and shown as such.
+    // What goes with it: the contract's four diagnostics, always sent, with no switches. Whoever reads the report
+    // needs the device, the time and the screen to act on it, so leaving one out only ever cost a round trip.
+    // The sheet says so in one small FYI line rather than a section to configure.
     const avail = [
         { name: 'appVersion', label: S.diagAppVersion, value: adapters.about?.version },
         { name: 'at', label: S.diagAt, value: new Date(adapters.phone?.now?.() ?? Date.now()).toISOString() },
         { name: 'screen', label: S.diagScreen, value: screenSize() },
         { name: 'device', label: S.diagDevice, value: adapters.device ? adapters.device() : phoneType() },
     ].filter((d) => Boolean(d.value));
-    // The design's order: the app's version, this screen's name (always), then whatever else is on, phone type last.
-    const isOn = (n) => avail.find((d) => d.name === n && on[d.name])?.label;
-    const lineParts = [isOn('appVersion'), S.screenName, isOn('at'), isOn('screen'), isOn('device')].filter((x) => Boolean(x));
+    const lineParts = [`this screen (${where.screen}, ${sanitizeRoute(where.route)})`, ...avail.map((d) => d.label)];
     const summary = `${S.goesTo(adapters.words.owner)} ${S.includes(lineParts)}`;
     // Answers to the broken questions only count while the kind is broken: they are not sent otherwise.
     const hasAnything = Boolean(words.trim() || voice.length || media.length || (kind === 'broken' && (answers.happened.trim() || answers.expected.trim() || answers.steps.trim())));
@@ -275,8 +272,7 @@ export function SuggestSheet({ adapters, where, onClose, initial }) {
         const d = await saveDraft(rt.store, key, { kind, words, attachments: [...voice.map((v) => v.key), ...media.map((m) => m.key)] });
         const diagnostics = {};
         for (const x of avail)
-            if (on[x.name])
-                diagnostics[x.name] = x.value;
+            diagnostics[x.name] = x.value;
         const report = {
             id: d.reportId,
             kind,
@@ -335,5 +331,5 @@ export function SuggestSheet({ adapters, where, onClose, initial }) {
     return (_jsx("div", { className: "sac-backdrop", "data-suggest-sheet": "", children: _jsxs("div", { ref: box, className: "sac-sheet", role: "dialog", "aria-modal": "true", "aria-labelledby": titleId, tabIndex: -1, children: [_jsxs("header", { className: "sac-header", children: [_jsx("h2", { id: titleId, className: "sac-title", children: S.sheetTitle }), onClose ? _jsx("button", { type: "button", className: "sac-button sac-close", onClick: onClose, children: S.close }) : null] }), _jsx("div", { className: "sac-sr", "data-sac-live": "", role: "status", "aria-live": "polite", "aria-atomic": "true", children: announce }), who === undefined ? _jsx("p", { children: S.loading }) : who === null ? _jsx("p", { role: "alert", children: S.signedOut }) : !rt ? _jsx("p", { children: S.loading }) : sent ? (_jsxs("div", { className: "sac-sent", children: [_jsx(Receipt, { adapters: adapters, reportId: sent.id, quiet: true, onLine: setAnnounce }), sent.files.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.attachmentsLabel, children: sent.files.map((f) => {
                                 const p = rt.part(sent.id, f.file);
                                 return (_jsxs("li", { className: "sac-item", "data-attachment-state": p.state, children: [_jsxs("span", { className: "sac-item-name", children: [f.name, f.bytes ? `, ${sizeWords(f.bytes)}` : ''] }), _jsxs("span", { className: "sac-item-state", children: [p.state === 'sending' ? _jsx("progress", { "aria-label": `${S.sending} ${f.name}` }) : null, p.state === 'waiting' ? S.waitingToSend : p.state === 'sending' ? S.sending : p.state === 'sent' ? S.sentWord : S.didNotSend(p.reason ?? '')] }), p.state === 'failed' ? _jsx("button", { type: "button", className: "sac-button", onClick: () => void rt.retry(sent.id), children: S.retry }) : null] }, f.file));
-                            }) })) : null, onClose ? _jsx("button", { type: "button", className: "sac-button sac-primary", onClick: onClose, children: S.done }) : null] })) : (_jsxs("form", { className: "sac-form", onSubmit: (e) => { e.preventDefault(); void send(); }, children: [_jsxs("fieldset", { role: "radiogroup", className: "sac-group sac-kinds", children: [_jsx("legend", { children: S.kindLegend }), kinds.map((k) => (_jsxs("label", { className: "sac-choice", children: [_jsx("input", { type: "radio", name: "sac-kind", value: k.id, checked: kind === k.id, onChange: () => setKind(k.id) }), _jsx("span", { children: k.label })] }, k.id)))] }), kind === 'broken' ? (_jsxs("fieldset", { className: "sac-group", children: [_jsxs("legend", { children: [S.kindBroken, " (", S.optional, ")"] }), fieldFor('happened', S.brokenHappened, answers.happened, (v) => setAnswers((a) => ({ ...a, happened: v }))), fieldFor('expected', S.brokenExpected, answers.expected, (v) => setAnswers((a) => ({ ...a, expected: v }))), fieldFor('steps', S.brokenSteps, answers.steps, (v) => setAnswers((a) => ({ ...a, steps: v })))] })) : null, _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.sayItLegend }), fieldFor('words', S.sayItLabel, words, setWords, { placeholder: S.sayItPlaceholder }), voice.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.voiceNotesLabel, children: voice.map((v, i) => (_jsxs("li", { className: "sac-item", children: [_jsx("span", { className: "sac-item-name", children: S.voiceNote(i + 1, lengthWords(v.ms)) }), _jsx("button", { type: "button", className: "sac-button", "aria-label": `${S.remove} ${S.voiceNote(i + 1, lengthWords(v.ms))}`, onClick: () => void removeVoice(v), children: S.remove })] }, v.key))) })) : null] }), _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.showItLegend }), _jsxs("div", { className: "sac-actions", children: [_jsx("button", { type: "button", className: "sac-button", onClick: () => fileInput.current?.click(), children: S.addImages }), _jsx("button", { type: "button", className: "sac-button", onClick: () => videoInput.current?.click(), children: S.addVideo }), adapters.snapshot ? _jsx("button", { type: "button", className: "sac-button", onClick: () => void takeScreenshot(), children: S.takeScreenshot }) : null] }), _jsx("input", { ref: fileInput, type: "file", accept: "image/*", multiple: true, hidden: true, "aria-label": S.addImages, "data-sac-images": "", onChange: (e) => { const f = [...(e.target.files ?? [])]; e.target.value = ''; void addMedia(f, 'image'); } }), _jsx("input", { ref: videoInput, type: "file", accept: "video/*", hidden: true, "aria-label": S.addVideo, "data-sac-video": "", onChange: (e) => { const f = [...(e.target.files ?? [])]; e.target.value = ''; void addMedia(f, 'video'); } }), media.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.attachmentsLabel, children: media.map((m) => (_jsxs("li", { className: "sac-item", children: [_jsxs("span", { className: "sac-item-name", children: [m.name, ", ", sizeWords(m.bytes)] }), _jsx("button", { type: "button", className: "sac-button", "aria-label": `${S.remove} ${m.name}`, onClick: () => void removeMedia(m), children: S.remove })] }, m.key))) })) : null] }), _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.withLegend }), _jsx("p", { className: "sac-summary", "data-sac-summary": "", "aria-live": "polite", children: summary }), _jsx("p", { className: "sac-muted", "data-sac-where": "", children: S.alwaysSent(where.screen, sanitizeRoute(where.route)) }), avail.map((d) => (_jsxs("label", { className: "sac-switch", children: [_jsx("input", { type: "checkbox", role: "switch", checked: on[d.name], "aria-label": S.include(d.label), onChange: (e) => setOn((cur) => ({ ...cur, [d.name]: e.target.checked })) }), _jsxs("span", { children: [d.label, ": ", _jsx("span", { className: "sac-muted", children: d.value })] })] }, d.name)))] }), error ? _jsx("p", { role: "alert", className: "sac-error", children: error }) : null, _jsxs("div", { className: "sac-actions", children: [_jsx("button", { type: "submit", className: "sac-button sac-primary", disabled: !hasAnything, "aria-describedby": hasAnything ? undefined : `${titleId}-hint`, children: S.send }), hasAnything ? null : _jsx("span", { id: `${titleId}-hint`, className: "sac-muted", children: S.sendHint })] })] })), _jsx(Toasts, {})] }) }));
+                            }) })) : null, onClose ? _jsx("button", { type: "button", className: "sac-button sac-primary", onClick: onClose, children: S.done }) : null] })) : (_jsxs("form", { className: "sac-form", onSubmit: (e) => { e.preventDefault(); void send(); }, children: [_jsxs("fieldset", { role: "radiogroup", className: "sac-group sac-kinds", children: [_jsx("legend", { children: S.kindLegend }), kinds.map((k) => (_jsxs("label", { className: "sac-choice", children: [_jsx("input", { type: "radio", name: "sac-kind", value: k.id, checked: kind === k.id, onChange: () => setKind(k.id) }), _jsx("span", { children: k.label })] }, k.id)))] }), kind === 'broken' ? (_jsxs("fieldset", { className: "sac-group", children: [_jsxs("legend", { children: [S.kindBroken, " (", S.optional, ")"] }), fieldFor('happened', S.brokenHappened, answers.happened, (v) => setAnswers((a) => ({ ...a, happened: v }))), fieldFor('expected', S.brokenExpected, answers.expected, (v) => setAnswers((a) => ({ ...a, expected: v }))), fieldFor('steps', S.brokenSteps, answers.steps, (v) => setAnswers((a) => ({ ...a, steps: v })))] })) : null, _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.sayItLegend }), fieldFor('words', S.sayItLabel, words, setWords, { placeholder: S.sayItPlaceholder }), voice.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.voiceNotesLabel, children: voice.map((v, i) => (_jsxs("li", { className: "sac-item", children: [_jsx("span", { className: "sac-item-name", children: S.voiceNote(i + 1, lengthWords(v.ms)) }), _jsx("button", { type: "button", className: "sac-button", "aria-label": `${S.remove} ${S.voiceNote(i + 1, lengthWords(v.ms))}`, onClick: () => void removeVoice(v), children: S.remove })] }, v.key))) })) : null] }), _jsxs("fieldset", { className: "sac-group", children: [_jsx("legend", { children: S.showItLegend }), _jsxs("div", { className: "sac-actions", children: [_jsx("button", { type: "button", className: "sac-button", onClick: () => fileInput.current?.click(), children: S.addImages }), _jsx("button", { type: "button", className: "sac-button", onClick: () => videoInput.current?.click(), children: S.addVideo }), adapters.snapshot ? _jsx("button", { type: "button", className: "sac-button", onClick: () => void takeScreenshot(), children: S.takeScreenshot }) : null] }), _jsx("input", { ref: fileInput, type: "file", accept: "image/*", multiple: true, hidden: true, "aria-label": S.addImages, "data-sac-images": "", onChange: (e) => { const f = [...(e.target.files ?? [])]; e.target.value = ''; void addMedia(f, 'image'); } }), _jsx("input", { ref: videoInput, type: "file", accept: "video/*", hidden: true, "aria-label": S.addVideo, "data-sac-video": "", onChange: (e) => { const f = [...(e.target.files ?? [])]; e.target.value = ''; void addMedia(f, 'video'); } }), media.length ? (_jsx("ul", { className: "sac-list", "aria-label": S.attachmentsLabel, children: media.map((m) => (_jsxs("li", { className: "sac-item", children: [_jsxs("span", { className: "sac-item-name", children: [m.name, ", ", sizeWords(m.bytes)] }), _jsx("button", { type: "button", className: "sac-button", "aria-label": `${S.remove} ${m.name}`, onClick: () => void removeMedia(m), children: S.remove })] }, m.key))) })) : null] }), _jsx("p", { className: "sac-muted sac-fyi", "data-sac-summary": "", children: summary }), error ? _jsx("p", { role: "alert", className: "sac-error", children: error }) : null, _jsxs("div", { className: "sac-actions", children: [_jsx("button", { type: "submit", className: "sac-button sac-primary", disabled: !hasAnything, "aria-describedby": hasAnything ? undefined : `${titleId}-hint`, children: S.send }), hasAnything ? null : _jsx("span", { id: `${titleId}-hint`, className: "sac-muted", children: S.sendHint })] })] })), _jsx(Toasts, {})] }) }));
 }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@supersuit/suggest-a-change",
-  "version": "0.1.9",
+  "version": "0.1.11",
   "description": "The report format and flow behind a Suggest a change button: what a report is, who acts at each step, the screens, and the check every app runs. The contract has zero dependencies.",
   "type": "module",
   "bin": {

package/src/client/recorder.ts

@@ -10,7 +10,18 @@ export function pickMime(): string {
   return ''
 }
 
-interface Meta { questionId: string; mime: string; startedAt: number }
+interface Meta { questionId: string; mime: string; startedAt: number; beatAt?: number }
+
+/**
+ * A take whose last second landed this recently is LIVE in some page, never abandoned. Two tabs
+ * share one IndexedDB, so a second tab opening while the first records would otherwise "recover"
+ * the first tab's take mid-recording: delete its marker and chunks, and leave every second said
+ * after that with no marker, lost if that tab then dies (freedom-app-template#1). Each second of a
+ * take refreshes `beatAt`, so a take nobody is recording goes quiet within a second and is made
+ * whole on the next open after this window. Chunks arrive every 1000 ms; the margin covers a busy
+ * main thread.
+ */
+export const LIVE_TAKE_MS = 5000
 export interface Recorded { key: string; blob: Blob; ms: number }
 
 export async function startTake(store: Store, key: string, questionId: string) {
@@ -21,12 +32,15 @@ export async function startTake(store: Store, key: string, questionId: string) {
   const started = Date.now()
   const chunks: Blob[] = []
   const writes: Promise<void>[] = []
-  await store.put('kv', `rec:${key}`, { questionId, mime: type, startedAt: started } satisfies Meta)
+  const meta: Meta = { questionId, mime: type, startedAt: started, beatAt: started }
+  await store.put('kv', `rec:${key}`, meta)
   rec.ondataavailable = (e) => {
     if (!e.data?.size) return
     const seq = chunks.length
     chunks.push(e.data)
     writes.push(store.put('blobs', `${key}#${String(seq).padStart(5, '0')}`, e.data).catch(() => {}))
+    // The heartbeat another tab's recovery reads (LIVE_TAKE_MS).
+    writes.push(store.put('kv', `rec:${key}`, { ...meta, beatAt: Date.now() }).catch(() => {}))
   }
   rec.start(1000)
   const meter = makeMeter(stream)
@@ -88,7 +102,9 @@ function makeMeter(stream: MediaStream): { level(): number; close(): void } | nu
 
 /** Takes the app was closed in the middle of, made whole again. */
 /** `claim` limits the recovery to takes the caller owns (by question id); the rest are left exactly as they are for their owner. */
-export async function recoverTakes(store: Store, claim?: (questionId: string) => boolean): Promise<{ questionId: string; key: string; ms: number }[]> {
+/** A take still beating (another tab recording it, LIVE_TAKE_MS) is left exactly as it is; it is recovered on an open after it goes quiet. */
+export async function recoverTakes(store: Store, claim?: (questionId: string) => boolean,
+  { now = Date.now(), liveMs = LIVE_TAKE_MS }: { now?: number; liveMs?: number } = {}): Promise<{ questionId: string; key: string; ms: number }[]> {
   const out: { questionId: string; key: string; ms: number }[] = []
   // By prefix: this runs before the first paint, and `kv` also holds every saved view.
   const metas = (await store.all<Meta>('kv', 'rec:')).filter((r) => r.key.startsWith('rec:'))
@@ -96,6 +112,8 @@ export async function recoverTakes(store: Store, claim?: (questionId: string) =>
   const blobs = await store.all<Blob>('blobs')
   for (const { key: metaKey, value: m } of metas) {
     if (claim && !claim(m.questionId)) continue
+    const beat = Number(m.beatAt ?? m.startedAt)
+    if (Number.isFinite(beat) && now - beat < liveMs) continue
     const key = metaKey.slice(4)
     const parts = blobs.filter((b) => b.key.startsWith(`${key}#`)).sort((a, b) => a.key.localeCompare(b.key))
     if (parts.length) {

package/src/client/sheet.tsx

@@ -75,8 +75,6 @@ export function SuggestSheet({ adapters, where, onClose, initial }: { adapters:
   const [answers, setAnswers] = useState<Answers>({ ...NO_ANSWERS, happened: initial?.happened ?? '' })
   const [voice, setVoice] = useState<Voice[]>([])
   const [media, setMedia] = useState<Media[]>([])
-  // The design's example line is the default: version, screen name (always) and phone type. The time and the screen size are opt-in.
-  const [on, setOn] = useState<Record<Diag, boolean>>({ appVersion: true, at: false, screen: false, device: true })
   const [error, setError] = useState('')
   const [announce, setAnnounce] = useState('')
   const [sent, setSent] = useState<{ id: string; files: { file: string; name: string; bytes: number }[] } | null>(null)
@@ -251,17 +249,16 @@ export function SuggestSheet({ adapters, where, onClose, initial }: { adapters:
     setAnnounce(S.voiceNoteRemoved)
   }
 
-  // What goes with it: exactly the contract's four diagnostics, each with a switch that really removes it.
-  // Where the person was (the screen's name and address) is what the report is about, so it is always sent and shown as such.
+  // What goes with it: the contract's four diagnostics, always sent, with no switches. Whoever reads the report
+  // needs the device, the time and the screen to act on it, so leaving one out only ever cost a round trip.
+  // The sheet says so in one small FYI line rather than a section to configure.
   const avail = ([
     { name: 'appVersion', label: S.diagAppVersion, value: adapters.about?.version },
     { name: 'at', label: S.diagAt, value: new Date(adapters.phone?.now?.() ?? Date.now()).toISOString() },
     { name: 'screen', label: S.diagScreen, value: screenSize() },
     { name: 'device', label: S.diagDevice, value: adapters.device ? adapters.device() : phoneType() },
   ] as { name: Diag; label: string; value: string | undefined }[]).filter((d): d is { name: Diag; label: string; value: string } => Boolean(d.value))
-  // The design's order: the app's version, this screen's name (always), then whatever else is on, phone type last.
-  const isOn = (n: Diag) => avail.find((d) => d.name === n && on[d.name])?.label
-  const lineParts = [isOn('appVersion'), S.screenName, isOn('at'), isOn('screen'), isOn('device')].filter((x): x is string => Boolean(x))
+  const lineParts = [`this screen (${where.screen}, ${sanitizeRoute(where.route)})`, ...avail.map((d) => d.label)]
   const summary = `${S.goesTo(adapters.words.owner)} ${S.includes(lineParts)}`
 
   // Answers to the broken questions only count while the kind is broken: they are not sent otherwise.
@@ -273,7 +270,7 @@ export function SuggestSheet({ adapters, where, onClose, initial }: { adapters:
     await chain.current
     const d = await saveDraft(rt.store, key, { kind, words, attachments: [...voice.map((v) => v.key), ...media.map((m) => m.key)] })
     const diagnostics: Record<string, string> = {}
-    for (const x of avail) if (on[x.name]) diagnostics[x.name] = x.value
+    for (const x of avail) diagnostics[x.name] = x.value
     const report: Record<string, unknown> & { id: string } = {
       id: d.reportId,
       kind,
@@ -411,17 +408,7 @@ export function SuggestSheet({ adapters, where, onClose, initial }: { adapters:
               ) : null}
             </fieldset>
 
-            <fieldset className="sac-group">
-              <legend>{S.withLegend}</legend>
-              <p className="sac-summary" data-sac-summary="" aria-live="polite">{summary}</p>
-              <p className="sac-muted" data-sac-where="">{S.alwaysSent(where.screen, sanitizeRoute(where.route))}</p>
-              {avail.map((d) => (
-                <label key={d.name} className="sac-switch">
-                  <input type="checkbox" role="switch" checked={on[d.name]} aria-label={S.include(d.label)} onChange={(e) => setOn((cur) => ({ ...cur, [d.name]: e.target.checked }))} />
-                  <span>{d.label}: <span className="sac-muted">{d.value}</span></span>
-                </label>
-              ))}
-            </fieldset>
+            <p className="sac-muted sac-fyi" data-sac-summary="">{summary}</p>
 
             {error ? <p role="alert" className="sac-error">{error}</p> : null}
             <div className="sac-actions">

package/src/client/styles.css

@@ -49,6 +49,7 @@
 .sac-entry-dot { position: absolute; top: 6px; right: 6px; width: 10px; height: 10px; border-radius: 50%; background: var(--sac-accent); box-shadow: 0 0 0 2px var(--sac-bg); }
 .sac-new { align-self: flex-start; font-size: 0.8rem; font-weight: 600; padding: 1px 8px; border-radius: 999px; background: var(--sac-accent); color: var(--sac-accent-fg); }
 .sac-muted { color: var(--sac-muted); font-size: 0.9rem; }
+.sac-fyi { font-size: 0.8rem; margin: 0; }
 .sac-error { color: var(--sac-danger); margin: 0; }
 .sac-receipt-line { font-weight: 600; margin: 0; }
 .sac-strip { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px; }