@remit/web-client 0.0.271 → 0.0.273

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remit/web-client",
-  "version": "0.0.271",
+  "version": "0.0.273",
   "type": "module",
   "description": "Remit web client, published as composable primitives — the app shell, auth shells, and runtime config. A distributor imports what it composes and bundles it.",
   "exports": {

package/src/components/mail/BlockedImagesNotice.render.test.ts

@@ -1,10 +1,17 @@
 /**
  * React-render smoke test for `BlockedImagesNotice` — the privacy "images
- * blocked" bar extracted from `MessageBody`. Pins the never-disable-buttons
- * rule (#943): the "Always trust" button stays active while the trust toggle
- * is in flight. It must NOT render `disabled`; the in-flight state is reflected
- * via `aria-busy` and a pending label instead, so the control stays focusable
- * and clickable (the handler no-ops the second click on the consumer side).
+ * blocked" bar extracted from `MessageBody`. Pins two rules.
+ *
+ * The never-disable-buttons rule (#943): the "Always trust" button stays active
+ * while the trust toggle is in flight. It must NOT render `disabled`; the
+ * in-flight state is reflected via `aria-busy` and a pending label instead, so
+ * the control stays focusable and clickable (the handler no-ops the second
+ * click on the consumer side).
+ *
+ * The blocked-sender rule (#352): `BlockedFlag` says images never load "even on
+ * explicit click", so for a blocked sender the load affordances are absent
+ * rather than disabled, and the bar states the reason so an image-free message
+ * is never silent about why.
  *
  * Uses `react-dom/server`'s `renderToString` so the assertion runs without
  * jsdom/happy-dom (no new deps), matching `MessageBodyErrorBanner.render.test`.
@@ -26,6 +33,7 @@ const render = (
 			blockedImageCount: 3,
 			canAlwaysTrust: true,
 			isTrustPending: false,
+			isSenderBlocked: false,
 			onLoadOnce: noop,
 			onAlwaysTrust: noop,
 			...overrides,
@@ -63,3 +71,44 @@ describe("BlockedImagesNotice — never-disable the Always trust button (#943)",
 		assert.match(html, /<button\b[^>]*>Load once<\/button>/);
 	});
 });
+
+describe("BlockedImagesNotice — a blocked sender gets no way in (#352)", () => {
+	it("renders no load affordance at all for a blocked sender", () => {
+		const html = render({ isSenderBlocked: true });
+		assert.doesNotMatch(
+			html,
+			/<button/,
+			"blocked means never load, even on explicit click — the buttons are absent",
+		);
+	});
+
+	it("states that the sender is blocked, so an image-free message is not silent", () => {
+		const html = render({ isSenderBlocked: true });
+		assert.match(html, /you blocked this sender/);
+		assert.match(html, /3 images hidden/);
+	});
+
+	it("offers nothing to disable — absence, not a dead control", () => {
+		const html = render({ isSenderBlocked: true });
+		assert.doesNotMatch(
+			html,
+			/<(?:button|a|input|select|textarea)\b|\brole="button"|\btabindex=/,
+			"a greyed-out control still reads as 'try again'; the bar carries no interactive element at all",
+		);
+		assert.doesNotMatch(html, /Load once/);
+		assert.doesNotMatch(html, /Always trust/);
+	});
+
+	it("stays blocked when the sender is somehow trusted as well", () => {
+		const html = render({ isSenderBlocked: true, canAlwaysTrust: true });
+		assert.doesNotMatch(html, /<button/);
+		assert.match(html, /you blocked this sender/);
+	});
+
+	it("singularizes the count", () => {
+		assert.match(
+			render({ isSenderBlocked: true, blockedImageCount: 1 }),
+			/1 image hidden/,
+		);
+	});
+});

package/src/components/mail/BlockedImagesNotice.tsx

@@ -2,40 +2,62 @@ interface BlockedImagesNoticeProps {
 	blockedImageCount: number;
 	canAlwaysTrust: boolean;
 	isTrustPending: boolean;
+	/**
+	 * The From-address carries the `blocked` flag. Blocking is a stronger
+	 * instruction than "not trusted": images never load, "even on explicit
+	 * click", so the bar states why the message is image-free instead of
+	 * offering a way past it. The affordances are absent, never disabled — a
+	 * dead button reads as broken (#943).
+	 */
+	isSenderBlocked: boolean;
 	onLoadOnce: () => void;
 	onAlwaysTrust: () => void;
 }
 
