caracms 0.8.0 → 0.8.2

package/src/editor/client/editor.ts

@@ -30,6 +30,7 @@
  *   editor.editHere() / useMine() / discardMine() / publish() / tryAgain() /
  *   dismissNotice(id) / signOut() / signInAgain()
  */
+import { heldBackSentence } from '../../document-problems.ts';
 import { ARRANGE_ADDRESS, addressOf, inboxAddress, inboxFromAddress, isArrangeAddress, refFromAddress } from '../addresses.ts';
 import { heldBases } from '../../held.ts';
 import {
@@ -52,6 +53,7 @@ import {
 	type SubmissionsSetup,
 	type UiState,
 	type ViewMode,
+	type WaitingView,
 	type Width,
 } from '../types.ts';
 import type { MediaOnly } from '../../media-value.ts';
@@ -300,6 +302,13 @@ export interface Editor {
 	useMine(): Promise<void>;
 	/** Discard mine: drop them and show the document as the server has it. */
 	discardMine(): Promise<void>;
+	/**
+	 * Discard changes (live mode): put one waiting document back to what's live. This tab's own
+	 * unsent edits in it go first, and its held copy goes from this browser; an open document is
+	 * read again (a new one closes, a moved one opens at its old address). The server's
+	 * sentence when it refuses.
+	 */
+	discardChanges(item: Pick<WaitingView, 'file' | 'collection' | 'path' | 'title' | 'change'>): Promise<{ ok: true } | { ok: false; error: string }>;
 	/** Publish. `ok: false` with the reason when it didn't publish (the Publish popover says so; press again to retry). */
 	publish(): Promise<{ ok: boolean; error?: string }>;
 	tryAgain(): Promise<{ ok: boolean; error?: string }>;
@@ -409,6 +418,7 @@ export function createEditor(props: AdminProps, options: { client: boolean }): E
 							...(liveProps?.keepDelayMs !== undefined ? { keepDelay: liveProps.keepDelayMs } : {}),
 							...(liveProps?.keepCapMs !== undefined ? { keepCap: liveProps.keepCapMs } : {}),
 							onLocked: (file, refusal) => lockOverride.set({ file, state: refusal.state, lock: refusal.lock, after: liveSession.started() }),
+							onDiscarded: (file, body) => void letGo(file, body.by && body.at ? { by: body.by, at: body.at } : null),
 							onSignedOut: (body) => liveState.update({ signedOut: body }),
 						}
 					: {}),
@@ -587,6 +597,48 @@ export function createEditor(props: AdminProps, options: { client: boolean }): E
 		}
 	}
 
+	/** Wait until nothing for this document is in flight (at most a few seconds). */
+	async function settled(id: string): Promise<void> {
+		for (let i = 0; i < 100 && keeper?.dirty(id); i++) await new Promise((resolve) => setTimeout(resolve, 50));
+	}
+
+	/**
+	 * Discard changes, from another tab's side: someone put this document back to what's live
+	 * while this tab had it (the poll's `open.discarded`, or a write refused as `discarded`). This
+	 * tab's copy is stale: its edits in it are dropped, the server is told it let go, and the
+	 * document is read again (Home opens if it's gone: a new page discarded, or one moved back).
+	 */
+	const lettingGo = new Set<string>();
+	async function letGo(file: string, discarded: { by: Person; at: string } | null): Promise<void> {
+		if (!liveSession || !keeper) return;
+		const key = `${file}:${discarded?.at ?? ''}`;
+		if (lettingGo.has(key)) return;
+		lettingGo.add(key);
+		const open = doc.get().entry.file === file;
+		const id = open ? docId(doc.get().ref) : null;
+		const title = open ? doc.get().document.title || doc.get().entry.label : null;
+		if (id) {
+			keeper.discard(id);
+			await settled(id);
+		}
+		await liveSession.discardSeen(file);
+		if (open && doc.get().entry.file === file) {
+			let gone = false;
+			try {
+				await readDocument(doc.get().ref);
+			} catch {
+				gone = true;
+			}
+			if (gone) await editor.openDocument(site.home, { history: 'replace' });
+			else await refreshOpen();
+		}
+		if (title) {
+			const who = discarded ? displayName(discarded.by) : 'Someone';
+			editor.toast(`${who} discarded the unpublished changes to ${title}. It's back to what's live.`, 'check');
+		}
+		void liveSession.poll();
+	}
+
 	/** Held edits looked at again against the document as it is now (Decision 11). */
 	async function recheck(id: string): Promise<void> {
 		if (!keeper) return;
@@ -866,6 +918,38 @@ export function createEditor(props: AdminProps, options: { client: boolean }): E
 			editor.announce('Your held changes were discarded.');
 		},
 
