@remit/web-client 0.0.239 → 0.0.241

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remit/web-client",
-  "version": "0.0.239",
+  "version": "0.0.241",
   "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/auth/auth-interceptor.test.ts

@@ -1,15 +1,19 @@
 import assert from "node:assert";
-import { describe, test } from "node:test";
+import { afterEach, describe, test } from "node:test";
+import { client } from "@remit/api-http-client/client.gen.ts";
+import { trashOperationsEmptyTrash } from "@remit/api-http-client/sdk.gen.ts";
+import { type HttpMock, mockFetch } from "../test-support/http";
 import { AuthTokenError } from "./better-auth-config";
 import { type AuthProvider, noneAuthProvider } from "./provider";
 
-type RequestFn = (req: Request) => Promise<Request>;
-
-declare global {
-	var __REMIT_CLIENT_MOCKS__: { requestFns: RequestFn[] } | undefined;
-}
-
 let cacheBust = 1000;
+let http: HttpMock | undefined;
+
+afterEach(() => {
+	http?.restore();
+	http = undefined;
+	client.interceptors.request.clear();
+});
 
 const providerWithToken = (
 	getToken: AuthProvider["getToken"],
@@ -17,15 +21,30 @@ const providerWithToken = (
 
 const loadInterceptor = async () => {
 	cacheBust += 1;
-	globalThis.__REMIT_CLIENT_MOCKS__ = { requestFns: [] };
+	client.interceptors.request.clear();
 	return import(`./auth-interceptor.ts?v=${cacheBust}`);
 };
 
+const send = (headers?: Record<string, string>): Promise<unknown> => {
+	http = mockFetch();
+	return trashOperationsEmptyTrash({
+		path: { accountId: "acc-1" },
+		headers,
+		throwOnError: true,
+	});
+};
+
+const sentHeaders = (): Record<string, string> => {
+	assert.ok(http, "expected a request to have been sent");
+	assert.equal(http.calls.length, 1);
+	return http.calls[0].headers;
+};
+
 describe("installAuthInterceptor", () => {
 	test("registers exactly one request interceptor", async () => {
 		const mod = await loadInterceptor();
 		mod.installAuthInterceptor(providerWithToken(async () => null));
-		assert.equal(globalThis.__REMIT_CLIENT_MOCKS__?.requestFns.length, 1);
+		assert.equal(client.interceptors.request.fns.length, 1);
 	});
 
 	test("is idempotent — subsequent calls do not register additional interceptors", async () => {
@@ -34,17 +53,14 @@ describe("installAuthInterceptor", () => {
 		mod.installAuthInterceptor(provider);
 		mod.installAuthInterceptor(provider);
 		mod.installAuthInterceptor(provider);
-		assert.equal(globalThis.__REMIT_CLIENT_MOCKS__?.requestFns.length, 1);
+		assert.equal(client.interceptors.request.fns.length, 1);
 	});
 
 	test("attaches the provider's Bearer token when one exists", async () => {
 		const mod = await loadInterceptor();
 		mod.installAuthInterceptor(providerWithToken(async () => "ID-TOKEN-123"));
-		const fn = globalThis.__REMIT_CLIENT_MOCKS__?.requestFns[0];
-		assert.ok(fn, "expected interceptor fn to be registered");
-		const req = new Request("https://api.example.com/thing");
-		const out = await fn(req);
-		assert.equal(out.headers.get("Authorization"), "Bearer ID-TOKEN-123");
+		await send();
+		assert.equal(sentHeaders().authorization, "Bearer ID-TOKEN-123");
 	});
 
 	test("abandons the request when the token cannot be minted — never sends it unauthenticated", async () => {
@@ -54,42 +70,32 @@ describe("installAuthInterceptor", () => {
 				throw new AuthTokenError("Could not mint a session token: 429", 429);
 			}),
 		);
-		const fn = globalThis.__REMIT_CLIENT_MOCKS__?.requestFns[0];
-		assert.ok(fn);
-		const req = new Request("https://api.example.com/thing");
 		await assert.rejects(
-			() => fn(req),
+			() => send(),
 			(error: unknown) => {
 				assert.ok(error instanceof AuthTokenError);
 				assert.equal(error.status, 429);
 				return true;
 			},
 		);
-		assert.equal(req.headers.get("Authorization"), null);
+		assert.equal(http?.calls.length, 0);
 	});
 
 	test("omits Authorization header when the deployment presents no identity", async () => {
 		const mod = await loadInterceptor();
 		mod.installAuthInterceptor(providerWithToken(async () => null));
-		const fn = globalThis.__REMIT_CLIENT_MOCKS__?.requestFns[0];
-		assert.ok(fn);
-		const req = new Request("https://api.example.com/thing");
-		const out = await fn(req);
-		assert.equal(out.headers.get("Authorization"), null);
+		await send();
+		assert.equal(sentHeaders().authorization, undefined);
 	});
 
 	test("preserves caller-supplied headers when adding Authorization", async () => {
 		const mod = await loadInterceptor();
 		mod.installAuthInterceptor(providerWithToken(async () => "TOK"));
-		const fn = globalThis.__REMIT_CLIENT_MOCKS__?.requestFns[0];
-		assert.ok(fn);
-		const req = new Request("https://api.example.com/thing", {
-			headers: { "X-Trace-Id": "abc-123", "Content-Type": "application/json" },
-		});
-		const out = await fn(req);
-		assert.equal(out.headers.get("X-Trace-Id"), "abc-123");
-		assert.equal(out.headers.get("Content-Type"), "application/json");
-		assert.equal(out.headers.get("Authorization"), "Bearer TOK");
+		await send({ "X-Trace-Id": "abc-123", "X-Client": "reader" });
+		const headers = sentHeaders();
+		assert.equal(headers["x-trace-id"], "abc-123");
+		assert.equal(headers["x-client"], "reader");
+		assert.equal(headers.authorization, "Bearer TOK");
 	});
 
 	test("propagates errors when the provider's getToken rejects (let it crash)", async () => {
@@ -99,9 +105,6 @@ describe("installAuthInterceptor", () => {
 				throw new Error("session fetch failed");
 			}),
 		);
-		const fn = globalThis.__REMIT_CLIENT_MOCKS__?.requestFns[0];
-		assert.ok(fn);
-		const req = new Request("https://api.example.com/thing");
-		await assert.rejects(() => fn(req), /session fetch failed/);
+		await assert.rejects(() => send(), /session fetch failed/);
 	});
 });

package/src/components/compose/ComposeForm.tsx

@@ -14,12 +14,15 @@ import {
 	ComposeBodySkeleton,
 	ComposeFormShell,
 	ComposeHeader,
+	ComposeQuoteMissingBanner,
+	type ComposeQuoteMode,
 	type ComposeSendState,
 	type ComposeShellLayout,
 	ComposeSubjectField,
 	composeHeaderSummary,
 	defaultComposeLanguages,
 	modeOfDraft,
+	NO_QUOTABLE_BODY_FORWARD_MESSAGE,
 	QuotedText,
 	type RichTextValue,
 	SMTP_MISSING_MESSAGE,
@@ -678,6 +681,7 @@ export const ComposeForm = ({
 		data: sourceBody,
 		isLoading: quoteIsLoading,
 		isError: quoteFailed,
+		hasNoRenderablePart: sourceHasNoQuotableBody,
 		refetch: refetchQuote,
 	} = useMessageBodyContent({
 		messageId: sourceMessage?.message.messageId,
@@ -685,6 +689,31 @@ export const ComposeForm = ({
 		enabled: isQuoting && !!sourceMessage,
 	});
 
+	const quoteMode: ComposeQuoteMode = mode === "forward" ? "forward" : "reply";
+
+	/**
+	 * The message being answered has not arrived yet, so the quote's own fetch
+	 * cannot have started — it picks its part out of what has not landed. A send
+	 * pressed in this window went out carrying none of the original and was
+	 * refused by nothing, because "no part picked" reads the same here as "this
+	 * message has no part to pick" (#1030).
+	 */
+	const quoteSourceIsLoading = isQuoting && !sourceMessage;
+
+	/**
+	 * The message being answered arrived carrying attachments and no text. A
+	 * forward of it is refused: the composer sends a text body and an html body
+	 * and no attachments, so the forward would arrive holding nothing of the
+	 * original at all. A reply goes out — it carries the answer and the thread's
+	 * references either way — and says the original is not quoted in it.
+	 *
+	 * Not stated for a resumed draft, whose body already holds whatever quote it
+	 * was saved with; this composer is not the one that assembles it.
+	 */
+	const quoteHasNoBody =
+		isQuoting && !documentHoldsQuote && sourceHasNoQuotableBody;
+	const nothingToForward = quoteHasNoBody && quoteMode === "forward";
+
 	/**
 	 * The original as it will be sent, and as it is shown while the answer is
 	 * written — one value for both, because the two disagreeing is the whole of
@@ -818,7 +847,7 @@ export const ComposeForm = ({
 			if (selectedAccountMissingSmtp) {
 				return { status: "blocked", reason: SMTP_MISSING_MESSAGE };
 			}
-			if (quoteIsLoading) {
+			if (quoteIsLoading || quoteSourceIsLoading) {
 				return { status: "blocked", reason: QUOTE_LOADING_MESSAGE };
 			}
 			if (unparsed) {
@@ -827,9 +856,26 @@ export const ComposeForm = ({
 			if (toCount === 0) {
 				return { status: "blocked", reason: NO_TO_ADDRESS_MESSAGE };
 			}
+			// Last of the refusals: the others name something the writer can go and
+			// fix, and this one names something about the message being forwarded
+			// that they cannot. The banner above states it the whole time either
+			// way, so the press is better spent on the fixable thing.
+			if (nothingToForward) {
+				return {
+					status: "blocked",
+					reason: NO_QUOTABLE_BODY_FORWARD_MESSAGE,
+				};
+			}
 			return { status: "ready", accountId: selectedAccountId };
 		},
-		[isSending, selectedAccountId, selectedAccountMissingSmtp, quoteIsLoading],
+		[
+			isSending,
+			selectedAccountId,
+			selectedAccountMissingSmtp,
+			quoteIsLoading,
+			quoteSourceIsLoading,
+			nothingToForward,
+		],
 	);
 	const sendReadiness = useMemo<SendReadiness>(
 		() =>
@@ -1092,6 +1138,9 @@ export const ComposeForm = ({
 							configureRef={smtpConfigureRef}
 						/>
 					) : null}
+					{quoteHasNoBody ? (
+						<ComposeQuoteMissingBanner mode={quoteMode} />
+					) : null}
 					{quoteFailed ? (
 						<Banner tone="warning" data-testid="compose-quote-failed">
 							<span>{QUOTE_FAILED_MESSAGE}</span>{" "}

package/src/components/compose/attachment-only-source.render.test.ts

@@ -0,0 +1,233 @@
+/**
+ * Issue #1030: a source with no text or html part — a message that is
+ * attachments and nothing else — left the quote hook disabled, so nothing was
+ * loading, nothing had failed, and the composer sent a forward carrying none of
+ * the original at all.
+ *
+ * The composer sends a text body and an html body and no attachments, so that
+ * forward has nothing to arrive with: it is refused, in words. A reply still
+ * carries the answer and the thread's references, so it goes out and says the
+ * original is not quoted in it. And a source that has not arrived yet is a
+ * third thing again — still loading, not a message with nothing in it.
+ */
+
+import assert from "node:assert/strict";
+import { afterEach, describe, it } from "node:test";
+import type {
+	RemitImapAccountResponse,
+	RemitImapDescribeMessageResponse,
+} from "@remit/api-http-client/types.gen.ts";
+import { NO_QUOTABLE_BODY_FORWARD_MESSAGE } from "@remit/ui";
+import {
+	type AnyRouter,
+	createMemoryHistory,
+	createRootRoute,
+	createRoute,
+	createRouter,
+	RouterContextProvider,
+} from "@tanstack/react-router";
+import { createElement, useState } from "react";
+import { createDomHarness, type DomHarness } from "../../test-support/dom";
+import { type HttpMock, mockFetch } from "../../test-support/http";
+import { ComposeForm } from "./ComposeForm";
+import type { ComposeMode } from "./ComposeProvider";
+import { ComposeProvider } from "./ComposeProvider";
+
+const ACCOUNT_ID = "acc-1";
+
+const account = {
+	accountId: ACCOUNT_ID,
+	email: "me@example.com",
+	smtpEnabled: true,
+} as unknown as RemitImapAccountResponse;
+
+/** Two scans and a cover sheet — no text part anywhere in it. */
+const attachmentOnlySource = {
+	message: { messageId: "msg-1" },
+	envelope: {
+		subject: "Scans",
+		date: Date.UTC(2026, 5, 24, 9, 14),
+		messageIdValue: "<m1@example.com>",
+		from: [{ normalizedEmail: "dana@example.com", displayName: "Dana" }],
+		replyTo: [],
+		to: [{ normalizedEmail: "me@example.com" }],
+		cc: [],
+	},
+	references: [],
+	bodyParts: [
+		{
+			mediaType: "MULTIPART",
+			mediaSubtype: "MIXED",
+			contentUrl: "",
+			isMultipart: true,
+		},
+		{
+			mediaType: "IMAGE",
+			mediaSubtype: "JPEG",
+			disposition: "attachment",
+			contentUrl: "/content/msg-1/2.jpg",
+			isMultipart: false,
+		},
+	],
+} as unknown as RemitImapDescribeMessageResponse;
+
+const outboxEntry = () => ({
+	outboxMessageId: "ob-1030",
+	accountId: ACCOUNT_ID,
+	fromAddress: account.email,
+	toAddresses: ["dana@example.com"],
+	ccAddresses: [],
+	bccAddresses: [],
+	references: [],
+	subject: "Fwd: Scans",
+	status: "draft",
+});
+
+let harness: DomHarness | undefined;
+let http: HttpMock | undefined;
+
+afterEach(() => {
+	harness?.close();
+	harness = undefined;
+	http?.restore();
+	http = undefined;
+});
+
+const Opened = ({
+	mode,
+	sourceMessage,
+}: {
+	mode: ComposeMode;
+	sourceMessage?: RemitImapDescribeMessageResponse;
+}) => {
+	const [draftId, setDraftId] = useState<string | undefined>(undefined);
+
+	return createElement(ComposeForm, {
+		mode,
+		account,
+		sourceMessage,
+		outboxMessageId: draftId,
+		onDraftCreated: setDraftId,
+		onClose: () => {},
+	});
+};
+
+(globalThis as { self?: typeof globalThis }).self ??= globalThis;
+
+const rootRoute = createRootRoute();
+const mailboxRoute = createRoute({
+	getParentRoute: () => rootRoute,
+	path: "/mail/$mailboxId",
+	validateSearch: (search: Record<string, unknown>) => search,
+});
+
+const testRouter = (): AnyRouter =>
+	createRouter({
+		routeTree: rootRoute.addChildren([mailboxRoute]),
+		history: createMemoryHistory({ initialEntries: ["/mail/mbx-1"] }),
+	}) as unknown as AnyRouter;
+
+const mount = async (options: {
+	mode: ComposeMode;
+	/** Left out for the deep link that opened before the source landed. */
+	sourceMessage?: RemitImapDescribeMessageResponse;
+}): Promise<void> => {
+	http = mockFetch(async (call) => {
+		if (call.path.endsWith("/config")) return { accounts: [account] };
+		return outboxEntry();
+	});
+
+	harness = createDomHarness();
+	harness.renderApp(
+		createElement(RouterContextProvider, {
+			router: testRouter(),
+			// biome-ignore lint/correctness/noChildrenProp: RouterContextProvider types `children` as a required prop, which createElement's rest-argument form does not satisfy
+			children: createElement(
+				ComposeProvider,
+				null,
+				createElement(Opened, {
+					mode: options.mode,
+					sourceMessage: options.sourceMessage,
+				}),
+			),
+		}),
+	);
+	await harness.flush();
+	await harness.wait(100);
+	await harness.flush();
+};
+
+const sendButton = (): HTMLElement => {
+	const button = harness?.byText("button", "Send");
+	if (!button) throw new Error("the compose send button is not mounted");
+	return button;
+};
+
+const addRecipient = (email: string): void => {
+	const field = harness?.query<HTMLInputElement>("#address-field-To");
+	if (!field) throw new Error("the To field is not mounted");
+	harness?.type(field, email);
+};
+
+const dispatches = (): number =>
+	(http?.calls ?? []).filter((call) => call.path.endsWith("/send")).length;
+
+const press = async (): Promise<void> => {
+	harness?.click(sendButton());
+	await harness?.flush();
+	await harness?.wait(100);
+};
+
+describe("a source with nothing to quote (#1030)", () => {
+	it("refuses a forward of a message that is attachments only", async () => {
+		await mount({ mode: "forward", sourceMessage: attachmentOnlySource });
+
+		addRecipient("bob@example.com");
+		await press();
+
+		assert.equal(
+			dispatches(),
+			0,
+			"a forward left with nothing of the message it forwards",
+		);
+		assert.ok(
+			(harness?.text() ?? "").includes(NO_QUOTABLE_BODY_FORWARD_MESSAGE),
+			"the refusal was not stated",
+		);
+	});
+
+	it("says so on screen before the forward is even written", async () => {
+		await mount({ mode: "forward", sourceMessage: attachmentOnlySource });
+
+		const banner = harness?.query("[data-testid=compose-quote-missing]");
+		assert.ok(banner, "nothing said the message had no body to quote");
+	});
+
+	it("sends a reply to it, saying the original is not quoted", async () => {
+		await mount({ mode: "reply", sourceMessage: attachmentOnlySource });
+
+		assert.ok(
+			harness?.query("[data-testid=compose-quote-missing]"),
+			"nothing said the original would not be quoted",
+		);
+
+		await press();
+
+		assert.equal(dispatches(), 1, "the reply was not sent");
+	});
+
+	it("refuses while the source is still on its way, without claiming it is empty", async () => {
+		await mount({ mode: "forward" });
+
+		addRecipient("bob@example.com");
+		await press();
+
+		assert.equal(dispatches(), 0, "a forward left before its source arrived");
+		assert.match(harness?.text() ?? "", /Loading the message you're quoting/);
+		assert.equal(
+			harness?.query("[data-testid=compose-quote-missing]"),
+			null,
+			"a source still arriving was reported as a message with no body",
+		);
+	});
+});

package/src/components/mail/RoleAppointmentPromptProvider.tsx

@@ -24,6 +24,7 @@ import {
 import { isMailboxNotSettledRefusal } from "@/components/ui/folder-role-refusal";
 import { useCreateMailbox } from "@/hooks/useCreateMailbox";
 import { useFolderLabelTranslator } from "@/hooks/useFolderLabelTranslator";
+import { softErrorStatuses } from "@/lib/error-classifier";
 import { buildMailboxRoleMap, labelForMailbox } from "@/lib/folder-roles";
 import { buildMoveOptions, folderDelimiter } from "@/lib/move-options";
 
@@ -90,9 +91,12 @@ export const RoleAppointmentPromptProvider = ({
 		enabled: !!accountId,
 	});
 	const { createFolderIn } = useCreateMailbox(accountId);
-	const appointMutation = useMutation(
-		folderRoleOperationsAppointFolderRoleMutation(),
-	);
+	const appointMutation = useMutation({
+		...folderRoleOperationsAppointFolderRoleMutation(),
+		// A mailbox still settling answers 409, and the prompt states that itself
+		// in `appoint-failed`. Escalating would take the screen the prompt is on.
+		meta: softErrorStatuses(409),
+	});
 
 	const account = config?.accounts.find((one) => one.accountId === accountId);
 	const mailboxes = useMemo(() => mailboxData?.items ?? [], [mailboxData]);

package/src/components/settings/QuarantinePanel.delimiter.test.ts

@@ -0,0 +1,112 @@
+/**
+ * A quarantine row names the folder its message sits in, which means cutting a
+ * provider path into a leaf — and that cut is only correct on the account's own
+ * hierarchy separator. The separator comes from a second read (the account's
+ * mailbox list), so the pane must never paint a row before that read lands:
+ * `INBOX.Projects.Q3` cut on a slash is one segment, and the row would show the
+ * whole path as if it were a folder name. See #900.
+ */
+
+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 { type HttpMock, httpError, mockFetch } from "../../test-support/http";
+import { QuarantinePanel } from "./QuarantinePanel";
+
+const ACCOUNT_ID = "acct-1";
+const MAILBOX_ID = "mbx-q3";
+const FULL_PATH = "INBOX.Projects.Q3";
+
+const CONFIG = {
+	accounts: [{ accountId: ACCOUNT_ID, folderAppointments: [] }],
+};
+
+const MAILBOXES = {
+	items: [
+		{
+			mailboxId: MAILBOX_ID,
+			fullPath: FULL_PATH,
+			hierarchyDelimiter: ".",
+		},
+	],
+};
+
+const QUARANTINE = {
+	entries: [
+		{
+			quarantineId: "q-1",
+			accountId: ACCOUNT_ID,
+			mailboxId: MAILBOX_ID,
+			uidValidity: 1_712_000_000,
+			uid: 40251,
+			mailboxPath: FULL_PATH,
+			failureStage: "BodyParse",
+			failureCode: "UnreadableBody",
+			failureMessage: "stream ended before the declared body length",
+			quarantinedAt: Date.parse("2026-07-19T06:03:00Z"),
+			attempts: 1,
+			sizeBytes: 2_140,
+			structure: [],
+		},
+	],
+};
+
+let harness: DomHarness | undefined;
+let http: HttpMock | undefined;
+
+afterEach(() => {
+	harness?.close();
+	harness = undefined;
+	http?.restore();
+	http = undefined;
+});
+
+const mount = async (mailboxes: () => unknown): Promise<DomHarness> => {
+	http = mockFetch((call) => {
+		if (call.path.endsWith("/config")) return CONFIG;
+		if (call.path.endsWith("/mailboxes")) return mailboxes();
+		if (call.path.endsWith("/quarantine")) return QUARANTINE;
+		return {};
+	});
+	harness = createDomHarness();
+	harness.renderApp(createElement(QuarantinePanel));
+	// Two waves: the mailbox-list fan-out is keyed on the accounts `/config`
+	// returns, so it cannot even start until that first read has settled.
+	await harness.flush();
+	await harness.wait(0);
+	await harness.flush();
+	return harness;
+};
+
+describe("QuarantinePanel folder names", () => {
+	it("waits for the account's delimiter rather than cutting on a guess", async () => {
+		const view = await mount(() => new Promise(() => {}));
+
+		assert.match(view.text(), /Checking for messages set aside/);
+		assert.doesNotMatch(
+			view.text(),
+			new RegExp(FULL_PATH.replace(/\./g, "\\.")),
+		);
+	});
+
+	it("names the folder by its leaf once the delimiter has arrived", async () => {
+		const view = await mount(() => MAILBOXES);
+
+		assert.match(view.text(), /Q3/);
+		assert.doesNotMatch(
+			view.text(),
+			new RegExp(FULL_PATH.replace(/\./g, "\\.")),
+		);
+	});
+
+	it("reports a failed mailbox read instead of naming folders on a guess", async () => {
+		const view = await mount(() => httpError(500));
+
+		assert.match(view.html(), /role="alert"/);
+		assert.doesNotMatch(
+			view.text(),
+			new RegExp(FULL_PATH.replace(/\./g, "\\.")),
+		);
+	});
+});