+const noticeCopy = (
+	blockedImageCount: number,
+	isSenderBlocked: boolean,
+): string => {
+	const images = `${blockedImageCount} image${blockedImageCount > 1 ? "s" : ""}`;
+	if (isSenderBlocked) return `${images} hidden — you blocked this sender`;
+	return `${images} blocked for privacy`;
+};
+
 export const BlockedImagesNotice = ({
 	blockedImageCount,
 	canAlwaysTrust,
 	isTrustPending,
+	isSenderBlocked,
 	onLoadOnce,
 	onAlwaysTrust,
 }: BlockedImagesNoticeProps) => (
-	<div className="mb-3 flex items-center justify-between rounded-md bg-surface-sunken/50 px-3 py-2 text-sm">
+	<div
+		data-testid="blocked-images-notice"
+		className="mb-3 flex items-center justify-between rounded-md bg-surface-sunken/50 px-3 py-2 text-sm"
+	>
 		<span className="text-fg-muted">
-			{blockedImageCount} image{blockedImageCount > 1 ? "s" : ""} blocked for
-			privacy
+			{noticeCopy(blockedImageCount, isSenderBlocked)}
 		</span>
-		<div className="flex items-center gap-3">
-			<button
-				type="button"
-				onClick={onLoadOnce}
-				className="text-accent hover:underline"
-			>
-				Load once
-			</button>
-			{canAlwaysTrust && (
+		{!isSenderBlocked && (
+			<div className="flex items-center gap-3">
 				<button
 					type="button"
-					onClick={onAlwaysTrust}
-					aria-busy={isTrustPending}
-					className="text-accent hover:underline aria-busy:opacity-50"
+					onClick={onLoadOnce}
+					className="text-accent hover:underline"
 				>
-					{isTrustPending ? "Trusting…" : "Always trust"}
+					Load once
 				</button>
-			)}
-		</div>
+				{canAlwaysTrust && (
+					<button
+						type="button"
+						onClick={onAlwaysTrust}
+						aria-busy={isTrustPending}
+						className="text-accent hover:underline aria-busy:opacity-50"
+					>
+						{isTrustPending ? "Trusting…" : "Always trust"}
+					</button>
+				)}
+			</div>
+		)}
 	</div>
 );

package/src/components/mail/BulkRunProvider.tsx