+		async discardChanges(item) {
+			if (!liveSession) return { ok: false, error: 'Discarding changes needs live mode.' };
+			const id = item.collection && item.path ? docId({ collection: item.collection, path: item.path }) : null;
+			const openId = docId(doc.get().ref);
+			const isOpen = doc.get().entry.file === item.file || (id !== null && id === openId);
+			// This tab's own edits in it reach the server first, so nothing is in flight while it's discarded.
+			for (const one of new Set([id, isOpen ? openId : null])) {
+				if (!one) continue;
+				await keeper?.flush(one).catch(() => undefined);
+				await settled(one);
+			}
+			const answer = await liveSession.discard(item.file);
+			if (!answer.ok) return { ok: false, error: answer.error };
+			const back = answer.body.movedBack;
+			// This browser's held copies of it go too.
+			for (const one of new Set([id, isOpen ? openId : null, back ? docId(back) : null])) if (one) keeper?.discard(one);
+			await editor.refreshDocuments().catch(() => undefined);
+			if (isOpen) {
+				if (back) await editor.openDocument({ collection: back.collection, path: back.path }, { history: 'replace' });
+				else if (answer.body.change === 'new') {
+					await editor.openDocument(site.home, { history: 'push' });
+					const collection = site.collections.find((c) => c.name === item.collection);
+					if (collection && !collection.nested && collection.kind !== 'settings') editor.openCollection(collection.name);
+					else editor.goTo('documents');
+				} else await refreshOpen();
+			}
+			const said = answer.body.change === 'new' ? `Discarded ${item.title}.` : `Discarded the changes to ${item.title}. It's back to what's live.`;
+			editor.toast(said, 'check');
+			editor.announce(said);
+			return { ok: true };
+		},
+
 		async publish() {
 			if (!liveSession) return { ok: false };
 			await keeper?.flush();
@@ -874,8 +958,18 @@ export function createEditor(props: AdminProps, options: { client: boolean }): E
 				editor.announce("It didn't publish. Nothing went live.");
 				return { ok: false, error: answer.error };
 			}
-			if (answer.body.result === 'nothing-waiting') editor.announce('Nothing to publish.');
-			else editor.announce('Publishing.');
+			// caracms-cloud adversarial review, finding 15: what was left waiting, and why, in the toast.
+			const held = (answer.body.held ?? []).map((h) => heldBackSentence(h.title, h.reason)).join(' ');
+			if (answer.body.result === 'held-back') {
+				const said = `Nothing was published. ${held}`;
+				editor.toast(said, 'warn');
+				editor.announce(said);
+			} else if (answer.body.result === 'nothing-waiting') editor.announce('Nothing to publish.');
+			else if (held) {
+				const said = `Publishing the rest. ${held}`;
+				editor.toast(said, 'warn');
+				editor.announce(said);
+			} else editor.announce('Publishing.');
 			return { ok: true };
 		},
 
@@ -964,6 +1058,8 @@ export function createEditor(props: AdminProps, options: { client: boolean }): E
 						const seen = seenChange;
 						seenChange = change;
 						if (access.get().veil && change && change !== seen && change !== loadedVersion && !keeper.dirty(openId)) void refreshOpen();
+						// Discard changes: someone put it back to what's live while this tab had it.
+						if (open.discarded) void letGo(open.file, open.discarded);
 					}),
 				);
 			}

package/src/editor/client/fields/LockupField.tsx

@@ -208,7 +208,8 @@ export function LockupField(props: { blockKey: string; index: number; name: stri
 					</span>
 				) : null
 			}
