@m5kdev/web-ui 0.8.2 → 0.8.3

package/dist/src/modules/auth/components/OrganizationAcceptInvitationRoute.mjs

@@ -0,0 +1,112 @@
+import { useEffect, useMemo, useState } from "react";
+import { Card, CardBody, CardHeader, Spinner } from "@heroui/react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTranslation } from "react-i18next";
+import { useLocation, useNavigate, useSearchParams } from "react-router";
+import { toast } from "sonner";
+import { authClient } from "@m5kdev/frontend/modules/auth/auth.lib";
+import { useSession } from "@m5kdev/frontend/modules/auth/hooks/useSession";
+//#region src/modules/auth/components/OrganizationAcceptInvitationRoute.tsx
+function OrganizationAcceptInvitationRoute({ authReturnKey = "org-auth-return", loginPath = "/login", defaultRedirectPath = "/", managerRedirectPath = "/organization/members", managerRoles = ["admin", "owner"], onInvalidateScopedQueries }) {
+	const { t } = useTranslation();
+	const [searchParams] = useSearchParams();
+	const { data: session, registerSession } = useSession();
+	const navigate = useNavigate();
+	const location = useLocation();
+	const invitationId = searchParams.get("id");
+	const [phase, setPhase] = useState("idle");
+	const [errorMessage, setErrorMessage] = useState(null);
+	const managerRoleSet = useMemo(() => new Set(managerRoles), [managerRoles]);
+	useEffect(() => {
+		if (!invitationId) {
+			setPhase("error");
+			setErrorMessage(t("web-ui:organization.invitation.errorMissing"));
+			return;
+		}
+		if (!session) {
+			sessionStorage.setItem(authReturnKey, `${location.pathname}${location.search}`);
+			navigate(loginPath, { replace: true });
+		}
+	}, [
+		authReturnKey,
+		invitationId,
+		location.pathname,
+		location.search,
+		loginPath,
+		navigate,
+		session,
+		t
+	]);
+	useEffect(() => {
+		if (!session || !invitationId || phase !== "idle") return;
+		let isMounted = true;
+		const run = async () => {
+			try {
+				setPhase("accepting");
+				const { data, error } = await authClient.organization.acceptInvitation({ invitationId });
+				if (error) throw new Error(error.message ?? t("web-ui:organization.invitation.acceptFailed"));
+				const organizationId = data?.invitation?.organizationId ?? null;
+				const invitationRole = data?.invitation?.role ?? "member";
+				if (organizationId) {
+					const result = await authClient.organization.setActive({ organizationId });
+					if (result.error) throw new Error(result.error.message ?? t("web-ui:organization.invitation.activateFailed"));
+				}
+				registerSession(() => {
+					onInvalidateScopedQueries?.();
+				});
+				if (isMounted) {
+					setPhase("success");
+					toast.success(t("web-ui:organization.invitation.accepted"));
+					navigate(managerRoleSet.has(invitationRole) ? managerRedirectPath : defaultRedirectPath, { replace: true });
+				}
+			} catch (error) {
+				if (isMounted) {
+					setPhase("error");
+					setErrorMessage(error instanceof Error ? error.message : t("web-ui:organization.invitation.acceptFailed"));
+				}
+			}
+		};
+		run();
+		return () => {
+			isMounted = false;
+		};
+	}, [
+		defaultRedirectPath,
+		invitationId,
+		managerRedirectPath,
+		managerRoleSet,
+		navigate,
+		onInvalidateScopedQueries,
+		phase,
+		registerSession,
+		session,
+		t
+	]);
+	if (phase === "error") return /* @__PURE__ */ jsx("div", {
+		className: "min-h-screen flex items-center justify-center p-6",
+		children: /* @__PURE__ */ jsxs(Card, {
+			className: "w-full max-w-lg",
+			children: [/* @__PURE__ */ jsx(CardHeader, {
+				className: "text-lg font-semibold",
+				children: t("web-ui:organization.invitation.error")
+			}), /* @__PURE__ */ jsx(CardBody, { children: errorMessage ?? t("web-ui:organization.invitation.unableAccept") })]
+		})
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: "min-h-screen flex items-center justify-center p-6",
+		children: /* @__PURE__ */ jsxs(Card, {
+			className: "w-full max-w-lg",
+			children: [/* @__PURE__ */ jsx(CardHeader, {
+				className: "text-lg font-semibold",
+				children: t("web-ui:organization.invitation.accepting")
+			}), /* @__PURE__ */ jsxs(CardBody, {
+				className: "flex items-center gap-3",
+				children: [/* @__PURE__ */ jsx(Spinner, { size: "sm" }), /* @__PURE__ */ jsx("span", { children: phase === "success" ? t("web-ui:organization.invitation.redirecting") : t("web-ui:organization.invitation.pleaseWait") })]
+			})]
+		})
+	});
+}
+//#endregion
+export { OrganizationAcceptInvitationRoute };
+
+//# sourceMappingURL=OrganizationAcceptInvitationRoute.mjs.map

