@remit/web-client 0.0.64 → 0.0.66

package/src/lib/organize/sender-fallback.ts

@@ -2,6 +2,7 @@ import type {
 	RemitImapFilterClause,
 	RemitImapOrganizeInput,
 } from "@remit/api-http-client/types.gen.ts";
+import { getDomain } from "tldts";
 import type { OrganizeDraft } from "./organize-model";
 
 /**
@@ -31,15 +32,47 @@ export const distinctSenders = (senders: readonly string[]): string[] => {
 	return out;
 };
 
+const hostOf = (address: string): string => {
+	const at = address.lastIndexOf("@");
+	return at >= 0 ? address.slice(at + 1) : address;
+};
+
 /**
- * One `From` literal clause per distinct sender address. A `From` clause matches
- * the sender address or display name (match.ts `clauseMatches`), so the address
- * is the precise, stable key.
+ * The single registrable domain the whole selection collapses to, or `null` when
+ * it does not collapse. A collapse needs at least two distinct senders that all
+ * resolve to one registrable domain (public-suffix aware, via tldts `getDomain`)
+ * — the "anyone at this domain" signal (RFC 038 D2). One sender stays a precise
+ * `From` clause rather than widening a single address to its whole domain, and a
+ * sender whose domain can't be resolved blocks the collapse.
+ */
+export const collapsibleDomain = (
+	senders: readonly string[],
+): string | null => {
+	const distinct = distinctSenders(senders);
+	if (distinct.length < 2) return null;
+	let shared: string | null = null;
+	for (const sender of distinct) {
+		const domain = getDomain(hostOf(sender));
+		if (domain === null) return null;
+		if (shared === null) shared = domain;
+		else if (shared !== domain) return null;
+	}
+	return shared;
+};
+
+/**
+ * The literal clauses standing in for the selection. When every sender shares one
+ * registrable domain, a single `FromDomain` clause replaces the per-address `From`
+ * chips (RFC 038 D2); otherwise one `From` clause per distinct sender, each
+ * matching the sender address or display name (match.ts `clauseMatches`).
  */
 export const deriveSenderClauses = (
 	senders: readonly string[],
-): RemitImapFilterClause[] =>
-	distinctSenders(senders).map((value) => ({ field: "From", value }));
+): RemitImapFilterClause[] => {
+	const domain = collapsibleDomain(senders);
+	if (domain !== null) return [{ field: "FromDomain", value: domain }];
+	return distinctSenders(senders).map((value) => ({ field: "From", value }));
+};
 
 /**
  * The literal predicate that stands in for the semantic anchor: the sender `From`

package/src/components/mail/organize/OrganizePanel.progress.test.ts

@@ -1,113 +0,0 @@
-/**
- * The back-apply progress copy. On a deployment without the vector pipeline the
- * "all like these" job moves the sender-matched set, so the in-progress line must
- * state the sender semantics — never "similar mail" (#250's honesty
- * requirement). The semantic path keeps the "similar mail" wording.
- */
-
-import assert from "node:assert/strict";
-import { afterEach, describe, it } from "node:test";
-import { mailboxOperationsListMailboxesQueryKey } from "@remit/api-http-client/@tanstack/react-query.gen.ts";
-import { createElement } from "react";
-import type { OrganizeMatchPredicate } from "../../../lib/organize/sender-fallback";
-import { createDomHarness, type DomHarness } from "../../../test-support/dom";
-import { makeMailbox } from "../../../test-support/fixtures";
-import { type HttpMock, mockFetch } from "../../../test-support/http";
-import { OrganizePanel } from "./OrganizePanel";
-
-let harness: DomHarness | undefined;
-let http: HttpMock | undefined;
-
-afterEach(() => {
-	harness?.close();
-	harness = undefined;
-	http?.restore();
-	http = undefined;
-});
-
-const ACCOUNT_ID = "acc-1";
-
-const MAILBOXES = [
-	makeMailbox({ mailboxId: "mbx-inbox", fullPath: "INBOX" }),
-	makeMailbox({ mailboxId: "mbx-archive", fullPath: "Archive" }),
-];
-
-const SEMANTIC_PREDICATE: OrganizeMatchPredicate = {
-	anchorMessageId: "msg-1",
-	matchOperator: "And",
-	literalClauses: [],
-};
-
-const SENDER_PREDICATE: OrganizeMatchPredicate = {
-	matchOperator: "Or",
-	literalClauses: [{ field: "From", value: "npm@github.com" }],
-};
-
-const mount = (
-	props: Partial<Parameters<typeof OrganizePanel>[0]>,
-): DomHarness => {
-	http = mockFetch((call) => {
-		if (call.path.endsWith("/organize") && call.method === "POST") {
-			return { organizeJobId: "job-1", state: "Processing" };
-		}
-		if (call.path.endsWith("/organize/job-1") && call.method === "GET") {
-			return {
-				organizeJobId: "job-1",
-				state: "Processing",
-				matchedCount: 128,
-				appliedCount: 0,
-				failedCount: 0,
-			};
-		}
-		return {};
-	});
-	harness = createDomHarness();
-	harness.queryClient.setQueryData(
-		mailboxOperationsListMailboxesQueryKey({ path: { accountId: ACCOUNT_ID } }),
-		{ items: MAILBOXES },
-	);
-	harness.renderApp(
-		createElement(OrganizePanel, {
-			accountId: ACCOUNT_ID,
-			mailboxId: "mbx-inbox",
-			selectedMessageIds: ["msg-1", "msg-2"],
-			matchPredicate: SEMANTIC_PREDICATE,
-			matchedCount: 128,
-			seedMailboxId: "mbx-archive",
-			onClose: () => undefined,
-			...props,
-		}),
-	);
-	return harness;
-};
-
-async function startJob(dom: DomHarness): Promise<void> {
-	dom.click(dom.byText("button", "Organize"));
-	for (let attempt = 0; attempt < 20; attempt += 1) {
-		await dom.flush();
-		if (/Organizing/.test(dom.text())) return;
-		await dom.wait(1);
-	}
-}
-
-describe("OrganizePanel back-apply progress copy", () => {
-	it("states the sender semantics while organizing in the sender fallback", async () => {
-		const dom = mount({
-			matchPredicate: SENDER_PREDICATE,
-			semanticUnavailable: true,
-			senders: ["npm@github.com"],
-		});
-		await startJob(dom);
-
-		assert.match(dom.text(), /Organizing mail from these senders/);
-		assert.doesNotMatch(dom.text(), /Organizing similar mail/);
-	});
-
-	it("keeps the similar-mail wording on the semantic path", async () => {
-		const dom = mount({});
-		await startJob(dom);
-
-		assert.match(dom.text(), /Organizing similar mail/);
-		assert.doesNotMatch(dom.text(), /from these senders/);
-	});
-});