@@ -0,0 +1,331 @@
+import { mailboxOperationsListMailboxesQueryKey } from "@remit/api-http-client/@tanstack/react-query.gen.ts";
+import { useQueryClient } from "@tanstack/react-query";
+import {
+	createContext,
+	type ReactNode,
+	useCallback,
+	useContext,
+	useEffect,
+	useMemo,
+	useRef,
+	useState,
+} from "react";
+import { useErrorBanners } from "@/components/ui/ErrorBannerProvider";
+import { buildMutationErrorBanner } from "@/components/ui/error-banners";
+import { isFolderRoleRefusal } from "@/components/ui/folder-role-refusal";
+import {
+	bulkActionFailureDetail,
+	bulkActionFailureTitle,
+	bulkRunBusyRefusal,
+} from "@/lib/bulk-action-copy";
+import {
+	type ApplyBatch,
+	type BulkActionProgress,
+	type BulkActionTarget,
+	type BulkRunOutcome,
+	type BulkRunStart,
+	type EscalatedAction,
+	type FetchIdsPage,
+	honestProgress,
+	mailboxesTouchedBy,
+	runChunkedAction,
+	runPredicateAction,
+} from "@/lib/bulk-actions";
+import {
+	invalidateThreadListQueries,
+	threadListCacheKeys,
+} from "@/lib/thread-list-cache";
+import { useRoleAppointmentPrompt } from "./RoleAppointmentPromptProvider";
+
+/**
+ * What the run pages, which is the one thing a bounded and an escalated run do
+ * differently: a ticked selection is a list of ids the surface already holds,
+ * an escalated one is a predicate the server re-resolves page by page.
+ */
+export type BulkRunSource =
+	| { kind: "targets"; targets: readonly BulkActionTarget[] }
+	| { kind: "predicate"; fetchPage: FetchIdsPage };
+
+export interface BulkRunRequest {
+	action: EscalatedAction;
+	/** The mailbox the run belongs to — where its progress shows on return. */
+	mailboxId: string;
+	/** That mailbox in the user's words, for a refusal that names this run. */
+	mailboxLabel?: string;
+	/** Owning account, for the unseen-count invalidation on completion. */
+	accountId: string | undefined;
+	/** The count the run was offered against, for the bar and for the ending. */
+	matched: number;
+	source: BulkRunSource;
+	/** Issues one batch of the action. Closed over the SDK, never over a screen. */
+	applyBatch: ApplyBatch;
+	/**
+	 * States how the run ended, once no screen is left reporting on it in place.
+	 * Called by the provider rather than by the caller, so an ending that lands
+	 * after the surface unmounted is still said out loud (#112). Absent on a
+	 * surface with nowhere to say it.
+	 */
+	reportEnding?: (
+		kind: EscalatedAction["kind"],
+		matched: number,
+		outcome: BulkRunOutcome,
+	) => void;
+	/**
+	 * Handed the release for this run's ending, for a screen that is showing the
+	 * ending itself. The claim is made inside `start`, for the run it starts, so
+	 * a commit that starts no run holds nothing over the ending of one that is
+	 * already going (#112). Released when that screen goes.
+	 */
+	claimEnding?: (release: () => void) => void;
+}
+
+/** A run in flight, as any screen reads it. */
+export interface ActiveBulkRun {
+	action: EscalatedAction;
+	mailboxId: string;
+	/** Seeded from the count the run was offered against, so the bar has a
+	 *  denominator before the first batch comes back. */
+	progress: BulkActionProgress;
+}
+
+interface BulkRunContextValue {
+	run: ActiveBulkRun | undefined;
+	/**
+	 * Runs `request`, or refuses it because one is already going. There is one
+	 * slot: a second run would page behind the first's bar and answer to the
+	 * first's Stop, so it is refused with the run in flight named rather than
+	 * queued or started alongside.
+	 */
+	start: (request: BulkRunRequest) => Promise<BulkRunStart>;
+	/**
+	 * Ends the run `mailboxId` owns: the request on the wire is aborted and
+	 * nothing more leaves. A stop aimed at any other mailbox is not this run's,
+	 * and reaches nothing.
+	 */
+	stop: (mailboxId: string) => void;
+}
+
+const BulkRunContext = createContext<BulkRunContextValue | undefined>(
+	undefined,
+);
+
+/**
+ * The owner of a chunked bulk run (#112).
+ *
+ * A run is mail leaving the mailbox, and it outlives every screen that can show
+ * it: the wizard invites the user to close it mid-run, and nothing stops them
+ * navigating to another mailbox on top of that. Held in the surface that started
+ * it, the progress, the count and the cancellation all unmounted with the route,
+ * so returning showed nothing, Stop reached nothing, and an ending that landed
+ * after the move was dropped in silence.
+ *
+ * Mounted at the root beside the other app-lifetime providers, this holds the
+ * run instead: its progress, its `AbortController`, the caches it invalidates,
+ * the refusal it replays and the ending it states. A screen reads the run and
+ * offers Stop; it never owns either.
+ *
+ * In memory and per tab. A run is a sequence of requests this tab is making, so
+ * a reload ends it — persisting the reading would show a bar for a run nothing
+ * is driving.
+ */
+export const BulkRunProvider = ({ children }: { children: ReactNode }) => {
+	const [run, setRun] = useState<ActiveBulkRun | undefined>(undefined);
+	// The signal every call of the live run is issued under, so a stop ends the
+	// request on the wire instead of waiting for it to come back (#113).
+	const controllerRef = useRef<AbortController | undefined>(undefined);
+	// Identifies the live run across the awaits below, so a run that ended after
+	// the slot was taken from it — by a sign-out — writes nothing back.
+	const liveRunRef = useRef<symbol | undefined>(undefined);
+	// What is in the slot, read synchronously: two commits landing in one frame
+	// both have to see the first of them.
+	const liveRequestRef = useRef<BulkRunRequest | undefined>(undefined);
+	// The runs a screen is reporting on in place, by token — never a count of
+	// claims over runs in general, which any commit could hold against any run.
+	const claimsRef = useRef(new Set<symbol>());
+	const queryClient = useQueryClient();
+	const { pushError } = useErrorBanners();
+	const { requestAppointment } = useRoleAppointmentPrompt();
+	// The run replays itself once a folder is appointed, so it needs a handle on
+	// itself that does not make `start` its own dependency.
+	const startRef = useRef<BulkRunContextValue["start"]>(async () => ({
+		kind: "ran",
+		outcome: { done: 0, failedIds: [], cancelled: false },
+	}));
+
+	/**
+	 * The listings a run changed, and the unseen counts it moved. A cross-account
+	 * selection has no single owning account, so the run's own targets name the
+	 * accounts to refresh alongside the one the surface named.
+	 */
+	const invalidateAfterRun = useCallback(
+		(request: BulkRunRequest) => {
+			invalidateThreadListQueries(
+				queryClient,
+				threadListCacheKeys(
+					mailboxesTouchedBy(request.action, request.mailboxId),
+				),
+			);
+			const touched = new Set<string>();
+			if (request.accountId) touched.add(request.accountId);
+			if (request.source.kind === "targets") {
+				for (const target of request.source.targets) {
+					if (target.accountId) touched.add(target.accountId);
+				}
+			}
+			for (const accountId of touched) {
+				queryClient.invalidateQueries({
+					queryKey: mailboxOperationsListMailboxesQueryKey({
+						path: { accountId },
+					}),
+				});
+			}
+		},
+		[queryClient],
+	);
+
+	const start = useCallback(
+		async (request: BulkRunRequest): Promise<BulkRunStart> => {
+			const inFlight = liveRequestRef.current;
+			if (inFlight) {
+				return {
+					kind: "refused",
+					reason: bulkRunBusyRefusal(
+						inFlight.action.kind,
+						inFlight.matched,
+						inFlight.mailboxLabel,
+					),
+				};
+			}
+			const token = Symbol("bulk-run");
+			const controller = new AbortController();
+			controllerRef.current = controller;
+			liveRunRef.current = token;
+			liveRequestRef.current = request;
+			if (request.claimEnding) {
+				claimsRef.current.add(token);
+				request.claimEnding(() => claimsRef.current.delete(token));
+			}
+			setRun({
+				action: request.action,
+				mailboxId: request.mailboxId,
+				progress: { done: 0, total: request.matched },
+			});
+			// `honestProgress` widens `total` if `done` overtakes it (#109) — the
+			// predicate can match more by the time the run pages it than the count
+			// saw, and the bar must never show more done than out of.
+			const onProgress = (next: BulkActionProgress) => {
+				if (liveRunRef.current !== token) return;
+				setRun((held) =>
+					held ? { ...held, progress: honestProgress(next) } : held,
+				);
+			};
+
+			const outcome =
+				request.source.kind === "targets"
+					? await runChunkedAction(
+							request.source.targets,
+							request.applyBatch,
+							onProgress,
+							controller.signal,
+						)
+					: await runPredicateAction(
+							request.source.fetchPage,
+							request.matched,
+							request.applyBatch,
+							onProgress,
+							controller.signal,
+						);
+
+			const reportedInPlace = claimsRef.current.delete(token);
+			if (liveRunRef.current === token) {
+				liveRunRef.current = undefined;
+				liveRequestRef.current = undefined;
+				setRun(undefined);
+			}
+
+			// A provenance refusal is answered by the appointment prompt exactly as
+			// it is on the single-row path (#887, #876). Left to the banner it
+			// arrives as the API's own sentence — "Appoint one under Settings ›
+			// Folder roles" — which asks the user to reassemble a select-all they
+			// have already made.
+			const refusal = outcome.error
+				? isFolderRoleRefusal(outcome.error)
+				: undefined;
+			if (refusal) {
+				requestAppointment({
+					accountId: refusal.accountId,
+					role: refusal.role,
+					reason: refusal.reason,
+					action: { kind: "delete", count: request.matched },
+					// The replay is a new run, and it claims nothing: the claim the
+					// original was started under belongs to a screen whose release has
+					// already fired or never will for this run, so re-claiming would
+					// leave the replay's ending held back by nobody and never said.
+					onAppointed: async () => {
+						const replayed = await startRef.current({
+							...request,
+							claimEnding: undefined,
+						});
+						if (replayed.kind === "refused") {
+							pushError({
+								title: bulkActionFailureTitle(request.action.kind, 0),
+								detail: replayed.reason,
+							});
+						}
+					},
+				});
+			} else if (outcome.error) {
+				pushError(
+					buildMutationErrorBanner(
+						bulkActionFailureTitle(request.action.kind, outcome.done),
+						bulkActionFailureDetail(request.action.kind),
+						outcome.error,
+					),
+				);
+			}
+			// Nobody is left showing this run, so the ending is said where the user
+			// now is. A screen still reporting on it says it in place instead.
+			if (!reportedInPlace) {
+				request.reportEnding?.(request.action.kind, request.matched, outcome);
+			}
+			if (outcome.done > 0) invalidateAfterRun(request);
+			return { kind: "ran", outcome };
+		},
+		[invalidateAfterRun, pushError, requestAppointment],
+	);
+	startRef.current = start;
+
+	const stop = useCallback((mailboxId: string) => {
+		if (liveRequestRef.current?.mailboxId !== mailboxId) return;
+		controllerRef.current?.abort();
+	}, []);
+
+	// A run belongs to the session that started it. Both auth shells gate the
+	// whole app on the session, so signing out or switching accounts takes this
+	// provider down with the router — and a run left paging past that would go on
+	// deleting mail for an account nobody is signed in to.
+	useEffect(() => {
+		const claims = claimsRef.current;
+		return () => {
+			controllerRef.current?.abort();
+			controllerRef.current = undefined;
+			liveRunRef.current = undefined;
+			liveRequestRef.current = undefined;
+			claims.clear();
+		};
+	}, []);
+
+	const value = useMemo(() => ({ run, start, stop }), [run, start, stop]);
+
+	return (
+		<BulkRunContext.Provider value={value}>{children}</BulkRunContext.Provider>
+	);
+};
+
+export const useBulkRun = (): BulkRunContextValue => {
+	const context = useContext(BulkRunContext);
+	if (!context) {
+		throw new Error("useBulkRun must be used within a BulkRunProvider");
+	}
+	return context;
+};

