@m5kdev/web-ui 0.7.0 → 0.8.0

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

@@ -1,359 +1,458 @@
-import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
-import { Button, Card, CardBody, CardHeader, Chip, Input, Select, SelectItem, Spinner, Table, TableBody, TableCell, TableColumn, TableHeader, TableRow, } from "@heroui/react";
-import { authClient } from "@m5kdev/frontend/modules/auth/auth.lib";
-import { useSession } from "@m5kdev/frontend/modules/auth/hooks/useSession";
-import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
-import { Copy, Trash2, UserPlus, Users } from "lucide-react";
 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";
-const ORGANIZATION_ROLES = ["member", "admin", "owner"];
+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);
+	return ORGANIZATION_ROLES.includes(role);
 }
 function OrganizationStateCard({ title, message }) {
-    return (_jsx("div", { className: "p-6", children: _jsxs(Card, { children: [_jsx(CardHeader, { className: "text-lg font-semibold", children: title }), _jsx(CardBody, { children: 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 ??
-        "";
-    const managerRoleSet = useMemo(() => new Set(managerRoles ?? ["admin", "owner"]), [managerRoles]);
-    const canManageOrganization = managerRoleSet.has(activeOrganizationRole);
-    const 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(() => {
-            void onInvalidateScopedQueries?.();
-        });
-    }, [activeOrganizationId, onInvalidateScopedQueries, queryClient, registerSession]);
-    return {
-        activeOrganizationId,
-        activeOrganizationRole,
-        canManageOrganization,
-        refreshOrganizationQueries,
-    };
+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();
-    const translatedLabels = 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]);
-    const translatedRoleLabels = useMemo(() => ({
-        member: t("web-ui:organization.roles.member"),
-        admin: t("web-ui:organization.roles.admin"),
-        owner: t("web-ui:organization.roles.owner"),
-    }), [t]);
-    const resolvedAssignableRoles = useMemo(() => assignableRoles && assignableRoles.length > 0 ? assignableRoles : [...ORGANIZATION_ROLES], [assignableRoles]);
-    return {
-        resolvedLabels: translatedLabels,
-        resolvedRoleLabels: translatedRoleLabels,
-        resolvedAssignableRoles,
-    };
+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])
+	};
 }
-export 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 (_jsx(OrganizationStateCard, { title: resolvedLabels.membersTitle, message: resolvedLabels.membersNoActive }));
-    }
-    if (!canManageOrganization) {
-        return (_jsx(OrganizationStateCard, { title: resolvedLabels.membersTitle, message: resolvedLabels.membersManageOnly }));
-    }
-    if (organizationQuery.isLoading || membersQuery.isLoading || invitationsQuery.isLoading) {
-        return (_jsx("div", { className: "p-6 flex justify-center", children: _jsx(Spinner, {}) }));
-    }
-    return (_jsx("div", { className: "p-6 space-y-6", children: _jsxs(Card, { children: [_jsxs(CardHeader, { className: "flex items-center justify-between", children: [_jsxs("div", { className: "flex items-center gap-2", children: [_jsx(Users, { className: "h-4 w-4" }), _jsxs("div", { className: "flex flex-col", children: [_jsx("h2", { className: "text-lg font-semibold", children: resolvedLabels.membersTitle }), _jsx("p", { className: "text-sm text-default-500", children: resolvedLabels.membersDescription(organizationQuery.data?.name ?? resolvedLabels.defaultOrganizationName) })] })] }), _jsx(Chip, { variant: "flat", color: "primary", children: getRoleLabel(activeOrganizationRole || "member") })] }), _jsxs(CardBody, { className: "space-y-4", children: [_jsxs("div", { className: "grid gap-3 md:grid-cols-[1fr_160px_auto]", children: [_jsx(Input, { type: "email", label: resolvedLabels.emailLabel, value: inviteEmail, onValueChange: setInviteEmail, placeholder: resolvedLabels.emailPlaceholder }), _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) => (_jsx(SelectItem, { children: getRoleLabel(role) }, role))) }), _jsx(Button, { color: "primary", startContent: _jsx(UserPlus, { className: "h-4 w-4" }), onPress: onCreateInvitation, isLoading: createInvitationMutation.isPending, children: resolvedLabels.inviteButton })] }), _jsxs(Table, { "aria-label": resolvedLabels.tableTitle, children: [_jsxs(TableHeader, { children: [_jsx(TableColumn, { children: resolvedLabels.columnName }), _jsx(TableColumn, { children: resolvedLabels.columnEmail }), _jsx(TableColumn, { children: resolvedLabels.columnRole }), _jsx(TableColumn, { children: resolvedLabels.columnStatus }), _jsx(TableColumn, { className: "text-right", children: resolvedLabels.columnActions })] }), _jsx(TableBody, { emptyContent: resolvedLabels.tableEmpty, children: rows.map((row) => (_jsxs(TableRow, { children: [_jsx(TableCell, { children: row.displayName }), _jsx(TableCell, { children: row.email }), _jsx(TableCell, { children: row.kind === "member" ? (_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)) {
-                                                            void onUpdateMemberRole(row.memberId, role);
-                                                        }
-                                                    }, children: resolvedAssignableRoles.map((role) => (_jsx(SelectItem, { children: getRoleLabel(role) }, role))) })) : (getRoleLabel(row.role)) }), _jsx(TableCell, { children: _jsx(Chip, { size: "sm", variant: "flat", color: row.status === "active" ? "success" : "warning", children: row.status === "active"
-                                                        ? resolvedLabels.statusActive
-                                                        : resolvedLabels.statusInvited }) }), _jsx(TableCell, { className: "text-right", children: row.kind === "member" ? (_jsx(Button, { size: "sm", color: "danger", variant: "light", isIconOnly: true, onPress: () => void onRemoveMember(row.memberId), isDisabled: removingMemberId === row.memberId, "aria-label": resolvedLabels.removeMember, children: _jsx(Trash2, { className: "h-4 w-4" }) })) : (_jsxs("div", { className: "flex justify-end gap-2", children: [_jsx(Button, { size: "sm", variant: "light", isIconOnly: true, onPress: () => void onCopyInvitationLink(row.invitationId), "aria-label": resolvedLabels.copyInviteLink, children: _jsx(Copy, { className: "h-4 w-4" }) }), _jsx(Button, { size: "sm", color: "danger", variant: "light", isIconOnly: true, onPress: () => void onCancelInvitation(row.invitationId), isDisabled: cancelingInvitationId === row.invitationId, "aria-label": resolvedLabels.cancelInvitation, children: _jsx(Trash2, { className: "h-4 w-4" }) })] })) })] }, row.id))) })] })] })] }) }));
+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.js.map