@remit/web-client 0.0.303 → 0.0.304

package/src/mocks/story-frame/compose-world.ts

@@ -0,0 +1,191 @@
+import type {
+	RemitImapOutboxMessageResponse,
+	RemitImapThreadMessageResponse,
+} from "@remit/api-http-client/types.gen.ts";
+import {
+	DAY,
+	HOUR,
+	type MailWorld,
+	MINUTE,
+	mailboxIdFor,
+	mailWorld,
+	outboxMessage,
+	threadRow,
+	WORK,
+} from "./mail-world";
+
+export const INBOX = mailboxIdFor(WORK, "Inbox");
+
+export const LUNCH_SUBJECT = "Lunch Thursday?";
+export const LUNCH_BODY = "Are we still on for Thursday? I can do 12:30.";
+export const LONG_SUBJECT = "Billing migration owners";
+export const TURNS_SUBJECT = "Offsite venue";
+export const SCANS_SUBJECT = "Scans";
+export const MISSPELT_DRAFT =
+	"<p>Ths report is redy today, and the notes are attachd.</p>";
+export const PLAIN_DRAFT = [
+	"Thanks, that works for me.",
+	"",
+	"| Region | Total |",
+	"| --- | --- |",
+	"| EMEA | 412 |",
+].join("\n");
+
+const longBody = [
+	"Longer context, so the pane has more message than it has room for.",
+	...Array.from(
+		{ length: 14 },
+		(_, index) =>
+			`Point ${index + 1}. The billing migration touches the export path, the dunning schedule and the invoice numbering, and each of those has a different owner today.`,
+	),
+].join("\n\n");
+
+const longDraft = [
+	"<p>That works. Before Thursday, three things I want written down:</p>",
+	...Array.from(
+		{ length: 24 },
+		(_, index) =>
+			`<p>Point ${index + 1}. Whoever owns the dunning mail after self-serve ships also owns the invoice numbering, and today those are two different people on two different rotas.</p>`,
+	),
+].join("");
+
+const conversations: RemitImapThreadMessageResponse[] = [
+	threadRow({
+		id: "lunch",
+		accountId: WORK,
+		fromName: "Ada Lovelace",
+		fromEmail: "ada@acme.example",
+		subject: LUNCH_SUBJECT,
+		snippet: LUNCH_BODY,
+		category: "personal",
+		ago: 30 * MINUTE,
+	}),
+	threadRow({
+		id: "billing",
+		accountId: WORK,
+		fromName: "Priya Raman",
+		fromEmail: "priya@acme.example",
+		subject: LONG_SUBJECT,
+		snippet:
+			"Longer context, so the pane has more message than it has room for.",
+		category: "personal",
+		ago: 3 * HOUR,
+	}),
+	threadRow({
+		id: "venue-1",
+		inThread: "venue",
+		accountId: WORK,
+		role: "Archive",
+		fromName: "Linus Berg",
+		fromEmail: "linus@acme.example",
+		subject: TURNS_SUBJECT,
+		snippet: "Two options for the offsite: the boathouse or the old mill.",
+		category: "personal",
+		ago: 3 * DAY,
+		isRead: true,
+	}),
+	threadRow({
+		id: "venue-2",
+		inThread: "venue",
+		accountId: WORK,
+		role: "Sent",
+		fromName: "Alice Tan",
+		fromEmail: "alice.tan@acme.example",
+		subject: `Re: ${TURNS_SUBJECT}`,
+		snippet: "The boathouse, if it still has the long table.",
+		category: "personal",
+		ago: 2 * DAY,
+		isRead: true,
+	}),
+	threadRow({
+		id: "venue-3",
+		inThread: "venue",
+		accountId: WORK,
+		fromName: "Linus Berg",
+		fromEmail: "linus@acme.example",
+		subject: `Re: ${TURNS_SUBJECT}`,
+		snippet: "It does. Shall I book it for the 14th?",
+		category: "personal",
+		ago: 4 * HOUR,
+	}),
+	threadRow({
+		id: "scans",
+		accountId: WORK,
+		fromName: "Office Scanner",
+		fromEmail: "scanner@acme.example",
+		subject: SCANS_SUBJECT,
+		snippet: "",
+		category: "automated",
+		ago: 5 * HOUR,
+		hasAttachment: true,
+	}),
+];
+
+const drafts: RemitImapOutboxMessageResponse[] = [
+	{
+		...outboxMessage({
+			id: "misspelt",
+			accountId: WORK,
+			to: "ada@acme.example",
+			subject: "Report",
+			body: "Ths report is redy today, and the notes are attachd.",
+			status: "draft",
+			ago: 5 * MINUTE,
+		}),
+		htmlBody: MISSPELT_DRAFT,
+	},
+	outboxMessage({
+		id: "plain",
+		accountId: WORK,
+		to: "ada@acme.example",
+		subject: "Re: Q3 planning",
+		body: PLAIN_DRAFT,
+		status: "draft",
+		ago: 6 * MINUTE,
+	}),
+	{
+		...outboxMessage({
+			id: "long-reply",
+			accountId: WORK,
+			to: "ada@acme.example",
+			subject: `Re: ${LUNCH_SUBJECT}`,
+			body: "That works.",
+			status: "draft",
+			ago: 7 * MINUTE,
+		}),
+		htmlBody: longDraft,
+	},
+];
+
+export const composeWorld = (overrides: Partial<MailWorld> = {}): MailWorld => {
+	const base = mailWorld();
+	return {
+		...base,
+		accounts: base.accounts.map((account) =>
+			account.accountId === WORK
+				? { ...account, composeLanguages: ["en", "nl", "de"] }
+				: account,
+		),
+		threads: [...base.threads, ...conversations],
+		outbox: [...base.outbox, ...drafts],
+		bodies: { "msg-billing": longBody },
+		...overrides,
+	};
+};
+
+export const withoutSmtp = (world: MailWorld): MailWorld => ({
+	...world,
+	accounts: world.accounts.map((account) => ({
+		...account,
+		smtpEnabled: false,
+	})),
+});
+
+export const messageUrl = (id: string, mailboxId: string = INBOX): string =>
+	`/mail/${mailboxId}/thread-${id}/msg-${id}`;
+
+export const threadUrl = (
+	threadId: string,
+	messageId: string,
+	mailboxId: string = INBOX,
+): string => `/mail/${mailboxId}/thread-${threadId}/msg-${messageId}`;

