@remit/web-client 0.0.325 → 0.0.327

package/src/auth/SessionRateLimited.stories.tsx

@@ -1,26 +0,0 @@
-import type { Meta, StoryObj } from "@storybook/react-vite";
-import { SessionRateLimited } from "./SessionRateLimited";
-
-/**
- * What a 429 on the session lookup looks like (#441). Before this state
- * existed the gate fell through to the sign-in screen, so a throttled instance
- * told everyone behind the address that they had been logged out.
- */
-const meta: Meta<typeof SessionRateLimited> = {
-	title: "Playground/Shipped/Sign in/Session rate limited",
-	component: SessionRateLimited,
-	parameters: { layout: "fullscreen" },
-	args: {
-		onRetry: () => undefined,
-		onReport: () => undefined,
-	},
-};
-export default meta;
-
-type Story = StoryObj<typeof SessionRateLimited>;
-
-export const Default: Story = {};
-
-export const Dark: Story = {
-	parameters: { theme: "dark" },
-};

package/src/auth/SessionRateLimited.tsx

@@ -1,39 +0,0 @@
-import { AuthCard, AuthHero, Banner, Button } from "@remit/ui";
-
-export interface SessionRateLimitedProps {
-	onRetry: () => void;
-	onReport: () => void;
-}
-
-/**
- * The session could not be checked because the server is throttling this
- * address. Shown instead of the sign-in screen, which would claim a sign-out
- * that never happened (#441). The limits are keyed by IP, so a household, an
- * office, a VPN exit or a handful of open tabs all spend one budget — the copy
- * says so, because otherwise a single user cannot explain what they did wrong.
- */
-export const SessionRateLimited = ({
-	onRetry,
-	onReport,
-}: SessionRateLimitedProps) => (
-	<AuthCard>
-		<AuthHero />
-		<div className="flex flex-col gap-4 rounded-lg border border-line bg-surface p-7 shadow-lg">
-			<Banner tone="warning">
-				<p className="font-medium">Too many requests from this address</p>
-				<p className="mt-1">
-					The server is limiting requests from your network address, so it could
-					not check whether you are signed in. You have not been signed out.
-				</p>
-			</Banner>
-			<p className="text-sm text-fg-muted">
-				Wait a minute and try again. Everyone behind the same address — other
-				people on this network, and every tab you have open — shares one limit.
-			</p>
-			<Button onClick={onRetry}>Try again</Button>
-			<Button variant="ghost" size="sm" onClick={onReport}>
-				Report an issue
-			</Button>
-		</div>
-	</AuthCard>
-);

package/src/auth/SignInAgain.tsx

@@ -1,18 +0,0 @@
-import { useAuthProvider } from "@/auth/provider";
-
-export function SignInAgain() {
-	const { Account } = useAuthProvider();
-	return (
-		<Account>
-			{({ signOut }) => (
-				<button
-					type="button"
-					onClick={() => signOut()}
-					className="rounded-md border border-line px-2.5 py-1 text-sm font-medium text-fg outline-none hover:bg-surface-sunken focus-visible:ring-2 focus-visible:ring-ring"
-				>
-					Sign in again
-				</button>
-			)}
-		</Account>
-	);
-}

package/src/auth/account-menu-mode.test.ts