package/src/components/mail/organize/OrganizePanel.render.test.ts

@@ -1,151 +0,0 @@
-import assert from "node:assert/strict";
-import { describe, it } from "node:test";
-import { organizeOperationsCreateOrganizeJobMutation } from "@remit/api-http-client/@tanstack/react-query.gen.ts";
-import { MutationObserver } from "@tanstack/query-core";
-import { QueryClient, QueryClientProvider } from "@tanstack/react-query";
-import React, { createElement } from "react";
-import { renderToString } from "react-dom/server";
-import { ErrorBannerProvider } from "@/components/ui/ErrorBannerProvider";
-import { buildOrganizeInput } from "@/lib/organize/organize-model";
-import { OrganizePanel } from "./OrganizePanel";
-
-// The node test loader transpiles remit-ui's `.tsx` with the classic JSX
-// runtime, which references a global `React`. Vite uses the automatic runtime,
-// so this shim only exists for the SSR test harness.
-(globalThis as { React?: typeof React }).React = React;
-
-const render = (overrides: Partial<Parameters<typeof OrganizePanel>[0]> = {}) =>
-	renderToString(
-		createElement(
-			QueryClientProvider,
-			{ client: new QueryClient() },
-			createElement(
-				ErrorBannerProvider,
-				null,
-				createElement(OrganizePanel, {
-					accountId: "acc-1",
-					mailboxId: "mbx-inbox",
-					selectedMessageIds: ["msg-1", "msg-2"],
-					matchPredicate: {
-						anchorMessageId: "msg-1",
-						matchOperator: "And",
-						literalClauses: [],
-					},
-					matchedCount: 47,
-					onClose: () => undefined,
-					...overrides,
-				}),
-			),
-		) as never,
-	);
-
-describe("OrganizePanel", () => {
-	it("renders the organize sentence with the widened count", () => {
-		const html = render();
-		assert.match(html, /similar message/);
-		assert.match(html, /from 2 selected/);
-	});
-
-	it("surfaces the disabled reason until a folder is chosen (ux.md — say why)", () => {
-		const html = render();
-		assert.match(html, /Pick a folder to move these into/);
-		assert.match(html, /available yet/i);
-	});
-
-	it("offers all four commit scopes", () => {
-		const html = render();
-		assert.match(html, /Just these/);
-		assert.match(html, /All like these/);
-		assert.match(html, /These and new mail like this/);
-		assert.match(html, /Until a date/);
-	});
-
-	it("says it is organizing just the selection when the widen matched nothing (#211 — no dead end)", () => {
-		const html = render({ matchedCount: 0, fallback: true });
-		assert.match(html, /No similar messages found/);
-		assert.match(html, /organizing just your 2 selected/);
-	});
-
-	it("names the missing vector pipeline and organizes just the selection when the widen is unavailable and no senders are known (#226/#201)", () => {
-		const html = render({ matchedCount: 0, semanticUnavailable: true });
-		assert.match(html, /available on this server/);
-		assert.match(html, /organizing just your 2 selected/);
-	});
-
-	it("names the senders and states it is matching all mail from them when the widen fell back (no vector pipeline)", () => {
-		const html = render({
-			matchedCount: 128,
-			semanticUnavailable: true,
-			senders: ["npm@github.com", "notifications@github.com"],
-			matchPredicate: {
-				matchOperator: "Or",
-				literalClauses: [
-					{ field: "From", value: "npm@github.com" },
-					{ field: "From", value: "notifications@github.com" },
-				],
-			},
-		});
-		assert.match(html, /matching all mail from/);
-		assert.match(html, /npm@github\.com/);
-		assert.match(html, /notifications@github\.com/);
-		assert.match(html, /128 matches/);
-		// Never claims the matched set is semantically similar (only denies that
-		// similar-mail matching is available).
-		assert.doesNotMatch(html, /similar message/i);
-		assert.doesNotMatch(html, /similar ones found/i);
-		// The sender fallback is a real widen: the scopes reach it, so the
-		// default scope is "all like these", not "just these".
-		assert.match(html, /All like these/);
-	});
-
-	it("pre-selects the seeded scope (a 'Something else' shortcut seeds the sentence)", () => {
-		const html = render({ initialScope: "standing" });
-		// The standing scope's "Always keep" phrasing only renders when it is active.
-		assert.match(html, /Always keep/);
-	});
-});
-
-// The commit button's `disabled` prop is
-// `!!disabledReason || createFilter.isPending || organizeJob.isStarting`
-// (#1279) — a slow POST to /organize must block a second click just like an
-// in-flight createFilter does, or the back-apply runs twice. `renderToString`
-// never dispatches the click that would exercise that wiring end-to-end (SSR
-// doesn't run event handlers), so this drives the exact mutation config
-// `useOrganizeJob().start()` calls — `organizeOperationsCreateOrganizeJobMutation()`
-// — through a real `MutationObserver` and confirms it reports `isPending`
-// (what `organizeJob.isStarting` is) for the whole time the POST is in
-// flight, which is the invariant the disabled expression relies on.
-describe("organizeJob.isStarting — the create-organize-job POST stays pending until it resolves (#1279)", () => {
-	it("reports isPending immediately after start() and keeps it pending while the POST hasn't come back", () => {
-		const queryClient = new QueryClient();
-		const observer = new MutationObserver(
-			queryClient,
-			organizeOperationsCreateOrganizeJobMutation(),
-		);
-
-		assert.equal(
-			observer.getCurrentResult().isPending,
-			false,
-			"idle before the first submit — same as a fresh commit button",
-		);
-
-		observer.mutate({
-			path: { accountId: "acc-1" },
-			body: buildOrganizeInput({
-				anchorMessageId: "msg-1",
-				matchOperator: "And",
-				literalClauses: [],
-				moveMailboxId: "mbx-work",
-			}),
-			// Stands in for a slow POST that hasn't come back yet — the exact
-			// window a double click must be blocked in.
-			fetch: () => new Promise<Response>(() => {}),
-		});
-
-		assert.equal(
-			observer.getCurrentResult().isPending,
-			true,
-			"a second click during this window must be blocked — this is what organizeJob.isStarting disables the button on",
-		);
-	});
-});