package/dist/src/modules/auth/components/OrganizationAcceptInvitationRoute.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationAcceptInvitationRoute.mjs","names":[],"sources":["../../../../../src/modules/auth/components/OrganizationAcceptInvitationRoute.tsx"],"sourcesContent":["import { Card, CardBody, CardHeader, Spinner } from \"@heroui/react\";\r\nimport { authClient } from \"@m5kdev/frontend/modules/auth/auth.lib\";\r\nimport { useSession } from \"@m5kdev/frontend/modules/auth/hooks/useSession\";\r\nimport { useEffect, useMemo, useState } from \"react\";\r\nimport { useTranslation } from \"react-i18next\";\r\nimport { useLocation, useNavigate, useSearchParams } from \"react-router\";\r\nimport { toast } from \"sonner\";\r\n\r\ntype Phase = \"idle\" | \"accepting\" | \"success\" | \"error\";\r\n\r\nexport type OrganizationAcceptInvitationRouteProps = {\r\n  authReturnKey?: string;\r\n  loginPath?: string;\r\n  defaultRedirectPath?: string;\r\n  managerRedirectPath?: string;\r\n  managerRoles?: string[];\r\n  onInvalidateScopedQueries?: () => void | Promise<void>;\r\n};\r\n\r\nexport function OrganizationAcceptInvitationRoute({\r\n  authReturnKey = \"org-auth-return\",\r\n  loginPath = \"/login\",\r\n  defaultRedirectPath = \"/\",\r\n  managerRedirectPath = \"/organization/members\",\r\n  managerRoles = [\"admin\", \"owner\"],\r\n  onInvalidateScopedQueries,\r\n}: OrganizationAcceptInvitationRouteProps) {\r\n  const { t } = useTranslation();\r\n  const [searchParams] = useSearchParams();\r\n  const { data: session, registerSession } = useSession();\r\n  const navigate = useNavigate();\r\n  const location = useLocation();\r\n  const invitationId = searchParams.get(\"id\");\r\n  const [phase, setPhase] = useState<Phase>(\"idle\");\r\n  const [errorMessage, setErrorMessage] = useState<string | null>(null);\r\n  const managerRoleSet = useMemo(() => new Set(managerRoles), [managerRoles]);\r\n\r\n  useEffect(() => {\r\n    if (!invitationId) {\r\n      setPhase(\"error\");\r\n      setErrorMessage(t(\"web-ui:organization.invitation.errorMissing\"));\r\n      return;\r\n    }\r\n\r\n    if (!session) {\r\n      sessionStorage.setItem(authReturnKey, `${location.pathname}${location.search}`);\r\n      navigate(loginPath, { replace: true });\r\n    }\r\n  }, [\r\n    authReturnKey,\r\n    invitationId,\r\n    location.pathname,\r\n    location.search,\r\n    loginPath,\r\n    navigate,\r\n    session,\r\n    t,\r\n  ]);\r\n\r\n  useEffect(() => {\r\n    if (!session || !invitationId || phase !== \"idle\") {\r\n      return;\r\n    }\r\n\r\n    let isMounted = true;\r\n\r\n    const run = async () => {\r\n      try {\r\n        setPhase(\"accepting\");\r\n        const { data, error } = await authClient.organization.acceptInvitation({ invitationId });\r\n        if (error) {\r\n          throw new Error(error.message ?? t(\"web-ui:organization.invitation.acceptFailed\"));\r\n        }\r\n\r\n        const organizationId =\r\n          (data as { invitation?: { organizationId?: string } | null } | null)?.invitation\r\n            ?.organizationId ?? null;\r\n        const invitationRole =\r\n          (data as { invitation?: { role?: string } | null } | null)?.invitation?.role ?? \"member\";\r\n\r\n        if (organizationId) {\r\n          const result = await authClient.organization.setActive({ organizationId });\r\n          if (result.error) {\r\n            throw new Error(\r\n              result.error.message ?? t(\"web-ui:organization.invitation.activateFailed\")\r\n            );\r\n          }\r\n        }\r\n\r\n        registerSession(() => {\r\n          void onInvalidateScopedQueries?.();\r\n        });\r\n\r\n        if (isMounted) {\r\n          setPhase(\"success\");\r\n          toast.success(t(\"web-ui:organization.invitation.accepted\"));\r\n          navigate(managerRoleSet.has(invitationRole) ? managerRedirectPath : defaultRedirectPath, {\r\n            replace: true,\r\n          });\r\n        }\r\n      } catch (error) {\r\n        if (isMounted) {\r\n          setPhase(\"error\");\r\n          setErrorMessage(\r\n            error instanceof Error\r\n              ? error.message\r\n              : t(\"web-ui:organization.invitation.acceptFailed\")\r\n          );\r\n        }\r\n      }\r\n    };\r\n\r\n    void run();\r\n\r\n    return () => {\r\n      isMounted = false;\r\n    };\r\n  }, [\r\n    defaultRedirectPath,\r\n    invitationId,\r\n    managerRedirectPath,\r\n    managerRoleSet,\r\n    navigate,\r\n    onInvalidateScopedQueries,\r\n    phase,\r\n    registerSession,\r\n    session,\r\n    t,\r\n  ]);\r\n\r\n  if (phase === \"error\") {\r\n    return (\r\n      <div className=\"min-h-screen flex items-center justify-center p-6\">\r\n        <Card className=\"w-full max-w-lg\">\r\n          <CardHeader className=\"text-lg font-semibold\">\r\n            {t(\"web-ui:organization.invitation.error\")}\r\n          </CardHeader>\r\n          <CardBody>{errorMessage ?? t(\"web-ui:organization.invitation.unableAccept\")}</CardBody>\r\n        </Card>\r\n      </div>\r\n    );\r\n  }\r\n\r\n  return (\r\n    <div className=\"min-h-screen flex items-center justify-center p-6\">\r\n      <Card className=\"w-full max-w-lg\">\r\n        <CardHeader className=\"text-lg font-semibold\">\r\n          {t(\"web-ui:organization.invitation.accepting\")}\r\n        </CardHeader>\r\n        <CardBody className=\"flex items-center gap-3\">\r\n          <Spinner size=\"sm\" />\r\n          <span>\r\n            {phase === \"success\"\r\n              ? t(\"web-ui:organization.invitation.redirecting\")\r\n              : t(\"web-ui:organization.invitation.pleaseWait\")}\r\n          </span>\r\n        </CardBody>\r\n      </Card>\r\n    </div>\r\n  );\r\n}\r\n"],"mappings":";;;;;;;;;AAmBA,SAAgB,kCAAkC,EAChD,gBAAgB,mBAChB,YAAY,UACZ,sBAAsB,KACtB,sBAAsB,yBACtB,eAAe,CAAC,SAAS,QAAQ,EACjC,6BACyC;CACzC,MAAM,EAAE,MAAM,gBAAgB;CAC9B,MAAM,CAAC,gBAAgB,iBAAiB;CACxC,MAAM,EAAE,MAAM,SAAS,oBAAoB,YAAY;CACvD,MAAM,WAAW,aAAa;CAC9B,MAAM,WAAW,aAAa;CAC9B,MAAM,eAAe,aAAa,IAAI,KAAK;CAC3C,MAAM,CAAC,OAAO,YAAY,SAAgB,OAAO;CACjD,MAAM,CAAC,cAAc,mBAAmB,SAAwB,KAAK;CACrE,MAAM,iBAAiB,cAAc,IAAI,IAAI,aAAa,EAAE,CAAC,aAAa,CAAC;AAE3E,iBAAgB;AACd,MAAI,CAAC,cAAc;AACjB,YAAS,QAAQ;AACjB,mBAAgB,EAAE,8CAA8C,CAAC;AACjE;;AAGF,MAAI,CAAC,SAAS;AACZ,kBAAe,QAAQ,eAAe,GAAG,SAAS,WAAW,SAAS,SAAS;AAC/E,YAAS,WAAW,EAAE,SAAS,MAAM,CAAC;;IAEvC;EACD;EACA;EACA,SAAS;EACT,SAAS;EACT;EACA;EACA;EACA;EACD,CAAC;AAEF,iBAAgB;AACd,MAAI,CAAC,WAAW,CAAC,gBAAgB,UAAU,OACzC;EAGF,IAAI,YAAY;EAEhB,MAAM,MAAM,YAAY;AACtB,OAAI;AACF,aAAS,YAAY;IACrB,MAAM,EAAE,MAAM,UAAU,MAAM,WAAW,aAAa,iBAAiB,EAAE,cAAc,CAAC;AACxF,QAAI,MACF,OAAM,IAAI,MAAM,MAAM,WAAW,EAAE,8CAA8C,CAAC;IAGpF,MAAM,iBACH,MAAqE,YAClE,kBAAkB;IACxB,MAAM,iBACH,MAA2D,YAAY,QAAQ;AAElF,QAAI,gBAAgB;KAClB,MAAM,SAAS,MAAM,WAAW,aAAa,UAAU,EAAE,gBAAgB,CAAC;AAC1E,SAAI,OAAO,MACT,OAAM,IAAI,MACR,OAAO,MAAM,WAAW,EAAE,gDAAgD,CAC3E;;AAIL,0BAAsB;AACf,kCAA6B;MAClC;AAEF,QAAI,WAAW;AACb,cAAS,UAAU;AACnB,WAAM,QAAQ,EAAE,0CAA0C,CAAC;AAC3D,cAAS,eAAe,IAAI,eAAe,GAAG,sBAAsB,qBAAqB,EACvF,SAAS,MACV,CAAC;;YAEG,OAAO;AACd,QAAI,WAAW;AACb,cAAS,QAAQ;AACjB,qBACE,iBAAiB,QACb,MAAM,UACN,EAAE,8CAA8C,CACrD;;;;AAKF,OAAK;AAEV,eAAa;AACX,eAAY;;IAEb;EACD;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACD,CAAC;AAEF,KAAI,UAAU,QACZ,QACE,oBAAC,OAAD;EAAK,WAAU;YACb,qBAAC,MAAD;GAAM,WAAU;aAAhB,CACE,oBAAC,YAAD;IAAY,WAAU;cACnB,EAAE,uCAAuC;IAC/B,CAAA,EACb,oBAAC,UAAD,EAAA,UAAW,gBAAgB,EAAE,8CAA8C,EAAY,CAAA,CAClF;;EACH,CAAA;AAIV,QACE,oBAAC,OAAD;EAAK,WAAU;YACb,qBAAC,MAAD;GAAM,WAAU;aAAhB,CACE,oBAAC,YAAD;IAAY,WAAU;cACnB,EAAE,2CAA2C;IACnC,CAAA,EACb,qBAAC,UAAD;IAAU,WAAU;cAApB,CACE,oBAAC,SAAD,EAAS,MAAK,MAAO,CAAA,EACrB,oBAAC,QAAD,EAAA,UACG,UAAU,YACP,EAAE,6CAA6C,GAC/C,EAAE,4CAA4C,EAC7C,CAAA,CACE;MACN;;EACH,CAAA"}