package/src/mocks/story-frame/mail-handlers.ts

@@ -2,19 +2,30 @@ import type {
 	AccountDetailOperationsUpdateAccountResponse,
 	AddressDetailOperationsUpdateAddressResponse,
 	AddressOperationsSearchAddressesResponse,
+	CalendarEventOperationsListCalendarEventsResponse,
+	CalendarOperationsListCalendarsResponse,
+	CalendarSuggestionOperationsListCalendarSuggestionsResponse,
 	FilterOperationsListFiltersResponse,
 	LabelOperationsListLabelsResponse,
 	MailboxDetailOperationsRenameMailboxResponse,
 	MailboxOperationsListMailboxesResponse,
 	MeOperationsListQuarantineResponse,
 	MeOperationsListVipSuggestionsResponse,
+	MessageBulkOperationsDeleteMessagesData,
+	MessageBulkOperationsDeleteMessagesResponse,
+	MessageBulkOperationsMoveMessagesData,
+	MessageBulkOperationsMoveMessagesResponse,
 	MessageBulkOperationsUpdateFlagsResponse,
 	MessageCalendarSuggestionOperationsListMessageCalendarSuggestionsResponse,
+	OrganizeOperationsPreviewOrganizeResponse,
 	OutboxOperationsListOutboxMessagesResponse,
 	RemitImapConfigDescriptionResponse,
+	RemitImapCreateOutboxMessageInput,
 	RemitImapDescribeMessageResponse,
+	RemitImapOutboxMessageResponse,
 	RemitImapThreadMessageResponse,
 	RemitImapThreadSearchResponse,
+	RemitImapUpdateOutboxMessageInput,
 	SemanticSearchOperationsSemanticSearchResponse,
 	SyncOperationsGetSyncStatusResponse,
 	SyncOperationsTriggerSyncResponse,
@@ -32,11 +43,45 @@ export interface MailHandlerOptions {
 	withholdCounts?: boolean;
 	pageSize?: number;
 	holdLaterPages?: boolean;
+	draftSave?: "saves" | "refused";
+	send?: "sends" | "holds";
+	search?: "answers" | "holds";
+	config?: "answers" | "holds";
 }
 
 const contentPath = (row: RemitImapThreadMessageResponse): string =>
 	`/content/accounts/${row.accountConfigId}/${row.accountId}/messages/${row.messageId}/parts/1`;
 
+const attachmentOnly = (row: RemitImapThreadMessageResponse): boolean =>
+	row.hasAttachment && !row.snippet;
+
+const bodyPartsOf = (
+	row: RemitImapThreadMessageResponse,
+): RemitImapDescribeMessageResponse["bodyParts"] =>
+	attachmentOnly(row)
+		? [
+				{
+					bodyPartId: `part-${row.messageId}`,
+					mediaType: "APPLICATION",
+					mediaSubtype: "pdf",
+					sizeOctets: 48_000,
+					isMultipart: false,
+					disposition: "attachment",
+					dispositionFilename: "scan.pdf",
+					contentUrl: contentPath(row),
+				},
+			]
+		: [
+				{
+					bodyPartId: `part-${row.messageId}`,
+					mediaType: "TEXT",
+					mediaSubtype: "plain",
+					sizeOctets: (row.snippet ?? "").length,
+					isMultipart: false,
+					contentUrl: contentPath(row),
+				},
+			];
+
 const describe = (
 	row: RemitImapThreadMessageResponse,
 ): RemitImapDescribeMessageResponse => ({
@@ -71,16 +116,7 @@ const describe = (
 		senderTrust: row.senderTrust,
 	},
 	flags: row.isRead ? ["\\Seen"] : [],
-	bodyParts: [
-		{
-			bodyPartId: `part-${row.messageId}`,
-			mediaType: "TEXT",
-			mediaSubtype: "plain",
-			sizeOctets: (row.snippet ?? "").length,
-			isMultipart: false,
-			contentUrl: contentPath(row),
-		},
-	],
+	bodyParts: bodyPartsOf(row),
 	references: [],
 });
 
@@ -167,11 +203,23 @@ export const mailHandlers = (
 		),
 	);
 