package/src/components/mail/MessageBody.blocked-sender.test.ts

@@ -0,0 +1,193 @@
+/**
+ * Image gating at the `MessageBody` seam (#352). `BlockedFlag` declares that a
+ * blocked sender's images never load "even on explicit click", and Settings >
+ * Senders promises the same. Blocked therefore suppresses auto-load AND removes
+ * the manual load affordances, and outranks `trusted` when both are set.
+ *
+ * Renders through the real pipeline — sanitizer, blocked-image count, notice —
+ * against the jsdom harness, so the assertions read the DOM the user gets.
+ */
+
+import assert from "node:assert/strict";
+import { afterEach, describe, it } from "node:test";
+import { createElement } from "react";
+import { createDomHarness, type DomHarness } from "../../test-support/dom";
+import { MessageBody } from "./MessageBody";
+
+let harness: DomHarness | undefined;
+
+// The sandboxed frame measures itself once the iframe loads. jsdom fires that
+// load but has no ResizeObserver, and the resulting ReferenceError is raised
+// inside a listener where no assertion can see it.
+(globalThis as { ResizeObserver?: unknown }).ResizeObserver = class {
+	observe() {}
+	unobserve() {}
+	disconnect() {}
+};
+
+afterEach(() => {
+	harness?.close();
+	harness = undefined;
+});
+
+const MARKETING_HTML = `
+<div>
+	<img src="https://tracker.example/hero.png" alt="Hero" />
+	<p>Up to 40% off everything this weekend.</p>
+	<img src="https://tracker.example/pixel.gif" alt="" />
+</div>
+`;
+
+// Every remote-image vector an email can reach for, not just `img src`.
+const MULTI_VECTOR_HTML = `
+<div>
+	<img src="https://tracker.example/hero.png" srcset="https://tracker.example/hero@2x.png 2x" alt="Hero" />
+	<picture>
+		<source srcset="https://tracker.example/wide.png" type="image/png" />
+		<img src="https://tracker.example/narrow.png" alt="Deal" />
+	</picture>
+	<video poster="https://tracker.example/poster.jpg"><source src="https://tracker.example/clip.mp4" type="video/mp4" /></video>
+</div>
+`;
+
+const mount = (
+	flags: { isTrusted?: boolean; isBlocked?: boolean },
+	overrides: { html?: string; messageId?: string } = {},
+) => {
+	harness = createDomHarness();
+	harness.renderApp(
+		createElement(MessageBody, {
+			html: MARKETING_HTML,
+			messageId: "msg-1",
+			fromAddressId: "addr-1",
+			category: "marketing",
+			...flags,
+			...overrides,
+		}),
+	);
+	return harness;
+};
+
+const rerender = (
+	dom: DomHarness,
+	flags: { isTrusted?: boolean; isBlocked?: boolean },
+	overrides: { html?: string; messageId?: string } = {},
+) => {
+	dom.renderApp(
+		createElement(MessageBody, {
+			html: MARKETING_HTML,
+			messageId: "msg-1",
+			fromAddressId: "addr-1",
+			category: "marketing",
+			...flags,
+			...overrides,
+		}),
+	);
+};
+
+const frameHtml = (dom: DomHarness): string =>
+	dom.query<HTMLIFrameElement>("iframe")?.getAttribute("srcdoc") ?? "";
+
+// A blocked image keeps its original URL in `data-blocked-src` — only a live
+// `src=` means the browser will fetch it.
+const REMOTE_SRC = /\ssrc="https:\/\/tracker\.example\/hero\.png"/;
+
+describe("MessageBody image gating — blocked senders (#352)", () => {
+	it("never auto-loads images for a blocked sender", () => {
+		const dom = mount({ isBlocked: true });
+		assert.match(
+			frameHtml(dom),
+			/data-blocked-src/,
+			"a blocked sender's remote images must stay placeholders",
+		);
+		assert.doesNotMatch(frameHtml(dom), REMOTE_SRC);
+	});
+
+	it("offers no manual load affordance for a blocked sender", () => {
+		const dom = mount({ isBlocked: true });
+		assert.equal(
+			dom.queryAll("button").length,
+			0,
+			"never load, even on explicit click — the controls are absent, not disabled",
+		);
+		assert.doesNotMatch(dom.html(), /\bdisabled\b/);
+	});
+
+	it("says why the message has no images instead of going quiet", () => {
+		const dom = mount({ isBlocked: true });
+		assert.match(dom.text(), /2 images hidden/);
+		assert.match(dom.text(), /you blocked this sender/);
+	});
+
+	it("keeps images blocked when the sender is both blocked and trusted", () => {
+		const dom = mount({ isBlocked: true, isTrusted: true });
+		assert.match(frameHtml(dom), /data-blocked-src/);
+		assert.equal(dom.queryAll("button").length, 0);
+		assert.match(dom.text(), /you blocked this sender/);
+	});
+
+	it("emits no fetchable tracker URL through srcset, picture or poster either", () => {
+		const dom = mount({ isBlocked: true }, { html: MULTI_VECTOR_HTML });
+		// The placeholder swap parks the original `img src` in
+		// `data-blocked-src` for "load once"; anywhere else in the srcdoc, a
+		// tracker URL is a request the frame will make.
+		const live = frameHtml(dom).replace(/data-blocked-src="[^"]*"/g, "");
+		assert.doesNotMatch(
+			live,
+			/tracker\.example/,
+			"blocked means no remote image request, whichever attribute names it",
+		);
+		assert.match(
+			frameHtml(dom),
+			/data-blocked-src="https:\/\/tracker\.example/,
+		);
+	});
+});
+
+describe("MessageBody load-once is scoped to one message (#352)", () => {
+	it("drops the grant when the same instance is handed a different message", () => {
+		const dom = mount({});
+		dom.click(dom.byText("button", "Load once"));
+		assert.match(frameHtml(dom), REMOTE_SRC);
+
+		rerender(dom, {}, { messageId: "msg-2" });
+
+		assert.doesNotMatch(
+			frameHtml(dom),
+			REMOTE_SRC,
+			"a load-once decision belongs to the message it was taken on",
+		);
+		assert.match(frameHtml(dom), /data-blocked-src/);
+		assert.ok(dom.byText("button", "Load once"));
+	});
+
+	it("keeps the grant while the message stays the same", () => {
+		const dom = mount({});
+		dom.click(dom.byText("button", "Load once"));
+		rerender(dom, { isTrusted: false });
+		assert.match(frameHtml(dom), REMOTE_SRC);
+	});
+});
+
+describe("MessageBody image gating — the states blocking must not change", () => {
+	it("auto-loads a trusted sender's images and shows no notice", () => {
+		const dom = mount({ isTrusted: true });
+		assert.match(frameHtml(dom), REMOTE_SRC);
+		assert.doesNotMatch(frameHtml(dom), /data-blocked-src/);
+		assert.doesNotMatch(dom.text(), /hidden|blocked for privacy/);
+	});
+
+	it("still offers Load once and Always trust to a merely untrusted sender", () => {
+		const dom = mount({});
+		assert.match(frameHtml(dom), /data-blocked-src/);
+		assert.match(dom.text(), /2 images blocked for privacy/);
+		assert.ok(dom.byText("button", "Load once"));
+		assert.ok(dom.byText("button", "Always trust"));
+	});
+
+	it("loads the images once the untrusted sender's Load once is taken", () => {
+		const dom = mount({});
+		dom.click(dom.byText("button", "Load once"));
+		assert.match(frameHtml(dom), REMOTE_SRC);
+	});
+});