@remit/web-client 0.0.317 → 0.0.318

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@remit/web-client",
-  "version": "0.0.317",
+  "version": "0.0.318",
   "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/mail/MessageList.tsx

@@ -515,6 +515,7 @@ export const MessageList = ({
 				subject: thread.subject ?? "(No subject)",
 				date: formatEmailDate(thread.sentDate),
 				accountId,
+				mailboxId: thread.mailboxId,
 			});
 		}
 		return rows;

package/src/components/mail/SelectionWizardHost.tsx

@@ -33,6 +33,7 @@ import { useBlocker } from "@tanstack/react-router";
 import { useCallback, useEffect, useMemo, useRef, useState } from "react";
 import {
 	useFolderAppointments,
+	useInboxMailbox,
 	useJunkMailbox,
 } from "@/hooks/useArchiveMailbox";
 import { useClauseSuggestions } from "@/hooks/useClauseSuggestions";
@@ -61,8 +62,6 @@ import { useMailContext } from "@/lib/mail-context";
 import { buildMoveOptions, folderDelimiter } from "@/lib/move-options";
 import {
 	buildWizardDraft,
-	canBackApplyDraft,
-	type OrganizeDraft,
 	type OrganizeScope,
 	organizeScopeFor,
 } from "@/lib/organize/organize-model";
