@remit/web-client 0.0.94 → 0.0.96

package/src/hooks/useInitialSyncProgress.render.test.ts

@@ -26,12 +26,15 @@ import {
 
 let harness: DomHarness | undefined;
 let http: HttpMock | undefined;
+let restoreFetch: (() => void) | undefined;
 
 afterEach(() => {
 	harness?.close();
 	harness = undefined;
 	http?.restore();
 	http = undefined;
+	restoreFetch?.();
+	restoreFetch = undefined;
 });
 
 interface MailboxProgress {
@@ -72,22 +75,83 @@ const accountOf = (path: string): string => path.split("/")[2] ?? "";
 const progress = (dom: DomHarness): InitialSyncProgress =>
 	JSON.parse(dom.text());
 
-const mount = async (
+const UNKNOWN: InitialSyncProgress = {
+	syncing: false,
+	resolved: false,
+	synced: 0,
+	total: 0,
+};
+
+/** How long the hook gets to answer a request that is already in hand. */
+const RESOLVE_CEILING_MS = 2000;
+/** How long the hook is watched for an answer, or a request, it must not give. */
+const QUIET_WINDOW_MS = 500;
+const STEP_MS = 10;
+
+/**
+ * Let real time pass until the hook itself says `done`, or the ceiling runs out.
+ *
+ * Every wait in this file is a question put to the hook rather than a count of
+ * turns or a sleep the answer is assumed to fit inside: the poll and the answer
+ * deadline run on real timers, so a loaded machine changes how much work lands
+ * per turn, and the ceiling is what keeps a hook that never answers a failure
+ * instead of a hang.
+ */
+const settleUntil = async (
+	dom: DomHarness,
+	done: () => boolean,
+	ceilingMs: number,
+): Promise<void> => {
+	const deadline = Date.now() + ceilingMs;
+	for (;;) {
+		await dom.flush();
+		if (done() || Date.now() >= deadline) return;
+		await dom.wait(STEP_MS);
+	}
+};
+
+const mount = (
 	accountIds: string[],
 	answer: (accountId: string) => unknown,
 	enabled = true,
-): Promise<DomHarness> => {
+): DomHarness => {
 	http = mockFetch((call) => answer(accountOf(call.path)));
 	harness = createDomHarness();
 	harness.renderApp(createElement(Probe, { accountIds, enabled }));
-	// Settle on the hook's own answer rather than on a fixed number of turns:
-	// a query that lands on a timer instead of a microtask needs real time to
-	// pass, and a loaded machine is where that difference shows up.
-	for (let turn = 0; turn < 20; turn += 1) {
-		await harness.flush();
-		if (progress(harness).resolved) break;
-		await harness.wait(1);
-	}
+	return harness;
+};
+
+const mountResolved = async (
+	accountIds: string[],
+	answer: (accountId: string) => unknown,
+): Promise<DomHarness> => {
+	const dom = mount(accountIds, answer);
+	await settleUntil(dom, () => progress(dom).resolved, RESOLVE_CEILING_MS);
+	return dom;
+};
+
+/** `acc-2` never answers at all: its request is left hanging for good. */
+const mountSilentAccount = (
+	answerOfAccountOne: RemitImapAccountSyncStatusResponse,
+): DomHarness => {
+	const original = globalThis.fetch;
+	restoreFetch = () => {
+		globalThis.fetch = original;
+	};
+	globalThis.fetch = ((input: RequestInfo | URL) => {
+		const url = input instanceof Request ? input.url : String(input);
+		if (url.includes("acc-2")) return new Promise<Response>(() => {});
+		return Promise.resolve(
+			new Response(JSON.stringify(answerOfAccountOne), {
+				status: 200,
+				headers: { "content-type": "application/json" },
+			}),
+		);
+	}) as typeof globalThis.fetch;
+	harness = createDomHarness();
+	harness.renderApp(
+		createElement(Probe, { accountIds: ["acc-1", "acc-2"], enabled: true }),
+	);
 	return harness;
 };
 
@@ -112,7 +176,7 @@ describe("isSyncingPhase", () => {
 
 describe("useInitialSyncProgress", () => {
 	it("reports syncing with the counts of the accounts still syncing", async () => {
-		const dom = await mount(["acc-1"], (accountId) =>
+		const dom = await mountResolved(["acc-1"], (accountId) =>
 			status(accountId, "syncing_inbox", [
 				{ synced: 40, total: 100 },
 				{ synced: 10, total: 60 },
@@ -127,7 +191,7 @@ describe("useInitialSyncProgress", () => {
 	});
 
 	it("leaves out the counts of an account that has finished", async () => {
-		const dom = await mount(["acc-1", "acc-2"], (accountId) =>
+		const dom = await mountResolved(["acc-1", "acc-2"], (accountId) =>
 			accountId === "acc-1"
 				? status(accountId, "syncing_inbox", [{ synced: 40, total: 100 }])
 				: status(accountId, "complete", [{ synced: 900, total: 900 }]),
@@ -141,7 +205,7 @@ describe("useInitialSyncProgress", () => {
 	});
 
 	it("resolves to not-syncing once every account is done", async () => {
-		const dom = await mount(["acc-1", "acc-2"], (accountId) =>
+		const dom = await mountResolved(["acc-1", "acc-2"], (accountId) =>
 			status(accountId, "complete", [{ synced: 900, total: 900 }]),
 		);
 		assert.deepEqual(progress(dom), {
@@ -153,7 +217,7 @@ describe("useInitialSyncProgress", () => {
 	});
 
 	it("counts an unreachable account as answered rather than holding the list in limbo", async () => {
-		const dom = await mount(["acc-1", "acc-2"], (accountId) =>
+		const dom = await mountResolved(["acc-1", "acc-2"], (accountId) =>
 			accountId === "acc-1"
 				? status(accountId, "syncing_inbox", [{ synced: 5, total: 50 }])
 				: httpError(503),
@@ -167,39 +231,17 @@ describe("useInitialSyncProgress", () => {
 	it("knows nothing until every account has answered", async () => {
 		// One account answers, the other never does — the hook must not report on
 		// the half it has.
-		const original = globalThis.fetch;
-		try {
-			globalThis.fetch = ((input: RequestInfo | URL) => {
-				const url = input instanceof Request ? input.url : String(input);
-				if (url.includes("acc-2")) return new Promise<Response>(() => {});
-				return Promise.resolve(
-					new Response(
-						JSON.stringify(
-							status("acc-1", "syncing_inbox", [{ synced: 5, total: 50 }]),
-						),
-						{ status: 200, headers: { "content-type": "application/json" } },
-					),
-				);
-			}) as typeof globalThis.fetch;
-			harness = createDomHarness();
-			harness.renderApp(
-				createElement(Probe, { accountIds: ["acc-1", "acc-2"], enabled: true }),
-			);
-			await harness.flush();
-			await harness.flush();
-			assert.deepEqual(progress(harness), {
-				syncing: false,
-				resolved: false,
-				synced: 0,
-				total: 0,
-			});
-		} finally {
-			globalThis.fetch = original;
-		}
+		const dom = mountSilentAccount(
+			status("acc-1", "syncing_inbox", [{ synced: 5, total: 50 }]),
+		);
+
+		await settleUntil(dom, () => progress(dom).resolved, QUIET_WINDOW_MS);
+
+		assert.deepEqual(progress(dom), UNKNOWN);
 	});
 
 	it("answers immediately, and never syncing, for no accounts at all", async () => {
-		const dom = await mount([], () => ({}));
+		const dom = await mountResolved([], () => ({}));
 		assert.deepEqual(progress(dom), {
 			syncing: false,
 			resolved: true,
@@ -211,24 +253,28 @@ describe("useInitialSyncProgress", () => {
 
 	it("stops asking once every account has answered and none is syncing", async () => {
 		// The caught-up user's answer cannot change by being asked again.
-		const dom = await mount(["acc-1", "acc-2"], (accountId) =>
+		const dom = await mountResolved(["acc-1", "acc-2"], (accountId) =>
 			status(accountId, "complete"),
 		);
 		const asked = http?.calls.length ?? 0;
 		assert.equal(asked, 2);
 
-		await dom.wait(POLL_MS + 500);
+		await settleUntil(
+			dom,
+			() => (http?.calls.length ?? 0) > asked,
+			POLL_MS + QUIET_WINDOW_MS,
+		);
 
 		assert.equal(http?.calls.length, asked);
 		assert.equal(progress(dom).resolved, true);
 	});
 
 	it("keeps asking while an account is still syncing", async () => {
-		const dom = await mount(["acc-1"], (accountId) =>
+		const dom = await mountResolved(["acc-1"], (accountId) =>
 			status(accountId, "syncing_inbox", [{ synced: 5, total: 50 }]),
 		);
 
-		await dom.wait(POLL_MS + 500);
+		await settleUntil(dom, () => (http?.calls.length ?? 0) > 1, POLL_MS * 3);
 
 		assert.ok(
 			(http?.calls.length ?? 0) > 1,
@@ -237,50 +283,31 @@ describe("useInitialSyncProgress", () => {
 	});
 
 	it("answers without an account that never responds", async () => {
-		const original = globalThis.fetch;
-		try {
-			globalThis.fetch = ((input: RequestInfo | URL) => {
-				const url = input instanceof Request ? input.url : String(input);
-				if (url.includes("acc-2")) return new Promise<Response>(() => {});
-				return Promise.resolve(
-					new Response(JSON.stringify(status("acc-1", "complete")), {
-						status: 200,
-						headers: { "content-type": "application/json" },
-					}),
-				);
-			}) as typeof globalThis.fetch;
-			harness = createDomHarness();
-			harness.renderApp(
-				createElement(Probe, { accountIds: ["acc-1", "acc-2"], enabled: true }),
-			);
-			await harness.flush();
-			assert.equal(progress(harness).resolved, false);
-
-			await harness.wait(ANSWER_DEADLINE_MS + 500);
-
-			assert.deepEqual(progress(harness), {
-				syncing: false,
-				resolved: true,
-				synced: 0,
-				total: 0,
-			});
-		} finally {
-			globalThis.fetch = original;
-		}
-	});
+		const dom = mountSilentAccount(status("acc-1", "complete"));
 
-	it("asks nothing and claims nothing while disabled", async () => {
-		const dom = await mount(
-			["acc-1"],
-			() => status("acc-1", "syncing_inbox"),
-			false,
+		await settleUntil(dom, () => progress(dom).resolved, QUIET_WINDOW_MS);
+		assert.equal(progress(dom).resolved, false);
+
+		await settleUntil(
+			dom,
+			() => progress(dom).resolved,
+			ANSWER_DEADLINE_MS * 2,
 		);
+
 		assert.deepEqual(progress(dom), {
 			syncing: false,
-			resolved: false,
+			resolved: true,
 			synced: 0,
 			total: 0,
 		});
+	});
+
+	it("asks nothing and claims nothing while disabled", async () => {
+		const dom = mount(["acc-1"], () => status("acc-1", "syncing_inbox"), false);
+
+		await settleUntil(dom, () => progress(dom).resolved, QUIET_WINDOW_MS);
+
+		assert.deepEqual(progress(dom), UNKNOWN);
 		assert.deepEqual(http?.calls ?? [], []);
 	});
 });

package/src/hooks/useMatchSample.ts

@@ -1,7 +1,14 @@
-import { messageOperationsDescribeMessageOptions } from "@remit/api-http-client/@tanstack/react-query.gen.ts";
-import type { RemitImapDescribeMessageResponse } from "@remit/api-http-client/types.gen.ts";
+import {
+	messageOperationsDescribeMessageOptions,
+	threadOperationsSearchThreadsOptions,
+} from "@remit/api-http-client/@tanstack/react-query.gen.ts";
+import type {
+	RemitImapDescribeMessageResponse,
+	RemitImapThreadMessageResponse,
+} from "@remit/api-http-client/types.gen.ts";
 import { senderLabel, type WizardMessage } from "@remit/ui";
-import { useQueries } from "@tanstack/react-query";
+import { useQueries, useQuery } from "@tanstack/react-query";
+import type { EscalationSearchQuery } from "@/hooks/useEscalatedActions";
 import { formatEmailDate } from "@/lib/format";
 
 /**
@@ -44,6 +51,40 @@ const toWizardMessage = (
 	};
 };
 
+/**
+ * The members of an escalated predicate's match (#508). The predicate is the
+ * search the list is showing, so the search endpoint that resolved it is what
+ * names its members — one bounded request rather than the browser's own loaded
+ * rows, which stop at the page the list happens to have reached.
+ */
+export const useSearchMatchSample = (
+	mailboxId: string | undefined,
+	query: EscalationSearchQuery | undefined,
+): MatchSample => {
+	const enabled = mailboxId !== undefined && query !== undefined;
+	const { data, isLoading } = useQuery({
+		...threadOperationsSearchThreadsOptions({
+			path: { mailboxId: mailboxId ?? "" },
+			query: { ...query, limit: SAMPLE_LIMIT },
+		}),
+		enabled,
+		staleTime: 30_000,
+	});
+	return {
+		messages: (data?.items ?? []).map(toSearchWizardMessage),
+		isPending: enabled && isLoading,
+	};
+};
+
+const toSearchWizardMessage = (
+	row: RemitImapThreadMessageResponse,
+): WizardMessage => ({
+	id: row.messageId,
+	sender: row.fromName || row.fromEmail || "Unknown",
+	subject: row.subject ?? "(No subject)",
+	date: formatEmailDate(row.sentDate),
+});
+
 export const useMatchSample = (messageIds: readonly string[]): MatchSample =>
 	useQueries({
 		queries: messageIds.slice(0, SAMPLE_LIMIT).map((messageId) => ({

package/src/lib/bulk-action-copy.test.ts

@@ -5,7 +5,6 @@ import {
 	bulkActionCompletionText,
 	bulkActionFailureDetail,
 	bulkActionFailureTitle,
-	bulkActionPartialText,
 	bulkActionProgressLabel,
 	bulkActionProgressTone,
 } from "./bulk-action-copy.js";
@@ -46,23 +45,6 @@ describe("bulkActionCompletionText", () => {
 	});
 });
 
-describe("bulkActionPartialText", () => {
-	test("splits what landed from what is still selected", () => {
-		assert.equal(
-			bulkActionPartialText("delete", 3072, 340),
-			"3,072 moved to Trash. 340 couldn't be deleted.",
-		);
-		assert.equal(
-			bulkActionPartialText("move", 3072, 340),
-			"3,072 moved. 340 couldn't be moved.",
-		);
-		assert.equal(
-			bulkActionPartialText("markRead", 3072, 340),
-			"3,072 marked as read. 340 couldn't be marked as read.",
-		);
-	});
-});
-
 describe("bulkActionFailureTitle", () => {
 	test("reports where a partly-done run stopped", () => {
 		assert.equal(
@@ -87,7 +69,6 @@ describe("every action carries its own wording", () => {
 	test("no two actions share a sentence", () => {
 		const sentences: Array<(kind: BulkActionKind) => string> = [
 			(kind) => bulkActionCompletionText(kind, 5),
-			(kind) => bulkActionPartialText(kind, 5, 2),
 			(kind) => bulkActionFailureTitle(kind, 0),
 			(kind) => bulkActionFailureTitle(kind, 5),
 			bulkActionFailureDetail,

package/src/lib/bulk-action-copy.ts

@@ -59,14 +59,6 @@ export const bulkActionCompletionText = (
 ): string =>
 	`${formatNumber(done)} ${pastTense[kind]}. Your mail server is still catching up.`;
 
-/** Shown when part of a run landed and the rest is still selected for Retry. */
-export const bulkActionPartialText = (
-	kind: BulkActionKind,
-	succeeded: number,
-	remaining: number,
-): string =>
-	`${formatNumber(succeeded)} ${pastTense[kind]}. ${formatNumber(remaining)} ${negated[kind]}.`;
-
 /** Error-banner title for a run stopped by an infrastructure failure. */
 export const bulkActionFailureTitle = (
 	kind: BulkActionKind,

package/src/lib/bulk-actions.test.ts

@@ -6,7 +6,6 @@ import {
 	countMatches,
 	type FetchIdsPageResult,
 	honestProgress,
-	resolveSelectionAfterRun,
 	runChunkedAction,
 	runPredicateAction,
 } from "./bulk-actions.js";
@@ -355,65 +354,6 @@ describe("countMatches", () => {
 	});
 });
 
-describe("resolveSelectionAfterRun", () => {
-	test("a clean run with nothing failed exits selection mode", () => {
-		assert.deepEqual(
-			resolveSelectionAfterRun({
-				done: 3412,
-				failedIds: [],
-				cancelled: false,
-			}),
-			{ exit: true, retryIds: [] },
-		);
-	});
-
-	test("unreached ids stay selected for a precise retry, even alongside a clean stop", () => {
-		assert.deepEqual(
-			resolveSelectionAfterRun({
-				done: 3072,
-				failedIds: ["a", "b"],
-				cancelled: false,
-			}),
-			{ exit: false, retryIds: ["a", "b"] },
-		);
-	});
-
-	test("a clean cancel with nothing yet confirmed failed leaves nothing to retry, but does not exit", () => {
-		assert.deepEqual(
-			resolveSelectionAfterRun({
-				done: 100,
-				failedIds: [],
-				cancelled: true,
-			}),
-			{ exit: false, retryIds: [] },
-		);
-	});
-
-	test("an infra failure with nothing left unreached still keeps selection mode open", () => {
-		assert.deepEqual(
-			resolveSelectionAfterRun({
-				done: 0,
-				failedIds: [],
-				cancelled: false,
-				error: new Error("network blip"),
-			}),
-			{ exit: false, retryIds: [] },
-		);
-	});
-
-	test("failedIds wins over cancelled/error when both are present", () => {
-		assert.deepEqual(
-			resolveSelectionAfterRun({
-				done: 10,
-				failedIds: ["x"],
-				cancelled: true,
-				error: new Error("boom"),
-			}),
-			{ exit: false, retryIds: ["x"] },
-		);
-	});
-});
-
 describe("honestProgress", () => {
 	// Regression for #109: `countMatches` and `runPredicateAction` page the
 	// same predicate independently, so the delete can outrun the frozen

package/src/lib/bulk-actions.ts

@@ -275,29 +275,3 @@ export interface BulkRunOutcome {
 	cancelled: boolean;
 	error?: unknown;
 }
-
-export interface SelectionAfterRun {
-	/** The action reached everything targeted — selection mode should exit. */
-	exit: boolean;
-	/** The bounded selection to leave in place, empty when exiting. */
-	retryIds: string[];
-}
-
-/**
- * What a caller does with selection once a run ends, for any reason. Every id
- * the action never reached — a chunk the bounded run skipped because it was
- * stopped or errored — belongs in `retryIds`: it is exactly what Retry should
- * resend, and it is what stays selected so the count on screen never claims
- * more was done than actually was (#92 requirement 8).
- */
-export const resolveSelectionAfterRun = (
-	outcome: BulkRunOutcome,
-): SelectionAfterRun => {
-	if (outcome.failedIds.length > 0) {
-		return { exit: false, retryIds: outcome.failedIds };
-	}
-	if (outcome.cancelled || outcome.error) {
-		return { exit: false, retryIds: [] };
-	}
-	return { exit: true, retryIds: [] };
-};

package/src/lib/format.test.ts

@@ -119,31 +119,4 @@ describe("formatDeleteToTrashTitle", () => {
 			"Move 3,412 messages to Trash?",
 		);
 	});
-
-	// #109: an escalated-predicate count is paged once by `countMatches` and
-	// re-paged independently by the delete itself — never provably the number
-	// that gets deleted. `isEstimate` says so instead of stating an exact
-	// number the run may not honour.
-	describe("isEstimate (#109 — an escalated-predicate count, not a materialized selection)", () => {
-		test("prefixes 'about' for a plural estimate", () => {
-			assert.strictEqual(
-				formatDeleteToTrashTitle(3412, true),
-				"Move about 3,412 messages to Trash?",
-			);
-		});
-
-		test("prefixes 'about' for a singular estimate", () => {
-			assert.strictEqual(
-				formatDeleteToTrashTitle(1, true),
-				"Move about 1 message to Trash?",
-			);
-		});
-
-		test("defaults to false — a bounded selection's count stays exact", () => {
-			assert.strictEqual(
-				formatDeleteToTrashTitle(3412),
-				formatDeleteToTrashTitle(3412, false),
-			);
-		});
-	});
 });

package/src/lib/format.ts

@@ -152,21 +152,11 @@ export const formatEmailDate = (date: Date | string | number): string => {
 /**
  * Confirmation title for the move-to-Trash delete flow. Reflects that delete
  * moves messages to Trash (not a permanent delete) and pluralizes on count.
- * Thousands-separated: at escalated-selection scale this is exactly the digit
- * count someone checks against what they meant to select.
- *
- * `isEstimate` marks an escalated-predicate count (#109): it was paged to a
- * total once, and the delete itself re-pages the same predicate independently
- * — mail arriving or leaving between the two can make them differ. "about"
- * says so up front instead of stating a number the run may not honour; a
- * materialized (bounded) selection's count is exact and never passes it.
+ * The count is always a concrete list of ids — every predicate delete ends on
+ * the wizard's review screen instead, which states what the predicate covers.
  */
-export const formatDeleteToTrashTitle = (
-	count: number,
-	isEstimate = false,
-): string => {
+export const formatDeleteToTrashTitle = (count: number): string => {
 	const quantity = count === 1 ? "1" : formatNumber(count);
 	const noun = count === 1 ? "message" : "messages";
-	const prefix = isEstimate ? "about " : "";
-	return `Move ${prefix}${quantity} ${noun} to Trash?`;
+	return `Move ${quantity} ${noun} to Trash?`;
 };

package/src/lib/organize/organize-model.ts

@@ -6,7 +6,7 @@ import type {
 	RemitImapOrganizeInput,
 } from "@remit/api-http-client/types.gen.ts";
 import type {
-	MatchMode,
+	MatchDoor,
 	MatchOperator,
 	RuleClause,
 	RuleScope,
@@ -105,7 +105,13 @@ export const buildOrganizeInput = (
  * it holds, and the four `OrganizeScope` values fall out of the pair.
  */
 export interface WizardCommitAnswers {
-	mode: MatchMode;
+	/**
+	 * The door the match came through. An escalated predicate is not one: it has
+	 * no clauses to build a rule from and no anchor to widen, so a scope
+	 * reconstructed for it would be a rule matching everything. Typed to the
+	 * three doors so that cannot be written rather than merely not written.
+	 */
+	mode: MatchDoor;
 	/** Absent on the verbs that never reach the scope step — those act once. */
 	ruleScope?: RuleScope;
 }

package/src/lib/wizard-history.ts

@@ -17,9 +17,9 @@
  * rewinds every entry the wizard owns.
  */
 
-import { type StepId, stepIndex } from "@remit/ui";
+import { type StepId, stepIndex, type Verb } from "@remit/ui";
 import { useNavigate, useRouter, useSearch } from "@tanstack/react-router";
-import { useCallback, useEffect, useRef } from "react";
+import { useCallback, useEffect, useRef, useState } from "react";
 import { z } from "zod";
 
 const stepId = z.enum([
@@ -101,6 +101,46 @@ export const useOpenWizard = (): ((
 	);
 };
 
+export interface SelectionWizardControl {
+	/** The verb the wizard was opened for, for the host that renders it. */
+	verb: Verb;
+	/** Opens the wizard on a verb, from the match step — every bar verb, and
+	 *  every keyboard verb aimed at a selection, comes through here. */
+	start: (verb: Verb) => void;
+	/** Opens it on the search entry instead: the property step, with the query
+	 *  converted (#477 1.8). The route for a verb whose match is a predicate
+	 *  rather than a set of clauses. */
+	startFromSearch: () => void;
+	/**
+	 * A step is held, so the wizard owns the screen. Every selection surface
+	 * suspends its keyboard layer on this: a shortcut acting behind the screen
+	 * already asking about an action is a second flow nobody asked for.
+	 */
+	isOpen: boolean;
+}
+
+/**
+ * The wizard as a selection surface drives it. The step lives in the URL and
+ * the verb beside it in state, in one place rather than one copy per surface —
+ * three of them had drifted apart on which verbs they even offered.
+ */
+export const useSelectionWizard = (): SelectionWizardControl => {
+	const step = useWizardStepValue();
+	const openWizard = useOpenWizard();
+	const [verb, setVerb] = useState<Verb>("organize");
+	const start = useCallback(
+		(next: Verb) => {
+			setVerb(next);
+			openWizard("match");
+		},
+		[openWizard],
+	);
+	const startFromSearch = useCallback(() => {
+		openWizard("properties", "search");
+	}, [openWizard]);
+	return { verb, start, startFromSearch, isOpen: step !== undefined };
+};
+
 export interface WizardStepNavigation {
 	step: StepId | undefined;
 	goToStep: (step: StepId) => void;