@m5kdev/web-ui 0.1.2 → 0.1.4

package/dist/src/modules/auth/components/OrganizationAcceptInvitationRoute.d.ts

@@ -0,0 +1,10 @@
+export type OrganizationAcceptInvitationRouteProps = {
+    authReturnKey?: string;
+    loginPath?: string;
+    defaultRedirectPath?: string;
+    managerRedirectPath?: string;
+    managerRoles?: string[];
+    onInvalidateScopedQueries?: () => void | Promise<void>;
+};
+export declare function OrganizationAcceptInvitationRoute({ authReturnKey, loginPath, defaultRedirectPath, managerRedirectPath, managerRoles, onInvalidateScopedQueries, }: OrganizationAcceptInvitationRouteProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=OrganizationAcceptInvitationRoute.d.ts.map

package/dist/src/modules/auth/components/OrganizationAcceptInvitationRoute.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationAcceptInvitationRoute.d.ts","sourceRoot":"","sources":["../../../../../src/modules/auth/components/OrganizationAcceptInvitationRoute.tsx"],"names":[],"mappings":"AAUA,MAAM,MAAM,sCAAsC,GAAG;IACnD,aAAa,CAAC,EAAE,MAAM,CAAC;IACvB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,yBAAyB,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACxD,CAAC;AAEF,wBAAgB,iCAAiC,CAAC,EAChD,aAAiC,EACjC,SAAoB,EACpB,mBAAyB,EACzB,mBAA6C,EAC7C,YAAiC,EACjC,yBAAyB,GAC1B,EAAE,sCAAsC,2CAsIxC"}

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

@@ -0,0 +1,102 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { Card, CardBody, CardHeader, Spinner } from "@heroui/react";
+import { authClient } from "@m5kdev/frontend/modules/auth/auth.lib";
+import { useSession } from "@m5kdev/frontend/modules/auth/hooks/useSession";
+import { useEffect, useMemo, useState } from "react";
+import { useTranslation } from "react-i18next";
+import { useLocation, useNavigate, useSearchParams } from "react-router";
+import { toast } from "sonner";
+export 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(() => {
+                    void 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"));
+                }
+            }
+        };
+        void run();
+        return () => {
+            isMounted = false;
+        };
+    }, [
+        defaultRedirectPath,
+        invitationId,
+        managerRedirectPath,
+        managerRoleSet,
+        navigate,
+        onInvalidateScopedQueries,
+        phase,
+        registerSession,
+        session,
+        t,
+    ]);
+    if (phase === "error") {
+        return (_jsx("div", { className: "min-h-screen flex items-center justify-center p-6", children: _jsxs(Card, { className: "w-full max-w-lg", children: [_jsx(CardHeader, { className: "text-lg font-semibold", children: t("web-ui:organization.invitation.error") }), _jsx(CardBody, { children: errorMessage ?? t("web-ui:organization.invitation.unableAccept") })] }) }));
+    }
+    return (_jsx("div", { className: "min-h-screen flex items-center justify-center p-6", children: _jsxs(Card, { className: "w-full max-w-lg", children: [_jsx(CardHeader, { className: "text-lg font-semibold", children: t("web-ui:organization.invitation.accepting") }), _jsxs(CardBody, { className: "flex items-center gap-3", children: [_jsx(Spinner, { size: "sm" }), _jsx("span", { children: phase === "success"
+                                ? t("web-ui:organization.invitation.redirecting")
+                                : t("web-ui:organization.invitation.pleaseWait") })] })] }) }));
+}

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

@@ -0,0 +1,52 @@
+declare const ORGANIZATION_ROLES: readonly ["member", "admin", "owner"];
+export type OrganizationRole = (typeof ORGANIZATION_ROLES)[number];
+export 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;
+};
+export type OrganizationMembersRouteProps = {
+    managerRoles?: string[];
+    assignableRoles?: OrganizationRole[];
+    invitationAcceptPath?: string;
+    onInvalidateScopedQueries?: () => void | Promise<void>;
+};
+export declare function OrganizationMembersRoute({ managerRoles, assignableRoles, invitationAcceptPath, onInvalidateScopedQueries, }: OrganizationMembersRouteProps): import("react/jsx-runtime").JSX.Element;
+export {};
+//# sourceMappingURL=OrganizationMembersRoute.d.ts.map