@@ -1,64 +0,0 @@
-import assert from "node:assert";
-import { describe, test } from "node:test";
-import { COGNITO_FOOTER_NOTE } from "@remit/ui";
-import { accountMenuMode, authFooterNote } from "./account-menu-mode";
-
-describe("accountMenuMode", () => {
-	test("prefers better-auth when enabled", () => {
-		assert.equal(
-			accountMenuMode({ betterAuthEnabled: true, cognitoConfigured: false }),
-			"betterAuth",
-		);
-	});
-
-	test("better-auth wins even when cognito is also configured", () => {
-		assert.equal(
-			accountMenuMode({ betterAuthEnabled: true, cognitoConfigured: true }),
-			"betterAuth",
-		);
-	});
-
-	test("falls back to cognito when only cognito is configured", () => {
-		assert.equal(
-			accountMenuMode({ betterAuthEnabled: false, cognitoConfigured: true }),
-			"cognito",
-		);
-	});
-
-	test("renders nothing when neither identity provider is active", () => {
-		assert.equal(
-			accountMenuMode({ betterAuthEnabled: false, cognitoConfigured: false }),
-			"none",
-		);
-	});
-});
-
-describe("authFooterNote", () => {
-	test("names Cognito only when Cognito is the active provider", () => {
-		assert.equal(
-			authFooterNote({ betterAuthEnabled: false, cognitoConfigured: true }),
-			COGNITO_FOOTER_NOTE,
-		);
-	});
-
-	test("stays provider-neutral in better-auth mode", () => {
-		assert.equal(
-			authFooterNote({ betterAuthEnabled: true, cognitoConfigured: false }),
-			undefined,
-		);
-	});
-
-	test("stays provider-neutral when better-auth wins over present cognito env", () => {
-		assert.equal(
-			authFooterNote({ betterAuthEnabled: true, cognitoConfigured: true }),
-			undefined,
-		);
-	});
-
-	test("stays provider-neutral when no provider is configured", () => {
-		assert.equal(
-			authFooterNote({ betterAuthEnabled: false, cognitoConfigured: false }),
-			undefined,
-		);
-	});
-});

package/src/auth/account-menu-mode.ts

@@ -1,28 +0,0 @@
-import { COGNITO_FOOTER_NOTE } from "@remit/ui";
-
-export type AccountMenuMode = "betterAuth" | "cognito" | "none";
-
-export interface AccountMenuModeInput {
-	betterAuthEnabled: boolean;
-	cognitoConfigured: boolean;
-}
-
-export const accountMenuMode = ({
-	betterAuthEnabled,
-	cognitoConfigured,
-}: AccountMenuModeInput): AccountMenuMode => {
-	if (betterAuthEnabled) return "betterAuth";
-	if (cognitoConfigured) return "cognito";
-	return "none";
-};
-
-/**
- * The sign-in footer caption names Cognito only when Cognito is the active
- * provider. Every other mode falls through to the kit's provider-neutral
- * default, so the caption can never claim an identity provider the build does
- * not use.
- */
-export const authFooterNote = (
-	input: AccountMenuModeInput,
-): string | undefined =>
-	accountMenuMode(input) === "cognito" ? COGNITO_FOOTER_NOTE : undefined;

package/src/auth/amplify-config.test.ts

@@ -1,50 +0,0 @@
-import assert from "node:assert";
-import { describe, test } from "node:test";
-
-type TestConfig = {
-	cognito?: {
-		userPoolId?: string;
-		clientId?: string;
-		domain?: string;
-		region?: string;
-	};
-	appOrigin?: string;
-};
-let cacheBust = 0;
-
-const loadModule = async (config: TestConfig) => {
-	cacheBust += 1;
-	globalThis.__REMIT_CONFIG__ = config;
-	return import(`./amplify-config.ts?v=${cacheBust}`);
-};
-
-const fullConfig: TestConfig = {
-	cognito: {
-		userPoolId: "us-east-1_pool",
-		clientId: "client-id",
-		domain: "example.auth.us-east-1.amazoncognito.com",
-		region: "us-east-1",
-	},
-};
-
-describe("isCognitoConfigured", () => {
-	test("returns true when userPoolId and clientId are present", async () => {
-		const mod = await loadModule(fullConfig);
-		assert.equal(mod.isCognitoConfigured(), true);
-	});
-
-	test("returns false when both values are missing", async () => {
-		const mod = await loadModule({});
-		assert.equal(mod.isCognitoConfigured(), false);
-	});
-
-	test("returns false when only userPoolId is set", async () => {
-		const mod = await loadModule({ cognito: { userPoolId: "pool" } });
-		assert.equal(mod.isCognitoConfigured(), false);
-	});
-
-	test("returns false when only clientId is set", async () => {
-		const mod = await loadModule({ cognito: { clientId: "client" } });
-		assert.equal(mod.isCognitoConfigured(), false);
-	});
-});