package/dist/src/modules/auth/components/OrganizationMembersRoute.d.mts

@@ -0,0 +1,61 @@
+import * as _$react_jsx_runtime0 from "react/jsx-runtime";
+
+//#region src/modules/auth/components/OrganizationMembersRoute.d.ts
+declare const ORGANIZATION_ROLES: readonly ["member", "admin", "owner"];
+type OrganizationRole = (typeof ORGANIZATION_ROLES)[number];
+type OrganizationMembersRouteLabels = {
+  loadError: string;
+  membersTitle: string;
+  membersNoActive: string;
+  membersManageOnly: string;
+  membersDescription: (organizationName: string) => string;
+  defaultOrganizationName: string;
+  loadMembersError: string;
+  loadInvitationsError: string;
+  roleUpdateSuccess: string;
+  roleUpdateError: string;
+  removeMemberSuccess: string;
+  removeMemberError: string;
+  emailRequired: string;
+  inviteSuccess: string;
+  inviteError: string;
+  cancelInvitationSuccess: string;
+  cancelInvitationError: string;
+  inviteLinkCopied: string;
+  copyInviteLinkError: string;
+  unknownName: string;
+  invitedUser: string;
+  emailLabel: string;
+  emailPlaceholder: string;
+  roleLabel: string;
+  inviteButton: string;
+  tableTitle: string;
+  columnName: string;
+  columnEmail: string;
+  columnRole: string;
+  columnStatus: string;
+  columnActions: string;
+  tableEmpty: string;
+  roleFor: (name: string) => string;
+  statusActive: string;
+  statusInvited: string;
+  removeMember: string;
+  copyInviteLink: string;
+  cancelInvitation: string;
+  roleUnknown: string;
+};
+type OrganizationMembersRouteProps = {
+  managerRoles?: string[];
+  assignableRoles?: OrganizationRole[];
+  invitationAcceptPath?: string;
+  onInvalidateScopedQueries?: () => void | Promise<void>;
+};
+declare function OrganizationMembersRoute({
+  managerRoles,
+  assignableRoles,
+  invitationAcceptPath,
+  onInvalidateScopedQueries
+}: OrganizationMembersRouteProps): _$react_jsx_runtime0.JSX.Element;
+//#endregion
+export { OrganizationMembersRoute, OrganizationMembersRouteLabels, OrganizationMembersRouteProps, OrganizationRole };
+//# sourceMappingURL=OrganizationMembersRoute.d.mts.map