package/dist/src/modules/auth/components/OrganizationMembersRoute.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationMembersRoute.d.ts","sourceRoot":"","sources":["../../../../../src/modules/auth/components/OrganizationMembersRoute.tsx"],"names":[],"mappings":"AA4EA,QAAA,MAAM,kBAAkB,uCAAwC,CAAC;AAEjE,MAAM,MAAM,gBAAgB,GAAG,CAAC,OAAO,kBAAkB,CAAC,CAAC,MAAM,CAAC,CAAC;AAMnE,MAAM,MAAM,8BAA8B,GAAG;IAC3C,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,eAAe,EAAE,MAAM,CAAC;IACxB,iBAAiB,EAAE,MAAM,CAAC;IAC1B,kBAAkB,EAAE,CAAC,gBAAgB,EAAE,MAAM,KAAK,MAAM,CAAC;IACzD,uBAAuB,EAAE,MAAM,CAAC;IAChC,gBAAgB,EAAE,MAAM,CAAC;IACzB,oBAAoB,EAAE,MAAM,CAAC;IAC7B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,eAAe,EAAE,MAAM,CAAC;IACxB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,iBAAiB,EAAE,MAAM,CAAC;IAC1B,aAAa,EAAE,MAAM,CAAC;IACtB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,uBAAuB,EAAE,MAAM,CAAC;IAChC,qBAAqB,EAAE,MAAM,CAAC;IAC9B,gBAAgB,EAAE,MAAM,CAAC;IACzB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,WAAW,EAAE,MAAM,CAAC;IACpB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,gBAAgB,EAAE,MAAM,CAAC;IACzB,SAAS,EAAE,MAAM,CAAC;IAClB,YAAY,EAAE,MAAM,CAAC;IACrB,UAAU,EAAE,MAAM,CAAC;IACnB,UAAU,EAAE,MAAM,CAAC;IACnB,WAAW,EAAE,MAAM,CAAC;IACpB,UAAU,EAAE,MAAM,CAAC;IACnB,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,UAAU,EAAE,MAAM,CAAC;IACnB,OAAO,EAAE,CAAC,IAAI,EAAE,MAAM,KAAK,MAAM,CAAC;IAClC,YAAY,EAAE,MAAM,CAAC;IACrB,aAAa,EAAE,MAAM,CAAC;IACtB,YAAY,EAAE,MAAM,CAAC;IACrB,cAAc,EAAE,MAAM,CAAC;IACvB,gBAAgB,EAAE,MAAM,CAAC;IACzB,WAAW,EAAE,MAAM,CAAC;CACrB,CAAC;AAEF,MAAM,MAAM,6BAA6B,GAAG;IAC1C,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,eAAe,CAAC,EAAE,gBAAgB,EAAE,CAAC;IACrC,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,yBAAyB,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACxD,CAAC;AA+HF,wBAAgB,wBAAwB,CAAC,EACvC,YAAY,EACZ,eAAe,EACf,oBAAoB,EACpB,yBAAyB,GAC1B,EAAE,6BAA6B,2CAkd/B"}

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

@@ -0,0 +1,359 @@
+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 { useTranslation } from "react-i18next";
+import { toast } from "sonner";
+const ORGANIZATION_ROLES = ["member", "admin", "owner"];
+function isOrganizationRole(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 })] }) }));
+}
+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 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,
+    };
+}
+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))) })] })] })] }) }));
+}

package/dist/src/modules/auth/components/OrganizationSettingsRoute.d.ts

@@ -0,0 +1,21 @@
+export type OrganizationSettingsRouteLabels = {
+    settingsTitle: string;
+    settingsDescription: string;
+    settingsNoActive: string;
+    settingsManageOnly: string;
+    formName: string;
+    formSlug: string;
+    formMetadata: string;
+    formMetadataInvalidJson: string;
+    formMetadataInvalid: string;
+    saveButton: string;
+    updateSuccess: string;
+    updateError: string;
+    loadError: string;
+};
+export type OrganizationSettingsRouteProps = {
+    managerRoles?: string[];
+    onInvalidateScopedQueries?: () => void | Promise<void>;
+};
+export declare function OrganizationSettingsRoute({ managerRoles, onInvalidateScopedQueries, }: OrganizationSettingsRouteProps): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=OrganizationSettingsRoute.d.ts.map

package/dist/src/modules/auth/components/OrganizationSettingsRoute.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationSettingsRoute.d.ts","sourceRoot":"","sources":["../../../../../src/modules/auth/components/OrganizationSettingsRoute.tsx"],"names":[],"mappings":"AAgBA,MAAM,MAAM,+BAA+B,GAAG;IAC5C,aAAa,EAAE,MAAM,CAAC;IACtB,mBAAmB,EAAE,MAAM,CAAC;IAC5B,gBAAgB,EAAE,MAAM,CAAC;IACzB,kBAAkB,EAAE,MAAM,CAAC;IAC3B,QAAQ,EAAE,MAAM,CAAC;IACjB,QAAQ,EAAE,MAAM,CAAC;IACjB,YAAY,EAAE,MAAM,CAAC;IACrB,uBAAuB,EAAE,MAAM,CAAC;IAChC,mBAAmB,EAAE,MAAM,CAAC;IAC5B,UAAU,EAAE,MAAM,CAAC;IACnB,aAAa,EAAE,MAAM,CAAC;IACtB,WAAW,EAAE,MAAM,CAAC;IACpB,SAAS,EAAE,MAAM,CAAC;CACnB,CAAC;AAEF,MAAM,MAAM,8BAA8B,GAAG;IAC3C,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,yBAAyB,CAAC,EAAE,MAAM,IAAI,GAAG,OAAO,CAAC,IAAI,CAAC,CAAC;CACxD,CAAC;AAwFF,wBAAgB,yBAAyB,CAAC,EACxC,YAAY,EACZ,yBAAyB,GAC1B,EAAE,8BAA8B,2CAyJhC"}