+	const outbox = new Map(
+		world.outbox.map((message) => [message.outboxMessageId, message]),
+	);
+	let draftsCreated = 0;
+	const refuseSave = () =>
+		HttpResponse.json(
+			{ status: 409, message: "The mail server did not accept the draft." },
+			{ status: 409 },
+		);
+
 	return [
 		http.get(`${API}/config`, () =>
-			HttpResponse.json<RemitImapConfigDescriptionResponse>(
-				makeConfig(world.accounts),
-			),
+			options.config === "holds"
+				? pending()
+				: HttpResponse.json<RemitImapConfigDescriptionResponse>(
+						makeConfig(world.accounts),
+					),
 		),
 		http.patch(
 			`${API}/accounts/:accountId/mailboxes/:mailboxId`,
@@ -277,11 +325,38 @@ export const mailHandlers = (
 				failureCount: 0,
 			}),
 		),
+		http.post(`${API}/messages/delete`, async ({ request }) => {
+			const { messageIds } =
+				(await request.json()) as MessageBulkOperationsDeleteMessagesData["body"];
+			return HttpResponse.json<MessageBulkOperationsDeleteMessagesResponse>({
+				successCount: messageIds.length,
+				failureCount: 0,
+			});
+		}),
+		http.post(`${API}/messages/move`, async ({ request }) => {
+			const { messageIds } =
+				(await request.json()) as MessageBulkOperationsMoveMessagesData["body"];
+			return HttpResponse.json<MessageBulkOperationsMoveMessagesResponse>({
+				successCount: messageIds.length,
+				failureCount: 0,
+			});
+		}),
+		http.post(`${API}/accounts/:accountId/organize/preview`, ({ params }) => {
+			const matched = world.threads.filter(
+				(row) => row.accountId === params.accountId,
+			);
+			return HttpResponse.json<OrganizeOperationsPreviewOrganizeResponse>({
+				matchedCount: matched.length,
+				messageIds: matched.map((row) => row.messageId),
+			});
+		}),
 		http.get(
 			"/content/accounts/:accountConfigId/:accountId/messages/:messageId/parts/*",
 			({ params }) =>
 				HttpResponse.text(
-					byMessageId.get(String(params.messageId))?.snippet ?? "",
+					world.bodies[String(params.messageId)] ??
+						byMessageId.get(String(params.messageId))?.snippet ??
+						"",
 				),
 		),
 		http.get(`${API}/threads/:threadId/messages`, ({ params }) =>
@@ -300,21 +375,25 @@ export const mailHandlers = (
 			);
 			if (options.holdLaterPages && params.has("continuationToken"))
 				return pending();
+			if (searching && options.search === "holds") return pending();
 			return HttpResponse.json(listing(narrow(scope, params), params, options));
 		}),
 		http.get(
 			`${API}/mailboxes/:mailboxId/threads/search`,
-			({ request, params }) =>
-				HttpResponse.json(
+			({ request, params }) => {
+				const search = new URL(request.url).searchParams;
+				if (search.has("query") && options.search === "holds") return pending();
+				return HttpResponse.json(
 					listing(
 						narrow(
 							world.threads.filter((row) => row.mailboxId === params.mailboxId),
-							new URL(request.url).searchParams,
+							search,
 						),
-						new URL(request.url).searchParams,
+						search,
 						options,
 					),
-				),
+				);
+			},
 		),
 		http.get(`${API}/mailboxes/:mailboxId/threads`, ({ params }) =>
 			HttpResponse.json<ThreadOperationsListThreadsResponse>({
@@ -325,14 +404,108 @@ export const mailHandlers = (
 		),
 		http.get(`${API}/outbox`, () =>
 			HttpResponse.json<OutboxOperationsListOutboxMessagesResponse>({
-				items: world.outbox,
+				items: [...outbox.values()],
 			}),
 		),
-		http.get(`${API}/search/semantic`, () =>
-			HttpResponse.json<SemanticSearchOperationsSemanticSearchResponse>({
+		http.post(`${API}/outbox`, async ({ request }) => {
+			if (options.draftSave === "refused") return refuseSave();
+			const input = (await request.json()) as RemitImapCreateOutboxMessageInput;
+			draftsCreated += 1;
+			const account = world.accounts.find(
+				(candidate) => candidate.accountId === input.accountId,
+			);
+			const created: RemitImapOutboxMessageResponse = {
+				outboxMessageId: `out-created-${draftsCreated}`,
+				accountId: input.accountId,
+				fromAddress: account?.email ?? "",
+				fromName: account?.displayName,
+				toAddresses: input.toAddresses,
+				ccAddresses: input.ccAddresses ?? [],
+				bccAddresses: input.bccAddresses ?? [],
+				subject: input.subject,
+				textBody: input.textBody,
+				htmlBody: input.htmlBody,
+				references: input.references ?? [],
+				status: "draft",
+				createdAt: Date.UTC(2026, 8, 24, 13, 0),
+				updatedAt: Date.UTC(2026, 8, 24, 13, 0),
+				attachments: [],
+			};
+			outbox.set(created.outboxMessageId, created);
+			return HttpResponse.json<RemitImapOutboxMessageResponse>(created);
+		}),
+		http.get(`${API}/outbox/:outboxMessageId`, ({ params }) => {
+			const message = outbox.get(String(params.outboxMessageId));
+			if (!message)
+				return HttpResponse.json(
+					{ status: 404, message: "Outbox message not found" },
+					{ status: 404 },
+				);
+			return HttpResponse.json<RemitImapOutboxMessageResponse>(message);
+		}),
+		http.patch(
+			`${API}/outbox/:outboxMessageId`,
+			async ({ params, request }) => {
+				if (options.draftSave === "refused") return refuseSave();
+				const id = String(params.outboxMessageId);
+				const current = outbox.get(id);
+				if (!current)
+					return HttpResponse.json(
+						{ status: 404, message: "Outbox message not found" },
+						{ status: 404 },
+					);
+				const input =
+					(await request.json()) as RemitImapUpdateOutboxMessageInput;
+				const { attachmentIds: _attachmentIds, ...fields } = input;
+				const updated: RemitImapOutboxMessageResponse = {
+					...current,
+					...fields,
+					status: "draft",
+				};
+				outbox.set(id, updated);
+				return HttpResponse.json<RemitImapOutboxMessageResponse>(updated);
+			},
+		),
+		http.post(`${API}/outbox/:outboxMessageId/send`, ({ params }) => {
+			if (options.send === "holds") return pending();
+			const id = String(params.outboxMessageId);
+			const current = outbox.get(id);
+			if (!current)
+				return HttpResponse.json(
+					{ status: 404, message: "Outbox message not found" },
+					{ status: 404 },
+				);
+			const queued: RemitImapOutboxMessageResponse = {
+				...current,
+				status: "queued",
+			};
+			outbox.set(id, queued);
+			return HttpResponse.json<RemitImapOutboxMessageResponse>(queued);
+		}),
+		http.delete(`${API}/outbox/:outboxMessageId`, ({ params }) => {
+			outbox.delete(String(params.outboxMessageId));
+			return new HttpResponse(null, { status: 204 });
+		}),
+		http.get(`${API}/calendars`, () =>
+			HttpResponse.json<CalendarOperationsListCalendarsResponse>({ items: [] }),
+		),
+		http.get(`${API}/calendar-events`, () =>
+			HttpResponse.json<CalendarEventOperationsListCalendarEventsResponse>({
 				items: [],
 			}),
 		),
+		http.get(`${API}/calendar-suggestions`, () =>
+			HttpResponse.json<CalendarSuggestionOperationsListCalendarSuggestionsResponse>(
+				{ items: [] },
+			),
+		),
+		http.get(`${API}/search/semantic`, () =>
+			options.search === "holds"
+				? pending()
+				: HttpResponse.json<SemanticSearchOperationsSemanticSearchResponse>({
+						items: [],
+					}),
+		),
 		http.get(`${API}/me/quarantine`, () =>
 			HttpResponse.json<MeOperationsListQuarantineResponse>({
 				entries: world.quarantine,

package/src/mocks/story-frame/mail-world.ts

@@ -26,11 +26,12 @@ export interface MailWorld {
 	vipSuggestions: RemitImapVipSuggestionEntry[];
 	addresses: RemitImapAddressResponse[];
 	systemUpdate: RemitImapSystemUpdateResponse;
+	bodies: Record<string, string>;
 }
 
-const MINUTE = 60_000;
-const HOUR = 60 * MINUTE;
-const DAY = 24 * HOUR;
+export const MINUTE = 60_000;
+export const HOUR = 60 * MINUTE;
+export const DAY = 24 * HOUR;
 export const NOW = Date.UTC(2026, 8, 24, 13, 0);
 
 const ROLES = [
@@ -93,8 +94,9 @@ const accounts = [
 	accountWithFolders(WORK, "alice.tan@acme.example", "Work"),
 ];
 
-interface ThreadSeed {
+export interface ThreadSeed {
 	id: string;
+	inThread?: string;
 	accountId: string;
 	role?: RemitImapCanonicalMailboxRole;
 	fromName: string;
@@ -108,10 +110,10 @@ interface ThreadSeed {
 	hasAttachment?: boolean;
 }
 
-const thread = (seed: ThreadSeed): RemitImapThreadMessageResponse =>
+export const threadRow = (seed: ThreadSeed): RemitImapThreadMessageResponse =>
 	makeThreadMessage({
 		messageId: `msg-${seed.id}`,
-		threadId: `thread-${seed.id}`,
+		threadId: `thread-${seed.inThread ?? seed.id}`,
 		threadMessageId: `tm-${seed.id}`,
 		accountId: seed.accountId,
 		mailboxId: mailboxIdFor(seed.accountId, seed.role ?? "Inbox"),
@@ -129,7 +131,7 @@ const thread = (seed: ThreadSeed): RemitImapThreadMessageResponse =>
 	});
 
 const inboxThreads: RemitImapThreadMessageResponse[] = [
-	thread({
+	threadRow({
 		id: "q3-planning",
 		accountId: WORK,
 		fromName: "Ada Lovelace",
@@ -140,7 +142,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 		ago: 20 * MINUTE,
 		starred: true,
 	}),
-	thread({
+	threadRow({
 		id: "lease",
 		accountId: PERSONAL,
 		fromName: "Amara Okafor",
@@ -152,7 +154,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 		hasAttachment: true,
 		starred: true,
 	}),
-	thread({
+	threadRow({
 		id: "dinner",
 		accountId: PERSONAL,
 		fromName: "Grace Hopper",
@@ -163,7 +165,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 		ago: 5 * HOUR,
 		isRead: true,
 	}),
-	thread({
+	threadRow({
 		id: "invoice",
 		accountId: WORK,
 		fromName: "Billing",
@@ -175,7 +177,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 		isRead: true,
 		starred: true,
 	}),
-	thread({
+	threadRow({
 		id: "shipping",
 		accountId: PERSONAL,
 		fromName: "Parcel Service",
@@ -185,7 +187,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 		category: "transactional",
 		ago: 9 * HOUR,
 	}),
-	thread({
+	threadRow({
 		id: "weekly-digest",
 		accountId: PERSONAL,
 		fromName: "The Weekly",
@@ -195,7 +197,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 		category: "newsletter",
 		ago: DAY,
 	}),
-	thread({
+	threadRow({
 		id: "sale",
 		accountId: PERSONAL,
 		fromName: "Outdoor Store",
@@ -205,7 +207,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 		category: "marketing",
 		ago: DAY + 3 * HOUR,
 	}),
-	thread({
+	threadRow({
 		id: "mention",
 		accountId: WORK,
 		fromName: "Chat",
@@ -215,7 +217,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 		category: "social",
 		ago: DAY + 5 * HOUR,
 	}),
-	thread({
+	threadRow({
 		id: "build",
 		accountId: WORK,
 		fromName: "CI",
@@ -226,7 +228,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 		ago: 2 * DAY,
 		isRead: true,
 	}),
-	thread({
+	threadRow({
 		id: "talk-outline",
 		accountId: PERSONAL,
 		role: "Archive",
@@ -242,7 +244,7 @@ const inboxThreads: RemitImapThreadMessageResponse[] = [
 ];
 
 const serverDrafts: RemitImapThreadMessageResponse[] = [
-	thread({
+	threadRow({
 		id: "draft-talk",
 		accountId: PERSONAL,
 		role: "Drafts",
@@ -376,7 +378,7 @@ export const newsletterBacklog = (
 	count: number,
 ): RemitImapThreadMessageResponse[] =>
 	Array.from({ length: count }, (_, index) =>
-		thread({
+		threadRow({
 			id: `digest-${index}`,
 			accountId: PERSONAL,
 			fromName: "The Weekly",
@@ -388,6 +390,29 @@ export const newsletterBacklog = (
 		}),
 	);
 
+export const senderAddress = (
+	row: RemitImapThreadMessageResponse,
+): RemitImapAddressResponse => {
+	const email = (row.fromEmail ?? "").toLowerCase();
+	const [localPart = "", domain = ""] = email.split("@");
+	return {
+		addressId: `addr-${email}`,
+		accountConfigId: row.accountConfigId,
+		displayName: row.fromName,
+		localPart,
+		domain,
+		normalizedEmail: email,
+		flags: {},
+		inboundCount: 1,
+		outboundCount: 0,
+		replyCount: 0,
+		lastInboundAt: row.sentDate,
+		lastReplyAt: 0,
+		createdAt: row.sentDate,
+		updatedAt: row.sentDate,
+	};
+};
+
 export const mailWorld = (overrides: Partial<MailWorld> = {}): MailWorld => ({
 	accounts,
 	mailboxes: (overrides.accounts ?? accounts).flatMap((account) =>
@@ -403,5 +428,6 @@ export const mailWorld = (overrides: Partial<MailWorld> = {}): MailWorld => ({
 		check: { status: "disabled" },
 		run: null,
 	},
+	bodies: {},
 	...overrides,
 });