package/src/auth/amplify-config.ts

@@ -1,59 +0,0 @@
-import { Amplify } from "aws-amplify";
-import { getRuntimeConfig } from "../runtime-config";
-
-export interface CognitoEnv {
-	userPoolId: string;
-	userPoolClientId: string;
-	domain: string;
-	region: string;
-	appOrigin: string;
-}
-
-const readCognitoEnv = (): CognitoEnv | null => {
-	const config = getRuntimeConfig();
-	const { userPoolId, clientId, domain, region } = config.cognito;
-
-	if (!userPoolId || !clientId) return null;
-
-	return {
-		userPoolId,
-		userPoolClientId: clientId,
-		domain,
-		region,
-		appOrigin: config.appOrigin,
-	};
-};
-
-export const isCognitoConfigured = (): boolean => readCognitoEnv() !== null;
-
-export const configureAmplify = (): void => {
-	const cognitoEnv = readCognitoEnv();
-	if (!cognitoEnv) {
-		console.warn(
-			"[auth] Cognito user pool is not configured. Running in local dev mode without Cognito auth.",
-		);
-		return;
-	}
-
-	const { userPoolId, userPoolClientId, domain, appOrigin } = cognitoEnv;
-
-	Amplify.configure({
-		Auth: {
-			Cognito: {
-				userPoolId,
-				userPoolClientId,
-				loginWith: domain
-					? {
-							oauth: {
-								domain,
-								scopes: ["openid", "email", "profile"],
-								redirectSignIn: appOrigin ? [appOrigin] : [],
-								redirectSignOut: appOrigin ? [appOrigin] : [],
-								responseType: "code",
-							},
-						}
-					: undefined,
-			},
-		},
-	});
-};

package/src/auth/auth-error.test.ts

@@ -1,129 +0,0 @@
-import assert from "node:assert/strict";
-import { afterEach, describe, it } from "node:test";
-import { __resetFatalError, getCurrentFatalError } from "@/lib/fatal-error";
-import {
-	type AuthRequest,
-	authInlineMessage,
-	buildFatalAuthMessage,
-	classifyAuthError,
-	reportFatalAuthError,
-} from "./auth-error";
-
-const SIGN_UP: AuthRequest = {
-	method: "POST",
-	path: "/api/auth/sign-up/email",
-};
-
-describe("classifyAuthError", () => {
-	it("treats a 404 on our own route as fatal", () => {
-		assert.equal(
-			classifyAuthError({ status: 404, statusText: "Not Found" }),
-			"fatal",
-		);
-	});
-
-	it("treats a 5xx as fatal", () => {
-		assert.equal(
-			classifyAuthError({ status: 503, statusText: "Service Unavailable" }),
-			"fatal",
-		);
-	});
-
-	it("treats an unexpected 4xx with no message as fatal", () => {
-		assert.equal(classifyAuthError({ status: 418 }), "fatal");
-	});
-
-	it("treats an expected, server-described 4xx as validation", () => {
-		assert.equal(
-			classifyAuthError({
-				status: 422,
-				code: "USER_ALREADY_EXISTS",
-				message: "User already exists.",
-			}),
-			"validation",
-		);
-		assert.equal(
-			classifyAuthError({
-				status: 401,
-				code: "INVALID_EMAIL_OR_PASSWORD",
-				message: "Invalid email or password.",
-			}),
-			"validation",
-		);
-	});
-
-	it("treats a 429 as rate limited, not as a rejected credential (#441)", () => {
-		assert.equal(
-			classifyAuthError({
-				status: 429,
-				statusText: "Too Many Requests",
-				message: "Too many requests. Please try again later.",
-			}),
-			"rateLimited",
-		);
-	});
-
-	it("treats a statusless failure as network", () => {
-		assert.equal(classifyAuthError(new Error("Failed to fetch")), "network");
-	});
-
-	it("treats better-auth's Fetch Error sentinel as network", () => {
-		assert.equal(
-			classifyAuthError({
-				status: 500,
-				statusText: "Fetch Error",
-				message: "Fetch related error.",
-			}),
-			"network",
-		);
-	});
-});
-
-describe("authInlineMessage", () => {
-	it("surfaces the server's message for a validation error", () => {
-		assert.equal(
-			authInlineMessage(
-				{ status: 422, message: "User already exists." },
-				"validation",
-			),
-			"User already exists.",
-		);
-	});
-
-	it("gives a connection hint for a network error", () => {
-		assert.match(authInlineMessage(new Error("boom"), "network"), /offline/i);
-	});
-
-	it("says the limit is shared by address, over the server's bare wording", () => {
-		const message = authInlineMessage(
-			{ status: 429, message: "Too many requests. Please try again later." },
-			"rateLimited",
-		);
-		assert.match(message, /this address/i);
-		assert.match(message, /wait a minute/i);
-	});
-});
-
-describe("buildFatalAuthMessage", () => {
-	it("names the method, path, and status, with 404 troubleshooting guidance", () => {
-		const message = buildFatalAuthMessage(
-			{ status: 404, statusText: "Not Found" },
-			SIGN_UP,
-		);
-		assert.match(message, /POST \/api\/auth\/sign-up\/email/);
-		assert.match(message, /404 Not Found/);
-		assert.match(message, /backend is running and up to date/);
-	});
-});
-
-describe("reportFatalAuthError", () => {
-	afterEach(() => __resetFatalError());
-
-	it("escalates to a non-recoverable fatal carrying the request detail", () => {
-		reportFatalAuthError({ status: 404, statusText: "Not Found" }, SIGN_UP);
-		const fatal = getCurrentFatalError();
-		assert.ok(fatal);
-		assert.equal(fatal.recoverable, false);
-		assert.match(fatal.message, /POST \/api\/auth\/sign-up\/email failed: 404/);
-	});
-});

