@burdenoff/microfe-auth 2026.510.127

package/dist/auth/pages/SessionsPage.js

@@ -0,0 +1,258 @@
+import { useAuthStore as e } from "../store/authStore.js";
+import { useSessionOperations as t } from "../hooks/useSessionOperations.js";
+import "../hooks/index.js";
+import { AlertIcon as n, SpinnerIcon as r } from "../components/AuthIcons.js";
+import { formatRelativeTime as i, parseBrowserName as a, parseDeviceName as o } from "../utils/formatters.js";
+import { ConfirmActionDialog as s } from "../components/ConfirmActionDialog.js";
+import { useState as c } from "react";
+import { useI18n as l } from "@burdenoff/fe-libs/shared/providers/shell";
+import { jsx as u, jsxs as d } from "react/jsx-runtime";
+//#region src/auth/pages/SessionsPage.tsx
+function f() {
+	let { t: f } = l(), p = (e, t) => {
+		let n = f(e);
+		return n === e ? t : n;
+	}, m = e((e) => e.isAuthenticated), { activeSessions: h, revokeSession: g, revokeAllSessions: _, isLoading: v } = t({ disableTokenInfoQuery: !0 }), [y, b] = c(null), [x, S] = c(null), [C, w] = c(null), [T, E] = c(!1), D = async (e) => {
+		try {
+			await g(e), S("Session revoked successfully"), w(null);
+		} catch (e) {
+			b(e instanceof Error ? e.message : "Failed to revoke session");
+		}
+	};
+	return m ? /* @__PURE__ */ d("div", {
+		className: "max-w-4xl mx-auto p-6",
+		children: [
+			/* @__PURE__ */ u(s, {
+				open: C !== null,
+				onOpenChange: (e) => {
+					e || w(null);
+				},
+				title: "Revoke this session?",
+				description: "The selected device will be signed out immediately and will need to authenticate again.",
+				confirmText: "Revoke session",
+				variant: "danger",
+				isPending: v,
+				onConfirm: async () => {
+					C && await D(C);
+				}
+			}),
+			/* @__PURE__ */ u(s, {
+				open: T,
+				onOpenChange: E,
+				title: "Revoke every other session?",
+				description: "All devices except your current one will be signed out immediately.",
+				confirmText: "Revoke all other sessions",
+				variant: "warning",
+				isPending: v,
+				onConfirm: async () => {
+					try {
+						await _(), S("All other sessions have been revoked"), E(!1);
+					} catch (e) {
+						b(e instanceof Error ? e.message : "Failed to revoke all sessions");
+					}
+				}
+			}),
+			/* @__PURE__ */ d("div", {
+				className: "flex items-center justify-between mb-8",
+				children: [/* @__PURE__ */ d("div", { children: [/* @__PURE__ */ u("h1", {
+					className: "text-3xl font-semibold text-[var(--color-text-primary)]",
+					children: p("auth.sessions.title", "Active Sessions")
+				}), /* @__PURE__ */ d("p", {
+					className: "text-[var(--color-text-secondary)] mt-2",
+					children: [
+						"You have ",
+						h.length,
+						" active session",
+						h.length === 1 ? "" : "s"
+					]
+				})] }), h.length > 1 && /* @__PURE__ */ u("button", {
+					onClick: () => E(!0),
+					className: "px-4 py-2.5 rounded-xl border border-[var(--color-status-error-border)] text-[var(--color-status-error-text)] font-medium hover:bg-[var(--color-status-error-bg-subtle)] transition-colors duration-200",
+					children: p("auth.sessions.revokeAll", "Revoke All Sessions")
+				})]
+			}),
+			x && /* @__PURE__ */ d("div", {
+				className: "mb-6 p-4 rounded-xl bg-[var(--color-status-success-bg-subtle)] border border-[var(--color-status-success-border)]",
+				children: [/* @__PURE__ */ u("p", {
+					className: "text-[var(--color-status-success-text)]",
+					children: x
+				}), /* @__PURE__ */ u("button", {
+					onClick: () => S(null),
+					className: "mt-2 text-sm text-[var(--color-status-success-text)] hover:underline transition-colors duration-200",
+					children: "Dismiss"
+				})]
+			}),
+			y && /* @__PURE__ */ d("div", {
+				className: "mb-6 flex items-start gap-3 p-4 rounded-xl bg-[var(--color-status-error-bg-subtle)] border border-[var(--color-status-error-border)]",
+				children: [/* @__PURE__ */ u(n, { className: "w-5 h-5 text-[var(--color-status-error-text)] flex-shrink-0 mt-0.5" }), /* @__PURE__ */ d("div", {
+					className: "flex-1",
+					children: [/* @__PURE__ */ u("p", {
+						className: "text-sm text-[var(--color-status-error-text)]",
+						children: y
+					}), /* @__PURE__ */ u("button", {
+						onClick: () => b(null),
+						className: "mt-2 text-sm text-[var(--color-status-error-text)] hover:underline transition-colors duration-200",
+						children: "Dismiss"
+					})]
+				})]
+			}),
+			v ? /* @__PURE__ */ d("div", {
+				className: "flex items-center justify-center py-12",
+				children: [/* @__PURE__ */ u(r, { className: "w-8 h-8 text-text-link animate-spin" }), /* @__PURE__ */ u("span", {
+					className: "ml-3 text-[var(--color-text-secondary)]",
+					children: p("auth.sessions.loading", "Loading sessions...")
+				})]
+			}) : h.length === 0 ? /* @__PURE__ */ d("div", {
+				className: "text-center py-16 border-2 border-dashed border-[var(--color-border-default)] rounded-xl",
+				children: [/* @__PURE__ */ u("div", {
+					className: "w-16 h-16 mx-auto mb-4 rounded-full bg-[var(--color-bg-muted)] flex items-center justify-center",
+					children: /* @__PURE__ */ u("svg", {
+						className: "w-8 h-8 text-[var(--color-text-tertiary)]",
+						fill: "none",
+						viewBox: "0 0 24 24",
+						stroke: "currentColor",
+						children: /* @__PURE__ */ u("path", {
+							strokeLinecap: "round",
+							strokeLinejoin: "round",
+							strokeWidth: 1.5,
+							d: "M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"
+						})
+					})
+				}), /* @__PURE__ */ u("p", {
+					className: "text-[var(--color-text-secondary)]",
+					children: p("auth.sessions.noSessions", "No active sessions found")
+				})]
+			}) : /* @__PURE__ */ u("div", {
+				className: "space-y-4",
+				children: h.map((e) => /* @__PURE__ */ u("div", {
+					className: "p-6 rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] shadow-sm hover:shadow-md transition-shadow",
+					children: /* @__PURE__ */ d("div", {
+						className: "flex items-start justify-between",
+						children: [/* @__PURE__ */ d("div", {
+							className: "flex items-start gap-4",
+							children: [/* @__PURE__ */ u("div", {
+								className: "w-12 h-12 rounded-xl bg-[var(--color-bg-accent)] flex items-center justify-center flex-shrink-0",
+								children: /* @__PURE__ */ u("svg", {
+									className: "w-6 h-6 text-[var(--color-text-link)]",
+									fill: "none",
+									viewBox: "0 0 24 24",
+									stroke: "currentColor",
+									children: /* @__PURE__ */ u("path", {
+										strokeLinecap: "round",
+										strokeLinejoin: "round",
+										strokeWidth: 1.5,
+										d: "M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z"
+									})
+								})
+							}), /* @__PURE__ */ d("div", {
+								className: "flex-1",
+								children: [
+									/* @__PURE__ */ d("div", {
+										className: "flex items-center gap-3 mb-1",
+										children: [/* @__PURE__ */ u("h3", {
+											className: "text-lg font-semibold text-[var(--color-text-primary)]",
+											children: e.isCurrent && o(e.userAgent) === "Unknown Device" ? p("auth.sessions.thisDevice", "This Device") : o(e.userAgent)
+										}), e.isCurrent && /* @__PURE__ */ u("span", {
+											className: "px-2.5 py-1 rounded-full bg-[var(--color-status-success-bg-subtle)] text-[var(--color-status-success-text)] text-xs font-medium",
+											children: p("auth.sessions.currentSession", "Current Session")
+										})]
+									}),
+									/* @__PURE__ */ u("p", {
+										className: "text-sm text-[var(--color-text-secondary)] mb-2",
+										children: a(e.userAgent) === "Unknown Browser" && e.isCurrent ? p("auth.sessions.currentBrowser", "Current Browser") : a(e.userAgent)
+									}),
+									/* @__PURE__ */ d("div", {
+										className: "flex flex-wrap gap-4 text-sm text-[var(--color-text-secondary)]",
+										children: [
+											e.ipAddress && e.ipAddress !== "unknown" && /* @__PURE__ */ d("span", {
+												className: "flex items-center gap-1.5",
+												children: [/* @__PURE__ */ u("svg", {
+													className: "w-4 h-4",
+													fill: "none",
+													viewBox: "0 0 24 24",
+													stroke: "currentColor",
+													children: /* @__PURE__ */ u("path", {
+														strokeLinecap: "round",
+														strokeLinejoin: "round",
+														strokeWidth: 2,
+														d: "M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9"
+													})
+												}), e.ipAddress]
+											}),
+											e.location && /* @__PURE__ */ d("span", {
+												className: "flex items-center gap-1.5",
+												children: [/* @__PURE__ */ d("svg", {
+													className: "w-4 h-4",
+													fill: "none",
+													viewBox: "0 0 24 24",
+													stroke: "currentColor",
+													children: [/* @__PURE__ */ u("path", {
+														strokeLinecap: "round",
+														strokeLinejoin: "round",
+														strokeWidth: 2,
+														d: "M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z"
+													}), /* @__PURE__ */ u("path", {
+														strokeLinecap: "round",
+														strokeLinejoin: "round",
+														strokeWidth: 2,
+														d: "M15 11a3 3 0 11-6 0 3 3 0 016 0z"
+													})]
+												}), e.location]
+											}),
+											/* @__PURE__ */ d("span", {
+												className: "flex items-center gap-1.5",
+												children: [
+													/* @__PURE__ */ u("svg", {
+														className: "w-4 h-4",
+														fill: "none",
+														viewBox: "0 0 24 24",
+														stroke: "currentColor",
+														children: /* @__PURE__ */ u("path", {
+															strokeLinecap: "round",
+															strokeLinejoin: "round",
+															strokeWidth: 2,
+															d: "M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z"
+														})
+													}),
+													"Last active ",
+													i(e.lastActivityAt)
+												]
+											})
+										]
+									})
+								]
+							})]
+						}), !e.isCurrent && /* @__PURE__ */ u("button", {
+							onClick: () => w(e.id),
+							className: "ml-4 px-4 py-2 rounded-lg text-sm font-medium border border-[var(--color-status-error-border)] text-[var(--color-status-error-text)] bg-[var(--color-bg-surface)] hover:bg-[var(--color-status-error-bg-subtle)] transition-colors duration-200",
+							children: p("auth.sessions.revoke", "Revoke")
+						})]
+					})
+				}, e.id))
+			})
+		]
+	}) : /* @__PURE__ */ u("div", {
+		className: "max-w-4xl mx-auto p-6",
+		children: /* @__PURE__ */ d("div", {
+			className: "text-center py-16 border-2 border-dashed border-[var(--color-border-default)] rounded-xl",
+			children: [
+				/* @__PURE__ */ u("div", {
+					className: "w-16 h-16 mx-auto mb-4 rounded-full bg-[var(--color-status-warning-bg-subtle)] flex items-center justify-center",
+					children: /* @__PURE__ */ u(n, { className: "w-8 h-8 text-[var(--color-status-warning-text)]" })
+				}),
+				/* @__PURE__ */ u("h2", {
+					className: "text-xl font-semibold text-[var(--color-text-primary)] mb-2",
+					children: p("auth.sessions.authRequired", "Authentication Required")
+				}),
+				/* @__PURE__ */ u("p", {
+					className: "text-[var(--color-text-secondary)]",
+					children: p("auth.sessions.signInToView", "Please sign in to view your active sessions")
+				})
+			]
+		})
+	});
+}
+//#endregion
+export { f as SessionsPage };
+
+//# sourceMappingURL=SessionsPage.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SessionsPage.js","names":[],"sources":["../../../src/auth/pages/SessionsPage.tsx"],"sourcesContent":["import { useState } from \"react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell\";\nimport { useSessionOperations } from \"../hooks\";\nimport { useAuthStore } from \"../store/authStore\";\nimport { ConfirmActionDialog } from \"../components/ConfirmActionDialog\";\nimport {\n  formatRelativeTime,\n  parseDeviceName,\n  parseBrowserName,\n} from \"../utils\";\nimport { SpinnerIcon, AlertIcon } from \"../components/AuthIcons\";\n\n/**\n * Active sessions management page with professional UI\n */\nexport function SessionsPage() {\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 isAuthenticated = useAuthStore((state) => state.isAuthenticated);\n  const { activeSessions, revokeSession, revokeAllSessions, isLoading } =\n    useSessionOperations({ disableTokenInfoQuery: true });\n  const [error, setError] = useState<string | null>(null);\n  const [successMessage, setSuccessMessage] = useState<string | null>(null);\n  const [pendingSessionId, setPendingSessionId] = useState<string | null>(null);\n  const [showRevokeAllDialog, setShowRevokeAllDialog] = useState(false);\n\n  const handleRevokeSession = async (sessionId: string) => {\n    try {\n      await revokeSession(sessionId);\n      setSuccessMessage(\"Session revoked successfully\");\n      setPendingSessionId(null);\n    } catch (err) {\n      setError(err instanceof Error ? err.message : \"Failed to revoke session\");\n    }\n  };\n\n  const handleRevokeAll = async () => {\n    try {\n      await revokeAllSessions();\n      setSuccessMessage(\"All other sessions have been revoked\");\n      setShowRevokeAllDialog(false);\n    } catch (err) {\n      setError(\n        err instanceof Error ? err.message : \"Failed to revoke all sessions\",\n      );\n    }\n  };\n\n  if (!isAuthenticated) {\n    return (\n      <div className=\"max-w-4xl mx-auto p-6\">\n        <div className=\"text-center py-16 border-2 border-dashed border-[var(--color-border-default)] rounded-xl\">\n          <div className=\"w-16 h-16 mx-auto mb-4 rounded-full bg-[var(--color-status-warning-bg-subtle)] flex items-center justify-center\">\n            <AlertIcon className=\"w-8 h-8 text-[var(--color-status-warning-text)]\" />\n          </div>\n          <h2 className=\"text-xl font-semibold text-[var(--color-text-primary)] mb-2\">\n            {tr(\"auth.sessions.authRequired\", \"Authentication Required\")}\n          </h2>\n          <p className=\"text-[var(--color-text-secondary)]\">\n            {tr(\n              \"auth.sessions.signInToView\",\n              \"Please sign in to view your active sessions\",\n            )}\n          </p>\n        </div>\n      </div>\n    );\n  }\n\n  return (\n    <div className=\"max-w-4xl mx-auto p-6\">\n      <ConfirmActionDialog\n        open={pendingSessionId !== null}\n        onOpenChange={(open) => {\n          if (!open) {\n            setPendingSessionId(null);\n          }\n        }}\n        title=\"Revoke this session?\"\n        description=\"The selected device will be signed out immediately and will need to authenticate again.\"\n        confirmText=\"Revoke session\"\n        variant=\"danger\"\n        isPending={isLoading}\n        onConfirm={async () => {\n          if (pendingSessionId) {\n            await handleRevokeSession(pendingSessionId);\n          }\n        }}\n      />\n      <ConfirmActionDialog\n        open={showRevokeAllDialog}\n        onOpenChange={setShowRevokeAllDialog}\n        title=\"Revoke every other session?\"\n        description=\"All devices except your current one will be signed out immediately.\"\n        confirmText=\"Revoke all other sessions\"\n        variant=\"warning\"\n        isPending={isLoading}\n        onConfirm={handleRevokeAll}\n      />\n      {/* Header */}\n      <div className=\"flex items-center justify-between mb-8\">\n        <div>\n          <h1 className=\"text-3xl font-semibold text-[var(--color-text-primary)]\">\n            {tr(\"auth.sessions.title\", \"Active Sessions\")}\n          </h1>\n          <p className=\"text-[var(--color-text-secondary)] mt-2\">\n            You have {activeSessions.length} active session\n            {activeSessions.length !== 1 ? \"s\" : \"\"}\n          </p>\n        </div>\n        {activeSessions.length > 1 && (\n          <button\n            onClick={() => setShowRevokeAllDialog(true)}\n            className=\"px-4 py-2.5 rounded-xl border border-[var(--color-status-error-border)] text-[var(--color-status-error-text)] font-medium hover:bg-[var(--color-status-error-bg-subtle)] transition-colors duration-200\"\n          >\n            {tr(\"auth.sessions.revokeAll\", \"Revoke All Sessions\")}\n          </button>\n        )}\n      </div>\n\n      {/* Success Message */}\n      {successMessage && (\n        <div className=\"mb-6 p-4 rounded-xl bg-[var(--color-status-success-bg-subtle)] border border-[var(--color-status-success-border)]\">\n          <p className=\"text-[var(--color-status-success-text)]\">\n            {successMessage}\n          </p>\n          <button\n            onClick={() => setSuccessMessage(null)}\n            className=\"mt-2 text-sm text-[var(--color-status-success-text)] hover:underline transition-colors duration-200\"\n          >\n            Dismiss\n          </button>\n        </div>\n      )}\n\n      {/* Error Message */}\n      {error && (\n        <div className=\"mb-6 flex items-start gap-3 p-4 rounded-xl bg-[var(--color-status-error-bg-subtle)] border border-[var(--color-status-error-border)]\">\n          <AlertIcon className=\"w-5 h-5 text-[var(--color-status-error-text)] flex-shrink-0 mt-0.5\" />\n          <div className=\"flex-1\">\n            <p className=\"text-sm text-[var(--color-status-error-text)]\">\n              {error}\n            </p>\n            <button\n              onClick={() => setError(null)}\n              className=\"mt-2 text-sm text-[var(--color-status-error-text)] hover:underline transition-colors duration-200\"\n            >\n              Dismiss\n            </button>\n          </div>\n        </div>\n      )}\n\n      {isLoading ? (\n        <div className=\"flex items-center justify-center py-12\">\n          <SpinnerIcon className=\"w-8 h-8 text-text-link animate-spin\" />\n          <span className=\"ml-3 text-[var(--color-text-secondary)]\">\n            {tr(\"auth.sessions.loading\", \"Loading sessions...\")}\n          </span>\n        </div>\n      ) : activeSessions.length === 0 ? (\n        <div className=\"text-center py-16 border-2 border-dashed border-[var(--color-border-default)] rounded-xl\">\n          <div className=\"w-16 h-16 mx-auto mb-4 rounded-full bg-[var(--color-bg-muted)] flex items-center justify-center\">\n            <svg\n              className=\"w-8 h-8 text-[var(--color-text-tertiary)]\"\n              fill=\"none\"\n              viewBox=\"0 0 24 24\"\n              stroke=\"currentColor\"\n            >\n              <path\n                strokeLinecap=\"round\"\n                strokeLinejoin=\"round\"\n                strokeWidth={1.5}\n                d=\"M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"\n              />\n            </svg>\n          </div>\n          <p className=\"text-[var(--color-text-secondary)]\">\n            {tr(\"auth.sessions.noSessions\", \"No active sessions found\")}\n          </p>\n        </div>\n      ) : (\n        <div className=\"space-y-4\">\n          {activeSessions.map((session) => (\n            <div\n              key={session.id}\n              className=\"p-6 rounded-xl border border-[var(--color-border-default)] bg-[var(--color-bg-surface)] shadow-sm hover:shadow-md transition-shadow\"\n            >\n              <div className=\"flex items-start justify-between\">\n                <div className=\"flex items-start gap-4\">\n                  {/* Device Icon */}\n                  <div className=\"w-12 h-12 rounded-xl bg-[var(--color-bg-accent)] flex items-center justify-center flex-shrink-0\">\n                    <svg\n                      className=\"w-6 h-6 text-[var(--color-text-link)]\"\n                      fill=\"none\"\n                      viewBox=\"0 0 24 24\"\n                      stroke=\"currentColor\"\n                    >\n                      <path\n                        strokeLinecap=\"round\"\n                        strokeLinejoin=\"round\"\n                        strokeWidth={1.5}\n                        d=\"M9.75 17L9 20l-1 1h8l-1-1-.75-3M3 13h18M5 17h14a2 2 0 002-2V5a2 2 0 00-2-2H5a2 2 0 00-2 2v10a2 2 0 002 2z\"\n                      />\n                    </svg>\n                  </div>\n\n                  <div className=\"flex-1\">\n                    <div className=\"flex items-center gap-3 mb-1\">\n                      <h3 className=\"text-lg font-semibold text-[var(--color-text-primary)]\">\n                        {session.isCurrent &&\n                        parseDeviceName(session.userAgent) === \"Unknown Device\"\n                          ? tr(\"auth.sessions.thisDevice\", \"This Device\")\n                          : parseDeviceName(session.userAgent)}\n                      </h3>\n                      {session.isCurrent && (\n                        <span className=\"px-2.5 py-1 rounded-full bg-[var(--color-status-success-bg-subtle)] text-[var(--color-status-success-text)] text-xs font-medium\">\n                          {tr(\n                            \"auth.sessions.currentSession\",\n                            \"Current Session\",\n                          )}\n                        </span>\n                      )}\n                    </div>\n                    <p className=\"text-sm text-[var(--color-text-secondary)] mb-2\">\n                      {parseBrowserName(session.userAgent) ===\n                        \"Unknown Browser\" && session.isCurrent\n                        ? tr(\"auth.sessions.currentBrowser\", \"Current Browser\")\n                        : parseBrowserName(session.userAgent)}\n                    </p>\n                    <div className=\"flex flex-wrap gap-4 text-sm text-[var(--color-text-secondary)]\">\n                      {session.ipAddress && session.ipAddress !== \"unknown\" && (\n                        <span className=\"flex items-center gap-1.5\">\n                          <svg\n                            className=\"w-4 h-4\"\n                            fill=\"none\"\n                            viewBox=\"0 0 24 24\"\n                            stroke=\"currentColor\"\n                          >\n                            <path\n                              strokeLinecap=\"round\"\n                              strokeLinejoin=\"round\"\n                              strokeWidth={2}\n                              d=\"M21 12a9 9 0 01-9 9m9-9a9 9 0 00-9-9m9 9H3m9 9a9 9 0 01-9-9m9 9c1.657 0 3-4.03 3-9s-1.343-9-3-9m0 18c-1.657 0-3-4.03-3-9s1.343-9 3-9m-9 9a9 9 0 019-9\"\n                            />\n                          </svg>\n                          {session.ipAddress}\n                        </span>\n                      )}\n                      {session.location && (\n                        <span className=\"flex items-center gap-1.5\">\n                          <svg\n                            className=\"w-4 h-4\"\n                            fill=\"none\"\n                            viewBox=\"0 0 24 24\"\n                            stroke=\"currentColor\"\n                          >\n                            <path\n                              strokeLinecap=\"round\"\n                              strokeLinejoin=\"round\"\n                              strokeWidth={2}\n                              d=\"M17.657 16.657L13.414 20.9a1.998 1.998 0 01-2.827 0l-4.244-4.243a8 8 0 1111.314 0z\"\n                            />\n                            <path\n                              strokeLinecap=\"round\"\n                              strokeLinejoin=\"round\"\n                              strokeWidth={2}\n                              d=\"M15 11a3 3 0 11-6 0 3 3 0 016 0z\"\n                            />\n                          </svg>\n                          {session.location}\n                        </span>\n                      )}\n                      <span className=\"flex items-center gap-1.5\">\n                        <svg\n                          className=\"w-4 h-4\"\n                          fill=\"none\"\n                          viewBox=\"0 0 24 24\"\n                          stroke=\"currentColor\"\n                        >\n                          <path\n                            strokeLinecap=\"round\"\n                            strokeLinejoin=\"round\"\n                            strokeWidth={2}\n                            d=\"M12 8v4l3 3m6-3a9 9 0 11-18 0 9 9 0 0118 0z\"\n                          />\n                        </svg>\n                        Last active {formatRelativeTime(session.lastActivityAt)}\n                      </span>\n                    </div>\n                  </div>\n                </div>\n\n                {!session.isCurrent && (\n                  <button\n                    onClick={() => setPendingSessionId(session.id)}\n                    className=\"ml-4 px-4 py-2 rounded-lg text-sm font-medium border border-[var(--color-status-error-border)] text-[var(--color-status-error-text)] bg-[var(--color-bg-surface)] hover:bg-[var(--color-status-error-bg-subtle)] transition-colors duration-200\"\n                  >\n                    {tr(\"auth.sessions.revoke\", \"Revoke\")}\n                  </button>\n                )}\n              </div>\n            </div>\n          ))}\n        </div>\n      )}\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/auth/pages/SsoCallbackPage.d.ts

