@burdenoff/microfe-auth 2026.624.2 → 2026.625.1

package/dist/auth/hooks/index.js

@@ -9,6 +9,7 @@ import "./useApiKeyOperations.js";
 import "./useAppOperations.js";
 import "./useWorkspaceOperations.js";
 import "./useContextSwitcherData.js";
+import "./useActiveContextBootstrapMirror.js";
 import "./useDelegationOperations.js";
 import "./useUserOperations.js";
 import "./useSsoOperations.js";

package/dist/auth/hooks/useActiveContextBootstrapMirror.js

@@ -0,0 +1,27 @@
+import { useEffect as e } from "react";
+//#region src/auth/hooks/useActiveContextBootstrapMirror.ts
+function t({ storeOrganizationId: t, storeWorkspaceId: n, storeProjectId: r, activeOrganizationId: i, activeWorkspaceId: a, activeProjectId: o, storeWorkspaces: s, storeProjects: c, setOrganization: l, setWorkspace: u, setProject: d }) {
+	e(() => {
+		t && !i && l(t);
+		let e = i || t, f = !!n && !!e && !!s?.some((t) => t.id === n && t.organizationId === e);
+		n && !a && f && u(n);
+		let p = a || (f ? n : null), m = !!r && !!p && !!c?.some((e) => e.id === r && e.workspaceId === p);
+		r && !o && m && d(r);
+	}, [
+		t,
+		n,
+		r,
+		i,
+		a,
+		o,
+		s,
+		c,
+		l,
+		u,
+		d
+	]);
+}
+//#endregion
+export { t as useActiveContextBootstrapMirror };
+
+//# sourceMappingURL=useActiveContextBootstrapMirror.js.map

package/dist/auth/hooks/useActiveContextBootstrapMirror.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"useActiveContextBootstrapMirror.js","names":[],"sources":["../../../src/auth/hooks/useActiveContextBootstrapMirror.ts"],"sourcesContent":["import { useEffect } from \"react\";\n\ntype ContextId = string | null | undefined;\n\ninterface MirrorWorkspace {\n  id: string;\n  organizationId?: string | null;\n}\n\ninterface MirrorProject {\n  id: string;\n  workspaceId?: string | null;\n}\n\nexport interface ActiveContextBootstrapMirrorArgs {\n  /** Auth-store `currentOrganizationId` */\n  storeOrganizationId: ContextId;\n  /** Auth-store `currentWorkspaceId` */\n  storeWorkspaceId: ContextId;\n  /** Auth-store `currentProjectId` */\n  storeProjectId: ContextId;\n  /** ActiveContext `organizationId` */\n  activeOrganizationId: ContextId;\n  /** ActiveContext `workspaceId` */\n  activeWorkspaceId: ContextId;\n  /** ActiveContext `projectId` */\n  activeProjectId: ContextId;\n  /**\n   * The auth store's loaded `workspaces`. Used to verify that\n   * `storeWorkspaceId` actually belongs to the organization being mirrored\n   * before it is filled. If omitted, the workspace axis is never mirrored\n   * (safe default — better no workspace than one from the wrong org).\n   */\n  storeWorkspaces?: ReadonlyArray<MirrorWorkspace>;\n  /**\n   * The auth store's loaded `projects`. Used to verify that `storeProjectId`\n   * actually belongs to the workspace being mirrored before it is filled. If\n   * omitted, the project axis is never mirrored.\n   */\n  storeProjects?: ReadonlyArray<MirrorProject>;\n  /**\n   * ActiveContext setters. Must be **stable references** (they are, coming\n   * from `ActiveContextProvider`'s memoized value) — passing inline arrows\n   * makes this effect re-run every render. Likewise prefer stable references\n   * for `storeWorkspaces` / `storeProjects` (e.g. a shallow-equal Zustand\n   * selector or `useMemo`); a new array reference each render re-runs the\n   * effect. Re-runs are harmless (the fills are idempotent), just wasted work.\n   */\n  setOrganization: (organizationId: string | null) => void;\n  setWorkspace: (workspaceId: string | null) => void;\n  setProject: (projectId: string | null) => void;\n}\n\n/**\n * One-way, **fill-only** mirror of the auth store's org / workspace / project\n * ids into ActiveContext, for app-shell headers / context switchers.\n *\n * Some context ids are derived programmatically in the Zustand auth store\n * without a paired ActiveContext write:\n * - the bootstrap in `useContextSwitcherData` auto-selects an organization\n *   (`setCurrentOrganizationId`) and, on the persisted-workspace path, a\n *   workspace (`setCurrentWorkspaceId`) without calling `setActiveContext`;\n * - `useProjectSyncEffect` / `selectWorkspace` auto-select a project.\n *\n * ActiveContext is the source of truth for the URL + storage + the props passed\n * to workspace MFEs and the workspace-token context, so those store-only ids\n * must reach it — otherwise e.g. a fresh `defaultWorkspaceId` login leaves\n * `organizationId` undefined and the token / MFE context break until the user\n * reselects.\n *\n * The rule is **fill, never override**: copy a store id into ActiveContext only\n * when ActiveContext has no value for that axis yet. We must NOT overwrite a\n * non-null ActiveContext value, because:\n *  1. it would clobber an explicit selection — a switch handler's write, or a\n *     deep-link / browser-back `?workspace=`/`?project=` that the router already\n *     applied; and\n *  2. overriding is exactly what turns this into a two-store ping-pong — the\n *     store→AC and AC→store effects each read the other's pre-commit value and\n *     swap the ids every commit until React throws \"Maximum update depth\n *     exceeded\" (error #185). Filling only nulls is self-terminating: once the\n *     axis is set the guard is false forever, so it can never alternate.\n *\n * Cross-context safety: a value is filled only when it provably belongs to the\n * parent context being mirrored, validated against the loaded store metadata —\n * the **workspace** must belong to the target organization (`storeWorkspaces`),\n * and the **project** must belong to the target workspace (`storeProjects`).\n * The store can transiently hold a stale child id after its parent advanced\n * (e.g. `useContextSwitcherData` copies a new org into the store before the new\n * org's — unpersisted — workspace list loads, leaving `currentWorkspaceId`\n * pointing at the previous org; or the workspace advances to B while the\n * project still points at A). Gating on loaded metadata means such a stale id\n * isn't in the list yet, so it is not mirrored until it is genuinely valid.\n *\n * See BOFF-2805.\n */\nexport function useActiveContextBootstrapMirror({\n  storeOrganizationId,\n  storeWorkspaceId,\n  storeProjectId,\n  activeOrganizationId,\n  activeWorkspaceId,\n  activeProjectId,\n  storeWorkspaces,\n  storeProjects,\n  setOrganization,\n  setWorkspace,\n  setProject,\n}: ActiveContextBootstrapMirrorArgs): void {\n  useEffect(() => {\n    if (storeOrganizationId && !activeOrganizationId) {\n      setOrganization(storeOrganizationId);\n    }\n\n    // Fill the workspace only when it provably belongs to the organization\n    // ActiveContext is on (or is being filled this pass). Guards against\n    // publishing a (org, workspace) pair from two different orgs while the\n    // store's org has advanced but its (unpersisted) workspace list / current\n    // workspace id has not caught up.\n    const targetOrganizationId = activeOrganizationId || storeOrganizationId;\n    const workspaceBelongsToTargetOrganization =\n      !!storeWorkspaceId &&\n      !!targetOrganizationId &&\n      !!storeWorkspaces?.some(\n        (workspace) =>\n          workspace.id === storeWorkspaceId &&\n          workspace.organizationId === targetOrganizationId,\n      );\n\n    if (\n      storeWorkspaceId &&\n      !activeWorkspaceId &&\n      workspaceBelongsToTargetOrganization\n    ) {\n      setWorkspace(storeWorkspaceId);\n    }\n\n    // Fill the project only when it provably belongs to the workspace\n    // ActiveContext is on (or is being filled this pass). Prevents a stale\n    // project from a previously-selected workspace leaking across a switch.\n    // Fall back to the store workspace only when it is being filled this pass;\n    // otherwise (e.g. workspace fill skipped because its metadata hasn't\n    // loaded) we'd let a project fill without its parent workspace present,\n    // an inconsistent (org, null, project) state.\n    const targetWorkspaceId =\n      activeWorkspaceId ||\n      (workspaceBelongsToTargetOrganization ? storeWorkspaceId : null);\n    const projectBelongsToTargetWorkspace =\n      !!storeProjectId &&\n      !!targetWorkspaceId &&\n      !!storeProjects?.some(\n        (project) =>\n          project.id === storeProjectId &&\n          project.workspaceId === targetWorkspaceId,\n      );\n\n    if (storeProjectId && !activeProjectId && projectBelongsToTargetWorkspace) {\n      setProject(storeProjectId);\n    }\n  }, [\n    storeOrganizationId,\n    storeWorkspaceId,\n    storeProjectId,\n    activeOrganizationId,\n    activeWorkspaceId,\n    activeProjectId,\n    storeWorkspaces,\n    storeProjects,\n    setOrganization,\n    setWorkspace,\n    setProject,\n  ]);\n}\n"],"mappings":";;AA+FA,SAAgB,EAAgC,EAC9C,wBACA,qBACA,mBACA,yBACA,sBACA,oBACA,oBACA,kBACA,oBACA,iBACA,iBACyC;AACzC,SAAgB;AACd,EAAI,KAAuB,CAAC,KAC1B,EAAgB,EAAoB;EAQtC,IAAM,IAAuB,KAAwB,GAC/C,IACJ,CAAC,CAAC,KACF,CAAC,CAAC,KACF,CAAC,CAAC,GAAiB,MAChB,MACC,EAAU,OAAO,KACjB,EAAU,mBAAmB,EAChC;AAEH,EACE,KACA,CAAC,KACD,KAEA,EAAa,EAAiB;EAUhC,IAAM,IACJ,MACC,IAAuC,IAAmB,OACvD,IACJ,CAAC,CAAC,KACF,CAAC,CAAC,KACF,CAAC,CAAC,GAAe,MACd,MACC,EAAQ,OAAO,KACf,EAAQ,gBAAgB,EAC3B;AAEH,EAAI,KAAkB,CAAC,KAAmB,KACxC,EAAW,EAAe;IAE3B;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC"}

