@remit/web-client 0.0.185 → 0.0.187

package/src/components/mail/ThreadListInteraction.test.ts

@@ -6,13 +6,22 @@
  * their headers, so what the consumer passed and what is rendered are different
  * lists. These cases mount rows directly and change them, which is the same
  * thing from the provider's point of view.
+ *
+ * The confirmation is worded from the folder the row is actually filed in
+ * (#855): this list spans mailboxes and accounts, and deleting mail that is
+ * already in Trash expunges it on the server rather than moving it.
  */
 import assert from "node:assert/strict";
 import { after, afterEach, before, beforeEach, describe, it } from "node:test";
-import type { Verb } from "@remit/ui";
+import { configOperationsGetConfigQueryKey } from "@remit/api-http-client/@tanstack/react-query.gen.ts";
+import type { ThreadRowData, Verb } from "@remit/ui";
+import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
 import type { JSDOM } from "jsdom";
 import { act, createElement, createRef, useState } from "react";
 import { createRoot, type Root } from "react-dom/client";
+import { AuthProviderProvider, noneAuthProvider } from "@/auth/provider";
+import { ErrorBannerProvider } from "@/components/ui/ErrorBannerProvider";
+import { makeAccount, makeConfig } from "@/test-support/fixtures";
 import type { MessageListCommands } from "./MessageList";
 import {
 	ThreadListInteraction,
@@ -57,6 +66,39 @@ afterEach(() => {
 	act(() => root.unmount());
 });
 
+const TRASH_MAILBOX_ID = "mbx-trash";
+
+const row = (id: string, mailboxId = "mbx-inbox"): ThreadRowData => ({
+	id,
+	accountId: "acc-1",
+	mailboxId,
+	threadId: `t-${id}`,
+	fromName: "Alice",
+	fromEmail: "alice@example.com",
+	subject: "Quarterly report",
+	snippet: "",
+	timeLabel: "9:42",
+});
+
+/**
+ * A client that already holds the account's folder appointments, so the
+ * confirmation's outcome is settled on the first render rather than arriving a
+ * frame later.
+ */
+const seededClient = (trashMailboxId: string): QueryClient => {
+	const client = new QueryClient();
+	client.setQueryData(
+		configOperationsGetConfigQueryKey(),
+		makeConfig([
+			makeAccount({
+				accountId: "acc-1",
+				folderAppointments: [{ role: "Trash", mailboxId: trashMailboxId }],
+			}),
+		]),
+	);
+	return client;
+};
+
 const rowElements = (ids: string[]) =>
 	ids.map((id) =>
 		createElement("button", { key: id, type: "button", "data-message-id": id }),
@@ -68,26 +110,44 @@ const rowElements = (ids: string[]) =>
  */
 function mountList(options: {
 	initialIds: string[];
+	rows?: readonly ThreadRowData[];
+	client?: QueryClient;
 	onDeleteMessages?: (ids: string[]) => void;
 	onSelectionVerb?: (verb: Verb) => void;
 }) {
 	const onDeleteMessages = options.onDeleteMessages ?? (() => undefined);
 	const onSelectionVerb = options.onSelectionVerb ?? (() => undefined);
+	const rows = options.rows ?? options.initialIds.map((id) => row(id));
+	const client = options.client ?? seededClient(TRASH_MAILBOX_ID);
+	const authProvider = noneAuthProvider;
 	const commandsRef = createRef<MessageListCommands | null>();
 	let setIds: ((ids: string[]) => void) | undefined;
 	const Harness = () => {
 		const [ids, set] = useState(options.initialIds);
 		setIds = set;
 		return createElement(
-			ThreadListInteraction,
-			{
-				selectedMessageId: undefined,
-				onOpen: () => undefined,
-				onDeleteMessages,
-				onSelectionVerb,
-				commandsRef,
-			},
-			...rowElements(ids),
+			AuthProviderProvider,
+			{ value: authProvider },
+			createElement(
+				QueryClientProvider,
+				{ client },
+				createElement(
+					ErrorBannerProvider,
+					null,
+					createElement(
+						ThreadListInteraction,
+						{
+							selectedMessageId: undefined,
+							rows,
+							onOpen: () => undefined,
+							onDeleteMessages,
+							onSelectionVerb,
+							commandsRef,
+						},
+						...rowElements(ids),
+					),
+				),
+			),
 		);
 	};
 	act(() => root.render(createElement(Harness)));
@@ -271,6 +331,111 @@ describe("ThreadListInteraction — delete confirms first", () => {
 	});
 });
 
+/**
+ * Issue #855. Flagged and the brief span mailboxes, so a row here can already
+ * be in its account's Trash — where the same keypress is an IMAP expunge, not a
+ * move. The confirmation used to promise "Move to Trash" over every one of
+ * them, collecting an answer to a question the user was never asked.
+ */
+describe("ThreadListInteraction — the confirmation states the outcome it will produce", () => {
+	const dialogText = (): string => dom.window.document.body.textContent ?? "";
+
+	const askDelete = (list: ReturnType<typeof mountList>) => {
+		act(() => list.commands().focusFirst());
+		act(() => {
+			list.commands().requestVerb("delete");
+		});
+	};
+
+	it("asks a row already in Trash as a permanent delete", () => {
+		const list = mountList({
+			initialIds: ["m1", "m2"],
+			rows: [row("m1", TRASH_MAILBOX_ID), row("m2")],
+		});
+
+		askDelete(list);
+
+		const text = dialogText();
+		assert.match(text, /Permanently delete 1 message\?/);
+		assert.match(text, /cannot be restored/);
+		assert.doesNotMatch(
+			text,
+			/Move 1 message to Trash\?/,
+			"a move is not what this delete does",
+		);
+	});
+
+	it("still offers the reversible move for a row filed outside Trash", () => {
+		const list = mountList({
+			initialIds: ["m1"],
+			rows: [row("m1")],
+		});
+
+		askDelete(list);
+
+		assert.match(dialogText(), /Move 1 message to Trash\?/);
+		assert.match(dialogText(), /restore them from Trash later/);
+	});
+
+	it("refuses a row with no account the same way", () => {
+		const deleted: string[][] = [];
+		const list = mountList({
+			initialIds: ["m1"],
+			rows: [{ ...row("m1"), accountId: undefined }],
+			onDeleteMessages: (ids) => deleted.push(ids),
+		});
+
+		act(() => list.commands().focusFirst());
+		act(() => {
+			assert.equal(list.commands().requestVerb("delete"), true);
+		});
+
+		assert.match(dialogText(), /Couldn.t delete this message/);
+		assert.deepEqual(deleted, []);
+	});
+
+	it("refuses a row it cannot place instead of opening a dialog nobody can answer", () => {
+		const deleted: string[][] = [];
+		const list = mountList({
+			initialIds: ["m1"],
+			rows: [],
+			onDeleteMessages: (ids) => deleted.push(ids),
+		});
+
+		act(() => list.commands().focusFirst());
+		act(() => {
+			assert.equal(
+				list.commands().requestVerb("delete"),
+				true,
+				"the press is still claimed — handing it back runs the pane’s own unconfirmed delete",
+			);
+		});
+
+		const text = dialogText();
+		assert.match(text, /Couldn.t delete this message/);
+		assert.match(text, /Nothing was deleted/);
+		assert.ok(
+			Array.from(
+				dom.window.document.querySelectorAll<HTMLAnchorElement>("a"),
+			).some((link) => link.textContent === "Reload the list"),
+			"the refusal offers the control its own sentence names",
+		);
+		assert.doesNotMatch(
+			text,
+			/Checking where this account files deleted mail/,
+			"no load is happening, so nothing may claim one is",
+		);
+		assert.equal(
+			Array.from(
+				dom.window.document.querySelectorAll<HTMLButtonElement>("button"),
+			).some((button) => button.textContent === "Move to Trash"),
+			false,
+			"and no confirmation stands behind the refusal",
+		);
+		assert.deepEqual(deleted, [], "nothing is deleted by a refusal");
+	});
+});
+
 /**
  * A background refresh drops the ids that left and keeps every survivor — the
  * same intersect-on-refresh guarantee `useSelection.test.ts` locks for the pure
@@ -280,6 +445,8 @@ describe("ThreadListInteraction — delete confirms first", () => {
  */
 function mountSelectableList(initialIds: string[]) {
 	const commandsRef = createRef<MessageListCommands | null>();
+	const client = seededClient(TRASH_MAILBOX_ID);
+	const authProvider = noneAuthProvider;
 	let setIds: ((ids: string[]) => void) | undefined;
 	let selected: string[] = [];
 	const Probe = () => {
@@ -291,16 +458,29 @@ function mountSelectableList(initialIds: string[]) {
 		const [ids, set] = useState(initialIds);
 		setIds = set;
 		return createElement(
-			ThreadListInteraction,
-			{
-				selectedMessageId: undefined,
-				onOpen: () => undefined,
-				onDeleteMessages: () => undefined,
-				onSelectionVerb: () => undefined,
-				commandsRef,
-			},
-			...rowElements(ids),
-			createElement(Probe, { key: "probe" }),
+			AuthProviderProvider,
+			{ value: authProvider },
+			createElement(
+				QueryClientProvider,
+				{ client },
+				createElement(
+					ErrorBannerProvider,
+					null,
+					createElement(
+						ThreadListInteraction,
+						{
+							selectedMessageId: undefined,
+							rows: initialIds.map((id) => row(id)),
+							onOpen: () => undefined,
+							onDeleteMessages: () => undefined,
+							onSelectionVerb: () => undefined,
+							commandsRef,
+						},
+						...rowElements(ids),
+						createElement(Probe, { key: "probe" }),
+					),
+				),
+			),
 		);
 	};
 	act(() => root.render(createElement(Harness)));

package/src/components/mail/ThreadListInteraction.tsx

@@ -17,8 +17,8 @@
  * verb acts on a message the user cannot see.
  */
 import {
-	ConfirmDialog,
 	SelectionTopBar,
+	type ThreadRowData,
 	useListCursor,
 	type Verb,
 } from "@remit/ui";
@@ -33,15 +33,27 @@ import {
 	useRef,
 	useState,
 } from "react";
+import { useErrorBanners } from "@/components/ui/ErrorBannerProvider";
+import { useDeleteOutcome } from "@/hooks/useDeleteOutcome";
 import { useFollowFocusOpen } from "@/hooks/useFollowFocusOpen";
 import { useIsDesktop } from "@/hooks/useMediaQuery";
 import type { TriageContextUpdate } from "@/hooks/useTriageLayer";
-import { formatDeleteToTrashTitle } from "@/lib/format";
+import type { DeleteTarget } from "@/lib/format";
 import { tabStopId } from "@/lib/list-focus";
 import { useListHeaderChrome } from "@/lib/list-header-chrome";
+import { DeleteConfirmDialog } from "./DeleteConfirmDialog";
 import type { MessageListCommands } from "./MessageList";
 import type { MessageRowSelection } from "./MessageRow";
 
+/** Nothing pending, as a stable identity so the outcome memo does not churn. */
+const NO_TARGETS: readonly DeleteTarget[] = [];
+
+interface PendingDelete {
+	ids: string[];
+	/** Where those rows were filed when the delete was asked for. */
+	targets: DeleteTarget[];
+}
+
 interface ThreadRowInteraction {
 	focused: boolean;
 	isTabStop: boolean;
@@ -147,6 +159,13 @@ export interface OpenMessageOptions {
 
 interface ThreadListInteractionProps {
 	selectedMessageId: string | undefined;
+	/**
+	 * The rows this list is showing. Read only to name the folder a row is
+	 * filed in, which is what decides whether deleting it moves it to Trash or
+	 * expunges it — this list spans mailboxes and accounts, so the answer is per
+	 * row and there is no route mailbox to take it from (#855).
+	 */
+	rows: readonly ThreadRowData[];
 	/** Opens a row — the same navigation a click performs. */
 	onOpen: (messageId: string, options?: OpenMessageOptions) => void;
 	/** Deletes a set of messages. Absent disables the delete key for this list. */
@@ -168,6 +187,7 @@ interface ThreadListInteractionProps {
 
 export function ThreadListInteraction({
 	selectedMessageId,
+	rows,
 	onOpen,
 	onDeleteMessages,
 	onSelectionVerb,
@@ -178,6 +198,7 @@ export function ThreadListInteraction({
 	children,
 }: ThreadListInteractionProps) {
 	const isDesktop = useIsDesktop();
+	const { pushError } = useErrorBanners();
 	const containerRef = useRef<HTMLDivElement>(null);
 	const orderedIds = useRenderedRowIds(containerRef);
 	const cursor = useListCursor({
@@ -255,11 +276,16 @@ export function ThreadListInteraction({
 		open: followOpen,
 	});
 
-	// Pending move-to-Trash for the row under the cursor, awaiting confirmation.
-	// The id is snapshotted at request time so a cursor move behind the dialog
-	// cannot retarget it. A delete over a selection is a bulk action and walks the
-	// wizard instead — the same contract the mailbox list's delete has.
-	const [pendingDelete, setPendingDelete] = useState<string[] | null>(null);
+	// Pending delete for the row under the cursor, awaiting confirmation. Both
+	// the id and the folder it is filed in are snapshotted at request time, so
+	// neither a cursor move nor a background refresh behind the dialog can
+	// retarget it or change the question it is asking. A delete over a selection
+	// is a bulk action and walks the wizard instead — the same contract the
+	// mailbox list's delete has.
+	const [pendingDelete, setPendingDelete] = useState<PendingDelete | null>(
+		null,
+	);
+	const deleteOutcome = useDeleteOutcome(pendingDelete?.targets ?? NO_TARGETS);
 
 	// A verb, routed the same way the bar routes its own (#477 1.4, #508). Over a
 	// selection every verb opens the wizard, so the keyboard cannot reach a bulk
@@ -276,15 +302,42 @@ export function ThreadListInteraction({
 				return true;
 			}
 			if (verb !== "delete" || !focusedMessageId) return false;
-			setPendingDelete([focusedMessageId]);
+			// A row this list cannot place is a row whose delete cannot be worded,
+			// and a confirmation nobody can answer is worse than no confirmation.
+			// The press is still claimed — handing it back runs the pane's own
+			// unconfirmed delete — and the refusal is said out loud, with the one
+			// control that can actually change the answer.
+			const pending = rows.find((row) => row.id === focusedMessageId);
+			if (!pending?.mailboxId || !pending.accountId) {
+				pushError({
+					title: "Couldn't delete this message",
+					detail:
+						"This list has lost track of which account and folder it is in, so reader can't tell whether deleting it would move it to Trash or erase it. Nothing was deleted.",
+					action: { label: "Reload the list", href: window.location.href },
+				});
+				return true;
+			}
+			setPendingDelete({
+				ids: [focusedMessageId],
+				targets: [
+					{ accountId: pending.accountId, mailboxId: pending.mailboxId },
+				],
+			});
 			return true;
 		},
-		[pendingDelete, selectedCount, onSelectionVerb, focusedMessageId],
+		[
+			pendingDelete,
+			selectedCount,
+			onSelectionVerb,
+			focusedMessageId,
+			rows,
+			pushError,
+		],
 	);
 
 	const confirmDelete = useCallback(() => {
 		if (pendingDelete === null) return;
-		onDeleteMessages(pendingDelete);
+		onDeleteMessages(pendingDelete.ids);
 		setPendingDelete(null);
 		exitSelection();
 	}, [pendingDelete, onDeleteMessages, exitSelection]);
@@ -416,13 +469,11 @@ export function ThreadListInteraction({
 			<div ref={containerRef} className="contents">
 				{children}
 			</div>
-			<ConfirmDialog
+			<DeleteConfirmDialog
 				isOpen={confirmOpen}
-				title={formatDeleteToTrashTitle(pendingDelete?.length ?? 0)}
-				description="You can restore them from Trash later."
-				confirmLabel="Move to Trash"
-				destructive
-				isBusy={isDeleting}
+				count={pendingDelete?.ids.length ?? 0}
+				outcome={deleteOutcome}
+				isDeleting={isDeleting}
 				onConfirm={confirmDelete}
 				onCancel={cancelDelete}
 			/>

package/src/hooks/useArchiveMailbox.ts

@@ -81,15 +81,45 @@ export const useJunkMailbox = (
 };
 
 /**
- * Returns the account's appointed Trash mailbox id. The delete confirmation
- * needs it to tell a move-to-Trash apart from a delete inside Trash, which is
- * an unrecoverable expunge and has to be asked as one (#845).
+ * Each account's appointed Trash mailbox, keyed by account. The delete
+ * confirmation needs it to tell a move-to-Trash apart from a delete inside
+ * Trash, which is an unrecoverable expunge and has to be asked as one (#845),
+ * and apart from an account that appoints no Trash at all, where the server
+ * refuses the delete outright (#846).
+ *
+ * A map rather than a set of ids, because the brief and Flagged answer for
+ * selections that span accounts (#855): "is this row in Trash" is a question
+ * about the row's own account, and "does any Trash exist" has to be answerable
+ * as "no" rather than as silence.
+ *
+ * `hasAppointments` is data presence, never `!isLoading`. React Query v5
+ * computes `isLoading` as `isPending && isFetching`, so an offline query is
+ * paused and reports neither loading nor error while `data` is still
+ * undefined — which read as "no Trash anywhere", and promised a reversible
+ * move over an expunge that would replay on reconnect.
  */
-export const useTrashMailbox = (
-	accountId: string | undefined,
-): { trashMailboxId: string | undefined; isLoading: boolean } => {
-	const { mailboxId, isLoading } = useFolderRoleMailbox(accountId, "Trash");
-	return { trashMailboxId: mailboxId, isLoading };
+export const useTrashByAccount = (): {
+	trashByAccount: ReadonlyMap<string, string | undefined>;
+	hasAppointments: boolean;
+	isError: boolean;
+} => {
+	const { data: config, isError } = useQuery({
+		...configOperationsGetConfigOptions(),
+		staleTime: Infinity,
+	});
+
+	const trashByAccount = useMemo(() => {
+		const byAccount = new Map<string, string | undefined>();
+		for (const account of config?.accounts ?? []) {
+			byAccount.set(
+				account.accountId,
+				account.folderAppointments.find((fa) => fa.role === "Trash")?.mailboxId,
+			);
+		}
+		return byAccount;
+	}, [config]);
+
+	return { trashByAccount, hasAppointments: config !== undefined, isError };
 };
 
 /**

package/src/hooks/useDeleteMessages.ts

@@ -16,7 +16,8 @@ import {
 	patchThreadListQueries,
 	restoreThreadListQueries,
 	snapshotThreadListQueries,
-	type ThreadListSnapshotEntry,
+	type ThreadMessagesData,
+	type ThreadMutationContext,
 	threadListCacheKeys,
 } from "@/lib/thread-list-cache";
 
@@ -39,23 +40,6 @@ interface UseDeleteMessagesOptions {
 	onAfterOptimisticRemove?: (messageIds: string[]) => void;
 }
 
-interface ThreadMessagesData {
-	items: RemitImapThreadMessageResponse[];
-	[key: string]: unknown;
-}
-
-interface SnapshotEntry<T> {
-	queryKey: readonly unknown[];
-	data: T;
-}
-
-interface DeleteContext {
-	threadMessagesPrefix: readonly unknown[];
-	listPrefixes: ReadonlyArray<readonly unknown[]>;
-	previousThreadMessages: SnapshotEntry<ThreadMessagesData>[];
-	previousThreadsList: ThreadListSnapshotEntry[];
-}
-
 /**
  * Pure helper: drop the messages in `messageIds` from a single page's items.
  *
@@ -94,7 +78,7 @@ export const useDeleteMessages = ({
 
 	const { mutateAsync, isPending } = useMutation({
 		...messageBulkOperationsDeleteMessagesMutation(),
-		onMutate: async (variables): Promise<DeleteContext> => {
+		onMutate: async (variables): Promise<ThreadMutationContext> => {
 			const messageIds = new Set(variables.body.messageIds ?? []);
 
 			const threadMessagesPrefix = threadId

package/src/hooks/useDeleteOutcome.ts

@@ -0,0 +1,35 @@
+/**
+ * What a delete is about to do to a specific set of rows — the one derivation
+ * every delete confirmation words itself from (#845, #855).
+ *
+ * `MessageMoveService.deleteMessages` moves a message to its account's Trash
+ * unless it is already there, in which case the same keypress is an IMAP
+ * expunge and nothing survives it; and it refuses the call outright when the
+ * account appoints no Trash. That branch is per message and per account, not
+ * per view, so the mailbox list, the brief and Flagged all have to ask it of
+ * the rows they are actually about to delete — the brief and Flagged hold rows
+ * from several mailboxes and several accounts at once.
+ *
+ * The decision itself is `deleteOutcomeFor`, kept pure in `lib/format`; this is
+ * only the read that feeds it.
+ */
+import { useMemo } from "react";
+import {
+	type DeleteOutcome,
+	type DeleteTarget,
+	deleteOutcomeFor,
+} from "@/lib/format";
+import { useTrashByAccount } from "./useArchiveMailbox";
+
+/** The outcome of deleting `targets`. */
+export const useDeleteOutcome = (
+	targets: readonly DeleteTarget[],
+): DeleteOutcome => {
+	const { trashByAccount, hasAppointments, isError } = useTrashByAccount();
+
+	return useMemo(
+		() =>
+			deleteOutcomeFor({ targets, trashByAccount, hasAppointments, isError }),
+		[targets, trashByAccount, hasAppointments, isError],
+	);
+};

package/src/hooks/useMarkAsRead.ts

@@ -16,7 +16,8 @@ import {
 	patchThreadListQueries,
 	restoreThreadListQueries,
 	snapshotThreadListQueries,
-	type ThreadListSnapshotEntry,
+	type ThreadMessagesData,
+	type ThreadMutationContext,
 	threadListCacheKeys,
 } from "@/lib/thread-list-cache";
 
@@ -28,23 +29,6 @@ interface UseMarkAsReadOptions {
 	accountId?: string;
 }
 
-interface ThreadMessagesData {
-	items: RemitImapThreadMessageResponse[];
-	[key: string]: unknown;
-}
-
-interface SnapshotEntry<T> {
-	queryKey: readonly unknown[];
-	data: T;
-}
-
-interface MarkAsReadContext {
-	threadMessagesPrefix: readonly unknown[];
-	listPrefixes: ReadonlyArray<readonly unknown[]>;
-	previousThreadMessages: SnapshotEntry<ThreadMessagesData>[];
-	previousThreadsList: ThreadListSnapshotEntry[];
-}
-
 /**
  * Dwell before a message the user is viewing is marked read. A glance closed
  * within this window leaves it unread (#140). Applied by the single shared
@@ -145,7 +129,7 @@ export const useMarkAsRead = ({
 	const { mutate: markAsRead } = useMutation({
 		...messageBulkOperationsUpdateFlagsMutation(),
 		meta: softErrorMeta,
-		onMutate: async (variables): Promise<MarkAsReadContext> => {
+		onMutate: async (variables): Promise<ThreadMutationContext> => {
 			const messageIds = new Set(variables.body.messageIds ?? []);
 			const isRead = variables.body.isRead ?? true;
 

package/src/hooks/useMoveMessages.ts

@@ -15,7 +15,8 @@ import {
 	patchThreadListQueries,
 	restoreThreadListQueries,
 	snapshotThreadListQueries,
-	type ThreadListSnapshotEntry,
+	type ThreadMessagesData,
+	type ThreadMutationContext,
 	threadListCacheKeys,
 } from "@/lib/thread-list-cache";
 
@@ -31,23 +32,6 @@ interface UseMoveMessagesOptions {
 	onAfterOptimisticRemove?: (messageIds: string[]) => void;
 }
 
-interface ThreadMessagesData {
-	items: RemitImapThreadMessageResponse[];
-	[key: string]: unknown;
-}
-
-interface SnapshotEntry<T> {
-	queryKey: readonly unknown[];
-	data: T;
-}
-
-interface MoveContext {
-	threadMessagesPrefix: readonly unknown[];
-	listPrefixes: ReadonlyArray<readonly unknown[]>;
-	previousThreadMessages: SnapshotEntry<ThreadMessagesData>[];
-	previousThreadsList: ThreadListSnapshotEntry[];
-}
-
 /**
  * Pure helper: drop the messages in `messageIds` from a single page's items.
  *
@@ -73,7 +57,7 @@ export const useMoveMessages = ({
 
 	const { mutateAsync, isPending, isError } = useMutation({
 		...messageBulkOperationsMoveMessagesMutation(),
-		onMutate: async (variables): Promise<MoveContext> => {
+		onMutate: async (variables): Promise<ThreadMutationContext> => {
 			const messageIds = new Set(variables.body.messageIds ?? []);
 
 			const threadMessagesPrefix = threadId

package/src/hooks/useToggleStar.ts

@@ -13,7 +13,8 @@ import {
 	patchThreadListQueries,
 	restoreThreadListQueries,
 	snapshotThreadListQueries,
-	type ThreadListSnapshotEntry,
+	type ThreadMessagesData,
+	type ThreadMutationContext,
 	threadListCacheKeys,
 } from "@/lib/thread-list-cache";
 
@@ -48,23 +49,6 @@ export const resolveMailboxForMessage = (
 	messages?.find((message) => message.messageId === messageId)?.mailboxId ??
 	fallbackMailboxId;
 
-interface ThreadMessagesData {
-	items: RemitImapThreadMessageResponse[];
-	[key: string]: unknown;
-}
-
-interface SnapshotEntry<T> {
-	queryKey: readonly unknown[];
-	data: T;
-}
-
-interface ToggleStarContext {
-	threadMessagesPrefix: readonly unknown[];
-	listPrefixes: ReadonlyArray<readonly unknown[]>;
-	previousThreadMessages: SnapshotEntry<ThreadMessagesData>[];
-	previousThreadsList: ThreadListSnapshotEntry[];
-}
-
 export const toggleStarsInItems = (
 	items: RemitImapThreadMessageResponse[],
 	messageId: string,
@@ -84,7 +68,7 @@ export const useToggleStar = ({
 
 	const { mutate, isPending, variables } = useMutation({
 		...messageOperationsUpdateMessageFlagsMutation(),
-		onMutate: async (vars): Promise<ToggleStarContext> => {
+		onMutate: async (vars): Promise<ThreadMutationContext> => {
 			const messageId = vars.path.messageId;
 			const nextStarred = vars.body.isStarred ?? false;