@@ -0,0 +1,8 @@
+/**
+ * SSO Callback Page
+ * Handles redirects from:
+ * - SAML ACS server (with token/refreshToken in query params)
+ * - OIDC Authorization Server (with code/state in query params)
+ */
+export declare function SsoCallbackPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SsoCallbackPage.d.ts.map

package/dist/auth/pages/SsoCallbackPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SsoCallbackPage.d.ts","sourceRoot":"","sources":["../../../src/auth/pages/SsoCallbackPage.tsx"],"names":[],"mappings":"AAOA;;;;;GAKG;AACH,wBAAgB,eAAe,4CAqW9B"}

package/dist/auth/pages/SsoCallbackPage.js

@@ -0,0 +1,188 @@
+import { useAuthStore as e } from "../store/authStore.js";
+import { useSsoOperations as t } from "../hooks/useSsoOperations.js";
+import { AlertIcon as n, SpinnerIcon as r } from "../components/AuthIcons.js";
+import { useEffect as i, useRef as a, useState as o } from "react";
+import { useNavigate as s, 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";
+//#region src/auth/pages/SsoCallbackPage.tsx
+function p() {
+	let { t: p } = l(), m = (e, t) => {
+		let n = p(e);
+		return n === e ? t : n;
+	}, h = s(), [g] = c(), _ = e((e) => e.setAuthTokens), v = e((e) => e.setAuthenticated), { exchangeOidcCode: y, validateOidcState: b, isExternalOidcCallback: x, handleExternalOidcCallback: S } = t(), [C, w] = o(null), [T, E] = o("processing"), [D, O] = o("unknown"), k = a(!1);
+	return i(() => {
+		if (k.current) return;
+		k.current = !0;
+		let e = async () => {
+			try {
+				let e = g.get("error"), r = g.get("message") || g.get("error_description");
+				if (e) throw Error(r || `SSO authentication failed: ${e}`);
+				let i = g.get("token"), a = g.get("code"), o = g.get("state");
+				if (i) O("saml"), await t(i);
+				else if (a) O("oidc"), await n(a, o);
+				else throw Error("Invalid SSO callback. No token or authorization code received.");
+			} catch (e) {
+				console.error("[SSO Callback] Error:", e), w(e instanceof Error ? e.message : "Failed to process SSO response"), E("error");
+			}
+		}, t = async (e) => {
+			let t = g.get("refreshToken"), n = g.get("redirect"), r = g.get("requiresMFA") === "true", i = g.get("mfaChallengeId");
+			if (r && i) {
+				sessionStorage.setItem("mfa_challenge_id", i), sessionStorage.setItem("mfa_pending_token", e), sessionStorage.setItem("mfa_pending_refresh", t || ""), sessionStorage.setItem("mfa_redirect", n || "/dashboard"), h("/auth/mfa-verify", { replace: !0 });
+				return;
+			}
+			_(e, t || ""), v(!0), E("success"), setTimeout(() => {
+				h(n || "/dashboard", { replace: !0 });
+			}, 1500);
+		}, n = async (e, t) => {
+			if (x()) {
+				if (!t) throw Error("State parameter is required for external OIDC flow");
+				let n = await S(e, t);
+				if (!n.success) throw Error(n.error || "Failed to authenticate with external OIDC provider");
+				E("success");
+				let r = n.redirectPath || "/dashboard";
+				setTimeout(() => {
+					h(r, { replace: !0 });
+				}, 1500);
+				return;
+			}
+			if (t && !b(t)) throw Error("Invalid state parameter. This may be a CSRF attack. Please try logging in again.");
+			let n = await y(e, sessionStorage.getItem("oidc_client_id") || "default-client", window.location.origin + "/auth/sso/callback");
+			if (!n.success) throw Error(n.error || "Failed to exchange authorization code");
+			if (n.requiresMFA && n.mfaChallengeId) {
+				sessionStorage.setItem("mfa_challenge_id", n.mfaChallengeId), sessionStorage.setItem("mfa_redirect", sessionStorage.getItem("oidc_redirect") || "/dashboard"), sessionStorage.removeItem("oidc_redirect"), sessionStorage.removeItem("oidc_client_id"), h("/auth/mfa-verify", { replace: !0 });
+				return;
+			}
+			E("success");
+			let r = sessionStorage.getItem("oidc_redirect") || "/dashboard";
+			sessionStorage.removeItem("oidc_redirect"), sessionStorage.removeItem("oidc_client_id"), setTimeout(() => {
+				h(r, { replace: !0 });
+			}, 1500);
+		};
+		e();
+	}, [
+		g,
+		h,
+		_,
+		v,
+		y,
+		b,
+		x,
+		S
+	]), /* @__PURE__ */ d("div", {
+		className: "min-h-screen flex items-center justify-center bg-gradient-to-br from-bg-canvas to-bg-sunkengray-900gray-800 p-4",
+		children: /* @__PURE__ */ d("div", {
+			className: "w-full max-w-md",
+			children: /* @__PURE__ */ f("div", {
+				className: "bg-bg-surface rounded-2xl shadow-xl p-8 text-center",
+				children: [
+					/* @__PURE__ */ d("div", {
+						className: "mb-6",
+						children: /* @__PURE__ */ d("div", {
+							className: "auth-brand-badge mx-auto flex h-16 w-16 items-center justify-center rounded-xl",
+							children: /* @__PURE__ */ d("svg", {
+								className: "w-8 h-8 text-white",
+								fill: "none",
+								viewBox: "0 0 24 24",
+								stroke: "currentColor",
+								children: /* @__PURE__ */ d("path", {
+									strokeLinecap: "round",
+									strokeLinejoin: "round",
+									strokeWidth: 2,
+									d: "M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z"
+								})
+							})
+						})
+					}),
+					T === "processing" && /* @__PURE__ */ f(u, { children: [
+						/* @__PURE__ */ d("h1", {
+							className: "text-2xl font-semibold text-text-primary mb-4",
+							children: m("auth.ssoCallback.completing", "Completing Sign In")
+						}),
+						/* @__PURE__ */ d("p", {
+							className: "text-text-secondary mb-6",
+							children: D === "oidc" ? m("auth.ssoCallback.exchangingCode", "Exchanging authorization code for access tokens...") : D === "saml" ? m("auth.ssoCallback.validatingSaml", "Validating your SAML credentials...") : m("auth.ssoCallback.validatingCreds", "Validating your credentials from your identity provider...")
+						}),
+						/* @__PURE__ */ d("div", {
+							className: "flex justify-center",
+							children: /* @__PURE__ */ d(r, { className: "w-10 h-10 text-text-link animate-spin" })
+						})
+					] }),
+					T === "success" && /* @__PURE__ */ f(u, { children: [
+						/* @__PURE__ */ d("div", {
+							className: "w-16 h-16 mx-auto mb-4 rounded-full bg-status-success-bg-subtle flex items-center justify-center",
+							children: /* @__PURE__ */ d("svg", {
+								className: "w-8 h-8 text-status-success-text",
+								fill: "none",
+								viewBox: "0 0 24 24",
+								stroke: "currentColor",
+								children: /* @__PURE__ */ d("path", {
+									strokeLinecap: "round",
+									strokeLinejoin: "round",
+									strokeWidth: 2,
+									d: "M5 13l4 4L19 7"
+								})
+							})
+						}),
+						/* @__PURE__ */ d("h1", {
+							className: "text-2xl font-semibold text-text-primary mb-4",
+							children: m("auth.ssoCallback.success", "Sign In Successful")
+						}),
+						/* @__PURE__ */ d("p", {
+							className: "text-text-secondary mb-6",
+							children: D === "oidc" ? m("auth.ssoCallback.oidcComplete", "OIDC authentication complete. Redirecting...") : D === "saml" ? m("auth.ssoCallback.samlComplete", "SAML authentication complete. Redirecting...") : m("auth.ssoCallback.authSuccess", "You have been authenticated successfully. Redirecting...")
+						}),
+						/* @__PURE__ */ d("div", {
+							className: "flex justify-center",
+							children: /* @__PURE__ */ d(r, { className: "w-6 h-6 text-status-success-text animate-spin" })
+						})
+					] }),
+					T === "error" && /* @__PURE__ */ f(u, { children: [
+						/* @__PURE__ */ d("div", {
+							className: "w-16 h-16 mx-auto mb-4 rounded-full bg-status-error-bg-subtle flex items-center justify-center",
+							children: /* @__PURE__ */ d(n, { className: "w-8 h-8 text-status-error-text" })
+						}),
+						/* @__PURE__ */ d("h1", {
+							className: "text-2xl font-semibold text-text-primary mb-4",
+							children: m("auth.ssoCallback.failed", "Sign In Failed")
+						}),
+						/* @__PURE__ */ d("p", {
+							className: "text-status-error-text mb-6 text-sm",
+							children: C
+						}),
+						/* @__PURE__ */ f("div", {
+							className: "space-y-3",
+							children: [/* @__PURE__ */ d("button", {
+								onClick: () => h("/auth/sso/login", { replace: !0 }),
+								className: "auth-primary-button w-full px-6 py-3 font-medium",
+								children: m("auth.ssoCallback.tryAgain", "Try Again")
+							}), /* @__PURE__ */ d("button", {
+								onClick: () => h("/auth/login", { replace: !0 }),
+								className: "w-full px-6 py-3 rounded-xl border border-border-default text-text-primary font-medium hover:bg-bg-sunken transition-colors",
+								children: m("auth.ssoCallback.backToLogin", "Back to Login")
+							})]
+						})
+					] }),
+					D !== "unknown" && /* @__PURE__ */ d("div", {
+						className: "mt-6",
+						children: /* @__PURE__ */ d("span", {
+							className: `inline-flex items-center px-3 py-1 rounded-full text-xs font-medium ${D === "oidc" ? "bg-accent-purple-subtle text-accent-purple" : "bg-status-info-bg-subtle text-text-linkHover"}`,
+							children: D === "oidc" ? "OpenID Connect" : "SAML 2.0"
+						})
+					}),
+					/* @__PURE__ */ d("div", {
+						className: "mt-8 pt-6 border-t border-border-subtle",
+						children: /* @__PURE__ */ d("p", {
+							className: "text-xs text-text-secondary",
+							children: m("auth.ssoCallback.helpText", "Having trouble? Contact your organization's IT administrator for assistance with SSO login.")
+						})
+					})
+				]
+			})
+		})
+	});
+}
+//#endregion
+export { p as SsoCallbackPage };
+
+//# sourceMappingURL=SsoCallbackPage.js.map

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

@@ -0,0 +1 @@
+{"version":3,"file":"SsoCallbackPage.js","names":[],"sources":["../../../src/auth/pages/SsoCallbackPage.tsx"],"sourcesContent":["import { useEffect, useState, useRef } from \"react\";\nimport { useI18n } from \"@burdenoff/fe-libs/shared/providers/shell\";\nimport { useNavigate, useSearchParams } from \"react-router-dom\";\nimport { useAuthStore } from \"../store/authStore\";\nimport { useSsoOperations } from \"../hooks/useSsoOperations\";\nimport { SpinnerIcon, AlertIcon } from \"../components/AuthIcons\";\n\n/**\n * SSO Callback Page\n * Handles redirects from:\n * - SAML ACS server (with token/refreshToken in query params)\n * - OIDC Authorization Server (with code/state in query params)\n */\nexport function SsoCallbackPage() {\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 navigate = useNavigate();\n  const [searchParams] = useSearchParams();\n  const setAuthTokens = useAuthStore((state) => state.setAuthTokens);\n  const setAuthenticated = useAuthStore((state) => state.setAuthenticated);\n  const {\n    exchangeOidcCode,\n    validateOidcState,\n    isExternalOidcCallback,\n    handleExternalOidcCallback,\n  } = useSsoOperations();\n\n  const [error, setError] = useState<string | null>(null);\n  const [status, setStatus] = useState<\"processing\" | \"success\" | \"error\">(\n    \"processing\",\n  );\n  const [callbackType, setCallbackType] = useState<\"saml\" | \"oidc\" | \"unknown\">(\n    \"unknown\",\n  );\n  const processedRef = useRef(false);\n\n  useEffect(() => {\n    // Prevent double execution in React StrictMode\n    if (processedRef.current) {\n      return;\n    }\n    processedRef.current = true;\n\n    const processCallback = async () => {\n      try {\n        // Check for error from either SSO provider\n        const errorParam = searchParams.get(\"error\");\n        const errorMessage =\n          searchParams.get(\"message\") || searchParams.get(\"error_description\");\n\n        if (errorParam) {\n          throw new Error(\n            errorMessage || `SSO authentication failed: ${errorParam}`,\n          );\n        }\n\n        // Detect callback type based on query parameters\n        const token = searchParams.get(\"token\");\n        const code = searchParams.get(\"code\");\n        const state = searchParams.get(\"state\");\n\n        if (token) {\n          // SAML callback - token already exchanged by ACS server\n          setCallbackType(\"saml\");\n          await handleSamlCallback(token);\n        } else if (code) {\n          // OIDC callback - need to exchange code for tokens\n          setCallbackType(\"oidc\");\n          await handleOidcCallback(code, state);\n        } else {\n          throw new Error(\n            \"Invalid SSO callback. No token or authorization code received.\",\n          );\n        }\n      } catch (err) {\n        console.error(\"[SSO Callback] Error:\", err);\n        setError(\n          err instanceof Error ? err.message : \"Failed to process SSO response\",\n        );\n        setStatus(\"error\");\n      }\n    };\n\n    /**\n     * Handle SAML callback from ACS server\n     * Token is already exchanged, just store and redirect\n     * Also handles MFA if required\n     */\n    const handleSamlCallback = async (token: string) => {\n      const refreshToken = searchParams.get(\"refreshToken\");\n      const redirect = searchParams.get(\"redirect\");\n      const requiresMFA = searchParams.get(\"requiresMFA\") === \"true\";\n      const mfaChallengeId = searchParams.get(\"mfaChallengeId\");\n\n      // Check if MFA is required\n      if (requiresMFA && mfaChallengeId) {\n        // Store partial auth state and MFA info\n        sessionStorage.setItem(\"mfa_challenge_id\", mfaChallengeId);\n        sessionStorage.setItem(\"mfa_pending_token\", token);\n        sessionStorage.setItem(\"mfa_pending_refresh\", refreshToken || \"\");\n        sessionStorage.setItem(\"mfa_redirect\", redirect || \"/dashboard\");\n\n        // Redirect to MFA verification\n        navigate(\"/auth/mfa-verify\", { replace: true });\n        return;\n      }\n\n      // Store tokens\n      setAuthTokens(token, refreshToken || \"\");\n      setAuthenticated(true);\n\n      setStatus(\"success\");\n\n      // Redirect to the specified URL or default to dashboard\n      setTimeout(() => {\n        const redirectUrl = redirect || \"/dashboard\";\n        navigate(redirectUrl, { replace: true });\n      }, 1500);\n    };\n\n    /**\n     * Handle OIDC callback - exchange code for tokens\n     */\n    const handleOidcCallback = async (code: string, state: string | null) => {\n      const isExternal = isExternalOidcCallback();\n\n      // Check if this is an external OIDC flow (Azure AD, Google, etc.)\n      if (isExternal) {\n        if (!state) {\n          throw new Error(\"State parameter is required for external OIDC flow\");\n        }\n\n        // Use the external OIDC handler\n        const result = await handleExternalOidcCallback(code, state);\n\n        if (!result.success) {\n          throw new Error(\n            result.error ||\n              \"Failed to authenticate with external OIDC provider\",\n          );\n        }\n\n        setStatus(\"success\");\n\n        // Redirect after brief success message using the redirect path from result\n        const redirectUrl = result.redirectPath || \"/dashboard\";\n        setTimeout(() => {\n          navigate(redirectUrl, { replace: true });\n        }, 1500);\n        return;\n      }\n\n      // Internal OIDC flow (our auth service as provider)\n      // Validate state to prevent CSRF\n      if (state && !validateOidcState(state)) {\n        throw new Error(\n          \"Invalid state parameter. This may be a CSRF attack. Please try logging in again.\",\n        );\n      }\n\n      // Get client configuration from session storage\n      const clientId =\n        sessionStorage.getItem(\"oidc_client_id\") || \"default-client\";\n      const redirectUri = window.location.origin + \"/auth/sso/callback\";\n\n      // Exchange code for tokens\n      const result = await exchangeOidcCode(code, clientId, redirectUri);\n\n      if (!result.success) {\n        throw new Error(\n          result.error || \"Failed to exchange authorization code\",\n        );\n      }\n\n      // Check if MFA is required after OIDC authentication\n      if (result.requiresMFA && result.mfaChallengeId) {\n        // Store MFA challenge info for the verification page\n        sessionStorage.setItem(\"mfa_challenge_id\", result.mfaChallengeId);\n        sessionStorage.setItem(\n          \"mfa_redirect\",\n          sessionStorage.getItem(\"oidc_redirect\") || \"/dashboard\",\n        );\n\n        // Clean up OIDC session data\n        sessionStorage.removeItem(\"oidc_redirect\");\n        sessionStorage.removeItem(\"oidc_client_id\");\n\n        // Redirect to MFA verification\n        navigate(\"/auth/mfa-verify\", { replace: true });\n        return;\n      }\n\n      setStatus(\"success\");\n\n      // Get redirect URL from state or session storage\n      const redirect = sessionStorage.getItem(\"oidc_redirect\") || \"/dashboard\";\n      sessionStorage.removeItem(\"oidc_redirect\");\n      sessionStorage.removeItem(\"oidc_client_id\");\n\n      // Redirect after brief success message\n      setTimeout(() => {\n        navigate(redirect, { replace: true });\n      }, 1500);\n    };\n\n    processCallback();\n  }, [\n    searchParams,\n    navigate,\n    setAuthTokens,\n    setAuthenticated,\n    exchangeOidcCode,\n    validateOidcState,\n    isExternalOidcCallback,\n    handleExternalOidcCallback,\n  ]);\n\n  return (\n    <div className=\"min-h-screen flex items-center justify-center bg-gradient-to-br from-bg-canvas to-bg-sunkengray-900gray-800 p-4\">\n      <div className=\"w-full max-w-md\">\n        <div className=\"bg-bg-surface rounded-2xl shadow-xl p-8 text-center\">\n          {/* Logo */}\n          <div className=\"mb-6\">\n            <div className=\"auth-brand-badge mx-auto flex h-16 w-16 items-center justify-center rounded-xl\">\n              <svg\n                className=\"w-8 h-8 text-white\"\n                fill=\"none\"\n                viewBox=\"0 0 24 24\"\n                stroke=\"currentColor\"\n              >\n                <path\n                  strokeLinecap=\"round\"\n                  strokeLinejoin=\"round\"\n                  strokeWidth={2}\n                  d=\"M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z\"\n                />\n              </svg>\n            </div>\n          </div>\n\n          {/* Processing State */}\n          {status === \"processing\" && (\n            <>\n              <h1 className=\"text-2xl font-semibold text-text-primary mb-4\">\n                {tr(\"auth.ssoCallback.completing\", \"Completing Sign In\")}\n              </h1>\n              <p className=\"text-text-secondary mb-6\">\n                {callbackType === \"oidc\"\n                  ? tr(\n                      \"auth.ssoCallback.exchangingCode\",\n                      \"Exchanging authorization code for access tokens...\",\n                    )\n                  : callbackType === \"saml\"\n                    ? tr(\n                        \"auth.ssoCallback.validatingSaml\",\n                        \"Validating your SAML credentials...\",\n                      )\n                    : tr(\n                        \"auth.ssoCallback.validatingCreds\",\n                        \"Validating your credentials from your identity provider...\",\n                      )}\n              </p>\n              <div className=\"flex justify-center\">\n                <SpinnerIcon className=\"w-10 h-10 text-text-link animate-spin\" />\n              </div>\n            </>\n          )}\n\n          {/* Success State */}\n          {status === \"success\" && (\n            <>\n              <div className=\"w-16 h-16 mx-auto mb-4 rounded-full bg-status-success-bg-subtle flex items-center justify-center\">\n                <svg\n                  className=\"w-8 h-8 text-status-success-text\"\n                  fill=\"none\"\n                  viewBox=\"0 0 24 24\"\n                  stroke=\"currentColor\"\n                >\n                  <path\n                    strokeLinecap=\"round\"\n                    strokeLinejoin=\"round\"\n                    strokeWidth={2}\n                    d=\"M5 13l4 4L19 7\"\n                  />\n                </svg>\n              </div>\n              <h1 className=\"text-2xl font-semibold text-text-primary mb-4\">\n                {tr(\"auth.ssoCallback.success\", \"Sign In Successful\")}\n              </h1>\n              <p className=\"text-text-secondary mb-6\">\n                {callbackType === \"oidc\"\n                  ? tr(\n                      \"auth.ssoCallback.oidcComplete\",\n                      \"OIDC authentication complete. Redirecting...\",\n                    )\n                  : callbackType === \"saml\"\n                    ? tr(\n                        \"auth.ssoCallback.samlComplete\",\n                        \"SAML authentication complete. Redirecting...\",\n                      )\n                    : tr(\n                        \"auth.ssoCallback.authSuccess\",\n                        \"You have been authenticated successfully. Redirecting...\",\n                      )}\n              </p>\n              <div className=\"flex justify-center\">\n                <SpinnerIcon className=\"w-6 h-6 text-status-success-text animate-spin\" />\n              </div>\n            </>\n          )}\n\n          {/* Error State */}\n          {status === \"error\" && (\n            <>\n              <div className=\"w-16 h-16 mx-auto mb-4 rounded-full bg-status-error-bg-subtle flex items-center justify-center\">\n                <AlertIcon className=\"w-8 h-8 text-status-error-text\" />\n              </div>\n              <h1 className=\"text-2xl font-semibold text-text-primary mb-4\">\n                {tr(\"auth.ssoCallback.failed\", \"Sign In Failed\")}\n              </h1>\n              <p className=\"text-status-error-text mb-6 text-sm\">{error}</p>\n              <div className=\"space-y-3\">\n                <button\n                  onClick={() => navigate(\"/auth/sso/login\", { replace: true })}\n                  className=\"auth-primary-button w-full px-6 py-3 font-medium\"\n                >\n                  {tr(\"auth.ssoCallback.tryAgain\", \"Try Again\")}\n                </button>\n                <button\n                  onClick={() => navigate(\"/auth/login\", { replace: true })}\n                  className=\"w-full px-6 py-3 rounded-xl border border-border-default text-text-primary font-medium hover:bg-bg-sunken transition-colors\"\n                >\n                  {tr(\"auth.ssoCallback.backToLogin\", \"Back to Login\")}\n                </button>\n              </div>\n            </>\n          )}\n\n          {/* SSO Type Badge */}\n          {callbackType !== \"unknown\" && (\n            <div className=\"mt-6\">\n              <span\n                className={`inline-flex items-center px-3 py-1 rounded-full text-xs font-medium ${\n                  callbackType === \"oidc\"\n                    ? \"bg-accent-purple-subtle text-accent-purple\"\n                    : \"bg-status-info-bg-subtle text-text-linkHover\"\n                }`}\n              >\n                {callbackType === \"oidc\" ? \"OpenID Connect\" : \"SAML 2.0\"}\n              </span>\n            </div>\n          )}\n\n          {/* Help Text */}\n          <div className=\"mt-8 pt-6 border-t border-border-subtle\">\n            <p className=\"text-xs text-text-secondary\">\n              {tr(\n                \"auth.ssoCallback.helpText\",\n                \"Having trouble? Contact your organization's IT administrator for assistance with SSO login.\",\n              )}\n            </p>\n          </div>\n        </div>\n      </div>\n    </div>\n  );\n}\n"],"mappings":"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"}

package/dist/auth/pages/SsoConfigPage.d.ts

@@ -0,0 +1,6 @@
+/**
+ * SSO Configuration page for managing SAML/OIDC enterprise SSO
+ * Admin only - allows configuring Identity Provider settings
+ */
+export declare function SsoConfigPage(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=SsoConfigPage.d.ts.map

package/dist/auth/pages/SsoConfigPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"SsoConfigPage.d.ts","sourceRoot":"","sources":["../../../src/auth/pages/SsoConfigPage.tsx"],"names":[],"mappings":"AAgHA;;;GAGG;AACH,wBAAgB,aAAa,4CA+7C5B"}