-			meta={<span className="field-meta">Lockup · {styleName}</span>}
+			// Editor wording note (caracms-cloud adversarial review): "Lockup" is the package's word, not an editor's.
+			meta={<span className="field-meta">Heading style: {styleName}</span>}
 		>
 			{onPhone ? (
 				<div className="mini-seg" role="radiogroup" aria-label="Which lines to edit">
@@ -291,9 +292,8 @@ export function LockupField(props: { blockKey: string; index: number; name: stri
 						<Icon name="warn" />
 						<div>
 							<b>Too long for mobile: shorten a line or split it</b>
-							<p>
-								On a phone, “{longest}” sets the heading at {Math.round(warning.px)}px. {styleName}'s smallest size is {Math.round(warning.minPx)}px.
-							</p>
+							{/* Editor wording note: what happens, not the sizes. A line never wraps; the heading shrinks to fit its longest line. */}
+							<p>On a phone, the heading shrinks so “{longest}” fits on one line, and comes out smaller than this heading style is meant to go.</p>
 							{hasPhone ? null : (
 								<div className="acts">
 									{!onPhone ? (

package/src/editor/client/inbox/InboxStage.tsx

@@ -7,7 +7,8 @@
  * **Reply by email** (a `mailto:` with the address percent-encoded and the subject
  * "Re: your enquiry to <brand>"), **Mark unread** (which closes it: staying open would be
  * reading it again), **Delete…** (after a confirm: documents/dialogs.tsx); then the email's
- * outcome (sent to whom, failed with Resend's message, skipped and why, or unknown), and
+ * outcome (sent to whom, failed with Resend's message, skipped and why, held behind a cloud
+ * site's daily limit with the cloud's sentence, or unknown), and
  * every field by its label, files as downloads with their sizes.
  *
  * **Visitor strings are only ever text** (React's escaping): no `dangerouslySetInnerHTML`
@@ -157,6 +158,16 @@ function Sheet({ answer }: { answer: SubmissionResponse }) {
 											))}
 										</div>
 									</dd>
+								) : submission.filesNote ? (
+									// The cloud's attachment limit: the files weren't kept. Said plainly, not as an error; the sentence is the cloud's.
+									<dd key={`${f.name}:d`}>
+										<div className="note" data-files="not-kept">
+											<Icon name="attach" />
+											<div>
+												<p>{submission.filesNote}</p>
+											</div>
+										</div>
+									</dd>
 								) : (
 									<dd key={`${f.name}:d`} className="none">
 										No files
@@ -242,6 +253,19 @@ function MailOutcome({ email, formLabel, timeZone, editor }: { email: EmailOutco
 			</div>
 		);
 	}
+	if (email.status === 'held') {
+		// Finding 20 (caracms-cloud adversarial review): the cloud holds it behind the site's daily
+		// limit; it goes out on its own, so it's calm, not a problem. The sentence is the cloud's.
+		return (
+			<div className="note" data-mail="held">
+				<Icon name="clock" />
+				<div>
+					<b>Email held</b>
+					<p>{email.error ?? 'The email about it is waiting to go out.'}</p>
+				</div>
+			</div>
+		);
+	}
 	// Skipped: no one to email (Site Settings sets who), or not the production server (which alone sends email).
 	const notProduction = (email.error ?? '').startsWith('Not emailed');
 	return (

package/src/editor/client/live/notices.tsx

@@ -11,6 +11,7 @@
  *   lock) and **Discard mine**.
  * - **The merge notice** (`#merge`), until dismissed or published.
  * - **"Aoife published Home as it stood at 14:20"** (`#published-over`).
+ * - **"Aoife discarded the unpublished changes to About"** (Discard changes), with OK.
  * - **Someone deleted it** (M5a Decision 12: the poll's `open.deleted`): who and when,
  *   read-only, with a way back to the documents.
  *
@@ -172,6 +173,24 @@ function Notice({ notice, timeZone }: { notice: NoticeView; timeZone: string })
 			</div>
 		);
 	}
+	if (notice.kind === 'discarded') {
+		return (
+			<div className="note select" role="status" data-note="discarded">
+				<Icon name="undo" />
+				<div>
+					<b>
+						{displayName(notice.by)} discarded the unpublished changes to {notice.title} at {clock(notice.at, timeZone)}
+					</b>
+					<p>It's back to what's live.</p>
+					<div className="acts">
+						<button type="button" className="btn sm" data-act="dismiss" onClick={() => editor.dismissNotice(notice.id)}>
+							OK
+						</button>
+					</div>
+				</div>
+			</div>
+		);
+	}
 	return (
 		<div className="note select" role="status" data-note="published-over">
 			<Icon name="check" />

package/src/editor/client/live/publish.tsx

@@ -25,6 +25,13 @@
  *   document on that field (a list row expanded, the alt input focused; a document
  *   someone else holds opens read-only with the field shown). The bar's count gets a
  *   warning dot. **Publish stays on and one click**: nothing here holds it back.
+ * - **Held back** (caracms-cloud adversarial review, finding 15): a waiting document the
+ *   reader would refuse (no title: `WaitingView.heldBack`) says so on its row ("Tinder won't
+ *   be published: its title is empty."), with Add a title, which opens it. Publish sends the
+ *   rest ("Publish 1 change"); with nothing else waiting it's off, and says why. What was
+ *   held back is said again in the toast when Publish answers (editor.ts → publish).
+ * - **Discard…** on each waiting document (Discard changes): the confirmation
+ *   (documents/dialogs.tsx → `discard`) puts it back to what's live.
  */
 import { useEffect, useRef, useState, type ReactNode } from 'react';
 import { useEditor, useStore } from '../context.tsx';
@@ -37,6 +44,8 @@ import { clock, displayName, joinNames, samePerson, when, zoneLine } from './for
 import { Avatar } from './marks.tsx';
 import { docIcon } from '../nav/DocRow.tsx';
 import { singular } from '../documents/actions.ts';
+import { openDialog } from '../documents/dialogs.tsx';
+import { NO_TITLE } from '../../../document-problems.ts';
 
 const histories = new WeakMap<Editor, { entries: HistoryEntryView[]; timeZone: string } | null>();
 
@@ -221,6 +230,8 @@ export function WaitingPop() {
 		</div>
 	);
 	const n = status.waiting.length;
+	// Finding 15: what Publish will send; the rest stays waiting.
+	const going = status.waiting.filter((w) => !w.heldBack).length;
 	const pub = status.publish;
 	const record = pub.record;
 	const names = joinNames(record?.titles ?? []);
@@ -399,6 +410,11 @@ export function WaitingPop() {
 						<WaitItem key={w.file} item={w} status={status} />
 					))}
 				</ul>
+				{going === 0 ? (
+					<p className="field-help" data-note="all-held">
+						Nothing can be published until {n === 1 ? 'it has' : 'they have'} what's missing.
+					</p>
+				) : null}
 				{publishError ? (
 					<div className="note danger tight" role="alert" data-note="publish-failed">
 						<Icon name="warn" />
@@ -416,7 +432,7 @@ export function WaitingPop() {
 					type="button"
 					className="btn lg accent"
 					data-act="publish"
-					disabled={busy}
+					disabled={busy || going === 0}
 					onClick={async () => {
 						setBusy(true);
 						setPublishError(null);
@@ -425,7 +441,7 @@ export function WaitingPop() {
 						if (!r.ok) setPublishError(r.error ?? 'the server said no.');
 					}}
 				>
-					Publish {n} change{n === 1 ? '' : 's'}
+					{going ? `Publish ${going} change${going === 1 ? '' : 's'}` : 'Publish'}
 				</button>
 			</div>
 		</>,
@@ -509,11 +525,51 @@ function WaitItem({ item, status }: { item: WaitingView; status: StatusResponse
 					</div>
 				</div>
 			) : null}
+			{item.heldBack ? <HeldBackNote item={item} /> : null}
 			{item.change !== 'deleted' && item.missingAlt?.length ? <AltGaps item={item} held={others} /> : null}
+			<div className="wi-acts">
+				<button type="button" className="linkbtn subtle" data-act="discard" aria-label={`Discard the unpublished changes to ${item.title}`} onClick={() => openDialog(editor, { kind: 'discard', file: item.file })}>
+					Discard…
+				</button>
+			</div>
 		</li>
 	);
 }
 
+/** Finding 15: a waiting document Publish will leave waiting, and why, with the way to fix it. */
+function HeldBackNote({ item }: { item: WaitingView }) {
+	const editor = useEditor();
+	const untitled = item.heldBack === NO_TITLE.reason;
+	const open = async () => {
+		if (item.collection === null || item.path === null) return;
+		editor.setPop(null);
+		await editor.openDocument({ collection: item.collection, path: item.path });
+		// A form's title is its first field; a page or a shared block is renamed.
+		requestAnimationFrame(() => {
+			const input = document.querySelector<HTMLInputElement>('#side .side-level:not([hidden]) input[data-path="title"]');
+			if (input && !input.disabled) input.focus();
+		});
+	};
+	return (
+		<div className="note warn tight" data-note="held-back">
+			<Icon name="warn" />
+			<div>
+				<b>
+					{item.title} won't be published: {item.heldBack}.
+				</b>
+				<p>It stays waiting. Publish sends the rest.</p>
+				{untitled && item.collection !== null ? (
+					<div className="acts">
+						<button type="button" className="btn sm" data-act="add-title" onClick={() => void open()}>
+							Add a title
+						</button>
+					</div>
+				) : null}
+			</div>
+		</div>
+	);
+}
+
 /** One waiting document's images without alt text (#publish-alt), each with Add alt text. It doesn't hold the Publish back. */
 function AltGaps({ item, held }: { item: WaitingView; held: Person[] }) {
 	const editor = useEditor();

package/src/editor/client/nav/DocRow.tsx

@@ -14,7 +14,7 @@
 import { useState, type CSSProperties, type ReactNode } from 'react';
 import { useEditor, useStore } from '../context.tsx';
 import { Icon } from '../shell/Icons.tsx';
-import { docId, sameDoc, type ListedDocument } from '../../types.ts';
+import { docId, opensInEditor, sameDoc, warnedWords, type ListedDocument } from '../../types.ts';
 import { DocMarksView } from '../live/marks.tsx';
 
 /** A document's icon by its collection: a page, a case study (any list-of-fields document), a shared block, Site Settings, else a post. */
@@ -56,7 +56,7 @@ export function DocRow(props: {
 	const collection = editor.site.collections.find((c) => c.name === doc.collection);
 	const classes = ['drow', props.className, current ? 'is-current' : '', doc.warning ? 'is-warned' : '', props.active ? 'is-active' : ''].filter(Boolean).join(' ');
 	const open = () => {
-		if (doc.warning) {
+		if (doc.warning && !opensInEditor(doc)) {
 			setWhy((w) => !w);
 			editor.announce(`${doc.label} can't be opened. ${doc.warning.message}`);
 			return;
@@ -73,7 +73,7 @@ export function DocRow(props: {
 				style={props.style}
 				data-doc={id}
 				aria-current={current ? 'page' : undefined}
-				aria-expanded={doc.warning ? why : undefined}
+				aria-expanded={doc.warning && !opensInEditor(doc) ? why : undefined}
 				title={doc.warning?.message}
 				onClick={open}
 			>
@@ -86,7 +86,7 @@ export function DocRow(props: {
 					{doc.warning ? (
 						<span className="wmark" data-warning={doc.warning.code}>
 							<Icon name="warn" size="xs" />
-							<span className="sr">, can't be opened</span>
+							<span className="sr">{warnedWords(doc)}</span>
 						</span>
 					) : null}
 					{/* M9 Decision 7: hidden from the site (or under a hidden page). */}

package/src/editor/client/pane/levels/CollectionLevel.tsx

@@ -23,6 +23,7 @@ import { CurrentHead, DocumentsTab, GlobalNotes, RecentStrip, Trail } from '../p
 import { usedOnLine } from '../../block-list/summary.ts';
 import { PAGELESS_SUB, singular } from '../../documents/actions.ts';
 import { openDialog } from '../../documents/dialogs.tsx';
+import { opensInEditor } from '../../../types.ts';
 
 
 export function CollectionLevel() {
@@ -88,7 +89,7 @@ export function CollectionLevel() {
 								onChange={(e) => setQuery(e.target.value)}
 								onKeyDown={(e) => {
 									if (e.key === 'Enter') {
-										const first = shown.find((d) => !d.warning);
+										const first = shown.find((d) => opensInEditor(d));
 										if (first) void editor.openDocument({ collection: first.collection, path: first.path });
 									} else if (e.key === 'Escape' && query) {
 										e.preventDefault();

package/src/editor/client/pane/levels/DocumentLevel.tsx

@@ -17,7 +17,7 @@ import { openPicker, pickerAt } from '../../block-list/link.ts';
 import { Picker } from '../../block-list/Picker.tsx';
 import { CurrentHead, DocumentsTab, GlobalNotes, parentLabel, RecentStrip, Trail } from '../parts.tsx';
 import { DocNotices, ReadOnlyChip } from '../../live/notices.tsx';
-import { DocMenu } from '../../documents/DocMenu.tsx';
+import { DocMenu, TitleNote } from '../../documents/DocMenu.tsx';
 import { PagesUnder } from '../../documents/PagesUnder.tsx';
 import { FieldsDocumentLevel, SettingsLevel, SharedDocumentLevel } from './FormLevel.tsx';
 import { SeoGroup } from '../../fields/SeoGroup.tsx';
@@ -71,6 +71,7 @@ function SectionsLevel() {
 			<div className="side-body" data-document={`${ref.collection}/${ref.path}`}>
 				<GlobalNotes />
 				<DocNotices />
+				<TitleNote />
 				{empty ? (
 					<div className="empty" data-empty="page" style={{ padding: 'var(--space-4)' }}>
 						<b>No blocks yet</b>

package/src/editor/client/pane/levels/DocumentsLevel.tsx

@@ -36,7 +36,7 @@ import { Bubble } from '../../live/marks.tsx';
 import { searchDocuments } from '../../nav/search.ts';
 import { treeRows, type TreeRow } from '../../nav/tree.ts';
 import { arrangeSite } from '../../arrange/store.ts';
-import type { EditorCollection, ListedDocument } from '../../../types.ts';
+import { opensInEditor, type EditorCollection, type ListedDocument } from '../../../types.ts';
 import { CurrentHead, GlobalNotes, RecentStrip, Trail } from '../parts.tsx';
 
 export function DocumentsLevel() {
@@ -59,7 +59,7 @@ export function DocumentsLevel() {
 		if (event.key === 'Enter') {
 			const first = searchDocuments(query, documents, editor.site.collections)
 				.flatMap((g) => g.hits)
-				.find((h) => !h.doc.warning);
+				.find((h) => opensInEditor(h.doc));
 			if (first) void editor.openDocument({ collection: first.doc.collection, path: first.doc.path });
 		} else if (event.key === 'Escape' && query) {
 			// Clear the box first; a second Esc leaves it (App.tsx).

package/src/editor/client/pane/levels/FormLevel.tsx

@@ -28,9 +28,11 @@ import { parseMedia } from '../../../../media-value.ts';
 import { parseAllowEntry } from '../../../../live/auth/allow-rules.ts';
 import { useEditor, useStore } from '../../context.tsx';
 import type { Editor } from '../../editor.ts';
-import { DocMenu } from '../../documents/DocMenu.tsx';
+import { DocMenu, TitleNote } from '../../documents/DocMenu.tsx';
 import { FieldControl } from '../../fields/FieldControl.tsx';
 import { FieldFrame } from '../../fields/FieldFrame.tsx';
+import { Warn } from '../../fields/parts.tsx';
+import { NO_TITLE } from '../../../../document-problems.ts';
 import { FieldHostProvider, parseBase, type FieldHost } from '../../fields/host.tsx';
 import { MediaSlot } from '../../fields/MediaField.tsx';
 import { mediaFor } from '../../media/store.ts';
@@ -102,14 +104,38 @@ export function CollectionTab({ name }: { name: string }) {
 	return <LevelTab name={collection.label} kind="Collection" count={String(count)} onClick={() => editor.openCollection(name)} />;
 }
 
-/** The title field every fields document has first (Decision 7): one line, always there. */
-function TitleField({ scope }: { scope: string }) {
+/**
+ * Editor wording note (caracms-cloud adversarial review): beside a heading (a lockup field),
+ * the title says where it shows, so the two aren't mistaken for each other. The document's
+ * title is its name in the site's lists and links, and the browser tab's and search
+ * results' title unless its SEO title says otherwise (head.ts).
+ */
+export const TITLE_BESIDE_HEADING = 'Shown in lists, links, browser tabs and search results.';
+
+/**
+ * The title field every fields document has first (Decision 7): one line, always there.
+ * Blank, it says so (caracms-cloud adversarial review, finding 15), as typed: the edit is
+ * kept all the same, and Publish leaves the document waiting until it has one.
+ */
+function TitleField({ scope, help }: { scope: string; help?: string }) {
 	const editor = useEditor();
 	const title = useStore(editor.doc.state, (s) => s.document.title);
 	const id = `f-${scope}-title`;
+	const blank = title.trim() === '';
 	return (
-		<FieldFrame blockKey={scope} name="title" label="Title" htmlFor={id}>
-			<input className="input" id={id} data-path="title" value={title} autoComplete="off" spellCheck={false} onChange={(e) => editor.doc.setTitle(e.target.value.replace(/\n+/g, ' '))} />
+		<FieldFrame blockKey={scope} name="title" label="Title" htmlFor={id} help={help}>
+			<input
+				className="input"
+				id={id}
+				data-path="title"
+				value={title}
+				autoComplete="off"
+				spellCheck={false}
+				aria-invalid={blank || undefined}
+				aria-describedby={blank ? `${id}-problem` : undefined}
+				onChange={(e) => editor.doc.setTitle(e.target.value.replace(/\n+/g, ' '))}
+			/>
+			{blank ? <Warn id={`${id}-problem`}>{NO_TITLE.note}</Warn> : null}
 		</FieldFrame>
 	);
 }
@@ -188,7 +214,7 @@ export function FieldsDocumentLevel() {
 				<DocNotices />
 				<FormFields readOnly={readOnly}>
 					<FieldHostProvider host={host}>
-						<TitleField scope={key} />
+						<TitleField scope={key} help={Object.values(fields).some((f) => f.kind === 'lockup') ? TITLE_BESIDE_HEADING : undefined} />
 						{formRows(fields).map((row) => {
 							const control = ([name, field]: [string, Field]) => (
 								<FieldControl key={`${key}:${name}`} name={name} label={field.label ?? titleCase(name)} field={field} value={data[name]} lockupIndex={0} />
@@ -257,6 +283,7 @@ export function SharedDocumentLevel() {
 			<div className="side-body" data-document={docId(ref)}>
 				<GlobalNotes />
 				<DocNotices />
+				<TitleNote />
 				{n ? (
 					<div className="note select" data-note="used-on">
 						<Icon name="shared" />

package/src/editor/client/pane/levels/SubmissionsLevel.tsx

@@ -5,7 +5,8 @@
  * - **The list**, newest first, 50 at a time with Older (by cursor). A row: the unread
  *   mark (a dot and a heavier name, never a side rail), who sent it, when (the site's
  *   zone: "14:12" today, then "Yesterday" or "Tue 13 Oct"), a one-line snippet, the
- *   form, the file count, and **Email failed** when its email failed. The open one has
+ *   form, the file count, **Email held** (quiet, beside the file count: a cloud site's
+ *   daily limit; finding 20) and **Email failed** when its email failed. The open one has
  *   the selection's wash and ring.
  * - **A row opens the submission** on a sheet over the dimmed page (inbox/InboxStage.tsx),
  *   with the list kept here; the address follows (`/admin/submissions/<id>`).
@@ -113,8 +114,12 @@ const settingsPath = (editor: ReturnType<typeof useEditor>) => editor.documents.
 function Row({ row, current, timeZone, onOpen }: { row: SubmissionRow; current: boolean; timeZone: string; onOpen: () => void }) {
 	const unread = row.readAt === null;
 	const failed = row.emailStatus === 'failed';
+	// Finding 20: a held email is said quietly, beside the files, never as a failure.
+	const held = row.emailStatus === 'held';
+	// The cloud's attachment limit: said as quietly as a held email.
+	const notKept = row.filesNotKept === true;
 	const time = rowTime(row.receivedAt, timeZone);
-	const label = [row.name, `${row.formLabel} form`, time, unread ? 'unread' : '', row.files ? filesLabel(row.files) : '', failed ? 'email failed' : ''].filter(Boolean).join(', ');
+	const label = [row.name, `${row.formLabel} form`, time, unread ? 'unread' : '', row.files ? filesLabel(row.files) : '', failed ? 'email failed' : '', held ? 'email held' : '', notKept ? 'attachments not kept' : ''].filter(Boolean).join(', ');
 	return (
 		<button
 			type="button"
@@ -139,6 +144,18 @@ function Row({ row, current, timeZone, onOpen }: { row: SubmissionRow; current:
 							{filesLabel(row.files)}
 						</span>
 					) : null}
+					{notKept ? (
+						<span data-files="not-kept">
+							<Icon name="attach" />
+							Attachments not kept
+						</span>
+					) : null}
+					{held ? (
+						<span data-mail="held">
+							<Icon name="clock" />
+							Email held
+						</span>
+					) : null}
 					{failed ? (
 						<span className="chip danger">
 							<Icon name="warn" size="xs" />