@remit/web-client 0.0.325 → 0.0.327

package/src/components/compose/quoted-message.ts

@@ -1,216 +0,0 @@
-import type { RemitImapDescribeMessageResponse } from "@remit/api-http-client/types.gen.ts";
-import { type RichTextValue, wrapWithLanguage } from "@remit/ui";
-import type { ComposeBodyMode } from "@remit/ui/rich-text";
-import { formatDate } from "../../lib/format";
-
-type Envelope = RemitImapDescribeMessageResponse["envelope"];
-type EnvelopeAddress = Envelope["from"][number];
-
-/** Whether the original is being answered or passed on. */
-export type QuoteKind = "reply" | "forward";
-
-/** The message being quoted, in both the representations a send carries. */
-export interface QuotedBlock {
-	text: string;
-	html: string;
-}
-
-/**
- * The original's body as the content route hands it over: one part, either
- * HTML or plain text, never both. The other representation is derived here,
- * because a message goes out with both and HTML markup dropped into the
- * `text/plain` part arrives as visible tags.
- */
-export type QuotedSourceBody =
-	| { kind: "text"; content: string }
-	| { kind: "html"; content: string };
-
-export const escapeHtml = (text: string): string =>
-	text
-		.replace(/&/g, "&")
-		.replace(/</g, "&lt;")
-		.replace(/>/g, "&gt;")
-		.replace(/"/g, "&quot;");
-
-export const textToHtml = (text: string): string =>
-	text
-		.split("\n")
-		.map((line) => `<p>${escapeHtml(line)}</p>`)
-		.join("");
-
-/**
- * Elements that end the line they are on. Everything else is inline and runs
- * into its neighbours, which is what separates a plain-text rendering of a
- * message from its `textContent` — that returns one long line with the words
- * of adjacent paragraphs joined together.
- */
-const LINE_BREAKING_TAGS = new Set([
-	"ADDRESS",
-	"ARTICLE",
-	"BLOCKQUOTE",
-	"BR",
-	"DIV",
-	"H1",
-	"H2",
-	"H3",
-	"H4",
-	"H5",
-	"H6",
-	"HR",
-	"LI",
-	"OL",
-	"P",
-	"PRE",
-	"SECTION",
-	"TABLE",
-	"TR",
-	"UL",
-]);
-
-const htmlToPlainText = (html: string): string => {
-	const parsed = new DOMParser().parseFromString(html, "text/html");
-	const lines: string[] = [];
-	let line = "";
-
-	const endLine = (): void => {
-		lines.push(line.trim());
-		line = "";
-	};
-
-	const visit = (node: Node): void => {
-		if (node.nodeType === node.TEXT_NODE) {
-			line += (node.textContent ?? "").replace(/\s+/g, " ");
-			return;
-		}
-		if (node.nodeType !== node.ELEMENT_NODE) return;
-		const breaks = LINE_BREAKING_TAGS.has((node as Element).tagName);
-		if (breaks && line !== "") endLine();
-		for (const child of node.childNodes) visit(child);
-		if (breaks) endLine();
-	};
-
-	visit(parsed.body);
-	if (line !== "") endLine();
-	return lines
-		.join("\n")
-		.replace(/\n{3,}/g, "\n\n")
-		.trim();
-};
-
-const addressLabel = (address: EnvelopeAddress): string =>
-	address.displayName
-		? `${address.displayName} <${address.normalizedEmail}>`
-		: address.normalizedEmail;
-
-const addressList = (addresses: readonly EnvelopeAddress[]): string =>
-	addresses.map(addressLabel).join(", ");
-
-/**
- * An absolute date, because the attribution outlives the moment it was written
- * — the relative form the message list uses would reach the recipient reading
- * "Yesterday" about a day that is no longer yesterday.
- */
-const quotedDate = (date: Envelope["date"]): string =>
-	formatDate(date, {
-		year: "numeric",
-		month: "short",
-		day: "numeric",
-		hour: "numeric",
-		minute: "numeric",
-	});
-
-/** The form `snippet.ts` and the search chunker both recognise as a quote. */
-const attributionLine = (envelope: Envelope): string => {
-	const who = addressList(envelope.from) || "the sender";
-	const when = quotedDate(envelope.date);
-	if (!when) return `${who} wrote:`;
-	return `On ${when}, ${who} wrote:`;
-};
-
-const FORWARD_RULE = "---------- Forwarded message ----------";
-
-const forwardHeader = (envelope: Envelope): string[] => {
-	const lines = [
-		FORWARD_RULE,
-		`From: ${addressList(envelope.from)}`,
-		`Date: ${quotedDate(envelope.date)}`,
-		`Subject: ${envelope.subject ?? ""}`,
-		`To: ${addressList(envelope.to)}`,
-	];
-	if (envelope.cc.length > 0) lines.push(`Cc: ${addressList(envelope.cc)}`);
-	return lines;
-};
-
-const quotePrefixed = (text: string): string[] =>
-	text.split("\n").map((line) => (line === "" ? ">" : `> ${line}`));
-
-/**
- * The original, as the message being written will carry it. One value, so what
- * the composer shows under the editor is the same block that leaves for the
- * API rather than a second rendering of the same source (#845.5).
- *
- * A reply indents the original behind an attribution line; a forward passes it
- * on whole under the header block, because a forward is the original message
- * rather than a passage cited from it.
- */
-export const buildQuotedBlock = (
-	kind: QuoteKind,
-	envelope: Envelope,
-	body: QuotedSourceBody,
-): QuotedBlock => {
-	const bodyText =
-		body.kind === "text" ? body.content.trim() : htmlToPlainText(body.content);
-	const bodyHtml =
-		body.kind === "html" ? body.content : textToHtml(body.content.trim());
-
-	if (kind === "forward") {
-		const header = forwardHeader(envelope);
-		return {
-			text: [...header, "", bodyText].join("\n"),
-			html: `${textToHtml(header.join("\n"))}${bodyHtml}`,
-		};
-	}
-
-	const attribution = attributionLine(envelope);
-	return {
-		text: [attribution, ...quotePrefixed(bodyText)].join("\n"),
-		html: `<p>${escapeHtml(attribution)}</p><blockquote type="cite">${bodyHtml}</blockquote>`,
-	};
-};
-
-const joinText = (written: string, quoted: string): string =>
-	written === "" ? quoted : `${written}\n\n${quoted}`;
-
-/**
- * What the two body columns carry for this mode.
- *
- * Plain mode writes the empty string rather than omitting `htmlBody`: absent
- * means "leave alone" at every layer below, so a plain draft that omitted it
- * would send the HTML it was written as before the switch. The empty string is
- * defined, so the repository's update guard clears the column, and nodemailer
- * branches on the value being truthy — an empty one builds no HTML alternative
- * and the message leaves as a single `text/plain` part. It is also why the
- * quote reaches a plain message through `textBody` alone: putting its markup in
- * `htmlBody` would reopen the draft as rich and send the recipient an HTML
- * alternative of a message written as plain text.
- *
- * Rich mode leaves `htmlBody` alone while it has nothing to say, so the moments
- * before the lazily-loaded editor reports its document cannot write a draft
- * back as plain. A quote is something to say, so a send pressed in those
- * moments still carries the message it quotes.
- */
-export const outgoingBody = (
-	bodyMode: ComposeBodyMode,
-	body: RichTextValue,
-	language: string,
-	quoted: QuotedBlock | undefined,
-): { textBody: string | undefined; htmlBody: string | undefined } => {
-	const text = quoted ? joinText(body.text, quoted.text) : body.text;
-	if (bodyMode === "plain")
-		return { textBody: text || undefined, htmlBody: "" };
-	const html = quoted ? `${body.html}${quoted.html}` : body.html;
-	return {
-		textBody: text || undefined,
-		htmlBody: html ? wrapWithLanguage(html, language) : undefined,
-	};
-};

package/src/components/compose/reopened-draft-writes-nothing.render.test.ts

@@ -1,148 +0,0 @@
-/**
- * Issue #933: opening a message is not editing it.
- *
- * Editing a settled failure returns the row to `draft`, which is what gets a
- * message refused for a bad address back on its way. The composer's autosave
- * had no dirty check, though, and its effect runs on the render that fills the
- * fields from the server's copy — so opening a Failed message and pressing
- * Escape wrote a PATCH, and the row left the Outbox with the reader having
- * changed nothing. A status change nobody asked for, on a message they were
- * only reading.
- *
- * The rule pinned here: an untouched document writes nothing, and the first
- * real edit writes as it always did.
- */
-
-import assert from "node:assert/strict";
-import { afterEach, describe, it } from "node:test";
-import type { RemitImapAccountResponse } from "@remit/api-http-client/types.gen.ts";
-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 { ComposeProvider } from "./ComposeProvider";
-
-const ACCOUNT_ID = "acc-1";
-const OUTBOX_MESSAGE_ID = "ob-933";
-const AUTOSAVE_DEBOUNCE_MS = 2000;
-
-const account = {
-	accountId: ACCOUNT_ID,
-	email: "me@example.com",
-	smtpEnabled: true,
-} as unknown as RemitImapAccountResponse;
-
-/** The row as the Outbox holds it: refused, and still carrying what was typed. */
-const failedEntry = {
-	outboxMessageId: OUTBOX_MESSAGE_ID,
-	accountId: ACCOUNT_ID,
-	fromAddress: account.email,
-	toAddresses: ["typo@exmaple.com"],
-	attachments: [],
-	ccAddresses: [],
-	bccAddresses: [],
-	references: [],
-	subject: "Invoice",
-	textBody: "Attached.",
-	status: "failed",
-	lastError: "550 5.1.0 mailbox unavailable",
-};
-
-let harness: DomHarness | undefined;
-let http: HttpMock | undefined;
-
-afterEach(() => {
-	harness?.close();
-	harness = undefined;
-	http?.restore();
-	http = undefined;
-});
-
-(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 Opened = () => {
-	const [draftId, setDraftId] = useState<string | undefined>(OUTBOX_MESSAGE_ID);
-
-	return createElement(ComposeForm, {
-		mode: "new",
-		account,
-		outboxMessageId: draftId,
-		onDraftCreated: setDraftId,
-		onClose: () => undefined,
-	});
-};
-
-const writes = () =>
-	(http?.calls ?? []).filter(
-		(call) => call.method === "PATCH" || call.method === "POST",
-	);
-
-const mount = async (): Promise<void> => {
-	http = mockFetch(async (call) => {
-		if (call.path.endsWith("/config")) return { accounts: [account] };
-		return failedEntry;
-	});
-
-	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)),
-		}),
-	);
-	await harness.flush();
-	await harness.wait(50);
-};
-
-const subjectField = (): HTMLElement => {
-	const field = harness?.query("[data-subject-field]");
-	if (!field) throw new Error("the compose subject field is not mounted");
-	return field;
-};
-
-describe("a message reopened in the composer", () => {
-	it("writes nothing while nobody has touched it", async () => {
-		await mount();
-
-		await harness?.wait(AUTOSAVE_DEBOUNCE_MS + 200);
-
-		assert.deepEqual(
-			writes().map((call) => call.method),
-			[],
-			"reopening a message must not change it",
-		);
-	});
-
-	it("writes the first real edit", async () => {
-		await mount();
-
-		harness?.type(subjectField(), "Invoice, corrected");
-		await harness?.wait(AUTOSAVE_DEBOUNCE_MS + 200);
-
-		const written = writes().at(-1);
-		assert.equal(written?.method, "PATCH");
-		assert.equal(written?.body?.subject, "Invoice, corrected");
-	});
-});