package/src/auth/auth-error.ts

@@ -1,120 +0,0 @@
-import { getErrorStatus, isAbortError } from "@/lib/error-classifier";
-import { reportFatalError } from "@/lib/fatal-error";
-
-/**
- * How an auth (better-auth) failure should surface.
- *
- *  - "network"    — the request never reached the server (offline / unreachable).
- *                   Inline, correctable by the user: check the connection.
- *  - "validation" — an expected, user-correctable rejection the server
- *                   described (email already registered, weak password, wrong
- *                   credentials). Inline, surfacing the server's own message.
- *  - "rateLimited" — a 429. Nothing is wrong with the credentials or the
- *                   deployment; the address has spent its budget and the same
- *                   attempt works after a wait. Inline, and named as its own
- *                   thing so it is never read as a rejection (#441).
- *  - "fatal"      — a 404, or any other unexpected 4xx/5xx from our own API. The
- *                   deployment or the client/server contract is broken and there
- *                   is nothing the user can retry their way out of. Escalates to
- *                   the full-screen fatal page with a bug-report link.
- */
-export type AuthErrorClass = "network" | "validation" | "rateLimited" | "fatal";
-
-/** The request being attempted, for a fatal report that names method and path. */
-export interface AuthRequest {
-	method: string;
-	path: string;
-}
-
-/** better-auth's client sentinel for a fetch that never got an HTTP response. */
-const FETCH_ERROR_STATUS_TEXT = "Fetch Error";
-
-const TOO_MANY_REQUESTS = 429;
-
-const readString = (error: unknown, key: string): string | undefined => {
-	if (error && typeof error === "object" && key in error) {
-		const value = (error as Record<string, unknown>)[key];
-		if (typeof value === "string" && value.trim().length > 0) return value;
-	}
-	return undefined;
-};
-
-/** The human message better-auth attaches to a known, expected rejection. */
-export const authServerMessage = (error: unknown): string | undefined =>
-	readString(error, "message");
-
-const isNetworkFailure = (error: unknown): boolean => {
-	if (isAbortError(error)) return false;
-	if (readString(error, "statusText") === FETCH_ERROR_STATUS_TEXT) return true;
-	return getErrorStatus(error) === undefined;
-};
-
-/**
- * Sort an auth failure into how it should surface. A 404 or any other
- * unexpected 4xx/5xx from our own API is fatal — a broken deployment or
- * contract, not something a retry fixes. Only a statusless connectivity failure
- * or an expected, server-described rejection stays inline.
- */
-export const classifyAuthError = (error: unknown): AuthErrorClass => {
-	if (isNetworkFailure(error)) return "network";
-	const status = getErrorStatus(error);
-	if (status === undefined) return "fatal";
-	if (status === TOO_MANY_REQUESTS) return "rateLimited";
-	if (status === 404 || status >= 500) return "fatal";
-	if (authServerMessage(error)) return "validation";
-	return "fatal";
-};
-
-const NETWORK_MESSAGE =
-	"Can't reach the server. You may be offline — check your connection and try again.";
-
-// The server's own 429 body says only "Too many requests"; it cannot say what
-// the budget is shared with, and that is the part a single user needs to hear.
-const RATE_LIMITED_MESSAGE =
-	"Too many requests from this address. Everyone behind the same address — other people on this network, and every tab you have open — shares one limit. Wait a minute and try again.";
-
-/** The inline banner text for a network, rate-limited or validation failure. */
-export const authInlineMessage = (
-	error: unknown,
-	kind: AuthErrorClass,
-): string => {
-	if (kind === "network") return NETWORK_MESSAGE;
-	if (kind === "rateLimited") return RATE_LIMITED_MESSAGE;
-	return authServerMessage(error) ?? "Please check your details and try again.";
-};
-
-const statusSummary = (error: unknown): string => {
-	const status = getErrorStatus(error);
-	if (status === undefined) return "no response";
-	const statusText = readString(error, "statusText");
-	return statusText ? `${status} ${statusText}` : String(status);
-};
-
-/** The message shown on the fatal page and prefilled into the bug report. */
-export const buildFatalAuthMessage = (
-	error: unknown,
-	request: AuthRequest,
-): string => {
-	const summary = statusSummary(error);
-	const guidance =
-		getErrorStatus(error) === 404
-			? "The endpoint did not respond as expected — check that the backend is running and up to date (see the deployment guide's troubleshooting section)."
-			: "The server returned an unexpected response.";
-	const server = authServerMessage(error);
-	const serverLine = server ? ` Server said: ${server}.` : "";
-	return `${request.method} ${request.path} failed: ${summary}. ${guidance}${serverLine}`;
-};
-
-/**
- * Escalate an unexpected auth failure to the full-screen fatal page. The message
- * names the method, path, and status; the overlay carries the bug-report link.
- * Not recoverable — a broken route or contract does not resolve on retry.
- */
-export const reportFatalAuthError = (
-	error: unknown,
-	request: AuthRequest,
-): void => {
-	reportFatalError(new Error(buildFatalAuthMessage(error, request)), {
-		recoverable: false,
-	});
-};