package/dist/auth/index.js

@@ -10,6 +10,7 @@ import "./hooks/usePasswordOperations.js";
 import "./hooks/useSessionOperations.js";
 import "./hooks/useWorkspaceOperations.js";
 import "./hooks/useContextSwitcherData.js";
+import "./hooks/useActiveContextBootstrapMirror.js";
 import "./hooks/useUserOperations.js";
 import "./hooks/index.js";
 import "./hooks/useWorkspaceToken.js";

package/dist/auth/pages/AuditLogPage.js

@@ -6,24 +6,25 @@ import { useState as a } from "react";
 import { useI18n as o } from "@burdenoff/fe-libs/shared/providers/shell";
 import { Fragment as s, jsx as c, jsxs as l } from "react/jsx-runtime";
 import { useFeatureFlagDetails as u } from "@burdenoff/fe-libs/shared/feature-flags";
-import { useGatewayClient as d } from "@burdenoff/fe-libs/shared/graphql";
+import { EmphasisPanel as d, IllustratedEmptyState as f, PagePurpose as p } from "@burdenoff/fe-libs/ui";
+import { useGatewayClient as m } from "@burdenoff/fe-libs/shared/graphql";
 //#region src/auth/pages/AuditLogPage.tsx
-var f = 20;
-function p() {
-	let { t: p } = o(), m = (e, t) => {
-		let n = p(e);
+var h = 20;
+function g() {
+	let { t: g } = o(), _ = (e, t) => {
+		let n = g(e);
 		return n === e ? t : n;
-	}, [h, g] = a(1), _ = (h - 1) * f, v = u("auth.audit-log")?.value === !0, { data: y, loading: b, error: x } = e({
-		skip: !v,
+	}, [v, y] = a(1), b = (v - 1) * h, x = u("auth.audit-log")?.value === !0, { data: S, loading: C, error: w } = e({
+		skip: !x,
 		fetchPolicy: "cache-and-network",
 		variables: { pagination: {
-			limit: f,
-			offset: _
+			limit: h,
+			offset: b
 		} }
-	}), S = y?.authAuditLogs ?? [], C = S.length === f, [w, { loading: T }] = i({ client: d("workspace") }), [E, D] = a(null), O = async () => {
-		D(null);
+	}), T = S?.authAuditLogs ?? [], E = T.length === h, [D, { loading: O }] = i({ client: m("workspace") }), [k, A] = a(null), j = async () => {
+		A(null);
 		try {
-			await w({ variables: { input: {
+			await D({ variables: { input: {
 				name: "Audit Log Export",
 				entityTypes: ["permission_audit_logs"],
 				format: "CSV",
@@ -31,9 +32,9 @@ function p() {
 				includeMetadata: !0
 			} } });
 		} catch (e) {
-			D(e instanceof Error ? e.message : "Failed to start export");
+			A(e instanceof Error ? e.message : "Failed to start export");
 		}
-	}, k = (e) => {
+	}, M = (e) => {
 		switch (e) {
 			case "LOGIN_SUCCESS": return "OK";
 			case "LOGIN_FAILURE": return "ER";
@@ -45,24 +46,24 @@ function p() {
 			default: return "AU";
 		}
 	};
-	return v ? /* @__PURE__ */ l("div", {
+	return x ? /* @__PURE__ */ l("div", {
 		className: "max-w-4xl mx-auto p-6",
 		children: [
 			/* @__PURE__ */ l("div", {
 				className: "flex items-center justify-between mb-8",
 				children: [/* @__PURE__ */ c("h1", {
 					className: "text-3xl font-semibold text-text-primary",
-					children: m("auth.auditLog.title", "Security Audit Log")
+					children: _("auth.auditLog.title", "Security Audit Log")
 				}), /* @__PURE__ */ c("button", {
 					type: "button",
-					onClick: () => void O(),
-					disabled: T,
-					"aria-label": m("auth.auditLog.exportAriaLabel", "Export audit log"),
+					onClick: () => void j(),
+					disabled: O,
+					"aria-label": _("auth.auditLog.exportAriaLabel", "Export audit log"),
 					className: "flex items-center gap-2 px-4 py-2.5 rounded-xl border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken disabled:opacity-50 disabled:cursor-not-allowed transition-colors font-medium",
-					children: T ? /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(n, {
+					children: O ? /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c(n, {
 						className: "size-4 animate-spin",
 						"aria-hidden": "true"
-					}), m("auth.auditLog.exporting", "Exporting...")] }) : /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c("svg", {
+					}), _("auth.auditLog.exporting", "Exporting...")] }) : /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c("svg", {
 						className: "size-4",
 						fill: "none",
 						viewBox: "0 0 24 24",
@@ -74,10 +75,24 @@ function p() {
 							strokeWidth: 2,
 							d: "M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4"
 						})
-					}), m("auth.auditLog.export", "Export")] })
+					}), _("auth.auditLog.export", "Export")] })
 				})]
 			}),
-			E && /* @__PURE__ */ l("div", {
+			/* @__PURE__ */ c(p, {
+				className: "mb-6",
+				children: _("auth.auditLog.purpose", "A running record of security-relevant events on your account — sign-ins, password and MFA changes, and anomalies. Scan it to spot anything you didn't do, and export it for your own records or compliance.")
+			}),
+			/* @__PURE__ */ l(d, {
+				className: "mb-6",
+				children: [/* @__PURE__ */ c("p", {
+					className: "text-sm font-medium text-text-primary",
+					children: _("auth.auditLog.emphasisTitle", "What this log captures")
+				}), /* @__PURE__ */ c("p", {
+					className: "mt-1 text-sm text-text-secondary",
+					children: _("auth.auditLog.emphasisBody", "Successful and failed sign-ins, logouts, password and two-factor changes, and detected anomalies — newest first.")
+				})]
+			}),
+			k && /* @__PURE__ */ l("div", {
 				role: "alert",
 				className: "mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border",
 				children: [/* @__PURE__ */ c(t, {
@@ -85,10 +100,10 @@ function p() {
 					"aria-hidden": "true"
 				}), /* @__PURE__ */ c("p", {
 					className: "text-sm text-status-error-text",
-					children: E
+					children: k
 				})]
 			}),
-			b ? /* @__PURE__ */ l("div", {
+			C ? /* @__PURE__ */ l("div", {
 				"aria-live": "polite",
 				"aria-busy": "true",
 				className: "text-center py-12",
@@ -97,26 +112,27 @@ function p() {
 					"aria-hidden": "true"
 				}), /* @__PURE__ */ c("p", {
 					className: "mt-3 text-text-secondary",
-					children: m("auth.auditLog.loading", "Loading audit events...")
+					children: _("auth.auditLog.loading", "Loading audit events...")
 				})]
-			}) : x ? /* @__PURE__ */ c("div", {
+			}) : w ? /* @__PURE__ */ c("div", {
 				role: "alert",
-				className: "text-center py-12 border border-status-error-border rounded-xl bg-status-error-bg-subtle",
-				children: /* @__PURE__ */ c("p", {
-					className: "text-status-error-text",
-					children: m("auth.auditLog.error", "Unable to load audit events")
+				children: /* @__PURE__ */ c(f, {
+					illustration: "empty-generic",
+					title: _("auth.auditLog.error", "Unable to load audit events"),
+					description: _("auth.auditLog.errorDesc", "Something went wrong fetching your security events. Please try again in a moment.")
 				})
-			}) : S.length === 0 ? /* @__PURE__ */ c("output", {
-				className: "block text-center py-12",
-				children: /* @__PURE__ */ c("p", {
-					className: "text-text-secondary",
-					children: m("auth.auditLog.noEvents", "No security events recorded")
+			}) : T.length === 0 ? /* @__PURE__ */ c("output", {
+				className: "block",
+				children: /* @__PURE__ */ c(f, {
+					illustration: "empty-notifications",
+					title: _("auth.auditLog.noEvents", "No security events recorded"),
+					description: _("auth.auditLog.noEventsDesc", "As you sign in and change security settings, those events will appear here.")
 				})
 			}) : /* @__PURE__ */ l(s, { children: [/* @__PURE__ */ c("div", {
 				className: "space-y-4",
 				"aria-live": "polite",
-				"aria-busy": b,
-				children: S.map((e) => /* @__PURE__ */ c("div", {
+				"aria-busy": C,
+				children: T.map((e) => /* @__PURE__ */ c("div", {
 					className: "p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm",
 					children: /* @__PURE__ */ l("div", {
 						className: "flex items-start gap-4",
@@ -124,7 +140,7 @@ function p() {
 							/* @__PURE__ */ c("div", {
 								className: "flex size-10 shrink-0 items-center justify-center rounded-full bg-bg-sunken text-xs font-semibold text-text-secondary",
 								"aria-hidden": "true",
-								children: k(e.action)
+								children: M(e.action)
 							}),
 							/* @__PURE__ */ l("div", {
 								className: "flex-1",
@@ -142,72 +158,57 @@ function p() {
 									}),
 									/* @__PURE__ */ l("p", {
 										className: "text-sm text-text-secondary",
-										children: [e.description ?? m("auth.auditLog.defaultDescription", "Authentication event"), e.ipAddress && ` • ${e.ipAddress}`]
+										children: [e.description ?? _("auth.auditLog.defaultDescription", "Authentication event"), e.ipAddress && ` • ${e.ipAddress}`]
 									})
 								]
 							}),
 							e.action.includes("FAILURE") && /* @__PURE__ */ c("output", {
 								className: "px-3 py-1 rounded-full bg-status-error-bg-subtle text-status-error-text text-sm font-medium",
-								children: m("auth.auditLog.failed", "Failed")
+								children: _("auth.auditLog.failed", "Failed")
 							})
 						]
 					})
 				}, e.id))
 			}), /* @__PURE__ */ l("nav", {
-				"aria-label": m("auth.auditLog.paginationAriaLabel", "Audit log pagination"),
+				"aria-label": _("auth.auditLog.paginationAriaLabel", "Audit log pagination"),
 				className: "mt-6 flex items-center justify-between",
 				children: [/* @__PURE__ */ l("p", {
 					className: "text-sm text-text-secondary",
 					children: [
-						m("auth.auditLog.page", "Page"),
+						_("auth.auditLog.page", "Page"),
 						" ",
-						h
+						v
 					]
 				}), /* @__PURE__ */ l("div", {
 					className: "flex gap-2",
 					children: [/* @__PURE__ */ c("button", {
 						type: "button",
-						onClick: () => g((e) => Math.max(1, e - 1)),
-						disabled: h === 1,
-						"aria-label": m("auth.auditLog.previousPageAriaLabel", "Go to previous page"),
+						onClick: () => y((e) => Math.max(1, e - 1)),
+						disabled: v === 1,
+						"aria-label": _("auth.auditLog.previousPageAriaLabel", "Go to previous page"),
 						className: "px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors",
-						children: m("auth.auditLog.previous", "Previous")
+						children: _("auth.auditLog.previous", "Previous")
 					}), /* @__PURE__ */ c("button", {
 						type: "button",
-						onClick: () => g((e) => e + 1),
-						disabled: !C,
-						"aria-label": m("auth.auditLog.nextPageAriaLabel", "Go to next page"),
+						onClick: () => y((e) => e + 1),
+						disabled: !E,
+						"aria-label": _("auth.auditLog.nextPageAriaLabel", "Go to next page"),
 						className: "px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors",
-						children: m("auth.auditLog.next", "Next")
+						children: _("auth.auditLog.next", "Next")
 					})]
 				})]
 			})] })
 		]
 	}) : /* @__PURE__ */ c("div", {
 		className: "max-w-4xl mx-auto p-6",
-		children: /* @__PURE__ */ l("div", {
-			className: "text-center py-16 border-2 border-dashed border-border-subtle rounded-xl",
-			children: [
-				/* @__PURE__ */ c("div", {
-					className: "size-16 mx-auto mb-4 rounded-full bg-status-warning-bg-subtle flex items-center justify-center",
-					children: /* @__PURE__ */ c(t, {
-						className: "size-8 text-status-warning-text",
-						"aria-hidden": "true"
-					})
-				}),
-				/* @__PURE__ */ c("h2", {
-					className: "text-xl font-semibold text-text-primary mb-2",
-					children: m("auth.auditLog.notAvailable", "Page Not Available")
-				}),
-				/* @__PURE__ */ c("p", {
-					className: "text-text-secondary",
-					children: m("auth.auditLog.notEnabled", "The Security Audit Log is not enabled for your account.")
-				})
-			]
+		children: /* @__PURE__ */ c(f, {
+			illustration: "empty-generic",
+			title: _("auth.auditLog.notAvailable", "Page Not Available"),
+			description: _("auth.auditLog.notEnabled", "The Security Audit Log is not enabled for your account.")
 		})
 	});
 }
 //#endregion
-export { p as AuditLogPage };
+export { g as AuditLogPage };
 
 //# sourceMappingURL=AuditLogPage.js.map

package/dist/auth/pages/AuditLogPage.js.map

@@ -1 +1 @@
-{"version":3,"file":"AuditLogPage.js","names":[],"sources":["../../../src/auth/pages/AuditLogPage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell\";\nimport { useGatewayClient } from \"@burdenoff/fe-libs/shared/graphql\";\nimport { useFeatureFlagDetails } from \"@burdenoff/fe-libs/shared/feature-flags\";\nimport { formatDateTime } from \"../utils/formatters\";\nimport { AlertIcon, SpinnerIcon } from \"../components/AuthIcons\";\nimport {\n  useAuthAuditLogsQuery,\n  type AuditLogEntry_AuthAuditLogFragment,\n} from \"../../generated/global-operations\";\nimport { useCreateAuthExportJobMutation } from \"../../generated/wspace-operations\";\n\nconst PAGE_SIZE = 20;\n\n/**\n * Security audit log page with pagination and export\n *\n * Fragment: AuditLogEntry_AuthAuditLog (graphql/operations/global/fragments/AuditLogEntry.fragment.graphql)\n * Query: AuthAuditLogs (graphql/operations/global/queries/auditLog.graphql)\n *\n * TODO: When authAuditLogs backend migrates to AuthAuditLogConnection type,\n *   update this query to use: authAuditLogs { auditLogs: [...], totalCount, hasMore }\n *   and remove the client-side hasMore approximation below.\n */\nexport function AuditLogPage() {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const translated = t(key);\n    return translated === key ? fallback : translated;\n  };\n\n  const [page, setPage] = useState(1);\n  const offset = (page - 1) * PAGE_SIZE;\n\n  // Default-deny: only show when the flag is explicitly enabled in the system.\n  // useFeatureFlag uses default-allow (returns true when not found), so we use\n  // useFeatureFlagDetails + explicit value check instead.\n  const auditLogFlag = useFeatureFlagDetails(\"auth.audit-log\");\n  const showAuditLog = auditLogFlag?.value === true;\n\n  const { data, loading, error } = useAuthAuditLogsQuery({\n    skip: !showAuditLog,\n    fetchPolicy: \"cache-and-network\",\n    variables: { pagination: { limit: PAGE_SIZE, offset } },\n  });\n\n  const auditLogs = data?.authAuditLogs ?? [];\n  // Approximate hasMore: if we received a full page there may be more\n  const hasMore = auditLogs.length === PAGE_SIZE;\n\n  const wspaceClient = useGatewayClient(\"workspace\");\n  const [createExportJob, { loading: isExporting }] =\n    useCreateAuthExportJobMutation({ client: wspaceClient });\n  const [exportError, setExportError] = useState<string | null>(null);\n\n  const handleExport = async () => {\n    setExportError(null);\n    try {\n      await createExportJob({\n        variables: {\n          input: {\n            name: \"Audit Log Export\",\n            // permission_audit_logs covers auth audit logs in the export system\n            entityTypes: [\"permission_audit_logs\"],\n            format: \"CSV\",\n            exportScope: \"INDIVIDUAL\",\n            includeMetadata: true,\n          },\n        },\n      });\n    } catch (err) {\n      setExportError(\n        err instanceof Error ? err.message : \"Failed to start export\",\n      );\n    }\n  };\n\n  const getEventMarker = (eventType: string) => {\n    switch (eventType) {\n      case \"LOGIN_SUCCESS\":\n        return \"OK\";\n      case \"LOGIN_FAILURE\":\n        return \"ER\";\n      case \"LOGOUT\":\n        return \"LO\";\n      case \"PASSWORD_CHANGE\":\n        return \"PW\";\n      case \"MFA_ENABLED\":\n      case \"MFA_VERIFIED\":\n        return \"MF\";\n      case \"ANOMALY_DETECTED\":\n        return \"AL\";\n      default:\n        return \"AU\";\n    }\n  };\n\n  if (!showAuditLog) {\n    return (\n      <div className=\"max-w-4xl mx-auto p-6\">\n        <div className=\"text-center py-16 border-2 border-dashed border-border-subtle rounded-xl\">\n          <div className=\"size-16 mx-auto mb-4 rounded-full bg-status-warning-bg-subtle flex items-center justify-center\">\n            <AlertIcon\n              className=\"size-8 text-status-warning-text\"\n              aria-hidden=\"true\"\n            />\n          </div>\n          <h2 className=\"text-xl font-semibold text-text-primary mb-2\">\n            {tr(\"auth.auditLog.notAvailable\", \"Page Not Available\")}\n          </h2>\n          <p className=\"text-text-secondary\">\n            {tr(\n              \"auth.auditLog.notEnabled\",\n              \"The Security Audit Log is not enabled for your account.\",\n            )}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"max-w-4xl mx-auto p-6\">\n      {/* Header */}\n      <div className=\"flex items-center justify-between mb-8\">\n        <h1 className=\"text-3xl font-semibold text-text-primary\">\n          {tr(\"auth.auditLog.title\", \"Security Audit Log\")}\n        </h1>\n        <button\n          type=\"button\"\n          onClick={() => void handleExport()}\n          disabled={isExporting}\n          aria-label={tr(\"auth.auditLog.exportAriaLabel\", \"Export audit log\")}\n          className=\"flex items-center gap-2 px-4 py-2.5 rounded-xl border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken disabled:opacity-50 disabled:cursor-not-allowed transition-colors font-medium\"\n        >\n          {isExporting ? (\n            <>\n              <SpinnerIcon className=\"size-4 animate-spin\" aria-hidden=\"true\" />\n              {tr(\"auth.auditLog.exporting\", \"Exporting...\")}\n            </>\n          ) : (\n            <>\n              <svg\n                className=\"size-4\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n                aria-hidden=\"true\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  strokeWidth={2}\n                  d=\"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4\"\n                />\n              </svg>\n              {tr(\"auth.auditLog.export\", \"Export\")}\n            </>\n          )}\n        </button>\n      </div>\n\n      {/* Export error */}\n      {exportError && (\n        <div\n          role=\"alert\"\n          className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\"\n        >\n          <AlertIcon\n            className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\"\n            aria-hidden=\"true\"\n          />\n          <p className=\"text-sm text-status-error-text\">{exportError}</p>\n        </div>\n      )}\n\n      {loading ? (\n        <div aria-live=\"polite\" aria-busy=\"true\" className=\"text-center py-12\">\n          <SpinnerIcon\n            className=\"size-8 mx-auto text-text-link animate-spin\"\n            aria-hidden=\"true\"\n          />\n          <p className=\"mt-3 text-text-secondary\">\n            {tr(\"auth.auditLog.loading\", \"Loading audit events...\")}\n          </p>\n        </div>\n      ) : error ? (\n        <div\n          role=\"alert\"\n          className=\"text-center py-12 border border-status-error-border rounded-xl bg-status-error-bg-subtle\"\n        >\n          <p className=\"text-status-error-text\">\n            {tr(\"auth.auditLog.error\", \"Unable to load audit events\")}\n          </p>\n        </div>\n      ) : auditLogs.length === 0 ? (\n        <output className=\"block text-center py-12\">\n          <p className=\"text-text-secondary\">\n            {tr(\"auth.auditLog.noEvents\", \"No security events recorded\")}\n          </p>\n        </output>\n      ) : (\n        <>\n          <div className=\"space-y-4\" aria-live=\"polite\" aria-busy={loading}>\n            {auditLogs.map((event: AuditLogEntry_AuthAuditLogFragment) => (\n              <div\n                key={event.id}\n                className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\"\n              >\n                <div className=\"flex items-start gap-4\">\n                  <div\n                    className=\"flex size-10 shrink-0 items-center justify-center rounded-full bg-bg-sunken text-xs font-semibold text-text-secondary\"\n                    aria-hidden=\"true\"\n                  >\n                    {getEventMarker(event.action)}\n                  </div>\n                  <div className=\"flex-1\">\n                    <h3 className=\"text-lg font-medium text-text-primary mb-1\">\n                      {event.action.replace(/_/g, \" \")}\n                    </h3>\n                    <p className=\"text-sm text-text-secondary mb-2\">\n                      <time dateTime={event.createdAt}>\n                        {formatDateTime(event.createdAt)}\n                      </time>\n                    </p>\n                    <p className=\"text-sm text-text-secondary\">\n                      {event.description ??\n                        tr(\n                          \"auth.auditLog.defaultDescription\",\n                          \"Authentication event\",\n                        )}\n                      {event.ipAddress && ` • ${event.ipAddress}`}\n                    </p>\n                  </div>\n                  {event.action.includes(\"FAILURE\") && (\n                    <output className=\"px-3 py-1 rounded-full bg-status-error-bg-subtle text-status-error-text text-sm font-medium\">\n                      {tr(\"auth.auditLog.failed\", \"Failed\")}\n                    </output>\n                  )}\n                </div>\n              </div>\n            ))}\n          </div>\n\n          {/* Pagination */}\n          <nav\n            aria-label={tr(\n              \"auth.auditLog.paginationAriaLabel\",\n              \"Audit log pagination\",\n            )}\n            className=\"mt-6 flex items-center justify-between\"\n          >\n            <p className=\"text-sm text-text-secondary\">\n              {tr(\"auth.auditLog.page\", \"Page\")} {page}\n            </p>\n            <div className=\"flex gap-2\">\n              <button\n                type=\"button\"\n                onClick={() => setPage((prev) => Math.max(1, prev - 1))}\n                disabled={page === 1}\n                aria-label={tr(\n                  \"auth.auditLog.previousPageAriaLabel\",\n                  \"Go to previous page\",\n                )}\n                className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n              >\n                {tr(\"auth.auditLog.previous\", \"Previous\")}\n              </button>\n              <button\n                type=\"button\"\n                onClick={() => setPage((prev) => prev + 1)}\n                disabled={!hasMore}\n                aria-label={tr(\n                  \"auth.auditLog.nextPageAriaLabel\",\n                  \"Go to next page\",\n                )}\n                className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n              >\n                {tr(\"auth.auditLog.next\", \"Next\")}\n              </button>\n            </div>\n          </nav>\n        </>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}
+{"version":3,"file":"AuditLogPage.js","names":[],"sources":["../../../src/auth/pages/AuditLogPage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell\";\nimport {\n  EmphasisPanel,\n  IllustratedEmptyState,\n  PagePurpose,\n} from \"@burdenoff/fe-libs/ui\";\nimport { useGatewayClient } from \"@burdenoff/fe-libs/shared/graphql\";\nimport { useFeatureFlagDetails } from \"@burdenoff/fe-libs/shared/feature-flags\";\nimport { formatDateTime } from \"../utils/formatters\";\nimport { AlertIcon, SpinnerIcon } from \"../components/AuthIcons\";\nimport {\n  useAuthAuditLogsQuery,\n  type AuditLogEntry_AuthAuditLogFragment,\n} from \"../../generated/global-operations\";\nimport { useCreateAuthExportJobMutation } from \"../../generated/wspace-operations\";\n\nconst PAGE_SIZE = 20;\n\n/**\n * Security audit log page with pagination and export\n *\n * Fragment: AuditLogEntry_AuthAuditLog (graphql/operations/global/fragments/AuditLogEntry.fragment.graphql)\n * Query: AuthAuditLogs (graphql/operations/global/queries/auditLog.graphql)\n *\n * TODO: When authAuditLogs backend migrates to AuthAuditLogConnection type,\n *   update this query to use: authAuditLogs { auditLogs: [...], totalCount, hasMore }\n *   and remove the client-side hasMore approximation below.\n */\nexport function AuditLogPage() {\n  const { t } = useI18n();\n  const tr = (key: string, fallback: string): string => {\n    const translated = t(key);\n    return translated === key ? fallback : translated;\n  };\n\n  const [page, setPage] = useState(1);\n  const offset = (page - 1) * PAGE_SIZE;\n\n  // Default-deny: only show when the flag is explicitly enabled in the system.\n  // useFeatureFlag uses default-allow (returns true when not found), so we use\n  // useFeatureFlagDetails + explicit value check instead.\n  const auditLogFlag = useFeatureFlagDetails(\"auth.audit-log\");\n  const showAuditLog = auditLogFlag?.value === true;\n\n  const { data, loading, error } = useAuthAuditLogsQuery({\n    skip: !showAuditLog,\n    fetchPolicy: \"cache-and-network\",\n    variables: { pagination: { limit: PAGE_SIZE, offset } },\n  });\n\n  const auditLogs = data?.authAuditLogs ?? [];\n  // Approximate hasMore: if we received a full page there may be more\n  const hasMore = auditLogs.length === PAGE_SIZE;\n\n  const wspaceClient = useGatewayClient(\"workspace\");\n  const [createExportJob, { loading: isExporting }] =\n    useCreateAuthExportJobMutation({ client: wspaceClient });\n  const [exportError, setExportError] = useState<string | null>(null);\n\n  const handleExport = async () => {\n    setExportError(null);\n    try {\n      await createExportJob({\n        variables: {\n          input: {\n            name: \"Audit Log Export\",\n            // permission_audit_logs covers auth audit logs in the export system\n            entityTypes: [\"permission_audit_logs\"],\n            format: \"CSV\",\n            exportScope: \"INDIVIDUAL\",\n            includeMetadata: true,\n          },\n        },\n      });\n    } catch (err) {\n      setExportError(\n        err instanceof Error ? err.message : \"Failed to start export\",\n      );\n    }\n  };\n\n  const getEventMarker = (eventType: string) => {\n    switch (eventType) {\n      case \"LOGIN_SUCCESS\":\n        return \"OK\";\n      case \"LOGIN_FAILURE\":\n        return \"ER\";\n      case \"LOGOUT\":\n        return \"LO\";\n      case \"PASSWORD_CHANGE\":\n        return \"PW\";\n      case \"MFA_ENABLED\":\n      case \"MFA_VERIFIED\":\n        return \"MF\";\n      case \"ANOMALY_DETECTED\":\n        return \"AL\";\n      default:\n        return \"AU\";\n    }\n  };\n\n  if (!showAuditLog) {\n    return (\n      <div className=\"max-w-4xl mx-auto p-6\">\n        <IllustratedEmptyState\n          illustration=\"empty-generic\"\n          title={tr(\"auth.auditLog.notAvailable\", \"Page Not Available\")}\n          description={tr(\n            \"auth.auditLog.notEnabled\",\n            \"The Security Audit Log is not enabled for your account.\",\n          )}\n        />\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"max-w-4xl mx-auto p-6\">\n      {/* Header */}\n      <div className=\"flex items-center justify-between mb-8\">\n        <h1 className=\"text-3xl font-semibold text-text-primary\">\n          {tr(\"auth.auditLog.title\", \"Security Audit Log\")}\n        </h1>\n        <button\n          type=\"button\"\n          onClick={() => void handleExport()}\n          disabled={isExporting}\n          aria-label={tr(\"auth.auditLog.exportAriaLabel\", \"Export audit log\")}\n          className=\"flex items-center gap-2 px-4 py-2.5 rounded-xl border border-border-default text-text-primary bg-bg-surface hover:bg-bg-sunken disabled:opacity-50 disabled:cursor-not-allowed transition-colors font-medium\"\n        >\n          {isExporting ? (\n            <>\n              <SpinnerIcon className=\"size-4 animate-spin\" aria-hidden=\"true\" />\n              {tr(\"auth.auditLog.exporting\", \"Exporting...\")}\n            </>\n          ) : (\n            <>\n              <svg\n                className=\"size-4\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n                aria-hidden=\"true\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  strokeWidth={2}\n                  d=\"M4 16v1a3 3 0 003 3h10a3 3 0 003-3v-1m-4-4l-4 4m0 0l-4-4m4 4V4\"\n                />\n              </svg>\n              {tr(\"auth.auditLog.export\", \"Export\")}\n            </>\n          )}\n        </button>\n      </div>\n\n      <PagePurpose className=\"mb-6\">\n        {tr(\n          \"auth.auditLog.purpose\",\n          \"A running record of security-relevant events on your account — sign-ins, password and MFA changes, and anomalies. Scan it to spot anything you didn't do, and export it for your own records or compliance.\",\n        )}\n      </PagePurpose>\n\n      {/* Emphasis: what's tracked — the one highlighted zone */}\n      <EmphasisPanel className=\"mb-6\">\n        <p className=\"text-sm font-medium text-text-primary\">\n          {tr(\"auth.auditLog.emphasisTitle\", \"What this log captures\")}\n        </p>\n        <p className=\"mt-1 text-sm text-text-secondary\">\n          {tr(\n            \"auth.auditLog.emphasisBody\",\n            \"Successful and failed sign-ins, logouts, password and two-factor changes, and detected anomalies — newest first.\",\n          )}\n        </p>\n      </EmphasisPanel>\n\n      {/* Export error */}\n      {exportError && (\n        <div\n          role=\"alert\"\n          className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-status-error-bg-subtle border border-status-error-border\"\n        >\n          <AlertIcon\n            className=\"size-5 text-status-error-text flex-shrink-0 mt-0.5\"\n            aria-hidden=\"true\"\n          />\n          <p className=\"text-sm text-status-error-text\">{exportError}</p>\n        </div>\n      )}\n\n      {loading ? (\n        <div aria-live=\"polite\" aria-busy=\"true\" className=\"text-center py-12\">\n          <SpinnerIcon\n            className=\"size-8 mx-auto text-text-link animate-spin\"\n            aria-hidden=\"true\"\n          />\n          <p className=\"mt-3 text-text-secondary\">\n            {tr(\"auth.auditLog.loading\", \"Loading audit events...\")}\n          </p>\n        </div>\n      ) : error ? (\n        <div role=\"alert\">\n          <IllustratedEmptyState\n            illustration=\"empty-generic\"\n            title={tr(\"auth.auditLog.error\", \"Unable to load audit events\")}\n            description={tr(\n              \"auth.auditLog.errorDesc\",\n              \"Something went wrong fetching your security events. Please try again in a moment.\",\n            )}\n          />\n        </div>\n      ) : auditLogs.length === 0 ? (\n        <output className=\"block\">\n          <IllustratedEmptyState\n            illustration=\"empty-notifications\"\n            title={tr(\"auth.auditLog.noEvents\", \"No security events recorded\")}\n            description={tr(\n              \"auth.auditLog.noEventsDesc\",\n              \"As you sign in and change security settings, those events will appear here.\",\n            )}\n          />\n        </output>\n      ) : (\n        <>\n          <div className=\"space-y-4\" aria-live=\"polite\" aria-busy={loading}>\n            {auditLogs.map((event: AuditLogEntry_AuthAuditLogFragment) => (\n              <div\n                key={event.id}\n                className=\"p-6 rounded-xl border border-border-subtle bg-bg-surface shadow-sm\"\n              >\n                <div className=\"flex items-start gap-4\">\n                  <div\n                    className=\"flex size-10 shrink-0 items-center justify-center rounded-full bg-bg-sunken text-xs font-semibold text-text-secondary\"\n                    aria-hidden=\"true\"\n                  >\n                    {getEventMarker(event.action)}\n                  </div>\n                  <div className=\"flex-1\">\n                    <h3 className=\"text-lg font-medium text-text-primary mb-1\">\n                      {event.action.replace(/_/g, \" \")}\n                    </h3>\n                    <p className=\"text-sm text-text-secondary mb-2\">\n                      <time dateTime={event.createdAt}>\n                        {formatDateTime(event.createdAt)}\n                      </time>\n                    </p>\n                    <p className=\"text-sm text-text-secondary\">\n                      {event.description ??\n                        tr(\n                          \"auth.auditLog.defaultDescription\",\n                          \"Authentication event\",\n                        )}\n                      {event.ipAddress && ` • ${event.ipAddress}`}\n                    </p>\n                  </div>\n                  {event.action.includes(\"FAILURE\") && (\n                    <output className=\"px-3 py-1 rounded-full bg-status-error-bg-subtle text-status-error-text text-sm font-medium\">\n                      {tr(\"auth.auditLog.failed\", \"Failed\")}\n                    </output>\n                  )}\n                </div>\n              </div>\n            ))}\n          </div>\n\n          {/* Pagination */}\n          <nav\n            aria-label={tr(\n              \"auth.auditLog.paginationAriaLabel\",\n              \"Audit log pagination\",\n            )}\n            className=\"mt-6 flex items-center justify-between\"\n          >\n            <p className=\"text-sm text-text-secondary\">\n              {tr(\"auth.auditLog.page\", \"Page\")} {page}\n            </p>\n            <div className=\"flex gap-2\">\n              <button\n                type=\"button\"\n                onClick={() => setPage((prev) => Math.max(1, prev - 1))}\n                disabled={page === 1}\n                aria-label={tr(\n                  \"auth.auditLog.previousPageAriaLabel\",\n                  \"Go to previous page\",\n                )}\n                className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n              >\n                {tr(\"auth.auditLog.previous\", \"Previous\")}\n              </button>\n              <button\n                type=\"button\"\n                onClick={() => setPage((prev) => prev + 1)}\n                disabled={!hasMore}\n                aria-label={tr(\n                  \"auth.auditLog.nextPageAriaLabel\",\n                  \"Go to next page\",\n                )}\n                className=\"px-4 py-2 rounded-lg border border-border-default text-text-primary bg-bg-surface disabled:opacity-50 disabled:cursor-not-allowed hover:bg-bg-sunken transition-colors\"\n              >\n                {tr(\"auth.auditLog.next\", \"Next\")}\n              </button>\n            </div>\n          </nav>\n        </>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/auth/pages/EmailVerifyPage.js

@@ -6,58 +6,59 @@ import { useCallback as i, useEffect as a, useRef as o, useState as s } from "re
 import { useSearchParams as c } from "react-router-dom";
 import { useI18n as l } from "@burdenoff/fe-libs/shared/providers/shell";
 import { Fragment as u, jsx as d, jsxs as f } from "react/jsx-runtime";
+import { Button as p } from "@burdenoff/fe-libs/button";
 //#region src/auth/pages/EmailVerifyPage.tsx
-var p = 5;
-function m(e) {
+var m = 5;
+function h(e) {
 	let t = "/auth/login", n = e ? `${t}?email=${encodeURIComponent(e)}` : t;
 	window.location.href = n;
 }
-function h() {
-	let { t: h } = l(), g = (e, t) => {
-		let n = h(e);
+function g() {
+	let { t: g } = l(), _ = (e, t) => {
+		let n = g(e);
 		return n === e ? t : n;
-	}, [_] = c(), v = _.get("token"), y = _.get("email"), { verifyEmail: b, resendVerification: x } = t(), S = e((e) => e.user), [C, w] = s("verifying"), T = o(y || void 0), [E, D] = s(!1), [O, k] = s(!1), [A, j] = s(p), M = o(!1);
+	}, [v] = c(), y = v.get("token"), b = v.get("email"), { verifyEmail: x, resendVerification: S } = t(), C = e((e) => e.user), [w, T] = s("verifying"), E = o(b || void 0), [D, O] = s(!1), [k, A] = s(!1), [j, M] = s(m), N = o(!1);
 	a(() => {
-		if (!v || M.current) return;
-		let e = `auth:verifyEmail:inflight:${v}`;
+		if (!y || N.current) return;
+		let e = `auth:verifyEmail:inflight:${y}`;
 		if (!(typeof window < "u" && window.sessionStorage.getItem(e))) {
-			M.current = !0;
+			N.current = !0;
 			try {
 				window.sessionStorage.setItem(e, "1");
 			} catch {}
-			b(v).then((e) => {
-				e.success ? (w("success"), e.email && (T.current = e.email)) : w("error");
-			}).catch(() => w("error"));
+			x(y).then((e) => {
+				e.success ? (T("success"), e.email && (E.current = e.email)) : T("error");
+			}).catch(() => T("error"));
 		}
-	}, [v, b]), a(() => {
-		if (C !== "success") return;
+	}, [y, x]), a(() => {
+		if (w !== "success") return;
 		let e = setInterval(() => {
-			j((t) => t <= 1 ? (clearInterval(e), m(T.current), 0) : t - 1);
+			M((t) => t <= 1 ? (clearInterval(e), h(E.current), 0) : t - 1);
 		}, 1e3);
 		return () => clearInterval(e);
-	}, [C]);
-	let N = async () => {
-		let e = y || S?.email;
+	}, [w]);
+	let P = async () => {
+		let e = b || C?.email;
 		if (!e) {
 			console.error("No email available for resend");
 			return;
 		}
-		D(!0);
+		O(!0);
 		try {
-			await x(e), k(!0);
+			await S(e), A(!0);
 		} catch (e) {
 			console.error("Failed to resend verification:", e);
 		} finally {
-			D(!1);
+			O(!1);
 		}
-	}, P = i(() => {
-		m(T.current);
-	}, []), F = i(() => {
-		m();
+	}, F = i(() => {
+		h(E.current);
+	}, []), I = i(() => {
+		h();
 	}, []);
-	return C === "verifying" ? /* @__PURE__ */ d(n, {
-		title: g("auth.emailVerify.verifyingTitle", "Verifying your email"),
-		subtitle: g("auth.emailVerify.verifyingSubtitle", "Please wait while we confirm your email address"),
+	return w === "verifying" ? /* @__PURE__ */ d(n, {
+		title: _("auth.emailVerify.verifyingTitle", "Verifying your email"),
+		subtitle: _("auth.emailVerify.verifyingSubtitle", "Please wait while we confirm your email address"),
 		children: /* @__PURE__ */ f("div", {
 			className: "flex flex-col items-center justify-center py-12",
 			children: [/* @__PURE__ */ d("div", {
@@ -65,12 +66,12 @@ function h() {
 				children: /* @__PURE__ */ d(r, { className: "size-8 text-[var(--color-text-link)] animate-spin" })
 			}), /* @__PURE__ */ d("p", {
 				className: "text-[var(--color-text-secondary)]",
-				children: g("auth.emailVerify.moment", "This will only take a moment...")
+				children: _("auth.emailVerify.moment", "This will only take a moment...")
 			})]
 		})
-	}) : C === "success" ? /* @__PURE__ */ d(n, {
-		title: g("auth.emailVerify.verifiedTitle", "Email verified!"),
-		subtitle: g("auth.emailVerify.verifiedSubtitle", "Your email address has been confirmed"),
+	}) : w === "success" ? /* @__PURE__ */ d(n, {
+		title: _("auth.emailVerify.verifiedTitle", "Email verified!"),
+		subtitle: _("auth.emailVerify.verifiedSubtitle", "Your email address has been confirmed"),
 		children: /* @__PURE__ */ f("div", {
 			className: "flex flex-col items-center justify-center py-6",
 			children: [
@@ -91,32 +92,34 @@ function h() {
 				}),
 				/* @__PURE__ */ d("p", {
 					className: "text-center text-[var(--color-text-secondary)] mb-6",
-					children: g("auth.emailVerify.successMessage", "Your email has been successfully verified. You can now sign in to access all features.")
+					children: _("auth.emailVerify.successMessage", "Your email has been successfully verified. You can now sign in to access all features.")
 				}),
 				/* @__PURE__ */ f("p", {
 					className: "text-center text-sm text-[var(--color-text-tertiary)] mb-6",
 					children: [
-						g("auth.emailVerify.redirecting", "Redirecting to sign in in"),
+						_("auth.emailVerify.redirecting", "Redirecting to sign in in"),
 						" ",
 						/* @__PURE__ */ d("span", {
 							className: "font-semibold text-[var(--color-text-primary)]",
-							children: A
+							children: j
 						}),
 						" ",
-						g("auth.emailVerify.seconds", "seconds...")
+						_("auth.emailVerify.seconds", "seconds...")
 					]
 				}),
-				/* @__PURE__ */ d("button", {
+				/* @__PURE__ */ d(p, {
 					type: "button",
-					onClick: P,
-					className: "auth-primary-button w-full px-4 py-3 font-semibold",
-					children: g("auth.emailVerify.continueSignIn", "Continue to sign in now")
+					onClick: F,
+					variant: "default",
+					size: "lg",
+					className: "w-full font-semibold",
+					children: _("auth.emailVerify.continueSignIn", "Continue to sign in now")
 				})
 			]
 		})
 	}) : /* @__PURE__ */ d(n, {
-		title: g("auth.emailVerify.failedTitle", "Verification failed"),
-		subtitle: g("auth.emailVerify.failedSubtitle", "We couldn't verify your email address"),
+		title: _("auth.emailVerify.failedTitle", "Verification failed"),
+		subtitle: _("auth.emailVerify.failedSubtitle", "We couldn't verify your email address"),
 		children: /* @__PURE__ */ f("div", {
 			className: "flex flex-col items-center justify-center py-6",
 			children: [
@@ -137,32 +140,34 @@ function h() {
 				}),
 				/* @__PURE__ */ d("p", {
 					className: "text-center text-[var(--color-text-secondary)] mb-8",
-					children: g("auth.emailVerify.invalidLink", "The verification link is invalid or has expired. Please request a new verification email.")
+					children: _("auth.emailVerify.invalidLink", "The verification link is invalid or has expired. Please request a new verification email.")
 				}),
-				O ? /* @__PURE__ */ d("div", {
+				k ? /* @__PURE__ */ d("div", {
 					className: "w-full p-4 rounded-xl bg-[var(--color-status-success-bg-subtle)] border border-[var(--color-status-success-border)] text-center mb-4",
 					children: /* @__PURE__ */ d("p", {
 						className: "text-sm text-[var(--color-status-success-text)]",
-						children: g("auth.emailVerify.emailSent", "Verification email sent! Please check your inbox.")
+						children: _("auth.emailVerify.emailSent", "Verification email sent! Please check your inbox.")
 					})
-				}) : /* @__PURE__ */ d("button", {
+				}) : /* @__PURE__ */ d(p, {
 					type: "button",
-					onClick: N,
-					disabled: E,
-					className: "auth-primary-button mb-4 flex w-full items-center justify-center gap-2 px-4 py-3 font-semibold",
-					children: E ? /* @__PURE__ */ f(u, { children: [/* @__PURE__ */ d(r, { className: "size-5 animate-spin" }), /* @__PURE__ */ d("span", { children: "Sending…" })] }) : g("auth.emailVerify.resend", "Resend verification email")
+					onClick: P,
+					disabled: D,
+					variant: "default",
+					size: "lg",
+					className: "mb-4 w-full font-semibold",
+					children: D ? /* @__PURE__ */ f(u, { children: [/* @__PURE__ */ d(r, { className: "size-5 animate-spin" }), /* @__PURE__ */ d("span", { children: "Sending…" })] }) : _("auth.emailVerify.resend", "Resend verification email")
 				}),
 				/* @__PURE__ */ d("button", {
 					type: "button",
-					onClick: F,
+					onClick: I,
 					className: "w-full py-3 px-4 rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] text-[var(--color-text-primary)] font-medium hover:bg-[var(--color-bg-sunken)] transition-all",
-					children: g("auth.emailVerify.backToSignIn", "Back to sign in")
+					children: _("auth.emailVerify.backToSignIn", "Back to sign in")
 				})
 			]
 		})
 	});
 }
 //#endregion
-export { h as EmailVerifyPage };
+export { g as EmailVerifyPage };
 
 //# sourceMappingURL=EmailVerifyPage.js.map