package/src/components/compose/reply-all-on-resumed-draft.render.test.ts

@@ -1,250 +0,0 @@
-/**
- * Issue #796: Reply All does nothing on a reply reopened after a reload.
- *
- * The composer mounts holding a draft id, so `resumedDraftRef` starts true —
- * the guard that keeps a saved draft's recipients from being overwritten when
- * it reopens. But that same guard then swallowed every later run of the
- * seeding effect, so switching the mode to Reply All over the same message
- * rewrote nothing: no addresses in Cc, nothing changed on screen. A dead
- * control — the reader cannot tell whether Reply All is broken, misconfigured,
- * or their own mistake.
- *
- * The guarantees here: a resumed reply still opens untouched, but pressing
- * Reply All puts the source message's other recipients in Cc — including when
- * the press lands before the source message or the account has resolved, which
- * after a reload is the ordinary case rather than the exception.
- */
-
-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 {
-	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 { ComposeProvider } from "./ComposeProvider";
-
-const ACCOUNT_ID = "acc-1";
-const DRAFT_ID = "ob-796";
-
-const account = {
-	accountId: ACCOUNT_ID,
-	email: "me@example.com",
-	smtpEnabled: true,
-} as unknown as RemitImapAccountResponse;
-
-/** The reader is among the message's recipients, as they are on their own mail. */
-const sourceMessage = {
-	message: { messageId: "msg-1", mailboxId: "mbx-1" },
-	envelope: {
-		subject: "Lunch",
-		messageIdValue: "<m1@example.com>",
-		from: [{ normalizedEmail: "them@example.com", displayName: "Them" }],
-		replyTo: [],
-		to: [
-			{ normalizedEmail: "other@example.com", displayName: "Other" },
-			{ normalizedEmail: account.email, displayName: "Me" },
-		],
-		cc: [{ normalizedEmail: "copied@example.com", displayName: "Copied" }],
-	},
-	references: [],
-	bodyParts: [],
-} as unknown as RemitImapDescribeMessageResponse;
-
-/** The draft as it was saved under Reply: only To holds the sender. */
-const draft = {
-	outboxMessageId: DRAFT_ID,
-	accountId: ACCOUNT_ID,
-	fromAddress: account.email,
-	toAddresses: ["them@example.com"],
-	attachments: [],
-	ccAddresses: [],
-	bccAddresses: [],
-	references: [],
-	subject: "Re: Lunch",
-	textBody: "Does one o'clock work?",
-	status: "draft",
-};
-
-let harness: DomHarness | undefined;
-let http: HttpMock | undefined;
-
-afterEach(() => {
-	harness?.close();
-	harness = undefined;
-	http?.restore();
-	http = undefined;
-});
-
-(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;
-
-interface ReopenedProps {
-	/** A reload refetches the source, which lands after the form is on screen. */
-	sourceAtMount: boolean;
-	/** The account is looked up from the source's mailbox, so it lands later still. */
-	accountAtMount: boolean;
-}
-
-/**
- * The composer reopened on its saved draft, with a button standing in for the
- * mode control — which switches Reply over to Reply All without remounting the
- * form or changing the draft segment. The two other buttons stand in for the
- * fetches a reload leaves outstanding, so a test can put the press before them.
- */
-const Reopened = ({ sourceAtMount, accountAtMount }: ReopenedProps) => {
-	const [mode, setMode] = useState<"reply" | "reply-all">("reply");
-	const [source, setSource] = useState(
-		sourceAtMount ? sourceMessage : undefined,
-	);
-	const [resolved, setResolved] = useState(
-		accountAtMount ? account : undefined,
-	);
-
-	return createElement(
-		"div",
-		null,
-		createElement(
-			"button",
-			{ type: "button", onClick: () => setMode("reply-all") },
-			"Reply All",
-		),
-		createElement(
-			"button",
-			{ type: "button", onClick: () => setSource(sourceMessage) },
-			"Deliver source",
-		),
-		createElement(
-			"button",
-			{ type: "button", onClick: () => setResolved(account) },
-			"Resolve account",
-		),
-		createElement(ComposeForm, {
-			mode,
-			account: resolved,
-			sourceMessage: source,
-			outboxMessageId: DRAFT_ID,
-			onDraftCreated: () => undefined,
-			onClose: () => undefined,
-		}),
-	);
-};
-
-const mount = async (props: ReopenedProps): Promise<DomHarness> => {
-	http = mockFetch(async (call) => {
-		if (call.path.endsWith("/config")) return { accounts: [account] };
-		return draft;
-	});
-
-	const created = createDomHarness();
-	harness = created;
-	created.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(Reopened, props),
-			),
-		}),
-	);
-	await created.flush();
-	await created.wait(50);
-	return created;
-};
-
-const press = async (mounted: DomHarness, label: string): Promise<void> => {
-	mounted.click(mounted.byText("button", label));
-	await mounted.flush();
-	await mounted.wait(20);
-};
-
-/**
- * What one address field holds, read off the chips rather than off the form's
- * text: every recipient is one chip, and each carries its address whether or
- * not the envelope gave it a display name.
- */
-const addressesIn = (mounted: DomHarness, label: string): string[] =>
-	mounted
-		.queryAll(`[data-address-field="${label}"] [aria-label^="Remove "]`)
-		.map((chip) =>
-			(chip.getAttribute("aria-label") ?? "").replace("Remove ", ""),
-		);
-
-describe("Reply All on a resumed reply", () => {
-	it("keeps the saved draft's fields while it merely reopens", async () => {
-		const mounted = await mount({ sourceAtMount: true, accountAtMount: true });
-
-		assert.deepEqual(addressesIn(mounted, "To"), ["them@example.com"]);
-		assert.deepEqual(
-			addressesIn(mounted, "Cc"),
-			[],
-			"reopening must not rewrite what the reader saved",
-		);
-	});
-
-	it("puts the source message's other recipients in Cc", async () => {
-		const mounted = await mount({ sourceAtMount: true, accountAtMount: true });
-
-		await press(mounted, "Reply All");
-
-		assert.deepEqual(addressesIn(mounted, "Cc"), [
-			"other@example.com",
-			"copied@example.com",
-		]);
-	});
-
-	// After a reload the source is fetched fresh, so the press ordinarily comes
-	// first. Reading the mode off that run recorded "reply-all" as the mode the
-	// draft opened under, and Cc stayed empty — the original dead control.
-	it("seeds Cc when the press lands before the source message", async () => {
-		const mounted = await mount({ sourceAtMount: false, accountAtMount: true });
-
-		await press(mounted, "Reply All");
-		await press(mounted, "Deliver source");
-
-		assert.deepEqual(addressesIn(mounted, "Cc"), [
-			"other@example.com",
-			"copied@example.com",
-		]);
-	});
-
-	// The account is looked up from the source's mailbox, so it resolves after
-	// the source. Its address is the only thing that keeps the reader out of the
-	// Cc of their own reply (#819), so a seed made without it is made again.
-	it("takes the reader out of Cc when the account resolves after the press", async () => {
-		const mounted = await mount({ sourceAtMount: true, accountAtMount: false });
-
-		await press(mounted, "Reply All");
-		await press(mounted, "Resolve account");
-
-		assert.deepEqual(addressesIn(mounted, "Cc"), [
-			"other@example.com",
-			"copied@example.com",
-		]);
-	});
-});

package/src/components/compose/reply-with-times.ts

@@ -1,22 +0,0 @@
-import { useCallback } from "react";
-import { useOpenReply } from "@/routing";
-import { useCompose } from "./ComposeProvider";
-
-export interface AnsweredMessage {
-	threadId: string;
-	messageId: string;
-}
-
-export type ReplyWithText = (message: AnsweredMessage, text: string) => void;
-
-export function useReplyWithText(): ReplyWithText {
-	const { insertIntoOpenReply } = useCompose();
-	const openReply = useOpenReply();
-	return useCallback(
-		(message: AnsweredMessage, text: string) => {
-			if (insertIntoOpenReply(message.messageId, text)) return;
-			openReply({ ...message, mode: "reply" }, { body: text });
-		},
-		[insertIntoOpenReply, openReply],
-	);
-}