@@ -367,11 +366,6 @@ function SelectionWizardSession({
 		  }
 		| undefined
 	>(undefined);
-	// The predicate the create chains its pass to. Undefined when the rule cannot
-	// be back-applied — a `HasWords` clause the vector-free pass cannot evaluate —
-	// in which case the filter still saves and applies to incoming mail. Kept, not
-	// cleared, so a failed start can be retried.
-	const [backApplyDraft, setBackApplyDraft] = useState<OrganizeDraft>();
 	const commitSent = useRef(false);
 
 	const messageIds = useMemo(
@@ -395,6 +389,26 @@ function SelectionWizardSession({
 	const anchorMessageId = messageIds[0];
 	const subjects = useSelectedSubjects(messageIds);
 	const { junkMailboxId } = useJunkMailbox(accountId);
+	const { inboxMailboxId } = useInboxMailbox(accountId);
+	// A saved rule's first pass runs over the inbox. Ticked rows in any other
+	// folder take the action directly, so a rule made from Archive or from a
+	// search across folders still files the mail it was made from.
+	const outsideInbox = useMemo<BulkActionTarget[]>(
+		() =>
+			inboxMailboxId
+				? selection
+						.filter(
+							(message) =>
+								message.mailboxId !== undefined &&
+								message.mailboxId !== inboxMailboxId,
+						)
+						.map((message) => ({
+							id: message.id,
+							accountId: message.accountId,
+						}))
+				: [],
+		[selection, inboxMailboxId],
+	);
 
 	// No door is offered over an escalated predicate, so nothing here has a widen
 	// to probe for.
@@ -728,7 +742,7 @@ function SelectionWizardSession({
 		});
 	}, [escalated, verb, named.moveMailboxId, junkMailboxId, claimEnding]);
 
-	const { start: startJob } = organizeJob;
+	const { start: startJob, watch: watchJob } = organizeJob;
 	const { createFilterAsync } = createFilter;
 
 	const sendCommit = useCallback(() => {
@@ -752,21 +766,18 @@ function SelectionWizardSession({
 		setCommittedScope(scope);
 
 		if (scope === "standing" || scope === "temporary") {
-			// Creating a filter also moves the mail that already matches, not only
-			// the mail that arrives next. The pass is chained to the create's own
-			// request rather than to this screen: the screen offers a Close while
-			// the create is still in flight, and a rule that saved with no pass
-			// behind it — and nothing left to retry from — is a silent no-op.
-			const backApply = canBackApplyDraft(organizeDraft)
-				? organizeDraft
-				: undefined;
-			setBackApplyDraft(backApply);
+			// Creating a filter also runs it over the inbox: the server queues that
+			// pass with the create and hands back its job id, which this screen
+			// follows. Ticked rows outside the inbox are not the job's to reach, so
+			// they take the action directly.
 			void createFilterAsync(
 				organizeDraft,
 				scope,
 				(named.name ?? "").trim(),
 			).then((created) => {
-				if (created && backApply) startJob(backApply);
+				if (!created) return;
+				watchJob(created.organizeJobId);
+				if (outsideInbox.length > 0) void runBulk(outsideInbox);
 			});
 			return;
 		}
@@ -792,6 +803,8 @@ function SelectionWizardSession({
 		bulkTargets,
 		matchedIds,
 		createFilterAsync,
+		watchJob,
+		outsideInbox,
 		startJob,
 		runBulk,
 	]);
@@ -878,13 +891,22 @@ function SelectionWizardSession({
 		};
 	}, [bulkRun, runProgress, rowsById]);
 
+	const createdFilter = createFilter.data;
+	// The direct action on ticked rows outside the inbox fell short. Its
+	// failures are reported over the job's progress: they are mail the user
+	// picked, and the job will never reach them.
+	const bulkFellShort =
+		bulkRun !== undefined &&
+		(bulkRun.failureReason !== undefined ||
+			(bulkRun.outcome?.failedIds.length ?? 0) > 0);
+
 	const runSnapshot = (): RunSnapshot => {
 		if (escalated) return bulkSnapshot();
 		if (committedScope === "standing" || committedScope === "temporary") {
 			if (createFilter.isError)
 				return { ...NOT_STARTED, state: "commitFailed" };
 			if (!createFilter.isSuccess) return NOT_STARTED;
-			if (!backApplyDraft) return { ...NOT_STARTED, state: "filterSaved" };
+			if (bulkFellShort) return bulkSnapshot();
 			return jobSnapshot(true);
 		}
 		if (committedScope === "all-like-these" && widenedRunsAsJob(verb)) {
@@ -899,12 +921,23 @@ function SelectionWizardSession({
 	// walking back to Review, which would push an entry the wizard does not own
 	// and leave Cancel rewinding to a step instead of out.
 	const retry = (): void => {
+		const ruleSaved =
+			committedScope === "standing" || committedScope === "temporary";
+		if (ruleSaved && bulkFellShort && bulkRun) {
+			const failed = new Set(bulkRun.outcome?.failedIds ?? []);
+			void runBulk(
+				failed.size > 0
+					? bulkRun.sent.filter((target) => failed.has(target.id))
+					: bulkRun.sent,
+			);
+			return;
+		}
 		const intent = retryIntent({
 			runState: run.state,
 			isEscalated: escalated !== undefined,
 			committedScope,
 			createFilterFailed: createFilter.isError,
-			backApplyPending: backApplyDraft !== undefined,
+			backApplyPending: createdFilter !== undefined,
 			widenRunsAsJob: widenedRunsAsJob(verb),
 			failedIds: bulkRun?.outcome?.failedIds ?? [],
 			sent: bulkRun?.sent ?? bulkTargets,
@@ -924,7 +957,7 @@ function SelectionWizardSession({
 				sendCommit();
 				return;
 			case "startBackApply":
-				if (backApplyDraft) startJob(backApplyDraft);
+				if (createdFilter) organizeJob.startForFilter(createdFilter.filterId);
 				return;
 			case "waitOnJob":
 				return;

package/src/components/settings/{FilterToggleError.render.test.ts → FilterActionError.render.test.ts}

@@ -3,14 +3,14 @@ import { describe, it } from "node:test";
 import React, { createElement } from "react";
 import { renderToString } from "react-dom/server";
 import { ApiError } from "@/lib/api";
-import { FilterToggleError } from "./FilterToggleError";
+import { FilterActionError } from "./FilterActionError";
 
 (globalThis as { React?: typeof React }).React = React;
 
-const render = (error: unknown) =>
+const render = (error: unknown, title = "Couldn't turn the filter on") =>
 	renderToString(
-		createElement(FilterToggleError, {
-			enabling: true,
+		createElement(FilterActionError, {
+			title,
 			error,
 			onRetry: () => undefined,
 			reportHref: (message: string) =>
@@ -18,7 +18,7 @@ const render = (error: unknown) =>
 		}) as never,
 	);
 
-describe("FilterToggleError (#1103)", () => {
+describe("FilterActionError (#1103, #1354)", () => {
 	it("shows a refusal with its fix and a report link, and no Retry", () => {
 		const html = render(new ApiError("Pick a folder in the rule.", 400));
 		assert.match(html, /Couldn('|')t turn the filter on/);
@@ -33,4 +33,14 @@ describe("FilterToggleError (#1103)", () => {
 		assert.match(html, />Retry</);
 		assert.match(html, /Report an issue/);
 	});
+
+	it("names the filter a Run now could not start, with the server's reason", () => {
+		const html = render(
+			new ApiError("This filter is turned off or has expired.", 400),
+			"Couldn't run Invoices",
+		);
+		assert.match(html, /Couldn(&#x27;|')t run Invoices/);
+		assert.match(html, /turned off or has expired/);
+		assert.match(html, /Report an issue/);
+	});
 });

package/src/components/settings/{FilterToggleError.stories.tsx → FilterActionError.stories.tsx}

@@ -1,10 +1,10 @@
 import type { Meta, StoryObj } from "@storybook/react-vite";
 import { ApiError } from "@/lib/api";
-import { FilterToggleError } from "./FilterToggleError";
+import { FilterActionError } from "./FilterActionError";
 
-const meta: Meta<typeof FilterToggleError> = {
-	title: "Playground/Shipped/Settings/Filters/FilterToggleError",
-	component: FilterToggleError,
+const meta: Meta<typeof FilterActionError> = {
+	title: "Playground/Shipped/Settings/Filters/FilterActionError",
+	component: FilterActionError,
 	parameters: { layout: "padded" },
 	decorators: [
 		(Story) => (
@@ -20,11 +20,11 @@ const meta: Meta<typeof FilterToggleError> = {
 };
 export default meta;
 
-type Story = StoryObj<typeof FilterToggleError>;
+type Story = StoryObj<typeof FilterActionError>;
 
 export const RefusedWithoutFolder: Story = {
 	args: {
-		enabling: true,
+		title: "Couldn't turn the filter on",
 		error: new ApiError(
 			"This filter has no folder to move mail into yet. Wait for its folder to be created on the mail server, or pick a folder in the rule, then turn it on.",
 			400,
@@ -34,7 +34,17 @@ export const RefusedWithoutFolder: Story = {
 
 export const ServerUnavailable: Story = {
 	args: {
-		enabling: false,
+		title: "Couldn't turn the filter off",
 		error: new ApiError("The server did not answer.", 503),
 	},
 };
+
+export const RunNowRefused: Story = {
+	args: {
+		title: "Couldn't run Invoices over the inbox",
+		error: new ApiError(
+			"This filter is turned off or has expired. Turn it on to run it over the inbox.",
+			400,
+		),
+	},
+};

package/src/components/settings/{FilterToggleError.tsx → FilterActionError.tsx}

@@ -1,8 +1,8 @@
 import { ErrorState, formatErrorMessage } from "@/components/ui/ErrorState";
 import { getErrorStatus } from "@/lib/error-classifier";
 
-interface FilterToggleErrorProps {
-	enabling: boolean;
+interface FilterActionErrorProps {
+	title: string;
 	error: unknown;
 	onRetry: () => void;
 	reportHref: (message: string) => string;
@@ -13,21 +13,17 @@ const isRefusal = (error: unknown): boolean => {
 	return status !== undefined && status >= 400 && status < 500;
 };
 
-export function FilterToggleError({
-	enabling,
+export function FilterActionError({
+	title,
 	error,
 	onRetry,
 	reportHref,
-}: FilterToggleErrorProps) {
+}: FilterActionErrorProps) {
 	return (
 		<div className="space-y-1">
 			<ErrorState
 				variant="inline"
-				title={
-					enabling
-						? "Couldn't turn the filter on"
-						: "Couldn't turn the filter off"
-				}
+				title={title}
 				error={error}
 				onRetry={isRefusal(error) ? undefined : onRetry}
 			/>

package/src/components/settings/FiltersList.render.test.ts

@@ -4,6 +4,7 @@ import type { RemitImapFilterResponse } from "@remit/api-http-client/types.gen.t
 import type { LabelOption } from "@remit/ui";
 import React, { createElement } from "react";
 import { renderToString } from "react-dom/server";
+import type { FilterRunStatus } from "@/lib/organize/filter-run";
 import { FiltersList } from "./FiltersList";
 
 // The node test loader transpiles remit-ui's `.tsx` with the classic JSX
@@ -38,6 +39,7 @@ const render = (
 	filters: RemitImapFilterResponse[],
 	semanticUnavailable = false,
 	labelById: Map<string, LabelOption> = new Map(),
+	run: { runFilterId?: string; runStatus?: FilterRunStatus } = {},
 ) =>
 	renderToString(
 		createElement(FiltersList, {
@@ -47,6 +49,8 @@ const render = (
 			onEdit: () => undefined,
 			onDelete: () => undefined,
 			onToggle: () => undefined,
+			onRunNow: () => undefined,
+			...run,
 			semanticUnavailable,
 			now: NOW,
 		}) as never,
@@ -153,4 +157,65 @@ describe("FiltersList", () => {
 			assert.match(html, /Turn on filter Travel/);
 		});
 	}
+
+	it("offers Run now on an active filter with an action (#1354)", () => {
+		const html = render([filter({})]);
+		assert.match(html, /Run now: filter Travel/);
+		assert.match(html, />Run now</);
+	});
+
+	it("offers no Run now on a turned-off or expired filter", () => {
+		const html = render([
+			filter({ state: "Disabled", disabledReason: "UserDisabled" }),
+			filter({
+				filterId: "f-2",
+				name: "Lisbon trip",
+				scope: "Temporary",
+				expiresAt: "2026-07-10T00:00:00Z",
+			}),
+		]);
+		assert.doesNotMatch(html, /Run now/);
+	});
+
+	it("offers no Run now on a filter with nothing to do", () => {
+		const html = render([
+			filter({ actionMailboxId: "None", actionLabelId: "None" }),
+		]);
+		assert.doesNotMatch(html, /Run now/);
+	});
+
+	it("says the run is going on the filter that was run, and holds the button", () => {
+		const html = render([filter({})], false, new Map(), {
+			runFilterId: "f-1",
+			runStatus: { kind: "running" },
+		});
+		assert.match(html, /role="status"/);
+		assert.match(html, /Running over the inbox/);
+		assert.match(html, /disabled=""/);
+	});
+
+	it("reports what the run filed once the job is done", () => {
+		const html = render([filter({})], false, new Map(), {
+			runFilterId: "f-1",
+			runStatus: { kind: "done", matched: 3, applied: 2 },
+		});
+		assert.match(html, /Filed 2 of 3 matching messages in the inbox/);
+	});
+
+	it("says so when nothing in the inbox matched", () => {
+		const html = render([filter({})], false, new Map(), {
+			runFilterId: "f-1",
+			runStatus: { kind: "done", matched: 0, applied: 0 },
+		});
+		assert.match(html, /Nothing in the inbox matched/);
+	});
+
+	it("puts no stale status on the row when the run failed", () => {
+		const html = render([filter({})], false, new Map(), {
+			runFilterId: "f-1",
+			runStatus: { kind: "failed", error: new Error("turned off") },
+		});
+		assert.doesNotMatch(html, /role="status"/);
+		assert.match(html, />Run now</);
+	});
 });

package/src/components/settings/FiltersList.stories.tsx

@@ -22,6 +22,7 @@ const meta: Meta<typeof FiltersList> = {
 		onEdit: () => undefined,
 		onDelete: () => undefined,
 		onToggle: () => undefined,
+		onRunNow: () => undefined,
 		now: NOW,
 	},
 };
@@ -87,3 +88,27 @@ export const Toggling: Story = {
 		togglingFilterId: "flt-1",
 	},
 };
+
+export const RunNowRunning: Story = {
+	args: {
+		filters: [makeFilter({})],
+		runFilterId: "flt-1",
+		runStatus: { kind: "running" },
+	},
+};
+
+export const RunNowDone: Story = {
+	args: {
+		filters: [makeFilter({})],
+		runFilterId: "flt-1",
+		runStatus: { kind: "done", matched: 3, applied: 3 },
+	},
+};
+
+export const RunNowMatchedNothing: Story = {
+	args: {
+		filters: [makeFilter({})],
+		runFilterId: "flt-1",
+		runStatus: { kind: "done", matched: 0, applied: 0 },
+	},
+};

package/src/components/settings/FiltersList.tsx

@@ -7,6 +7,7 @@ import {
 	WidenChip,
 } from "@remit/ui";
 import { Trash2 } from "lucide-react";
+import type { FilterRunStatus } from "@/lib/organize/filter-run";
 import {
 	disabledReasonCopy,
 	filterDisplayStatus,
@@ -14,6 +15,20 @@ import {
 } from "@/lib/organize/filter-status";
 import { NO_ACTION } from "@/lib/organize/organize-model";
 
+const runStatusLine = (status: FilterRunStatus): string | undefined => {
+	switch (status.kind) {
+		case "queuing":
+		case "running":
+			return "Running over the inbox…";
+		case "done":
+			return status.matched === 0
+				? "Done. Nothing in the inbox matched."
+				: `Done. Filed ${status.applied} of ${status.matched} matching messages in the inbox.`;
+		case "failed":
+			return undefined;
+	}
+};
+
 interface FiltersListProps {
 	filters: RemitImapFilterResponse[];
 	/** Resolve a destination mailbox id to a folder name for display. */
@@ -26,6 +41,12 @@ interface FiltersListProps {
 	deletingFilterId?: string;
 	onToggle: (filterId: string, enabled: boolean) => void;
 	togglingFilterId?: string;
+	/** Run the filter over the inbox now (#1354). */
+	onRunNow: (filterId: string) => void;
+	/** The filter the last Run now was for. */
+	runFilterId?: string;
+	/** How that run stands; a failure is reported above the list. */
+	runStatus?: FilterRunStatus;
 	/**
 	 * This deployment ships no vector pipeline (RFC 038 D4). A filter carrying a
 	 * semantic anchor lists with its widen chip inactive — it matches by its
@@ -52,6 +73,9 @@ export function FiltersList({
 	deletingFilterId,
 	onToggle,
 	togglingFilterId,
+	onRunNow,
+	runFilterId,
+	runStatus,
 	semanticUnavailable = false,
 	now = Date.now(),
 }: FiltersListProps) {
@@ -80,6 +104,13 @@ export function FiltersList({
 						? labelById.get(filter.actionLabelId)
 						: undefined;
 				const expiresLabel = formatExpiresAt(filter.expiresAt);
+				const run = runFilterId === filter.filterId ? runStatus : undefined;
+				const busy = run?.kind === "queuing" || run?.kind === "running";
+				const runLine = run ? runStatusLine(run) : undefined;
+				const runnable =
+					status === "Active" &&
+					(filter.actionMailboxId !== NO_ACTION ||
+						filter.actionLabelId !== NO_ACTION);
 
 				return (
 					<li
@@ -120,6 +151,11 @@ export function FiltersList({
 							{reason && (
 								<p className="mt-0.5 text-xs text-warning">{reason}</p>
 							)}
+							{runLine && (
+								<p role="status" className="mt-0.5 text-xs text-fg-muted">
+									{runLine}
+								</p>
+							)}
 							{(filter.hasAnchor || label) && (
 								<div className="mt-1.5 flex flex-wrap gap-1.5">
 									{filter.hasAnchor && (
@@ -142,6 +178,17 @@ export function FiltersList({
 								</div>
 							)}
 						</button>
+						{runnable && (
+							<Button
+								variant="ghost"
+								size="sm"
+								onClick={() => onRunNow(filter.filterId)}
+								disabled={busy}
+								aria-label={`Run now: filter ${filter.name}`}
+							>
+								{busy ? "Running…" : "Run now"}
+							</Button>
+						)}
 						{!expired && (
 							<Button
 								variant="ghost"

package/src/hooks/useFilters.ts

@@ -5,6 +5,7 @@ import {
 	filterOperationsListFiltersOptions,
 	filterOperationsListFiltersQueryKey,
 } from "@remit/api-http-client/@tanstack/react-query.gen.ts";
+import type { RemitImapCreateFilterResponse } from "@remit/api-http-client/types.gen.ts";
 import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
 import { useCallback } from "react";
 import {
@@ -84,23 +85,23 @@ export const useCreateFilter = (accountId: string | undefined) => {
 	 * to the request rather than to the surface is what keeps it running when the
 	 * surface is closed while the create is still in flight.
 	 *
-	 * `false` means the create did not land. The failure itself is on `isError`,
-	 * which is what the surface reports and retries from, so it is not raised a
-	 * second time here.
+	 * `undefined` means the create did not land. The failure itself is on
+	 * `isError`, which is what the surface reports and retries from, so it is not
+	 * raised a second time here.
 	 */
 	const createFilterAsync = useCallback(
 		async (
 			draft: OrganizeDraft,
 			scope: Extract<OrganizeScope, "standing" | "temporary">,
 			name: string,
-		): Promise<boolean> => {
-			if (!accountId) return false;
+		): Promise<RemitImapCreateFilterResponse | undefined> => {
+			if (!accountId) return undefined;
 			return mutateAsync({
 				path: { accountId },
 				body: buildCreateFilterInput(draft, scope, name),
 			}).then(
-				() => true,
-				() => false,
+				(created) => created,
+				() => undefined,
 			);
 		},
 		[accountId, mutateAsync],
@@ -109,6 +110,7 @@ export const useCreateFilter = (accountId: string | undefined) => {
 	return {
 		createFilter,
 		createFilterAsync,
+		data: mutation.data,
 		isPending: mutation.isPending,
 		isSuccess: mutation.isSuccess,
 		isError: mutation.isError,

package/src/hooks/useOrganizeJob.ts

@@ -7,6 +7,7 @@ import { useMutation, useQuery } from "@tanstack/react-query";
 import { useCallback, useState } from "react";
 import {
 	buildOrganizeInput,
+	buildRunFilterInput,
 	type OrganizeDraft,
 } from "@/lib/organize/organize-model";
 import {
@@ -92,6 +93,18 @@ export const useOrganizeJob = (accountId: string | undefined) => {
 		[accountId, createJob],
 	);
 
+	/** Run a saved filter over the inbox, the same pass its create queued. */
+	const startForFilter = useCallback(
+		(filterId: string) => {
+			if (!accountId) return;
+			createJob({
+				path: { accountId },
+				body: buildRunFilterInput(filterId),
+			});
+		},
+		[accountId, createJob],
+	);
+
 	const { refetch } = jobQuery;
 	// Looks at the job already in flight again. Distinct from `start`, which
 	// queues a second pass over the same mail.
@@ -117,6 +130,8 @@ export const useOrganizeJob = (accountId: string | undefined) => {
 
 	return {
 		start,
+		startForFilter,
+		watch: setOrganizeJobId,
 		refreshStatus,
 		progress,
 		isStarting: createMutation.isPending,

package/src/lib/filter-report.ts

@@ -8,3 +8,12 @@ export function filterToggleReportHref(message: string): string {
 		}),
 	);
 }
+
+export function filterRunReportHref(message: string): string {
+	return buildGitHubIssueUrl(
+		buildBugReportContext({
+			title: `Filter run now: ${message}`,
+			errorMessage: message,
+		}),
+	);
+}

package/src/lib/organize/filter-run.test.ts

@@ -0,0 +1,79 @@
+import assert from "node:assert/strict";
+import { describe, it } from "node:test";
+import { type FilterRunReading, filterRunStatus } from "./filter-run";
+
+const reading = (over: Partial<FilterRunReading> = {}): FilterRunReading => ({
+	progress: {
+		state: undefined,
+		matchedCount: 0,
+		appliedCount: 0,
+		failedCount: 0,
+		errorMessage: "",
+	},
+	failure: undefined,
+	isStarting: false,
+	isRunning: false,
+	isDone: false,
+	...over,
+});
+
+describe("filterRunStatus (#1354)", () => {
+	it("is nothing before a run", () => {
+		assert.equal(filterRunStatus(reading()), undefined);
+	});
+
+	it("is queuing while the request is out, then running", () => {
+		assert.deepEqual(filterRunStatus(reading({ isStarting: true })), {
+			kind: "queuing",
+		});
+		assert.deepEqual(filterRunStatus(reading({ isRunning: true })), {
+			kind: "running",
+		});
+	});
+
+	it("is a failure carrying the worker's reason when the job failed", () => {
+		const status = filterRunStatus(
+			reading({
+				isDone: true,
+				progress: {
+					state: "Failed",
+					matchedCount: 0,
+					appliedCount: 0,
+					failedCount: 0,
+					errorMessage: "This filter is turned off or has expired.",
+				},
+			}),
+		);
+		assert.equal(status?.kind, "failed");
+		assert.match(
+			String(status?.kind === "failed" && (status.error as Error).message),
+			/turned off/,
+		);
+	});
+
+	it("is a failure when the request itself failed", () => {
+		const error = new Error("offline");
+		assert.deepEqual(
+			filterRunStatus(reading({ failure: { kind: "startFailed", error } })),
+			{ kind: "failed", error },
+		);
+	});
+
+	it("is done with the counts of a completed job", () => {
+		assert.deepEqual(
+			filterRunStatus(
+				reading({
+					isDone: true,
+					progress: {
+						state: "Complete",
+						matchedCount: 4,
+						appliedCount: 3,
+						failedCount: 1,
+						errorMessage: "",
+					},
+				}),
+			),
+			{ kind: "done", matched: 4, applied: 3 },
+		);
+	});
+});

package/src/lib/organize/filter-run.ts

@@ -0,0 +1,48 @@
+import type {
+	OrganizeJobFailure,
+	OrganizeJobProgress,
+} from "@/hooks/useOrganizeJob";
+
+/** Where a Run now stands, as the filter's row says it. */
+export type FilterRunStatus =
+	| { kind: "queuing" }
+	| { kind: "running" }
+	| { kind: "done"; matched: number; applied: number }
+	| { kind: "failed"; error: unknown };
+
+export interface FilterRunReading {
+	progress: OrganizeJobProgress;
+	failure: OrganizeJobFailure | undefined;
+	isStarting: boolean;
+	isRunning: boolean;
+	isDone: boolean;
+}
+
+/**
+ * The row's status for the job a Run now started. A job the worker failed —
+ * a filter turned off since, or deleted — is a failure like a refused start,
+ * never a lingering "running".
+ */
+export const filterRunStatus = (
+	reading: FilterRunReading,
+): FilterRunStatus | undefined => {
+	if (reading.failure) return { kind: "failed", error: reading.failure.error };
+	if (reading.isStarting) return { kind: "queuing" };
+	if (reading.isDone) {
+		if (reading.progress.state === "Failed") {
+			return {
+				kind: "failed",
+				error: new Error(
+					reading.progress.errorMessage || "The run over the inbox failed.",
+				),
+			};
+		}
+		return {
+			kind: "done",
+			matched: reading.progress.matchedCount,
+			applied: reading.progress.appliedCount,
+		};
+	}
+	if (reading.isRunning) return { kind: "running" };
+	return undefined;
+};

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

@@ -73,15 +73,19 @@ export const hasCommittableAction = (draft: OrganizeDraft): boolean =>
 	(draft.labelId !== undefined && draft.labelId !== NO_ACTION);
 
 /**
- * Whether the draft's predicate can be back-applied over the existing corpus. A
- * `HasWords` clause matches the full message body, which only the live
- * index-time filter and the vector widen evaluate — the vector-free back-apply
- * projection carries no body and rejects it (`bodyContentRejection`,
- * organize.ts). A rule that carries one is still a valid standing filter for
- * incoming mail, so the back-apply is skipped, not run into that guard.
+ * Ask for a saved filter's pass over the inbox. The server reads the filter's
+ * own rule and action when the job runs and ignores the predicate fields,
+ * which the request shape still requires.
  */
-export const canBackApplyDraft = (draft: OrganizeDraft): boolean =>
-	!draft.literalClauses.some((clause) => clause.field === "HasWords");
+export const buildRunFilterInput = (
+	filterId: string,
+): RemitImapOrganizeInput => ({
+	filterId,
+	matchOperator: "And",
+	literalClauses: [],
+	actionLabelId: NO_ACTION,
+	actionMailboxId: NO_ACTION,
+});
 
 /**
  * Build the read-only preview / back-apply matcher input. The action fields do

package/src/lib/wizard-selection.ts

@@ -13,6 +13,11 @@ export interface WizardSelectionMessage extends WizardMessage {
 	 * which every account of one user shares (#456).
 	 */
 	accountId: string | undefined;
+	/**
+	 * The folder the row sits in, when the listing says. A saved rule's first
+	 * pass runs over the inbox, so a row elsewhere takes the action directly.
+	 */
+	mailboxId: string | undefined;
 }
 
 /**
@@ -34,4 +39,5 @@ export const wizardSelectionFrom = (
 			subject: row.subject,
 			date: row.timeLabel,
 			accountId: row.accountId,
+			mailboxId: row.mailboxId,
 		}));

package/src/routes/settings/filters.tsx

@@ -7,9 +7,9 @@ import { type LabelOption, SettingsShell } from "@remit/ui";
 import { useQuery } from "@tanstack/react-query";
 import { createFileRoute, useNavigate } from "@tanstack/react-router";
 import { useCallback, useMemo, useState } from "react";
+import { FilterActionError } from "@/components/settings/FilterActionError";
 import { FilterEditorSurface } from "@/components/settings/FilterEditorSurface";
 import { FiltersList } from "@/components/settings/FiltersList";
-import { FilterToggleError } from "@/components/settings/FilterToggleError";
 import { ErrorState } from "@/components/ui/ErrorState";
 import {
 	useDeleteFilter,
@@ -18,9 +18,14 @@ import {
 } from "@/hooks/useFilters";
 import { useFolderLabelTranslator } from "@/hooks/useFolderLabelTranslator";
 import { useLabelList } from "@/hooks/useLabels";
-import { filterToggleReportHref } from "@/lib/filter-report";
+import { useOrganizeJob } from "@/hooks/useOrganizeJob";
+import {
+	filterRunReportHref,
+	filterToggleReportHref,
+} from "@/lib/filter-report";
 import { buildMailboxRoleMap, labelForMailbox } from "@/lib/folder-roles";
 import { buildMoveOptions, folderDelimiter } from "@/lib/move-options";
+import { filterRunStatus } from "@/lib/organize/filter-run";
 import { SETTINGS_ID_TO_PATH, SETTINGS_NAV_ITEMS } from "@/routes/settings";
 
 export const Route = createFileRoute("/settings/filters")({
@@ -55,6 +60,17 @@ export function AccountFilters({
 		useFilterList(accountId);
 	const { deleteFilter, deletingFilterId } = useDeleteFilter(accountId);
 	const toggle = useToggleFilter(accountId);
+	const run = useOrganizeJob(accountId);
+	const { startForFilter } = run;
+	const [runFilterId, setRunFilterId] = useState<string | undefined>();
+	const runNow = useCallback(
+		(filterId: string) => {
+			setRunFilterId(filterId);
+			startForFilter(filterId);
+		},
+		[startForFilter],
+	);
+	const runStatus = filterRunStatus(run);
 	const [editingFilterId, setEditingFilterId] = useState<string | undefined>();
 
 	const { data: mailboxesData } = useQuery({
@@ -108,6 +124,9 @@ export function AccountFilters({
 	const editingFilter = filters.find(
 		(filter) => filter.filterId === editingFilterId,
 	);
+	const runName = filters.find(
+		(filter) => filter.filterId === runFilterId,
+	)?.name;
 
 	return (
 		<section className="space-y-2">
@@ -141,13 +160,29 @@ export function AccountFilters({
 			) : (
 				<>
 					{toggle.isError && (
-						<FilterToggleError
-							enabling={toggle.enabling}
+						<FilterActionError
+							title={
+								toggle.enabling
+									? "Couldn't turn the filter on"
+									: "Couldn't turn the filter off"
+							}
 							error={toggle.error}
 							onRetry={toggle.retry}
 							reportHref={filterToggleReportHref}
 						/>
 					)}
+					{runFilterId && runStatus?.kind === "failed" && (
+						<FilterActionError
+							title={`Couldn't run ${runName ?? "the filter"} over the inbox`}
+							error={runStatus.error}
+							onRetry={
+								run.failure?.kind === "statusUnreadable"
+									? run.refreshStatus
+									: () => runNow(runFilterId)
+							}
+							reportHref={filterRunReportHref}
+						/>
+					)}
 					<FiltersList
 						filters={filters}
 						mailboxName={mailboxName}
@@ -157,6 +192,9 @@ export function AccountFilters({
 						deletingFilterId={deletingFilterId}
 						onToggle={toggle.toggleFilter}
 						togglingFilterId={toggle.togglingFilterId}
+						onRunNow={runNow}
+						runFilterId={runFilterId}
+						runStatus={runStatus}
 					/>
 				</>
 			)}