package/dist/src/modules/auth/components/OrganizationMembersRoute.mjs

@@ -0,0 +1,458 @@
+import { useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { Button, Card, CardBody, CardHeader, Chip, Input, Select, SelectItem, Spinner, Table, TableBody, TableCell, TableColumn, TableHeader, TableRow } from "@heroui/react";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { Copy, Trash2, UserPlus, Users } from "lucide-react";
+import { useTranslation } from "react-i18next";
+import { toast } from "sonner";
+import { authClient } from "@m5kdev/frontend/modules/auth/auth.lib";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { useSession } from "@m5kdev/frontend/modules/auth/hooks/useSession";
+//#region src/modules/auth/components/OrganizationMembersRoute.tsx
+const ORGANIZATION_ROLES = [
+	"member",
+	"admin",
+	"owner"
+];
+function isOrganizationRole(role) {
+	return ORGANIZATION_ROLES.includes(role);
+}
+function OrganizationStateCard({ title, message }) {
+	return /* @__PURE__ */ jsx("div", {
+		className: "p-6",
+		children: /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsx(CardHeader, {
+			className: "text-lg font-semibold",
+			children: title
+		}), /* @__PURE__ */ jsx(CardBody, { children: message })] })
+	});
+}
+function useOrganizationAccess({ managerRoles, onInvalidateScopedQueries }) {
+	const { data: session, registerSession } = useSession();
+	const queryClient = useQueryClient();
+	const activeOrganizationId = session?.session.activeOrganizationId ?? "";
+	const activeOrganizationRole = (session?.session)?.activeOrganizationRole ?? "";
+	return {
+		activeOrganizationId,
+		activeOrganizationRole,
+		canManageOrganization: useMemo(() => new Set(managerRoles ?? ["admin", "owner"]), [managerRoles]).has(activeOrganizationRole),
+		refreshOrganizationQueries: useCallback(async () => {
+			await Promise.allSettled([
+				queryClient.invalidateQueries({ queryKey: ["auth-organization-list"] }),
+				queryClient.invalidateQueries({ queryKey: ["auth-organization-details", activeOrganizationId] }),
+				queryClient.invalidateQueries({ queryKey: ["auth-organization-members", activeOrganizationId] }),
+				queryClient.invalidateQueries({ queryKey: ["auth-organization-invitations", activeOrganizationId] })
+			]);
+			registerSession(() => {
+				onInvalidateScopedQueries?.();
+			});
+		}, [
+			activeOrganizationId,
+			onInvalidateScopedQueries,
+			queryClient,
+			registerSession
+		])
+	};
+}
+function useOrganizationConfig({ assignableRoles }) {
+	const { t } = useTranslation();
+	return {
+		resolvedLabels: useMemo(() => ({
+			loadError: t("web-ui:organization.members.loadError"),
+			membersTitle: t("web-ui:organization.members.title"),
+			membersNoActive: t("web-ui:organization.members.noActive"),
+			membersManageOnly: t("web-ui:organization.members.manageOnly"),
+			membersDescription: (organizationName) => t("web-ui:organization.members.description", { name: organizationName }),
+			defaultOrganizationName: t("web-ui:organization.members.defaultName"),
+			loadMembersError: t("web-ui:organization.members.loadMembersError"),
+			loadInvitationsError: t("web-ui:organization.members.loadInvitationsError"),
+			roleUpdateSuccess: t("web-ui:organization.members.roleUpdateSuccess"),
+			roleUpdateError: t("web-ui:organization.members.roleUpdateError"),
+			removeMemberSuccess: t("web-ui:organization.members.removeMemberSuccess"),
+			removeMemberError: t("web-ui:organization.members.removeMemberError"),
+			emailRequired: t("web-ui:organization.members.emailRequired"),
+			inviteSuccess: t("web-ui:organization.members.inviteSuccess"),
+			inviteError: t("web-ui:organization.members.inviteError"),
+			cancelInvitationSuccess: t("web-ui:organization.members.cancelInvitationSuccess"),
+			cancelInvitationError: t("web-ui:organization.members.cancelInvitationError"),
+			inviteLinkCopied: t("web-ui:organization.members.inviteLinkCopied"),
+			copyInviteLinkError: t("web-ui:organization.members.copyInviteLinkError"),
+			unknownName: t("web-ui:organization.members.unknownName"),
+			invitedUser: t("web-ui:organization.members.invitedUser"),
+			emailLabel: t("web-ui:organization.members.emailLabel"),
+			emailPlaceholder: t("web-ui:organization.members.emailPlaceholder"),
+			roleLabel: t("web-ui:organization.members.roleLabel"),
+			inviteButton: t("web-ui:organization.members.inviteButton"),
+			tableTitle: t("web-ui:organization.members.tableTitle"),
+			columnName: t("web-ui:organization.members.columnName"),
+			columnEmail: t("web-ui:organization.members.columnEmail"),
+			columnRole: t("web-ui:organization.members.columnRole"),
+			columnStatus: t("web-ui:organization.members.columnStatus"),
+			columnActions: t("web-ui:organization.members.columnActions"),
+			tableEmpty: t("web-ui:organization.members.tableEmpty"),
+			roleFor: (name) => t("web-ui:organization.members.roleFor", { name }),
+			statusActive: t("web-ui:organization.members.statusActive"),
+			statusInvited: t("web-ui:organization.members.statusInvited"),
+			removeMember: t("web-ui:organization.members.removeMember"),
+			copyInviteLink: t("web-ui:organization.members.copyInviteLink"),
+			cancelInvitation: t("web-ui:organization.members.cancelInvitation"),
+			roleUnknown: t("web-ui:organization.members.roleUnknown")
+		}), [t]),
+		resolvedRoleLabels: useMemo(() => ({
+			member: t("web-ui:organization.roles.member"),
+			admin: t("web-ui:organization.roles.admin"),
+			owner: t("web-ui:organization.roles.owner")
+		}), [t]),
+		resolvedAssignableRoles: useMemo(() => assignableRoles && assignableRoles.length > 0 ? assignableRoles : [...ORGANIZATION_ROLES], [assignableRoles])
+	};
+}
+function OrganizationMembersRoute({ managerRoles, assignableRoles, invitationAcceptPath, onInvalidateScopedQueries }) {
+	const { resolvedLabels, resolvedRoleLabels, resolvedAssignableRoles } = useOrganizationConfig({ assignableRoles });
+	const { activeOrganizationId, activeOrganizationRole, canManageOrganization, refreshOrganizationQueries } = useOrganizationAccess({
+		managerRoles,
+		onInvalidateScopedQueries
+	});
+	const [inviteEmail, setInviteEmail] = useState("");
+	const [inviteRole, setInviteRole] = useState(resolvedAssignableRoles[0] ?? "member");
+	const isMountedRef = useRef(true);
+	useEffect(() => {
+		return () => {
+			isMountedRef.current = false;
+		};
+	}, []);
+	const refreshOrganizationQueriesStable = useCallback(() => refreshOrganizationQueries(), [refreshOrganizationQueries]);
+	const updateRoleMutation = useMutation({
+		mutationFn: async ({ memberId, role, organizationId }) => {
+			const { error } = await authClient.organization.updateMemberRole({
+				memberId,
+				role,
+				organizationId
+			});
+			if (error) throw new Error(error.message ?? resolvedLabels.roleUpdateError);
+		},
+		onSuccess: async () => {
+			await refreshOrganizationQueriesStable();
+			toast.success(resolvedLabels.roleUpdateSuccess);
+		},
+		onError: (error) => {
+			toast.error(error instanceof Error ? error.message : resolvedLabels.roleUpdateError);
+		}
+	});
+	const removeMemberMutation = useMutation({
+		mutationFn: async ({ memberId, organizationId }) => {
+			const { error } = await authClient.organization.removeMember({
+				memberIdOrEmail: memberId,
+				organizationId
+			});
+			if (error) throw new Error(error.message ?? resolvedLabels.removeMemberError);
+		},
+		onSuccess: async () => {
+			await refreshOrganizationQueriesStable();
+			toast.success(resolvedLabels.removeMemberSuccess);
+		},
+		onError: (error) => {
+			toast.error(error instanceof Error ? error.message : resolvedLabels.removeMemberError);
+		}
+	});
+	const createInvitationMutation = useMutation({
+		mutationFn: async ({ email, role, organizationId }) => {
+			const { error } = await authClient.organization.inviteMember({
+				organizationId,
+				email: email.trim(),
+				role
+			});
+			if (error) throw new Error(error.message ?? resolvedLabels.inviteError);
+		},
+		onSuccess: async () => {
+			await refreshOrganizationQueriesStable();
+			toast.success(resolvedLabels.inviteSuccess);
+			if (isMountedRef.current) {
+				setInviteEmail("");
+				setInviteRole(resolvedAssignableRoles[0] ?? "member");
+			}
+		},
+		onError: (error) => {
+			toast.error(error instanceof Error ? error.message : resolvedLabels.inviteError);
+		}
+	});
+	const cancelInvitationMutation = useMutation({
+		mutationFn: async ({ invitationId }) => {
+			const { error } = await authClient.organization.cancelInvitation({ invitationId });
+			if (error) throw new Error(error.message ?? resolvedLabels.cancelInvitationError);
+		},
+		onSuccess: async () => {
+			await refreshOrganizationQueriesStable();
+			toast.success(resolvedLabels.cancelInvitationSuccess);
+		},
+		onError: (error) => {
+			toast.error(error instanceof Error ? error.message : resolvedLabels.cancelInvitationError);
+		}
+	});
+	const updatingMemberId = updateRoleMutation.isPending && updateRoleMutation.variables ? updateRoleMutation.variables.memberId : null;
+	const removingMemberId = removeMemberMutation.isPending && removeMemberMutation.variables ? removeMemberMutation.variables.memberId : null;
+	const cancelingInvitationId = cancelInvitationMutation.isPending && cancelInvitationMutation.variables ? cancelInvitationMutation.variables.invitationId : null;
+	useEffect(() => {
+		if (!resolvedAssignableRoles.includes(inviteRole)) setInviteRole(resolvedAssignableRoles[0] ?? "member");
+	}, [inviteRole, resolvedAssignableRoles]);
+	const organizationQuery = useQuery({
+		queryKey: ["auth-organization-details", activeOrganizationId],
+		enabled: Boolean(activeOrganizationId && canManageOrganization),
+		queryFn: async () => {
+			const { data, error } = await authClient.organization.getFullOrganization({ query: {
+				organizationId: activeOrganizationId,
+				membersLimit: 200
+			} });
+			if (error) throw new Error(error.message ?? resolvedLabels.loadError);
+			return data;
+		}
+	});
+	const membersQuery = useQuery({
+		queryKey: ["auth-organization-members", activeOrganizationId],
+		enabled: Boolean(activeOrganizationId && canManageOrganization),
+		queryFn: async () => {
+			const { data, error } = await authClient.organization.listMembers({ query: {
+				organizationId: activeOrganizationId,
+				limit: 200,
+				offset: 0
+			} });
+			if (error) throw new Error(error.message ?? resolvedLabels.loadMembersError);
+			return data?.members ?? [];
+		}
+	});
+	const invitationsQuery = useQuery({
+		queryKey: ["auth-organization-invitations", activeOrganizationId],
+		enabled: Boolean(activeOrganizationId && canManageOrganization),
+		queryFn: async () => {
+			const { data, error } = await authClient.organization.listInvitations({ query: { organizationId: activeOrganizationId } });
+			if (error) throw new Error(error.message ?? resolvedLabels.loadInvitationsError);
+			return data ?? [];
+		}
+	});
+	const members = membersQuery.data ?? [];
+	const invitations = invitationsQuery.data ?? [];
+	const rows = useMemo(() => {
+		const memberRows = members.map((member) => ({
+			kind: "member",
+			id: `member-${member.id}`,
+			displayName: member.user?.name || resolvedLabels.unknownName,
+			email: member.user?.email || "-",
+			role: member.role,
+			status: "active",
+			memberId: member.id
+		}));
+		const invitationRows = invitations.map((invitation) => ({
+			kind: "invitation",
+			id: `invitation-${invitation.id}`,
+			displayName: resolvedLabels.invitedUser,
+			email: invitation.email,
+			role: invitation.role,
+			status: "invited",
+			invitationId: invitation.id
+		}));
+		return [...memberRows, ...invitationRows].sort((left, right) => {
+			if (left.status === right.status) return left.email.localeCompare(right.email);
+			return left.status === "active" ? -1 : 1;
+		});
+	}, [
+		invitations,
+		members,
+		resolvedLabels.invitedUser,
+		resolvedLabels.unknownName
+	]);
+	const onUpdateMemberRole = useCallback((memberId, role) => {
+		if (!canManageOrganization || !activeOrganizationId) return;
+		updateRoleMutation.mutate({
+			memberId,
+			role,
+			organizationId: activeOrganizationId
+		});
+	}, [
+		canManageOrganization,
+		activeOrganizationId,
+		updateRoleMutation
+	]);
+	const onRemoveMember = useCallback((memberId) => {
+		if (!canManageOrganization || !activeOrganizationId) return;
+		removeMemberMutation.mutate({
+			memberId,
+			organizationId: activeOrganizationId
+		});
+	}, [
+		canManageOrganization,
+		activeOrganizationId,
+		removeMemberMutation
+	]);
+	const onCreateInvitation = useCallback(() => {
+		if (!canManageOrganization || !activeOrganizationId) return;
+		if (!inviteEmail.trim()) {
+			toast.error(resolvedLabels.emailRequired);
+			return;
+		}
+		createInvitationMutation.mutate({
+			email: inviteEmail,
+			role: inviteRole,
+			organizationId: activeOrganizationId
+		});
+	}, [
+		canManageOrganization,
+		activeOrganizationId,
+		inviteEmail,
+		inviteRole,
+		resolvedLabels.emailRequired,
+		createInvitationMutation
+	]);
+	const onCancelInvitation = useCallback((invitationId) => {
+		if (!canManageOrganization) return;
+		cancelInvitationMutation.mutate({ invitationId });
+	}, [canManageOrganization, cancelInvitationMutation]);
+	const invitationLinkBase = useMemo(() => {
+		const invitationPath = invitationAcceptPath ?? "/organization/accept-invitation";
+		if (/^https?:\/\//i.test(invitationPath)) return `${invitationPath}?id=`;
+		return typeof window === "undefined" ? `${invitationPath}?id=` : `${window.location.origin}${invitationPath}?id=`;
+	}, [invitationAcceptPath]);
+	const onCopyInvitationLink = async (invitationId) => {
+		try {
+			await navigator.clipboard.writeText(`${invitationLinkBase}${invitationId}`);
+			toast.success(resolvedLabels.inviteLinkCopied);
+		} catch {
+			toast.error(resolvedLabels.copyInviteLinkError);
+		}
+	};
+	const getRoleLabel = (role) => resolvedRoleLabels[role] ?? resolvedLabels.roleUnknown;
+	if (!activeOrganizationId) return /* @__PURE__ */ jsx(OrganizationStateCard, {
+		title: resolvedLabels.membersTitle,
+		message: resolvedLabels.membersNoActive
+	});
+	if (!canManageOrganization) return /* @__PURE__ */ jsx(OrganizationStateCard, {
+		title: resolvedLabels.membersTitle,
+		message: resolvedLabels.membersManageOnly
+	});
+	if (organizationQuery.isLoading || membersQuery.isLoading || invitationsQuery.isLoading) return /* @__PURE__ */ jsx("div", {
+		className: "p-6 flex justify-center",
+		children: /* @__PURE__ */ jsx(Spinner, {})
+	});
+	return /* @__PURE__ */ jsx("div", {
+		className: "p-6 space-y-6",
+		children: /* @__PURE__ */ jsxs(Card, { children: [/* @__PURE__ */ jsxs(CardHeader, {
+			className: "flex items-center justify-between",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "flex items-center gap-2",
+				children: [/* @__PURE__ */ jsx(Users, { className: "h-4 w-4" }), /* @__PURE__ */ jsxs("div", {
+					className: "flex flex-col",
+					children: [/* @__PURE__ */ jsx("h2", {
+						className: "text-lg font-semibold",
+						children: resolvedLabels.membersTitle
+					}), /* @__PURE__ */ jsx("p", {
+						className: "text-sm text-default-500",
+						children: resolvedLabels.membersDescription(organizationQuery.data?.name ?? resolvedLabels.defaultOrganizationName)
+					})]
+				})]
+			}), /* @__PURE__ */ jsx(Chip, {
+				variant: "flat",
+				color: "primary",
+				children: getRoleLabel(activeOrganizationRole || "member")
+			})]
+		}), /* @__PURE__ */ jsxs(CardBody, {
+			className: "space-y-4",
+			children: [/* @__PURE__ */ jsxs("div", {
+				className: "grid gap-3 md:grid-cols-[1fr_160px_auto]",
+				children: [
+					/* @__PURE__ */ jsx(Input, {
+						type: "email",
+						label: resolvedLabels.emailLabel,
+						value: inviteEmail,
+						onValueChange: setInviteEmail,
+						placeholder: resolvedLabels.emailPlaceholder
+					}),
+					/* @__PURE__ */ jsx(Select, {
+						label: resolvedLabels.roleLabel,
+						selectedKeys: [inviteRole],
+						disallowEmptySelection: true,
+						onSelectionChange: (keys) => {
+							const role = Array.from(keys)[0];
+							if (role && isOrganizationRole(role) && resolvedAssignableRoles.includes(role)) setInviteRole(role);
+						},
+						children: resolvedAssignableRoles.map((role) => /* @__PURE__ */ jsx(SelectItem, { children: getRoleLabel(role) }, role))
+					}),
+					/* @__PURE__ */ jsx(Button, {
+						color: "primary",
+						startContent: /* @__PURE__ */ jsx(UserPlus, { className: "h-4 w-4" }),
+						onPress: onCreateInvitation,
+						isLoading: createInvitationMutation.isPending,
+						children: resolvedLabels.inviteButton
+					})
+				]
+			}), /* @__PURE__ */ jsxs(Table, {
+				"aria-label": resolvedLabels.tableTitle,
+				children: [/* @__PURE__ */ jsxs(TableHeader, { children: [
+					/* @__PURE__ */ jsx(TableColumn, { children: resolvedLabels.columnName }),
+					/* @__PURE__ */ jsx(TableColumn, { children: resolvedLabels.columnEmail }),
+					/* @__PURE__ */ jsx(TableColumn, { children: resolvedLabels.columnRole }),
+					/* @__PURE__ */ jsx(TableColumn, { children: resolvedLabels.columnStatus }),
+					/* @__PURE__ */ jsx(TableColumn, {
+						className: "text-right",
+						children: resolvedLabels.columnActions
+					})
+				] }), /* @__PURE__ */ jsx(TableBody, {
+					emptyContent: resolvedLabels.tableEmpty,
+					children: rows.map((row) => /* @__PURE__ */ jsxs(TableRow, { children: [
+						/* @__PURE__ */ jsx(TableCell, { children: row.displayName }),
+						/* @__PURE__ */ jsx(TableCell, { children: row.email }),
+						/* @__PURE__ */ jsx(TableCell, { children: row.kind === "member" ? /* @__PURE__ */ jsx(Select, {
+							size: "sm",
+							selectedKeys: [row.role],
+							disallowEmptySelection: true,
+							isDisabled: updatingMemberId === row.memberId,
+							"aria-label": resolvedLabels.roleFor(row.displayName),
+							onSelectionChange: (keys) => {
+								const role = Array.from(keys)[0];
+								if (role && role !== row.role && isOrganizationRole(role) && resolvedAssignableRoles.includes(role)) onUpdateMemberRole(row.memberId, role);
+							},
+							children: resolvedAssignableRoles.map((role) => /* @__PURE__ */ jsx(SelectItem, { children: getRoleLabel(role) }, role))
+						}) : getRoleLabel(row.role) }),
+						/* @__PURE__ */ jsx(TableCell, { children: /* @__PURE__ */ jsx(Chip, {
+							size: "sm",
+							variant: "flat",
+							color: row.status === "active" ? "success" : "warning",
+							children: row.status === "active" ? resolvedLabels.statusActive : resolvedLabels.statusInvited
+						}) }),
+						/* @__PURE__ */ jsx(TableCell, {
+							className: "text-right",
+							children: row.kind === "member" ? /* @__PURE__ */ jsx(Button, {
+								size: "sm",
+								color: "danger",
+								variant: "light",
+								isIconOnly: true,
+								onPress: () => void onRemoveMember(row.memberId),
+								isDisabled: removingMemberId === row.memberId,
+								"aria-label": resolvedLabels.removeMember,
+								children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
+							}) : /* @__PURE__ */ jsxs("div", {
+								className: "flex justify-end gap-2",
+								children: [/* @__PURE__ */ jsx(Button, {
+									size: "sm",
+									variant: "light",
+									isIconOnly: true,
+									onPress: () => void onCopyInvitationLink(row.invitationId),
+									"aria-label": resolvedLabels.copyInviteLink,
+									children: /* @__PURE__ */ jsx(Copy, { className: "h-4 w-4" })
+								}), /* @__PURE__ */ jsx(Button, {
+									size: "sm",
+									color: "danger",
+									variant: "light",
+									isIconOnly: true,
+									onPress: () => void onCancelInvitation(row.invitationId),
+									isDisabled: cancelingInvitationId === row.invitationId,
+									"aria-label": resolvedLabels.cancelInvitation,
+									children: /* @__PURE__ */ jsx(Trash2, { className: "h-4 w-4" })
+								})]
+							})
+						})
+					] }, row.id))
+				})]
+			})]
+		})] })
+	});
+}
+//#endregion
+export { OrganizationMembersRoute };
+
+//# sourceMappingURL=OrganizationMembersRoute.mjs.map