@remit/web-client 0.0.311 → 0.0.312

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remit/web-client",
-  "version": "0.0.311",
+  "version": "0.0.312",
   "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/compose/ComposeForm.tsx

@@ -30,7 +30,7 @@ import {
 	sanitizeQuotedHtml,
 	unwrapLanguage,
 } from "@remit/ui";
-import type { ComposeBodyMode } from "@remit/ui/rich-text";
+import type { ComposeBodyMode, ComposeInsertion } from "@remit/ui/rich-text";
 import { useMutation, useQuery } from "@tanstack/react-query";
 import type { RefObject } from "react";
 import {
@@ -50,6 +50,7 @@ import { useMessageBodyContent } from "../../hooks/useMessageBodyContent";
 import { useSaveDraft } from "../../hooks/useSaveDraft";
 import { useSignature } from "../../hooks/useSignature.js";
 import { isNotFound, softErrorMeta } from "../../lib/error-classifier";
+import type { ComposeSeed } from "../../lib/mail-search";
 import { accountIsMissingSmtp } from "../settings/account-form-helpers.js";
 import { useErrorBanners } from "../ui/ErrorBannerProvider.js";
 import {
@@ -94,6 +95,8 @@ interface ComposeFormProps {
 	 * shared would open on the last draft any other composer touched.
 	 */
 	outboxMessageId?: string;
+	seed?: ComposeSeed;
+	insertion?: ComposeInsertion;
 	/** The draft the first autosave created, for the owner to record. */
 	onDraftCreated: (outboxMessageId: string) => void;
 	onClose: () => void;
@@ -118,10 +121,19 @@ const buildInitialHtml = (signaturePlainText: string): string => {
  */
 const freshDocument = (
 	signaturePlainText: string,
-): { html: string; text: string } => ({
-	html: buildInitialHtml(signaturePlainText),
-	text: signaturePlainText,
-});
+	seed?: ComposeSeed,
+): { html: string; text: string } => {
+	if (!seed) {
+		return {
+			html: buildInitialHtml(signaturePlainText),
+			text: signaturePlainText,
+		};
+	}
+	return {
+		html: `${textToHtml(seed.body)}${buildInitialHtml(signaturePlainText)}`,
+		text: [seed.body, signaturePlainText].filter(Boolean).join("\n\n"),
+	};
+};
 
 const buildReplySubject = (subject?: string): string => {
 	if (!subject) return "Re: ";
@@ -396,6 +408,8 @@ export const ComposeForm = ({
 	account,
 	sourceMessage,
 	outboxMessageId,
+	seed,
+	insertion,
 	onDraftCreated,
 	onClose,
 	onAccountChange,
@@ -546,7 +560,7 @@ export const ComposeForm = ({
 		// the signature, the same document a fresh mount would have started on.
 		const opening = outboxMessageId
 			? { html: "", text: "" }
-			: freshDocument(signatureRef.current);
+			: freshDocument(signatureRef.current, seedRef.current);
 		setToAddresses([]);
 		setCcAddresses([]);
 		setBccAddresses([]);
@@ -571,15 +585,19 @@ export const ComposeForm = ({
 	// not a reason to reopen the document somebody is typing in.
 	const signatureRef = useRef(signature.plainText);
 	signatureRef.current = signature.plainText;
+	const seedRef = useRef(seed);
+	seedRef.current = seed;
 	// The editor reads its document once, so this is the document it opens on,
 	// not the live value, and it is remounted when the generation changes. Only
 	// loading a different document bumps that — remounting mid-compose would take
 	// the caret, the focus and the undo history with it.
 	const [documentGeneration, setDocumentGeneration] = useState(0);
 	const [initialHtml, setInitialHtml] = useState(
-		() => freshDocument(signature.plainText).html,
+		() => freshDocument(signature.plainText, seed).html,
+	);
+	const [initialText, setInitialText] = useState(
+		() => freshDocument(signature.plainText, seed).text,
 	);
-	const [initialText, setInitialText] = useState(signature.plainText);
 	const [bodyMode, setBodyMode] = useState<ComposeBodyMode>("rich");
 	// What the body is tagged with on the way out. The composer owns the value —
 	// it is the surface that has the text detection reads — and reports it here,
@@ -587,9 +605,18 @@ export const ComposeForm = ({
 	const [composeLanguage, setComposeLanguage] = useState("en");
 	const [draftLanguage, setDraftLanguage] = useState<string | undefined>();
 	const [body, setBody] = useState<RichTextValue>(() => ({
-		...freshDocument(signature.plainText),
+		...freshDocument(signature.plainText, seed),
 		formatting: [],
 	}));
+	const [insertedVersion, setInsertedVersion] = useState(
+		() => insertion?.version ?? 0,
+	);
+	const pendingInsertion =
+		insertion &&
+		insertion.version > insertedVersion &&
+		(outboxMessageId === undefined || draftLoaded)
+			? insertion
+			: undefined;
 
 	const { data: draftData, error: draftError } = useQuery({
 		...outboxDetailOperationsGetOutboxMessageOptions({
@@ -1352,6 +1379,8 @@ export const ComposeForm = ({
 					initialLanguage={draftLanguage}
 					onLanguageChange={setComposeLanguage}
 					spellcheck={spellcheck}
+					insertion={pendingInsertion}
+					onInserted={setInsertedVersion}
 				/>
 			</Suspense>
 		</ComposeFormShell>

package/src/components/compose/ComposeProvider.tsx

@@ -9,6 +9,7 @@ import {
 	useContext,
 	useEffect,
 	useMemo,
+	useRef,
 	useState,
 } from "react";
 import { isNotFound, softErrorStatuses } from "@/lib/error-classifier";
@@ -30,8 +31,15 @@ export type ComposeMode = ReplyMode | "new";
  * the address's answers — `useComposeDraftId` and `useIsComposing`. A second
  * copy here is what let a reply's draft turn up in the next new message.
  */
+type InsertIntoReply = (text: string) => void;
+
 interface ComposeContextValue {
 	startSendPolling: (outboxMessageId: string) => void;
+	insertIntoOpenReply: (sourceMessageId: string, text: string) => boolean;
+	registerOpenReply: (
+		sourceMessageId: string,
+		insert: InsertIntoReply,
+	) => () => void;
 }
 
 const ComposeContext = createContext<ComposeContextValue | undefined>(
@@ -124,7 +132,33 @@ export const ComposeProvider = ({
 		setPollingMessageId(outboxMessageId);
 	}, []);
 
-	const value = useMemo(() => ({ startSendPolling }), [startSendPolling]);
+	const openReplies = useRef(new Map<string, InsertIntoReply>());
+
+	const insertIntoOpenReply = useCallback(
+		(sourceMessageId: string, text: string): boolean => {
+			const insert = openReplies.current.get(sourceMessageId);
+			if (!insert) return false;
+			insert(text);
+			return true;
+		},
+		[],
+	);
+
+	const registerOpenReply = useCallback(
+		(sourceMessageId: string, insert: InsertIntoReply) => {
+			openReplies.current.set(sourceMessageId, insert);
+			return () => {
+				if (openReplies.current.get(sourceMessageId) === insert)
+					openReplies.current.delete(sourceMessageId);
+			};
+		},
+		[],
+	);
+
+	const value = useMemo(
+		() => ({ startSendPolling, insertIntoOpenReply, registerOpenReply }),
+		[startSendPolling, insertIntoOpenReply, registerOpenReply],
+	);
 
 	return (
 		<ComposeContext.Provider value={value}>{children}</ComposeContext.Provider>

package/src/components/compose/ConversationCompose.tsx

@@ -2,7 +2,9 @@ import {
 	configOperationsGetConfigOptions,
 	messageOperationsDescribeMessageOptions,
 } from "@remit/api-http-client/@tanstack/react-query.gen.ts";
+import type { ComposeInsertion } from "@remit/ui/rich-text";
 import { useQuery } from "@tanstack/react-query";
+import { useCallback, useEffect, useState } from "react";
 import { useMailboxAccount } from "@/hooks/useMailboxAccount";
 import {
 	type ReplyAddress,
@@ -10,6 +12,7 @@ import {
 	useCloseReply,
 } from "@/routing";
 import { ComposeForm } from "./ComposeForm";
+import { useCompose } from "./ComposeProvider";
 
 /**
  * The answer to a message, as the top block of the conversation it answers.
@@ -27,6 +30,19 @@ import { ComposeForm } from "./ComposeForm";
 export const ConversationCompose = ({ surface }: { surface: ReplyAddress }) => {
 	const adoptCreatedDraft = useAdoptReplyDraft();
 	const closeReply = useCloseReply();
+	const { registerOpenReply } = useCompose();
+	const [insertion, setInsertion] = useState<ComposeInsertion>();
+	const insert = useCallback(
+		(text: string) =>
+			setInsertion((prev) => ({ version: (prev?.version ?? 0) + 1, text })),
+		[],
+	);
+	const answering = surface.sourceMessageId;
+
+	useEffect(
+		() => registerOpenReply(answering, insert),
+		[answering, insert, registerOpenReply],
+	);
 
 	const { data: sourceMessage } = useQuery({
 		...messageOperationsDescribeMessageOptions({
@@ -56,11 +72,14 @@ export const ConversationCompose = ({ surface }: { surface: ReplyAddress }) => {
 			    the address, and remounting the form on that would take the caret out
 			    of the sentence being typed. */}
 			<ComposeForm
+				key={surface.sourceMessageId}
 				layout="flow"
 				mode={surface.mode}
 				account={account}
 				sourceMessage={sourceMessage}
 				outboxMessageId={surface.outboxMessageId}
+				seed={surface.seed}
+				insertion={insertion}
 				onDraftCreated={adoptCreatedDraft}
 				onClose={closeReply}
 			/>

package/src/components/compose/compose.stories.tsx

@@ -174,6 +174,19 @@ export const Reply: Story = {
 	},
 };
 
+const OFFERED_TIMES = "Thursday 11 June: 12:30 – 13:00, 15:00 – 15:30";
+
+export const ReplyWithOfferedTimes: Story = {
+	args: {
+		url: `${messageUrl("lunch")}/reply?body=${encodeURIComponent(OFFERED_TIMES)}`,
+	},
+	play: async () => {
+		const subject = await page().findByPlaceholderText("Subject");
+		await waitFor(() => expect(subject).toHaveValue(`Re: ${LUNCH_SUBJECT}`));
+		await expect(await writingSurface(OFFERED_TIMES)).toBeVisible();
+	},
+};
+
 export const Forward: Story = {
 	args: { url: `${messageUrl("lunch")}/forward` },
 	play: async () => {

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

@@ -0,0 +1,22 @@
+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],
+	);
+}

package/src/components/mail/BriefPane.tsx

@@ -23,6 +23,7 @@ import {
 	useContext,
 	useMemo,
 } from "react";
+import { useReplyWithText } from "@/components/compose/reply-with-times";
 import { ConversationView } from "@/components/mail/ConversationView";
 import { DailyBrief } from "@/components/mail/DailyBrief";
 import { IntelligenceDrawer } from "@/components/mail/IntelligenceDrawer";
@@ -317,6 +318,7 @@ function BriefList() {
  * Mount in the `reading` slot of `AppShellSlotted`. Only rendered ≥ 1024px.
  */
 function BriefReading() {
+	const replyWithText = useReplyWithText();
 	const {
 		conversation,
 		selectedThread,
@@ -374,6 +376,7 @@ function BriefReading() {
 				mailboxId={selectedThread?.mailboxId}
 				accountId={selectedThread?.accountId}
 				onAfterOptimisticRemove={handleDeselectIfRemoved}
+				onReplyWithText={replyWithText}
 			/>
 		</>
 	);
@@ -384,6 +387,7 @@ function BriefReading() {
  * Mount in the `intelligence` slot of `AppShellSlotted`. Only rendered ≥ 1280px.
  */
 function BriefIntelligence() {
+	const replyWithText = useReplyWithText();
 	const { selectedThread, handleDeselectIfRemoved } = useBriefPane();
 	const { onToggleIntelligence } = useMailContext();
 
@@ -394,6 +398,7 @@ function BriefIntelligence() {
 			mailboxId={selectedThread?.mailboxId}
 			accountId={selectedThread?.accountId}
 			onAfterOptimisticRemove={handleDeselectIfRemoved}
+			onReplyWithText={replyWithText}
 		/>
 	);
 }
@@ -402,6 +407,7 @@ function BriefIntelligence() {
  * Phone view: ConversationView when thread is open, or the DailyBrief list.
  */
 function BriefPhone() {
+	const replyWithText = useReplyWithText();
 	const {
 		selectedThread,
 		conversation,
@@ -437,6 +443,7 @@ function BriefPhone() {
 					mailboxId={selectedThread?.mailboxId}
 					accountId={selectedThread?.accountId}
 					onAfterOptimisticRemove={handleDeselectIfRemoved}
+					onReplyWithText={replyWithText}
 				/>
 			</>
 		);

package/src/components/mail/FlaggedPane.tsx

@@ -33,6 +33,7 @@ import {
 	useContext,
 	useMemo,
 } from "react";
+import { useReplyWithText } from "@/components/compose/reply-with-times";
 import { ConversationView } from "@/components/mail/ConversationView";
 import { FlaggedList } from "@/components/mail/FlaggedList";
 import { IntelligenceDrawer } from "@/components/mail/IntelligenceDrawer";
@@ -320,6 +321,7 @@ function FlaggedListSlot() {
  * Mount in the `reading` slot of `AppShellSlotted`. Only rendered ≥ 1024px.
  */
 function FlaggedReading() {
+	const replyWithText = useReplyWithText();
 	const {
 		conversation,
 		selectedThread,
@@ -377,6 +379,7 @@ function FlaggedReading() {
 				mailboxId={selectedThread?.mailboxId}
 				accountId={selectedThread?.accountId}
 				onAfterOptimisticRemove={handleDeselectIfRemoved}
+				onReplyWithText={replyWithText}
 			/>
 		</>
 	);
@@ -387,6 +390,7 @@ function FlaggedReading() {
  * Mount in the `intelligence` slot of `AppShellSlotted`. Only rendered ≥ 1280px.
  */
 function FlaggedIntelligence() {
+	const replyWithText = useReplyWithText();
 	const { selectedThread, handleDeselectIfRemoved } = useFlaggedPane();
 	const { onToggleIntelligence } = useMailContext();
 
@@ -397,12 +401,14 @@ function FlaggedIntelligence() {
 			mailboxId={selectedThread?.mailboxId}
 			accountId={selectedThread?.accountId}
 			onAfterOptimisticRemove={handleDeselectIfRemoved}
+			onReplyWithText={replyWithText}
 		/>
 	);
 }
 
 /** Phone view: ConversationView when a thread is open, else the flat list. */
 function FlaggedPhone() {
+	const replyWithText = useReplyWithText();
 	const {
 		selectedThread,
 		conversation,
@@ -438,6 +444,7 @@ function FlaggedPhone() {
 					mailboxId={selectedThread?.mailboxId}
 					accountId={selectedThread?.accountId}
 					onAfterOptimisticRemove={handleDeselectIfRemoved}
+					onReplyWithText={replyWithText}
 				/>
 			</>
 		);

package/src/components/mail/IntelligenceDrawer.tsx

@@ -1,4 +1,5 @@
 import type { RemitImapThreadMessageResponse } from "@remit/api-http-client/types.gen.ts";
+import type { ReplyWithText } from "@/components/compose/reply-with-times";
 import { Drawer } from "@/components/layout/Drawer";
 import { IntelligencePane } from "@/components/mail/IntelligencePane";
 
@@ -16,6 +17,7 @@ export function IntelligenceDrawer({
 	mailboxId,
 	accountId,
 	onAfterOptimisticRemove,
+	onReplyWithText,
 }: {
 	isOpen: boolean;
 	onClose: () => void;
@@ -23,6 +25,7 @@ export function IntelligenceDrawer({
 	mailboxId?: string;
 	accountId?: string;
 	onAfterOptimisticRemove?: (messageIds: string[]) => void;
+	onReplyWithText?: ReplyWithText;
 }) {
 	return (
 		<Drawer
@@ -41,6 +44,7 @@ export function IntelligenceDrawer({
 				accountId={accountId}
 				hideCloseButton
 				onAfterOptimisticRemove={onAfterOptimisticRemove}
+				onReplyWithText={onReplyWithText}
 			/>
 		</Drawer>
 	);

package/src/components/mail/IntelligencePane.tsx

@@ -20,6 +20,7 @@ import { isRescueCandidate } from "@/lib/rescue-candidates";
 import { recordRescueSentToJunk } from "@/lib/rescue-telemetry";
 import { useTelemetry } from "@/lib/telemetry-context";
 import { NavLink } from "@/routing";
+import type { ReplyWithText } from "../compose/reply-with-times";
 
 export interface IntelligencePaneProps {
 	onClose: () => void;
@@ -53,6 +54,7 @@ export interface IntelligencePaneProps {
 	 * occasional unneeded pane-close — not a bug; see `useReportSpam`.
 	 */
 	onAfterOptimisticRemove?: (messageIds: string[]) => void;
+	onReplyWithText?: ReplyWithText;
 }
 
 /**
@@ -251,6 +253,7 @@ interface WiredPanelProps {
 	accountId?: string;
 	hideCloseButton?: boolean;
 	onAfterOptimisticRemove?: (messageIds: string[]) => void;
+	onReplyWithText?: ReplyWithText;
 }
 
 /**
@@ -263,6 +266,7 @@ function WiredPanel({
 	accountId,
 	hideCloseButton,
 	onAfterOptimisticRemove,
+	onReplyWithText,
 }: WiredPanelProps) {
 	const {
 		data,
@@ -273,7 +277,7 @@ function WiredPanel({
 		similarErrorIsFatal,
 		semanticEnabled,
 	} = useIntelligenceData(thread, mailboxId);
-	const calendar = useIntelligenceCalendar(thread);
+	const calendar = useIntelligenceCalendar(thread, onReplyWithText);
 	const [reclassifyOpen, setReclassifyOpen] = useState(false);
 	const senderEmail = thread.fromEmail ?? undefined;
 
@@ -432,6 +436,7 @@ export const IntelligencePane = ({
 	accountId,
 	hideCloseButton,
 	onAfterOptimisticRemove,
+	onReplyWithText,
 }: IntelligencePaneProps) => {
 	if (!thread) {
 		return (
@@ -461,6 +466,7 @@ export const IntelligencePane = ({
 			accountId={accountId}
 			hideCloseButton={hideCloseButton}
 			onAfterOptimisticRemove={onAfterOptimisticRemove}
+			onReplyWithText={onReplyWithText}
 		/>
 	);
 };

package/src/components/mail/MailboxPane.tsx

@@ -45,6 +45,7 @@ import {
 	useRef,
 	useState,
 } from "react";
+import { useReplyWithText } from "@/components/compose/reply-with-times";
 import { ConversationView } from "@/components/mail/ConversationView";
 import { DraftsView } from "@/components/mail/DraftsView";
 import { EmptyTrashBar } from "@/components/mail/EmptyTrashBar";
@@ -1115,6 +1116,7 @@ function MailboxList() {
  * Mount in the `reading` slot of `AppShellSlotted`. Only rendered ≥ 1024px.
  */
 function MailboxReading() {
+	const replyWithText = useReplyWithText();
 	const {
 		mailboxId,
 		mailboxAccountId,
@@ -1204,6 +1206,7 @@ function MailboxReading() {
 				mailboxId={mailboxId}
 				accountId={mailboxAccountId}
 				onAfterOptimisticRemove={handleDeselectIfRemoved}
+				onReplyWithText={replyWithText}
 			/>
 		</>
 	);
@@ -1214,6 +1217,7 @@ function MailboxReading() {
  * Mount in the `intelligence` slot of `AppShellSlotted`. Only rendered ≥ 1280px.
  */
 function MailboxIntelligence() {
+	const replyWithText = useReplyWithText();
 	const {
 		mailboxId,
 		mailboxAccountId,
@@ -1229,6 +1233,7 @@ function MailboxIntelligence() {
 			mailboxId={mailboxId}
 			accountId={mailboxAccountId}
 			onAfterOptimisticRemove={handleDeselectIfRemoved}
+			onReplyWithText={replyWithText}
 		/>
 	);
 }
@@ -1238,6 +1243,7 @@ function MailboxIntelligence() {
  * Use this on phones instead of the slot sub-views.
  */
 function MailboxPhone() {
+	const replyWithText = useReplyWithText();
 	const {
 		mailboxId,
 		mailboxAccountId,
@@ -1281,6 +1287,7 @@ function MailboxPhone() {
 					mailboxId={mailboxId}
 					accountId={mailboxAccountId}
 					onAfterOptimisticRemove={handleDeselectIfRemoved}
+					onReplyWithText={replyWithText}
 				/>
 			</>
 		);

package/src/components/mail/offer-times-reply.render.test.ts

@@ -0,0 +1,529 @@
+import assert from "node:assert/strict";
+import { afterEach, before, describe, it } from "node:test";
+import type {
+	RemitImapCalendarResponse,
+	RemitImapCalendarSuggestionResponse,
+	RemitImapDescribeMessageResponse,
+	RemitImapThreadMessageResponse,
+} from "@remit/api-http-client/types.gen.ts";
+import { type IntelligenceData, IntelligencePanel } from "@remit/ui";
+import {
+	type AnyRouter,
+	createMemoryHistory,
+	RouterContextProvider,
+} from "@tanstack/react-router";
+import { createElement } from "react";
+import { ComposeProvider } from "@/components/compose/ComposeProvider";
+import { useReplyWithText } from "@/components/compose/reply-with-times";
+import { useIntelligenceCalendar } from "@/hooks/useIntelligenceCalendar";
+import { noopTelemetry } from "@/lib/telemetry";
+import { createAppRouter } from "@/router";
+import { createDomHarness, type DomHarness } from "@/test-support/dom";
+import {
+	makeAccount,
+	makeMailbox,
+	makeThreadMessage,
+} from "@/test-support/fixtures";
+import { type HttpCall, type HttpMock, mockFetch } from "@/test-support/http";
+import { ConversationView } from "./ConversationView";
+
+const ACCOUNT_ID = "acc-1";
+const MAILBOX_ID = "mbx-inbox";
+const THREAD_ID = "thread-1";
+const MESSAGE_ID = "msg-1";
+const OTHER_ID = "msg-2";
+const DRAFT_ID = "ob-times";
+const CALENDAR = "11111111-1111-4111-8111-111111111111";
+const SUGGESTION = "22222222-2222-4222-8222-222222222222";
+const AUTOSAVE_DEBOUNCE_MS = 2000;
+
+const account = makeAccount({
+	accountId: ACCOUNT_ID,
+	email: "me@example.com",
+	username: "me@example.com",
+	smtpUsername: "me@example.com",
+});
+
+const inbox = makeMailbox({
+	mailboxId: MAILBOX_ID,
+	accountId: ACCOUNT_ID,
+	fullPath: "INBOX",
+});
+
+const thread: RemitImapThreadMessageResponse = makeThreadMessage({
+	messageId: MESSAGE_ID,
+	threadId: THREAD_ID,
+	mailboxId: MAILBOX_ID,
+	accountId: ACCOUNT_ID,
+	subject: "Quarterly review",
+	fromName: "Organizer",
+	fromEmail: "organizer@example.test",
+	isRead: true,
+});
+
+const otherThread: RemitImapThreadMessageResponse = {
+	...thread,
+	messageId: OTHER_ID,
+};
+
+const describeMessage: RemitImapDescribeMessageResponse = {
+	message: {
+		messageId: MESSAGE_ID,
+		mailboxId: MAILBOX_ID,
+		uid: 1,
+		rfc822Size: 512,
+		internalDate: 1_767_225_600_000,
+		status: "active",
+		syncStatus: "pending",
+		abandonedMutation: "none",
+	},
+	envelope: {
+		messageId: MESSAGE_ID,
+		date: 1_767_225_600_000,
+		subject: "Quarterly review",
+		messageIdValue: "<review-1@example.test>",
+		from: [
+			{
+				addressId: "addr-organizer",
+				displayName: "Organizer",
+				normalizedEmail: "organizer@example.test",
+				addressRole: "from",
+				addressOrder: 0,
+			},
+		],
+		to: [
+			{
+				addressId: "addr-me",
+				normalizedEmail: "me@example.com",
+				addressRole: "to",
+				addressOrder: 0,
+			},
+		],
+		cc: [],
+		bcc: [],
+		replyTo: [],
+		category: "uncategorized",
+		senderTrust: "unknown",
+	},
+	flags: ["\\Seen"],
+	bodyParts: [],
+	references: [],
+};
+
+const calendars = [
+	{
+		calendarId: CALENDAR,
+		accountConfigId: "cfg-1",
+		urlSegment: "default",
+		displayName: "Personal",
+		color: "Cal2",
+		componentSet: "VeventOnly",
+		source: "Default",
+		timezone: "Europe/Amsterdam",
+		syncSequence: 1,
+		subscriptionUrl: "",
+		subscriptionEnabled: false,
+		subscriptionCheckedAt: 0,
+		subscriptionFetchedAt: 0,
+		subscriptionError: "",
+		createdAt: 0,
+		updatedAt: 0,
+	},
+] satisfies RemitImapCalendarResponse[];
+
+const invitation: RemitImapCalendarSuggestionResponse = {
+	suggestionId: SUGGESTION,
+	accountConfigId: "cfg-1",
+	messageId: MESSAGE_ID,
+	bodyPartId: "part-1",
+	icalUid: "uid-1",
+	sequence: 0,
+	method: "Request",
+	source: "IcalendarPart",
+	state: "Pending",
+	summary: "Quarterly review",
+	dtStart: "2026-09-01T08:00:00+00:00",
+	dtEnd: "2026-09-01T09:00:00+00:00",
+	allDay: false,
+	location: "",
+	organizer: "organizer@example.test",
+	zoneCertainty: "Explicit",
+	acceptedCalendarObjectId: "",
+	createdAt: 0,
+	updatedAt: 0,
+};
+
+const sender: IntelligenceData = {
+	sender: {
+		name: "Organizer",
+		email: "organizer@example.test",
+		trust: "wellknown",
+		firstSeenLabel: "Jan 2025",
+	},
+	authenticity: {
+		verdict: "aligned",
+		fromDomain: "example.test",
+		summary: "Signed by example.test.",
+	},
+	category: { value: "personal" },
+	similar: [],
+};
+
+let harness: DomHarness | undefined;
+let http: HttpMock | undefined;
+
+before(() => {
+	Object.defineProperty(Range.prototype, "getBoundingClientRect", {
+		value: () => ({
+			top: 0,
+			bottom: 0,
+			left: 0,
+			right: 0,
+			width: 0,
+			height: 0,
+			x: 0,
+			y: 0,
+		}),
+		configurable: true,
+	});
+});
+
+afterEach(() => {
+	harness?.close();
+	harness = undefined;
+	http?.restore();
+	http = undefined;
+});
+
+(globalThis as { self?: typeof globalThis }).self ??= globalThis;
+
+const MESSAGE_PATH = `/mail/${MAILBOX_ID}/${THREAD_ID}/${MESSAGE_ID}`;
+
+const describeOther: RemitImapDescribeMessageResponse = {
+	...describeMessage,
+	message: { ...describeMessage.message, messageId: OTHER_ID, uid: 2 },
+	envelope: {
+		...describeMessage.envelope,
+		messageId: OTHER_ID,
+		messageIdValue: "<review-2@example.test>",
+	},
+};
+
+const CalendarRail = ({
+	railThread,
+}: {
+	railThread: RemitImapThreadMessageResponse;
+}) => {
+	const calendar = useIntelligenceCalendar(railThread, useReplyWithText());
+	return createElement(IntelligencePanel, {
+		data: sender,
+		calendar: calendar.surface,
+		tab: calendar.tab,
+		onTabChange: calendar.onTabChange,
+	});
+};
+
+const Surface = ({
+	railThread,
+}: {
+	railThread: RemitImapThreadMessageResponse;
+}) =>
+	createElement(
+		ComposeProvider,
+		null,
+		createElement(ConversationView, {
+			threadId: THREAD_ID,
+			mailboxId: MAILBOX_ID,
+			subject: "Quarterly review",
+			selectedMessageId: MESSAGE_ID,
+		}),
+		createElement(CalendarRail, { railThread }),
+	);
+
+const savedDraft = {
+	outboxMessageId: DRAFT_ID,
+	accountId: ACCOUNT_ID,
+	fromAddress: "me@example.com",
+	toAddresses: ["organizer@example.test"],
+	ccAddresses: [],
+	bccAddresses: [],
+	attachments: [],
+	references: [],
+	subject: "Re: Quarterly review",
+	textBody: "See you then",
+	htmlBody: "<p>See you then</p>",
+	status: "draft",
+};
+
+const creates = (): HttpCall[] =>
+	(http?.calls ?? []).filter(
+		(call) => call.method === "POST" && call.path.endsWith("/outbox"),
+	);
+
+const mount = async (
+	href: string,
+	{
+		railThread = thread,
+		draftArrives = Promise.resolve(),
+	}: {
+		railThread?: RemitImapThreadMessageResponse;
+		draftArrives?: Promise<void>;
+	} = {},
+): Promise<{ mounted: DomHarness; router: AnyRouter; redraw: () => void }> => {
+	let saved: Record<string, unknown> = savedDraft;
+	http = mockFetch(async (call) => {
+		if (call.path.endsWith("/config")) return { accounts: [account] };
+		if (call.path.endsWith(`/accounts/${ACCOUNT_ID}/mailboxes`))
+			return { items: [inbox] };
+		if (call.path.endsWith(`/threads/${THREAD_ID}/messages`))
+			return { items: [thread, otherThread] };
+		if (call.path.endsWith(`/messages/${MESSAGE_ID}`)) return describeMessage;
+		if (call.path.endsWith(`/messages/${OTHER_ID}`)) return describeOther;
+		if (call.path.endsWith(`/messages/${OTHER_ID}/calendar-suggestions`))
+			return { items: [{ ...invitation, messageId: OTHER_ID }] };
+		if (call.path.endsWith("/calendars")) return { items: calendars };
+		if (call.path.endsWith(`/messages/${MESSAGE_ID}/calendar-suggestions`))
+			return { items: [invitation] };
+		if (call.method === "POST" && call.path.endsWith("/outbox")) {
+			saved = {
+				...savedDraft,
+				...(call.body as Record<string, unknown>),
+			};
+			return saved;
+		}
+		if (call.path.endsWith(`/outbox/${DRAFT_ID}`)) {
+			await draftArrives;
+			return saved;
+		}
+		return { items: [] };
+	});
+
+	const mounted = createDomHarness();
+	harness = mounted;
+	const router = createAppRouter(
+		mounted.queryClient,
+		noopTelemetry,
+		createMemoryHistory({ initialEntries: [href] }),
+	) as unknown as AnyRouter;
+	await router.load();
+	const redraw = () =>
+		mounted.renderApp(
+			createElement(RouterContextProvider, {
+				router,
+				// biome-ignore lint/correctness/noChildrenProp: RouterContextProvider types `children` as a required prop, which createElement's rest-argument form does not satisfy
+				children: createElement(Surface, { railThread }),
+			}),
+		);
+	redraw();
+	await mounted.waitFor(
+		() => mounted.text().includes("Offer other times"),
+		"the invitation card to be drawn",
+	);
+	return { mounted, router, redraw };
+};
+
+const drawnUntil = async (
+	mounted: DomHarness,
+	redraw: () => void,
+	predicate: () => boolean,
+	description: string,
+): Promise<void> => {
+	const deadline = Date.now() + 5000;
+	while (!predicate()) {
+		if (Date.now() > deadline)
+			throw new Error(`gave up waiting for ${description}`);
+		redraw();
+		await mounted.wait(50);
+	}
+};
+
+const composerText = (mounted: DomHarness): string =>
+	mounted.query("[data-testid=compose-body]")?.textContent ?? "";
+
+const plainBody = (mounted: DomHarness): HTMLTextAreaElement | null =>
+	mounted.query<HTMLTextAreaElement>("[data-testid=compose-body-plain]");
+
+const freeSlot = (mounted: DomHarness): HTMLElement | undefined =>
+	mounted
+		.queryAll("button[aria-pressed]")
+		.find((button) =>
+			/\d{2}:\d{2} – \d{2}:\d{2}/.test(button.textContent ?? ""),
+		);
+
+const pickAndReply = async (mounted: DomHarness): Promise<string> => {
+	mounted.click(mounted.byText("button", "Offer other times"));
+	await mounted.waitFor(
+		() => freeSlot(mounted) !== undefined,
+		"free half-hours to be offered",
+	);
+	const slot = freeSlot(mounted);
+	assert.ok(slot, "a free half-hour is offered");
+	const picked = (slot.textContent ?? "").trim();
+	mounted.click(slot);
+	await mounted.flush();
+	mounted.click(mounted.byText("button", "Reply with these times"));
+	return picked;
+};
+
+const seedInAddress = (router: AnyRouter): unknown =>
+	(router.state.location.search as Record<string, unknown>).body;
+
+describe("offering other times from an invitation", () => {
+	it("opens the reply with the picked times written into it", async () => {
+		const { mounted, router, redraw } = await mount(MESSAGE_PATH);
+
+		const picked = await pickAndReply(mounted);
+
+		await drawnUntil(
+			mounted,
+			redraw,
+			() => composerText(mounted).includes(picked),
+			"the picked time to be written into the reply",
+		);
+		assert.match(composerText(mounted), /September/);
+		assert.equal(router.state.location.pathname, `${MESSAGE_PATH}/reply`);
+
+		await mounted.wait(AUTOSAVE_DEBOUNCE_MS + 300);
+		await mounted.waitFor(
+			() => creates().length === 1,
+			"the reply to be saved as a draft",
+		);
+		const draft = creates()[0].body as { textBody?: string };
+		assert.ok(
+			draft.textBody?.includes(picked),
+			`the saved draft holds the picked time, got ${JSON.stringify(draft.textBody)}`,
+		);
+
+		await drawnUntil(
+			mounted,
+			redraw,
+			() => router.state.location.pathname.endsWith(`/reply/${DRAFT_ID}`),
+			"the address to adopt the draft",
+		);
+		assert.equal(
+			seedInAddress(router),
+			undefined,
+			"once the draft holds the times, the address no longer carries them",
+		);
+		await drawnUntil(
+			mounted,
+			redraw,
+			() => composerText(mounted).includes(picked),
+			"the composer to keep the times once the draft is adopted",
+		);
+	});
+
+	it("keeps what was typed when the times go into a reply already open", async () => {
+		const { mounted, router } = await mount(`${MESSAGE_PATH}/reply`);
+		await mounted.waitFor(
+			() => mounted.query("[data-testid=compose-mode-toggle]") !== null,
+			"the reply composer to open",
+			5000,
+		);
+		const toggle = mounted.query("[data-testid=compose-mode-toggle]");
+		assert.ok(toggle);
+		mounted.click(toggle);
+		await mounted.waitFor(
+			() => plainBody(mounted) !== null,
+			"the plain writing surface",
+		);
+		const typing = plainBody(mounted);
+		assert.ok(typing);
+		mounted.type(typing, "Hi");
+		await mounted.flush();
+
+		const picked = await pickAndReply(mounted);
+
+		await mounted.waitFor(
+			() => plainBody(mounted)?.value.includes(picked) === true,
+			"the picked time to go into the open reply",
+		);
+		assert.match(plainBody(mounted)?.value ?? "", /^Hi/);
+		assert.equal(router.state.location.pathname, `${MESSAGE_PATH}/reply`);
+		assert.equal(seedInAddress(router), undefined);
+	});
+
+	it("keeps an open reply-all a reply-all and adds the times to it", async () => {
+		const href = `${MESSAGE_PATH}/reply-all/${DRAFT_ID}`;
+		const { mounted, router } = await mount(href);
+		await mounted.waitFor(
+			() => composerText(mounted).includes("See you then"),
+			"the saved reply-all to reopen",
+			5000,
+		);
+
+		const picked = await pickAndReply(mounted);
+
+		await mounted.waitFor(
+			() => composerText(mounted).includes(picked),
+			"the picked time to go into the open reply-all",
+		);
+		assert.ok(composerText(mounted).includes("See you then"));
+		assert.equal(router.state.location.pathname, href);
+		assert.equal(seedInAddress(router), undefined);
+	});
+
+	it("adds the times to a forward of the same message already open", async () => {
+		const href = `${MESSAGE_PATH}/forward`;
+		const { mounted, router } = await mount(href);
+		await mounted.waitFor(
+			() => mounted.query("[data-testid=compose-body]") !== null,
+			"the forward to open",
+			5000,
+		);
+
+		const picked = await pickAndReply(mounted);
+
+		await mounted.waitFor(
+			() => composerText(mounted).includes(picked),
+			"the picked time to go into the open forward",
+		);
+		assert.equal(router.state.location.pathname, href);
+	});
+
+	it("opens a reply holding the times when the open reply answers another message", async () => {
+		const { mounted, router, redraw } = await mount(`${MESSAGE_PATH}/reply`, {
+			railThread: otherThread,
+		});
+		await mounted.waitFor(
+			() => mounted.query("[data-testid=compose-body]") !== null,
+			"the reply to the first message to open",
+			5000,
+		);
+
+		const picked = await pickAndReply(mounted);
+
+		await drawnUntil(
+			mounted,
+			redraw,
+			() => composerText(mounted).includes(picked),
+			"a reply to the other message holding the times",
+		);
+		assert.equal(
+			router.state.location.pathname,
+			`/mail/${MAILBOX_ID}/${THREAD_ID}/${OTHER_ID}/reply`,
+		);
+	});
+
+	it("adds the times on top of a draft still loading when they were picked", async () => {
+		let deliver = () => {};
+		const draftArrives = new Promise<void>((resolve) => {
+			deliver = resolve;
+		});
+		const { mounted } = await mount(`${MESSAGE_PATH}/reply-all/${DRAFT_ID}`, {
+			draftArrives,
+		});
+
+		const picked = await pickAndReply(mounted);
+		await mounted.wait(100);
+		deliver();
+
+		await mounted.waitFor(
+			() =>
+				composerText(mounted).includes("See you then") &&
+				composerText(mounted).includes(picked),
+			"the loaded draft to hold the picked time",
+			5000,
+		);
+	});
+});

package/src/hooks/intelligence-calendar.render.test.ts

@@ -218,25 +218,6 @@ describe("the invitation beside the open message", () => {
 		);
 	});
 
-	it("offers the picked times to select by hand where the page has no clipboard", async () => {
-		await mount(server(() => "Accepted"));
-		Object.defineProperty(navigator, "clipboard", {
-			value: undefined,
-			configurable: true,
-		});
-		press("Offer other times");
-		const slot = harness?.query("[aria-pressed]");
-		if (!slot) throw new Error("no slot offered");
-		harness?.click(slot);
-		press("Copy picked times");
-
-		await harness?.waitFor(
-			() => harness?.query('textarea[aria-label="Picked times"]') !== null,
-			"the times to be offered for selecting",
-		);
-		assert.match(harness?.text() ?? "", /can't copy for you/);
-	});
-
 	it("declines through the API", async () => {
 		await mount(server(() => "Declined"));
 		press("Decline");

package/src/hooks/useIntelligenceCalendar.ts

@@ -22,6 +22,7 @@ import {
 	calendarUnavailable,
 	calendarWriteGate,
 } from "@/components/calendar/CalendarUnavailable";
+import type { ReplyWithText } from "@/components/compose/reply-with-times";
 import {
 	calendarWindowOfDays,
 	deviceTimeZone,
@@ -57,7 +58,6 @@ interface Working {
 	tab: IntelligenceTabId | undefined;
 	offering: boolean;
 	picked: string[];
-	copy: "idle" | "copied" | "failed";
 	answering: string;
 	/** The card the last refusal was about, and what it said. */
 	failure: { suggestionId: string; text: string };
@@ -68,7 +68,6 @@ const fresh = (messageId: string): Working => ({
 	tab: undefined,
 	offering: false,
 	picked: [],
-	copy: "idle",
 	answering: "",
 	failure: { suggestionId: "", text: "" },
 });
@@ -92,6 +91,7 @@ export interface IntelligenceCalendar {
 
 export function useIntelligenceCalendar(
 	thread: RemitImapThreadMessageResponse,
+	replyWithText?: ReplyWithText,
 ): IntelligenceCalendar {
 	const messageId = thread.messageId;
 	const { suggestions, isLoading, error } =
@@ -238,7 +238,8 @@ export function useIntelligenceCalendar(
 			: "Couldn't read the invitations in this message. Reopen it to try again.";
 
 	const cancellation = invitation?.method === "Cancel";
-	const copyText = date === "" ? "" : slotsAsText(date, slots, working.picked);
+	const pickedText =
+		date === "" ? "" : slotsAsText(date, slots, working.picked);
 
 	const actions: IntelligenceCalendarActions = {
 		onAddInvite: () =>
@@ -272,24 +273,14 @@ export function useIntelligenceCalendar(
 		onOfferOtherTimes: () => update({ offering: true }),
 		onToggleSlot: (slot) =>
 			update({
-				copy: "idle",
 				picked: working.picked.includes(slot.startTime)
 					? working.picked.filter((start) => start !== slot.startTime)
 					: [...working.picked, slot.startTime],
 			}),
-		onCopySlots: () => {
-			// Outside a secure context — plain http on a tailnet host — the
-			// browser exposes no clipboard at all, so the absence is the failure.
-			const clipboard: Clipboard | undefined = navigator.clipboard;
-			if (!clipboard) {
-				update({ copy: "failed" });
-				return;
-			}
-			void Promise.resolve()
-				.then(() => clipboard.writeText(copyText))
-				.then(() => update({ copy: "copied" }))
-				.catch(() => update({ copy: "failed" }));
-		},
+		onReplyWithSlots: replyWithText
+			? () =>
+					replyWithText({ threadId: thread.threadId, messageId }, pickedText)
+			: undefined,
 		onAddSuggestion: (suggestionId) =>
 			answer(suggestionId, "add this to your calendar", () =>
 				answers.accept(suggestionId, defaultCalendarId),
@@ -334,8 +325,6 @@ export function useIntelligenceCalendar(
 								proposals: [],
 								slots,
 								picked: working.picked,
-								copy: working.copy,
-								copyText,
 							}
 						: undefined,
 				suggestions: deck,

package/src/lib/mail-search.ts

@@ -50,3 +50,20 @@ export const mailListSearchSchemas = {
 	"/mail/outbox": outboxSearchSchema,
 	"/mail/$mailboxId": mailboxSearchSchema,
 } as const;
+
+export const composeSeedSearch = z.object({ body: z.string().optional() });
+
+export type ComposeSeed = Required<z.infer<typeof composeSeedSearch>>;
+
+export const withoutComposeSeed = (
+	prev: Record<string, unknown>,
+): Record<string, unknown> => {
+	const { body: _seed, ...rest } = prev;
+	return rest;
+};
+
+export const replySearchSchemas = {
+	brief: briefSearchSchema.extend(composeSeedSearch.shape),
+	flagged: flaggedSearchSchema.extend(composeSeedSearch.shape),
+	mailbox: mailboxSearchSchema.extend(composeSeedSearch.shape),
+} as const;

package/src/routes/mail/$mailboxId/$threadId/$messageId/$mode.{-$outboxMessageId}.tsx

@@ -8,7 +8,8 @@
  * The conversation reads it off the address and opens it at its head.
  */
 import { createFileRoute } from "@tanstack/react-router";
+import { replySearchSchemas } from "@/lib/mail-search";
 
 export const Route = createFileRoute(
 	"/mail/$mailboxId/$threadId/$messageId/$mode/{-$outboxMessageId}",
-)({});
+)({ validateSearch: replySearchSchemas.mailbox });

package/src/routes/mail/brief/$threadId/$messageId/$mode.{-$outboxMessageId}.tsx

@@ -20,7 +20,8 @@
  * the pane reads the reply off the address, the way the shell reads compose.
  */
 import { createFileRoute } from "@tanstack/react-router";
+import { replySearchSchemas } from "@/lib/mail-search";
 
 export const Route = createFileRoute(
 	"/mail/brief/$threadId/$messageId/$mode/{-$outboxMessageId}",
-)({});
+)({ validateSearch: replySearchSchemas.brief });

package/src/routes/mail/flagged/$threadId/$messageId/$mode.{-$outboxMessageId}.tsx

@@ -8,7 +8,8 @@
  * The conversation reads it off the address and opens it at its head.
  */
 import { createFileRoute } from "@tanstack/react-router";
+import { replySearchSchemas } from "@/lib/mail-search";
 
 export const Route = createFileRoute(
 	"/mail/flagged/$threadId/$messageId/$mode/{-$outboxMessageId}",
-)({});
+)({ validateSearch: replySearchSchemas.flagged });

package/src/routing/compose.ts

@@ -1,5 +1,6 @@
 import { useNavigate, useParams } from "@tanstack/react-router";
 import { useCallback } from "react";
+import { withoutComposeSeed } from "@/lib/mail-search";
 import { useBrowsedList, useNavigateToBrowsedList } from "./browsed-list";
 import { useRetainOpenPanels } from "./fragment";
 
@@ -108,7 +109,7 @@ function useComposeNavigate(): (
 		) => {
 			navigate({
 				...composeTarget(list, mailboxId, outboxMessageId),
-				search: (prev: Record<string, unknown>) => prev,
+				search: withoutComposeSeed,
 				// Opening or closing the surface is going somewhere, so the panes the
 				// reader keeps up travel and the overlays they were reading over do
 				// not. Recording the draft is not going anywhere — the address is

package/src/routing/outbox-draft.ts

@@ -1,5 +1,6 @@
 import { useNavigate, useParams } from "@tanstack/react-router";
 import { useCallback } from "react";
+import { withoutComposeSeed } from "@/lib/mail-search";
 import { useNavigateToBrowsedList } from "./browsed-list";
 import { useRetainOpenPanels } from "./fragment";
 
@@ -29,7 +30,7 @@ export function useOpenOutboxDraft(): (outboxMessageId: string) => void {
 			navigate({
 				to: "/mail/outbox/draft/$outboxMessageId",
 				params: { outboxMessageId },
-				search: (prev: Record<string, unknown>) => prev,
+				search: withoutComposeSeed,
 				hash: retainPanels,
 			});
 		},

package/src/routing/reply.ts

@@ -1,7 +1,8 @@
-import { useNavigate, useParams } from "@tanstack/react-router";
+import { useNavigate, useParams, useSearch } from "@tanstack/react-router";
 import { useCallback, useMemo } from "react";
 import { z } from "zod";
 import type { MailListRoute } from "@/lib/mail-route";
+import { type ComposeSeed, withoutComposeSeed } from "@/lib/mail-search";
 import { useBrowsedList } from "./browsed-list";
 import { useRetainOpenPanels } from "./fragment";
 
@@ -53,6 +54,7 @@ export interface ReplyAddress {
 	sourceMessageId: string;
 	/** The draft it writes to, once the first autosave has made one. */
 	outboxMessageId: string | undefined;
+	seed: ComposeSeed | undefined;
 }
 
 export type ReplySurface =
@@ -79,6 +81,20 @@ function useReplyParams(): ReplyParams | undefined {
 	return brief ?? flagged ?? mailbox;
 }
 
+function useReplySeed(): string | undefined {
+	const brief = useSearch({ from: BRIEF_REPLY, shouldThrow: false });
+	const flagged = useSearch({ from: FLAGGED_REPLY, shouldThrow: false });
+	const mailbox = useSearch({ from: MAILBOX_REPLY, shouldThrow: false });
+	return (brief ?? flagged ?? mailbox)?.body;
+}
+
+const seededSearch =
+	(seed: ComposeSeed | undefined) =>
+	(prev: Record<string, unknown>): Record<string, unknown> =>
+		seed === undefined
+			? withoutComposeSeed(prev)
+			: { ...withoutComposeSeed(prev), body: seed.body };
+
 /**
  * The reply surface the address names, or none.
  *
@@ -89,6 +105,7 @@ function useReplyParams(): ReplyParams | undefined {
  */
 export function useReplySurface(): ReplySurface | undefined {
 	const params = useReplyParams();
+	const seedBody = useReplySeed();
 	return useMemo(() => {
 		if (!params) return undefined;
 		const mode = replyModeSchema.safeParse(params.mode);
@@ -99,8 +116,9 @@ export function useReplySurface(): ReplySurface | undefined {
 			threadId: params.threadId,
 			sourceMessageId: params.messageId,
 			outboxMessageId: params.outboxMessageId,
+			seed: seedBody === undefined ? undefined : { body: seedBody },
 		};
-	}, [params]);
+	}, [params, seedBody]);
 }
 
 /**
@@ -183,17 +201,25 @@ function inheritedDraft(
  * A push, so Back leaves the reply and returns the message it was written
  * under, and the query travels with it.
  */
-export function useOpenReply(): (target: ReplyTarget) => void {
+export function useOpenReply(): (
+	target: ReplyTarget,
+	seed?: ComposeSeed,
+) => void {
 	const navigate = useNavigate();
 	const retainPanels = useRetainOpenPanels();
 	const { list, mailboxId } = useBrowsedList();
 	const open = useReplySurface();
 
 	return useCallback(
-		(target: ReplyTarget) => {
+		(target: ReplyTarget, seed?: ComposeSeed) => {
 			navigate({
-				...replyTarget(list, mailboxId, target, inheritedDraft(open, target)),
-				search: (prev: Record<string, unknown>) => prev,
+				...replyTarget(
+					list,
+					mailboxId,
+					target,
+					seed === undefined ? inheritedDraft(open, target) : undefined,
+				),
+				search: seededSearch(seed),
 				hash: retainPanels,
 			});
 		},
@@ -254,7 +280,7 @@ export function useAdoptReplyDraft(): (outboxMessageId: string) => void {
 					},
 					outboxMessageId,
 				),
-				search: (prev: Record<string, unknown>) => prev,
+				search: seededSearch(undefined),
 				hash: true,
 				replace: true,
 			});
@@ -278,7 +304,7 @@ export function useCloseReply(): () => void {
 
 	return useCallback(() => {
 		if (!params) return;
-		const search = (prev: Record<string, unknown>) => prev;
+		const search = seededSearch(undefined);
 		const hash = retainPanels;
 		const message = { threadId: params.threadId, messageId: params.messageId };
 		if (list === "flagged") {