package/src/auth/auth-interceptor.test.ts

@@ -1,104 +0,0 @@
-import assert from "node:assert";
-import { afterEach, describe, test } from "node:test";
-import { client } from "@remit/api-http-client/client.gen.ts";
-import { trashOperationsEmptyTrash } from "@remit/api-http-client/sdk.gen.ts";
-import { type HttpMock, mockFetch } from "../test-support/http";
-import { AuthTokenError } from "./better-auth-config";
-import { type AuthProvider, noneAuthProvider } from "./provider";
-
-let cacheBust = 1000;
-let http: HttpMock | undefined;
-
-afterEach(() => {
-	http?.restore();
-	http = undefined;
-	client.interceptors.request.clear();
-});
-
-const providerWithToken = (
-	getToken: AuthProvider["getToken"],
-): AuthProvider => ({ ...noneAuthProvider, getToken });
-
-const loadInterceptor = async () => {
-	cacheBust += 1;
-	client.interceptors.request.clear();
-	return import(`./auth-interceptor.ts?v=${cacheBust}`);
-};
-
-const send = (headers?: Record<string, string>): Promise<unknown> => {
-	http = mockFetch();
-	return trashOperationsEmptyTrash({
-		path: { accountId: "acc-1" },
-		headers,
-		throwOnError: true,
-	});
-};
-
-const sentHeaders = (): Record<string, string> => {
-	assert.ok(http, "expected a request to have been sent");
-	assert.equal(http.calls.length, 1);
-	return http.calls[0].headers;
-};
-
-describe("installAuthInterceptor", () => {
-	test("is idempotent — subsequent calls do not register additional interceptors", async () => {
-		const mod = await loadInterceptor();
-		const provider = providerWithToken(async () => null);
-		mod.installAuthInterceptor(provider);
-		mod.installAuthInterceptor(provider);
-		mod.installAuthInterceptor(provider);
-		assert.equal(client.interceptors.request.fns.length, 1);
-	});
-
-	test("attaches the provider's Bearer token when one exists", async () => {
-		const mod = await loadInterceptor();
-		mod.installAuthInterceptor(providerWithToken(async () => "ID-TOKEN-123"));
-		await send();
-		assert.equal(sentHeaders().authorization, "Bearer ID-TOKEN-123");
-	});
-
-	test("abandons the request when the token cannot be minted — never sends it unauthenticated", async () => {
-		const mod = await loadInterceptor();
-		mod.installAuthInterceptor(
-			providerWithToken(async () => {
-				throw new AuthTokenError("Could not mint a session token: 429", 429);
-			}),
-		);
-		await assert.rejects(
-			() => send(),
-			(error: unknown) => {
-				assert.ok(error instanceof AuthTokenError);
-				assert.equal(error.status, 429);
-				return true;
-			},
-		);
-		assert.equal(http?.calls.length, 0);
-	});
-
-	test("omits Authorization header when the deployment presents no identity", async () => {
-		const mod = await loadInterceptor();
-		mod.installAuthInterceptor(providerWithToken(async () => null));
-		await send();
-		assert.equal(sentHeaders().authorization, undefined);
-	});
-
-	test("preserves caller-supplied headers when adding Authorization", async () => {
-		const mod = await loadInterceptor();
-		mod.installAuthInterceptor(providerWithToken(async () => "TOK"));
-		await send({ "X-Trace-Id": "abc-123", "X-Client": "reader" });
-		const headers = sentHeaders();
-		assert.equal(headers["x-trace-id"], "abc-123");
-		assert.equal(headers["x-client"], "reader");
-		assert.equal(headers.authorization, "Bearer TOK");
-	});
-
-	test("propagates errors when the provider's getToken rejects (let it crash)", async () => {
-		const mod = await loadInterceptor();
-		mod.installAuthInterceptor(
-			providerWithToken(async () => {
-				throw new Error("session fetch failed");
-			}),
-		);
-		await assert.rejects(() => send(), /session fetch failed/);
-	});
-});

package/src/auth/auth-interceptor.ts

@@ -1,28 +0,0 @@
-import { client } from "@remit/api-http-client/client.gen.ts";
-import type { AuthProvider } from "./provider";
-
-let installed = false;
-
-/**
- * Attach the composed provider's bearer token to every API request. Called once
- * from `mountApp` with the app's chosen provider, so the token source is the
- * same `AuthProvider` the shell and screens read — no separate seam.
- *
- * A provider that cannot produce a token throws, and that throw is left to
- * propagate: the request is abandoned rather than sent without an Authorization
- * header. Only the deployments that present no identity at all resolve to null,
- * and for those an unauthenticated request is the intended one.
- */
-export const installAuthInterceptor = (authProvider: AuthProvider): void => {
-	if (installed) return;
-
-	client.interceptors.request.use(async (request) => {
-		const token = await authProvider.getToken();
-		if (token) {
-			request.headers.set("Authorization", `Bearer ${token}`);
-		}
-		return request;
-	});
-
-	installed = true;
-};