@remit/web-client 0.0.240 → 0.0.242

package/src/hooks/useStaleAccountSync.ts

@@ -275,21 +275,28 @@ export const useStaleAccountSync = (
 				return;
 			}
 			// Hidden: don't reschedule. `handleVisibilityChange` resumes the loop
-			// (with an immediate catch-up poll) once the tab is visible again.
-			// A hot window running out while the tab is away costs nothing —
-			// there is nobody watching a list to keep current.
+			// (with an immediate catch-up poll if one is due) once the tab is
+			// visible again. A hot window running out while the tab is away costs
+			// nothing — there is nobody watching a list to keep current.
 		};
 
+		// A tick that fired while the tab was hidden left no timer behind, so
+		// coming back is the only thing that can re-arm the loop — it does so
+		// unconditionally. Due-ness decides whether this tab polls *now*, never
+		// whether a next tick exists: a tab that went to sleep on the hot cadence
+		// and came back after the window lapsed is not due against a longer
+		// ambient interval, and used to stop polling for good (#1031).
 		const handleVisibilityChange = () => {
 			if (document.visibilityState !== "visible") return;
-			if (
-				!hasPollIntervalElapsed(Date.now(), lastPollAt, currentPollIntervalMs())
-			) {
+			if (timeoutId !== undefined) clearTimeout(timeoutId);
+			const now = Date.now();
+			const intervalMs = currentPollIntervalMs(now);
+			if (hasPollIntervalElapsed(now, lastPollAt, intervalMs)) {
+				poll();
+				timeoutId = setTimeout(tick, intervalMs);
 				return;
 			}
-			if (timeoutId !== undefined) clearTimeout(timeoutId);
-			poll();
-			timeoutId = setTimeout(tick, currentPollIntervalMs());
+			timeoutId = setTimeout(tick, lastPollAt + intervalMs - now);
 		};
 
 		// A press opens the hot window, but this loop may already be asleep on a

package/src/lib/api.ts

@@ -1,3 +1,4 @@
+import type { ApiError as ApiErrorWireBody } from "@remit/api-http-client/types.gen.ts";
 import { taggedFetch } from "./network-error";
 
 export class ApiError extends Error {
@@ -11,6 +12,46 @@ export class ApiError extends Error {
 	}
 }
 
+/**
+ * The wire body's coded half, re-checked at runtime. `ApiErrorWireBody` is the
+ * generated flat shape the API sends; `ApiError` is the class every HTTP
+ * failure arrives in, carrying that body at `.body`. Reading `code` off the
+ * class is the bug #1004 is about, so nothing outside this module reaches for
+ * either shape directly.
+ */
+export interface CodedApiErrorBody {
+	code: ApiErrorWireBody["code"];
+	details: Record<string, unknown> | undefined;
+}
+
+const isRecord = (value: unknown): value is Record<string, unknown> =>
+	typeof value === "object" && value !== null && !Array.isArray(value);
+
+export const codedApiErrorBody = (
+	error: unknown,
+): CodedApiErrorBody | undefined => {
+	const body = error instanceof ApiError ? error.body : error;
+	if (!isRecord(body)) return undefined;
+	const { code, details } = body;
+	if (typeof code !== "string") return undefined;
+	return { code, details: isRecord(details) ? details : undefined };
+};
+
+const failureMessage = (body: unknown, status: number): string => {
+	if (isRecord(body) && body.message !== undefined && body.message !== null) {
+		const message = String(body.message);
+		if (message) return message;
+	}
+	return `Request failed with status ${status}`;
+};
+
+/**
+ * The one place an HTTP failure becomes an `ApiError`, so a test can hand a
+ * consumer the exact value the error interceptor produces.
+ */
+export const wrapHttpFailure = (body: unknown, status: number): ApiError =>
+	new ApiError(failureMessage(body, status), status, body);
+
 interface RequestOptions extends Omit<RequestInit, "body"> {
 	params?: Record<string, string | number | boolean | undefined>;
 	body?: unknown;
@@ -52,11 +93,7 @@ const request = async <T>(
 
 	if (!response.ok) {
 		const errorBody = await response.json().catch(() => undefined);
-		throw new ApiError(
-			errorBody?.message || `Request failed with status ${response.status}`,
-			response.status,
-			errorBody,
-		);
+		throw wrapHttpFailure(errorBody, response.status);
 	}
 
 	if (response.status === 204) {

package/src/lib/client.test.ts

@@ -0,0 +1,68 @@
+import assert from "node:assert/strict";
+import { afterEach, describe, it } from "node:test";
+import { trashOperationsEmptyTrash } from "@remit/api-http-client/sdk.gen.ts";
+import { type HttpMock, mockFetch } from "../test-support/http";
+import { ApiError } from "./api";
+import "./client";
+
+let http: HttpMock | undefined;
+
+afterEach(() => {
+	http?.restore();
+	http = undefined;
+});
+
+const answer = (status: number, body: unknown): void => {
+	http = mockFetch(
+		() =>
+			new Response(JSON.stringify(body), {
+				status,
+				headers: { "content-type": "application/json" },
+			}),
+	);
+};
+
+const empty = (): Promise<unknown> =>
+	trashOperationsEmptyTrash({
+		path: { accountId: "acc-1" },
+		throwOnError: true,
+	});
+
+describe("the error interceptor", () => {
+	it("hands the app an ApiError carrying the status and the wire body", async () => {
+		answer(409, {
+			code: "folder_role_unresolved",
+			message: "Nobody has confirmed which folder is this account's Trash",
+			details: { reason: "unconfirmed", role: "Trash", accountId: "acc-1" },
+		});
+
+		const error = await empty().then(
+			() => undefined,
+			(reason: unknown) => reason,
+		);
+
+		assert.ok(error instanceof ApiError);
+		assert.equal(error.status, 409);
+		assert.equal(
+			error.message,
+			"Nobody has confirmed which folder is this account's Trash",
+		);
+		assert.deepEqual(error.body, {
+			code: "folder_role_unresolved",
+			message: "Nobody has confirmed which folder is this account's Trash",
+			details: { reason: "unconfirmed", role: "Trash", accountId: "acc-1" },
+		});
+	});
+
+	it("falls back to the status when the body states no message", async () => {
+		answer(503, {});
+
+		const error = await empty().then(
+			() => undefined,
+			(reason: unknown) => reason,
+		);
+
+		assert.ok(error instanceof ApiError);
+		assert.equal(error.message, "Request failed with status 503");
+	});
+});

package/src/lib/client.ts

@@ -1,6 +1,6 @@
 import { client } from "@remit/api-http-client/client.gen.ts";
 import { getRuntimeConfig } from "../runtime-config";
-import { ApiError } from "./api";
+import { ApiError, wrapHttpFailure } from "./api";
 import { taggedFetch } from "./network-error";
 
 // In production, the config.js apiUrl points at the deployed API Gateway.
@@ -27,13 +27,7 @@ client.interceptors.error.use((error, response) => {
 	if (error instanceof ApiError) return error;
 	if (!response) return error;
 
-	const body = error;
-	const message =
-		body && typeof body === "object" && "message" in body
-			? String((body as { message: unknown }).message)
-			: `Request failed with status ${response.status}`;
-
-	return new ApiError(message, response.status, body);
+	return wrapHttpFailure(error, response.status);
 });
 
 export { client };

package/src/routes/settings/folders.tsx

@@ -31,6 +31,7 @@ import { isMailboxNotSettledRefusal } from "@/components/ui/folder-role-refusal"
 import { useCreateMailbox } from "@/hooks/useCreateMailbox";
 import { useFolderLabelTranslator } from "@/hooks/useFolderLabelTranslator";
 import { guardFolderDeletion } from "@/lib/delete-folder";
+import { softErrorStatuses } from "@/lib/error-classifier";
 import {
 	buildMailboxRoleMap,
 	CANONICAL_TO_NAV_ROLE,
@@ -57,6 +58,9 @@ function AccountFolders({ account }: { account: RemitImapAccountResponse }) {
 
 	const appointMutation = useMutation({
 		...folderRoleOperationsAppointFolderRoleMutation(),
+		// The pane states a still-settling mailbox inline; see the same meta on
+		// the prompt's own write.
+		meta: softErrorStatuses(409),
 		onSuccess: () => {
 			queryClient.invalidateQueries({
 				queryKey: configOperationsGetConfigQueryKey(),

package/src/test-support/http.ts

@@ -71,8 +71,9 @@ export const mockFetch = (responder: Responder = () => ({})): HttpMock => {
 
 /**
  * A failed request. The status travels in the body as well as on the response:
- * the generated client throws the parsed body, and the app's error classifier
- * reads the status off it.
+ * the generated client throws the parsed body, which the error interceptor
+ * re-wraps as an `ApiError` carrying the response status. Anything read off the
+ * body — a `code`, its `details` — sits at `.body`, never at the top level.
  */
 export const httpError = (status: number, message = "boom"): Response =>
 	new Response(JSON.stringify({ status, message }), {