@marinoscar/platform-web 0.0.0-stage → 0.1.0-next.4

package/dist/identity/ui/org/InviteMemberDialog.js

@@ -0,0 +1,60 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+/**
+ * The "Invite member" form of the Organization page (#726). Collects an
+ * address, an org role and an optional private note; the API validates and
+ * decides (a member or an accepted invitation is refused, and its message is
+ * shown here).
+ */
+import { useState } from 'react';
+import { Alert, Button, Dialog, DialogActions, DialogContent, DialogTitle, FormControl, InputLabel, MenuItem, Select, Stack, TextField, } from '@mui/material';
+/** The role offered first: `viewer` (the least privileged built-in) when it is assignable, else the first one. */
+function defaultRoleOf(roles) {
+    return (roles.find((role) => role.id === 'viewer') ?? roles[0])?.id ?? '';
+}
+export function InviteMemberDialog({ open, onClose, onInvite, roles }) {
+    const [email, setEmail] = useState('');
+    // `null` until the person picks one: the default follows the list as it loads.
+    const [picked, setPicked] = useState(null);
+    const roleName = picked !== null && roles.some((role) => role.id === picked) ? picked : defaultRoleOf(roles);
+    const [notes, setNotes] = useState('');
+    const [error, setError] = useState(null);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    function reset() {
+        setEmail('');
+        setPicked(null);
+        setNotes('');
+        setError(null);
+    }
+    async function handleSubmit(event) {
+        event.preventDefault();
+        if (!email.trim()) {
+            setError('Email is required');
+            return;
+        }
+        if (!roleName) {
+            setError('There is no role you can invite someone as');
+            return;
+        }
+        setIsSubmitting(true);
+        setError(null);
+        try {
+            await onInvite({ email: email.trim(), roleName, ...(notes.trim() ? { notes: notes.trim() } : {}) });
+            reset();
+            onClose();
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : 'Failed to send the invitation');
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    }
+    return (_jsx(Dialog, { open: open, onClose: () => {
+            reset();
+            onClose();
+        }, fullWidth: true, maxWidth: "sm", children: _jsxs("form", { onSubmit: handleSubmit, noValidate: true, children: [_jsx(DialogTitle, { children: "Invite member" }), _jsx(DialogContent, { children: _jsxs(Stack, { spacing: 2, sx: { pt: 1 }, children: [error && _jsx(Alert, { severity: "error", children: error }), _jsx(TextField, { label: "Email", type: "email", value: email, onChange: (event) => setEmail(event.target.value), autoFocus: true, required: true, fullWidth: true, helperText: "They join when they sign in with this address. It is added to the allowlist." }), _jsxs(FormControl, { fullWidth: true, children: [_jsx(InputLabel, { id: "invite-role", children: "Role" }), _jsx(Select, { labelId: "invite-role", label: "Role", value: roleName, onChange: (event) => setPicked(event.target.value), children: roles.map((role) => (_jsx(MenuItem, { value: role.id, children: role.label }, role.id))) })] }), _jsx(TextField, { label: "Notes (private, not emailed)", value: notes, onChange: (event) => setNotes(event.target.value), multiline: true, minRows: 2, fullWidth: true, slotProps: { htmlInput: { maxLength: 500 } } })] }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: () => {
+                                reset();
+                                onClose();
+                            }, children: "Cancel" }), _jsx(Button, { type: "submit", variant: "contained", disabled: isSubmitting || !roleName, children: "Send invitation" })] })] }) }));
+}
+//# sourceMappingURL=InviteMemberDialog.js.map

package/dist/identity/ui/org/InviteMemberDialog.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"InviteMemberDialog.js","sourceRoot":"","sources":["../../../../src/identity/ui/org/InviteMemberDialog.tsx"],"names":[],"mappings":"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"}

package/dist/identity/ui/org/OrgInvitesPanel.d.ts

@@ -0,0 +1,32 @@
+/**
+ * The Invites tab of the Organization page (#726, PP-6.7): the ACTIVE
+ * organization's invitations. The tab itself is gated on `org_invites:read`
+ * by the page; the Invite and Revoke actions are disabled without
+ * `org_invites:write` (the API enforces both).
+ */
+import type { ReactElement } from 'react';
+import type { UseRolesReturn } from '../../headless/index.js';
+/**
+ * Props of {@link OrgInvitesPanel}.
+ *
+ * @stability experimental
+ */
+export interface OrgInvitesPanelProps {
+    /**
+     * The org roles (`useRoles('org')`), when the page already read them. Without
+     * it the panel reads its own.
+     */
+    roles?: UseRolesReturn;
+}
+/**
+ * The current organization's invitations: invite and revoke
+ * (`org_invites:write`). The Invites tab of {@link OrganizationPage}. The role
+ * choices and labels come from `GET /api/roles?scope=org`.
+ *
+ * @param props - see {@link OrgInvitesPanelProps}.
+ * @returns the component.
+ *
+ * @stability stable
+ */
+export declare function OrgInvitesPanel({ roles: rolesFromPage }?: OrgInvitesPanelProps): ReactElement;
+//# sourceMappingURL=OrgInvitesPanel.d.ts.map

package/dist/identity/ui/org/OrgInvitesPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrgInvitesPanel.d.ts","sourceRoot":"","sources":["../../../../src/identity/ui/org/OrgInvitesPanel.tsx"],"names":[],"mappings":"AAAA;;;;;GAKG;AACH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAkB1C,OAAO,KAAK,EAAmB,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAM/E;;;;GAIG;AACH,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC;CACxB;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,GAAE,oBAAyB,GAAG,YAAY,CAqGjG"}

package/dist/identity/ui/org/OrgInvitesPanel.js

@@ -0,0 +1,48 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { Alert, Box, Button, Chip, FormControl, InputLabel, MenuItem, Paper, Select, Stack, Typography, } from '@mui/material';
+import { Add as AddIcon } from '@mui/icons-material';
+import { usePermissions } from '../../headless/index.js';
+import { useOrgInvites, useRoles } from '../../headless/index.js';
+import { INVITE_STATUS_COLOR, formatDate, orgRoleLabel } from './orgLabels.js';
+import { InviteMemberDialog } from './InviteMemberDialog.js';
+/**
+ * The current organization's invitations: invite and revoke
+ * (`org_invites:write`). The Invites tab of {@link OrganizationPage}. The role
+ * choices and labels come from `GET /api/roles?scope=org`.
+ *
+ * @param props - see {@link OrgInvitesPanelProps}.
+ * @returns the component.
+ *
+ * @stability stable
+ */
+export function OrgInvitesPanel({ roles: rolesFromPage } = {}) {
+    const ownRoles = useRoles('org', { enabled: rolesFromPage === undefined });
+    const roles = rolesFromPage ?? ownRoles;
+    const { hasPermission } = usePermissions();
+    const canWrite = hasPermission('org_invites:write');
+    const { invites, isLoading, error, fetchInvites, inviteMember, revokeInvite } = useOrgInvites();
+    const [status, setStatus] = useState('pending');
+    const [dialogOpen, setDialogOpen] = useState(false);
+    const [busy, setBusy] = useState(null);
+    useEffect(() => {
+        void fetchInvites({ page: 1, pageSize: 100, status });
+    }, [fetchInvites, status]);
+    return (_jsxs(Stack, { spacing: 2, children: [_jsxs(Stack, { direction: { xs: 'column', sm: 'row' }, spacing: 2, sx: { alignItems: { sm: 'center' } }, children: [_jsxs(FormControl, { size: "small", sx: { minWidth: 180 }, children: [_jsx(InputLabel, { id: "invite-status-filter", children: "Status" }), _jsxs(Select, { labelId: "invite-status-filter", label: "Status", value: status, onChange: (event) => setStatus(event.target.value), children: [_jsx(MenuItem, { value: "pending", children: "Pending" }), _jsx(MenuItem, { value: "accepted", children: "Accepted" }), _jsx(MenuItem, { value: "revoked", children: "Revoked" }), _jsx(MenuItem, { value: "expired", children: "Expired" }), _jsx(MenuItem, { value: "all", children: "All" })] })] }), _jsx(Box, { sx: { flexGrow: 1 } }), _jsx(Button, { variant: "contained", startIcon: _jsx(AddIcon, {}), disabled: !canWrite, onClick: () => setDialogOpen(true), children: "Invite member" })] }), error && _jsx(Alert, { severity: "error", children: error }), !isLoading && invites.length === 0 && !error && (_jsx(Typography, { color: "text.secondary", children: "No invitations." })), invites.map((invite) => (_jsx(Paper, { variant: "outlined", sx: { p: 2 }, "data-testid": `invite-${invite.id}`, children: _jsxs(Stack, { direction: { xs: 'column', sm: 'row' }, spacing: 2, sx: { alignItems: { sm: 'center' } }, children: [_jsxs(Box, { sx: { flexGrow: 1, minWidth: 0 }, children: [_jsx(Typography, { noWrap: true, sx: { fontWeight: 600 }, children: invite.email }), _jsxs(Typography, { variant: "body2", color: "text.secondary", children: [orgRoleLabel(invite.role, roles.roles), invite.invitedBy ? ` · invited by ${invite.invitedBy.email}` : ''] }), _jsx(Typography, { variant: "caption", color: "text.secondary", children: invite.status === 'pending'
+                                        ? `Expires ${formatDate(invite.expiresAt)}`
+                                        : invite.status === 'accepted'
+                                            ? `Accepted ${formatDate(invite.acceptedAt)}`
+                                            : `Sent ${formatDate(invite.createdAt)}` })] }), _jsx(Chip, { label: invite.status, color: INVITE_STATUS_COLOR[invite.status], size: "small", sx: { alignSelf: { xs: 'flex-start', sm: 'center' }, textTransform: 'capitalize' } }), invite.status === 'pending' && (_jsx(Button, { size: "small", color: "error", variant: "outlined", disabled: !canWrite || busy === invite.id, onClick: async () => {
+                                setBusy(invite.id);
+                                try {
+                                    await revokeInvite(invite.id);
+                                }
+                                catch {
+                                    // The hook holds the API's message in `error`.
+                                }
+                                finally {
+                                    setBusy(null);
+                                }
+                            }, children: "Revoke" }))] }) }, invite.id))), _jsx(InviteMemberDialog, { open: dialogOpen, onClose: () => setDialogOpen(false), onInvite: inviteMember, roles: roles.assignable })] }));
+}
+//# sourceMappingURL=OrgInvitesPanel.js.map

package/dist/identity/ui/org/OrgInvitesPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrgInvitesPanel.js","sourceRoot":"","sources":["../../../../src/identity/ui/org/OrgInvitesPanel.tsx"],"names":[],"mappings":";AAOA,OAAO,EAAE,SAAS,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAC;AAC5C,OAAO,EACL,KAAK,EACL,GAAG,EACH,MAAM,EACN,IAAI,EACJ,WAAW,EACX,UAAU,EACV,QAAQ,EACR,KAAK,EACL,MAAM,EACN,KAAK,EACL,UAAU,GACX,MAAM,eAAe,CAAC;AACvB,OAAO,EAAE,GAAG,IAAI,OAAO,EAAE,MAAM,qBAAqB,CAAC;AACrD,OAAO,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AACzD,OAAO,EAAE,aAAa,EAAE,QAAQ,EAAE,MAAM,yBAAyB,CAAC;AAElE,OAAO,EAAE,mBAAmB,EAAE,UAAU,EAAE,YAAY,EAAE,MAAM,gBAAgB,CAAC;AAC/E,OAAO,EAAE,kBAAkB,EAAE,MAAM,yBAAyB,CAAC;AAiB7D;;;;;;;;;GASG;AACH,MAAM,UAAU,eAAe,CAAC,EAAE,KAAK,EAAE,aAAa,KAA2B,EAAE;IACjF,MAAM,QAAQ,GAAG,QAAQ,CAAC,KAAK,EAAE,EAAE,OAAO,EAAE,aAAa,KAAK,SAAS,EAAE,CAAC,CAAC;IAC3E,MAAM,KAAK,GAAG,aAAa,IAAI,QAAQ,CAAC;IACxC,MAAM,EAAE,aAAa,EAAE,GAAG,cAAc,EAAE,CAAC;IAC3C,MAAM,QAAQ,GAAG,aAAa,CAAC,mBAAmB,CAAC,CAAC;IACpD,MAAM,EAAE,OAAO,EAAE,SAAS,EAAE,KAAK,EAAE,YAAY,EAAE,YAAY,EAAE,YAAY,EAAE,GAAG,aAAa,EAAE,CAAC;IAChG,MAAM,CAAC,MAAM,EAAE,SAAS,CAAC,GAAG,QAAQ,CAAe,SAAS,CAAC,CAAC;IAC9D,MAAM,CAAC,UAAU,EAAE,aAAa,CAAC,GAAG,QAAQ,CAAC,KAAK,CAAC,CAAC;IACpD,MAAM,CAAC,IAAI,EAAE,OAAO,CAAC,GAAG,QAAQ,CAAgB,IAAI,CAAC,CAAC;IAEtD,SAAS,CAAC,GAAG,EAAE;QACb,KAAK,YAAY,CAAC,EAAE,IAAI,EAAE,CAAC,EAAE,QAAQ,EAAE,GAAG,EAAE,MAAM,EAAE,CAAC,CAAC;IACxD,CAAC,EAAE,CAAC,YAAY,EAAE,MAAM,CAAC,CAAC,CAAC;IAE3B,OAAO,CACL,MAAC,KAAK,IAAC,OAAO,EAAE,CAAC,aACf,MAAC,KAAK,IAAC,SAAS,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,aAC7F,MAAC,WAAW,IAAC,IAAI,EAAC,OAAO,EAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,GAAG,EAAE,aAC7C,KAAC,UAAU,IAAC,EAAE,EAAC,sBAAsB,uBAAoB,EACzD,MAAC,MAAM,IACL,OAAO,EAAC,sBAAsB,EAC9B,KAAK,EAAC,QAAQ,EACd,KAAK,EAAE,MAAM,EACb,QAAQ,EAAE,CAAC,KAAK,EAAE,EAAE,CAAC,SAAS,CAAC,KAAK,CAAC,MAAM,CAAC,KAAqB,CAAC,aAElE,KAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,wBAAmB,EAC5C,KAAC,QAAQ,IAAC,KAAK,EAAC,UAAU,yBAAoB,EAC9C,KAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,wBAAmB,EAC5C,KAAC,QAAQ,IAAC,KAAK,EAAC,SAAS,wBAAmB,EAC5C,KAAC,QAAQ,IAAC,KAAK,EAAC,KAAK,oBAAe,IAC7B,IACG,EACd,KAAC,GAAG,IAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE,GAAI,EAC5B,KAAC,MAAM,IAAC,OAAO,EAAC,WAAW,EAAC,SAAS,EAAE,KAAC,OAAO,KAAG,EAAE,QAAQ,EAAE,CAAC,QAAQ,EAAE,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,IAAI,CAAC,8BAElG,IACH,EAEP,KAAK,IAAI,KAAC,KAAK,IAAC,QAAQ,EAAC,OAAO,YAAE,KAAK,GAAS,EAEhD,CAAC,SAAS,IAAI,OAAO,CAAC,MAAM,KAAK,CAAC,IAAI,CAAC,KAAK,IAAI,CAC/C,KAAC,UAAU,IAAC,KAAK,EAAC,gBAAgB,gCAA6B,CAChE,EAEA,OAAO,CAAC,GAAG,CAAC,CAAC,MAAM,EAAE,EAAE,CAAC,CACvB,KAAC,KAAK,IAAiB,OAAO,EAAC,UAAU,EAAC,EAAE,EAAE,EAAE,CAAC,EAAE,CAAC,EAAE,iBAAe,UAAU,MAAM,CAAC,EAAE,EAAE,YACxF,MAAC,KAAK,IAAC,SAAS,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,EAAE,KAAK,EAAE,EAAE,OAAO,EAAE,CAAC,EAAE,EAAE,EAAE,EAAE,UAAU,EAAE,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,aAC7F,MAAC,GAAG,IAAC,EAAE,EAAE,EAAE,QAAQ,EAAE,CAAC,EAAE,QAAQ,EAAE,CAAC,EAAE,aACnC,KAAC,UAAU,IAAC,MAAM,QAAC,EAAE,EAAE,EAAE,UAAU,EAAE,GAAG,EAAE,YACvC,MAAM,CAAC,KAAK,GACF,EACb,MAAC,UAAU,IAAC,OAAO,EAAC,OAAO,EAAC,KAAK,EAAC,gBAAgB,aAC/C,YAAY,CAAC,MAAM,CAAC,IAAI,EAAE,KAAK,CAAC,KAAK,CAAC,EACtC,MAAM,CAAC,SAAS,CAAC,CAAC,CAAC,iBAAiB,MAAM,CAAC,SAAS,CAAC,KAAK,EAAE,CAAC,CAAC,CAAC,EAAE,IACvD,EACb,KAAC,UAAU,IAAC,OAAO,EAAC,SAAS,EAAC,KAAK,EAAC,gBAAgB,YACjD,MAAM,CAAC,MAAM,KAAK,SAAS;wCAC1B,CAAC,CAAC,WAAW,UAAU,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE;wCAC3C,CAAC,CAAC,MAAM,CAAC,MAAM,KAAK,UAAU;4CAC5B,CAAC,CAAC,YAAY,UAAU,CAAC,MAAM,CAAC,UAAU,CAAC,EAAE;4CAC7C,CAAC,CAAC,QAAQ,UAAU,CAAC,MAAM,CAAC,SAAS,CAAC,EAAE,GACjC,IACT,EACN,KAAC,IAAI,IACH,KAAK,EAAE,MAAM,CAAC,MAAM,EACpB,KAAK,EAAE,mBAAmB,CAAC,MAAM,CAAC,MAAM,CAAC,EACzC,IAAI,EAAC,OAAO,EACZ,EAAE,EAAE,EAAE,SAAS,EAAE,EAAE,EAAE,EAAE,YAAY,EAAE,EAAE,EAAE,QAAQ,EAAE,EAAE,aAAa,EAAE,YAAY,EAAE,GAClF,EACD,MAAM,CAAC,MAAM,KAAK,SAAS,IAAI,CAC9B,KAAC,MAAM,IACL,IAAI,EAAC,OAAO,EACZ,KAAK,EAAC,OAAO,EACb,OAAO,EAAC,UAAU,EAClB,QAAQ,EAAE,CAAC,QAAQ,IAAI,IAAI,KAAK,MAAM,CAAC,EAAE,EACzC,OAAO,EAAE,KAAK,IAAI,EAAE;gCAClB,OAAO,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;gCACnB,IAAI,CAAC;oCACH,MAAM,YAAY,CAAC,MAAM,CAAC,EAAE,CAAC,CAAC;gCAChC,CAAC;gCAAC,MAAM,CAAC;oCACP,+CAA+C;gCACjD,CAAC;wCAAS,CAAC;oCACT,OAAO,CAAC,IAAI,CAAC,CAAC;gCAChB,CAAC;4BACH,CAAC,uBAGM,CACV,IACK,IA5CE,MAAM,CAAC,EAAE,CA6Cb,CACT,CAAC,EAEF,KAAC,kBAAkB,IACjB,IAAI,EAAE,UAAU,EAChB,OAAO,EAAE,GAAG,EAAE,CAAC,aAAa,CAAC,KAAK,CAAC,EACnC,QAAQ,EAAE,YAAY,EACtB,KAAK,EAAE,KAAK,CAAC,UAAU,GACvB,IACI,CACT,CAAC;AACJ,CAAC"}

package/dist/identity/ui/org/OrgMembersPanel.d.ts

@@ -0,0 +1,58 @@
+/**
+ * The Members tab of the Organization page (#726, PP-6.7): the ACTIVE
+ * organization's members, with their org role and status.
+ *
+ * Controls are disabled without `org_members:write` (the API enforces it
+ * anyway), and on the viewer's own row: the API refuses self-demotion,
+ * self-suspension and self-removal, so the page does not offer them. Every
+ * other rule (the last active administrator) is the API's to decide; its
+ * refusal is shown as returned.
+ *
+ * Laid out as a list of rows that wrap, not a wide table, so it works at
+ * phone width without horizontal scrolling.
+ */
+import type { ReactElement } from 'react';
+import type { TableSlots } from '../../../core/index.js';
+import type { OrgMember, UseRolesReturn } from '../../headless/index.js';
+/**
+ * The slots of {@link OrgMembersPanel}: the table slots that make sense for a
+ * list of member rows. `RowActions` adds controls to a member's action row,
+ * `DetailPanel` adds content under the member's row, `Toolbar` adds controls
+ * under the search box. There is no `Columns`: the panel is a list of cards that
+ * wrap at phone width, not a table with columns to add.
+ *
+ * @example
+ * ```tsx
+ * <OrgMembersPanel slots={{ RowActions: ({ row }) => <ResendWelcome userId={row.userId} /> }} />
+ * ```
+ *
+ * @extensionPoint slot
+ * @stability experimental
+ */
+export type OrgMembersPanelSlots = Pick<TableSlots<OrgMember>, 'RowActions' | 'DetailPanel' | 'Toolbar'>;
+/**
+ * Props of {@link OrgMembersPanel}.
+ *
+ * @stability experimental
+ */
+export interface OrgMembersPanelProps {
+    /**
+     * The org roles (`useRoles('org')`), when the page already read them. Without
+     * it the panel reads its own.
+     */
+    roles?: UseRolesReturn;
+    /** Add per-member actions, a detail view or toolbar controls. */
+    slots?: OrgMembersPanelSlots;
+}
+/**
+ * The current organization's members: role and status changes and removal
+ * (`org_members:write`). The Members tab of {@link OrganizationPage}. The roles
+ * offered come from `GET /api/roles?scope=org` (the assignable ones).
+ *
+ * @param props - see {@link OrgMembersPanelProps}.
+ * @returns the component.
+ *
+ * @stability stable
+ */
+export declare function OrgMembersPanel({ roles: rolesFromPage, slots }?: OrgMembersPanelProps): ReactElement;
+//# sourceMappingURL=OrgMembersPanel.d.ts.map

package/dist/identity/ui/org/OrgMembersPanel.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrgMembersPanel.d.ts","sourceRoot":"","sources":["../../../../src/identity/ui/org/OrgMembersPanel.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;GAYG;AACH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAqB1C,OAAO,KAAK,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAIzD,OAAO,KAAK,EAAE,SAAS,EAAE,cAAc,EAAE,MAAM,yBAAyB,CAAC;AAGzE;;;;;;;;;;;;;;GAcG;AACH,MAAM,MAAM,oBAAoB,GAAG,IAAI,CAAC,UAAU,CAAC,SAAS,CAAC,EAAE,YAAY,GAAG,aAAa,GAAG,SAAS,CAAC,CAAC;AAEzG;;;;GAIG;AACH,MAAM,WAAW,oBAAoB;IACnC;;;OAGG;IACH,KAAK,CAAC,EAAE,cAAc,CAAC;IACvB,iEAAiE;IACjE,KAAK,CAAC,EAAE,oBAAoB,CAAC;CAC9B;AAED;;;;;;;;;GASG;AACH,wBAAgB,eAAe,CAAC,EAAE,KAAK,EAAE,aAAa,EAAE,KAAK,EAAE,GAAE,oBAAyB,GAAG,YAAY,CA0KxG"}

package/dist/identity/ui/org/OrgMembersPanel.js

@@ -0,0 +1,59 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { Alert, Box, Button, Chip, Dialog, DialogActions, DialogContent, DialogContentText, DialogTitle, FormControl, InputLabel, MenuItem, Paper, Select, Stack, TextField, Typography, } from '@mui/material';
+import { useAuth } from '../../headless/index.js';
+import { usePermissions } from '../../headless/index.js';
+import { useOrgMembers, useRoles } from '../../headless/index.js';
+import { MEMBER_STATUS_COLOR, formatDate, orgRoleLabel } from './orgLabels.js';
+/**
+ * The current organization's members: role and status changes and removal
+ * (`org_members:write`). The Members tab of {@link OrganizationPage}. The roles
+ * offered come from `GET /api/roles?scope=org` (the assignable ones).
+ *
+ * @param props - see {@link OrgMembersPanelProps}.
+ * @returns the component.
+ *
+ * @stability stable
+ */
+export function OrgMembersPanel({ roles: rolesFromPage, slots } = {}) {
+    const RowActions = slots?.RowActions;
+    const DetailPanel = slots?.DetailPanel;
+    const Toolbar = slots?.Toolbar;
+    const ownRoles = useRoles('org', { enabled: rolesFromPage === undefined });
+    const roles = rolesFromPage ?? ownRoles;
+    const { user } = useAuth();
+    const { hasPermission } = usePermissions();
+    const canWrite = hasPermission('org_members:write');
+    const { members, total, isLoading, error, fetchMembers, updateMember, removeMember } = useOrgMembers();
+    const [search, setSearch] = useState('');
+    const [busy, setBusy] = useState(null);
+    const [confirmRemove, setConfirmRemove] = useState(null);
+    useEffect(() => {
+        void fetchMembers({ page: 1, pageSize: 100, search: search.trim() || undefined });
+    }, [fetchMembers, search]);
+    async function run(userId, action) {
+        setBusy(userId);
+        try {
+            await action();
+        }
+        catch {
+            // The hook already holds the API's message in `error`.
+        }
+        finally {
+            setBusy(null);
+        }
+    }
+    return (_jsxs(Stack, { spacing: 2, children: [_jsx(TextField, { label: "Search members", size: "small", value: search, onChange: (event) => setSearch(event.target.value), sx: { maxWidth: { sm: 360 } } }), Toolbar && _jsx(Toolbar, {}), error && _jsx(Alert, { severity: "error", children: error }), !isLoading && members.length === 0 && !error && (_jsx(Typography, { color: "text.secondary", children: "No members match." })), members.map((member) => {
+                const isSelf = member.userId === user?.id;
+                const disabled = !canWrite || isSelf || busy === member.userId;
+                return (_jsxs(Paper, { variant: "outlined", sx: { p: 2 }, "data-testid": `member-${member.userId}`, children: [_jsxs(Stack, { direction: { xs: 'column', sm: 'row' }, spacing: 2, sx: { alignItems: { xs: 'stretch', sm: 'center' } }, children: [_jsxs(Box, { sx: { flexGrow: 1, minWidth: 0 }, children: [_jsxs(Typography, { noWrap: true, sx: { fontWeight: 600 }, children: [member.displayName ?? member.email, isSelf ? ' (you)' : ''] }), _jsx(Typography, { variant: "body2", color: "text.secondary", noWrap: true, children: member.email }), _jsxs(Typography, { variant: "caption", color: "text.secondary", children: ["Last active ", formatDate(member.lastActiveAt)] })] }), _jsx(Chip, { label: member.status === 'active' ? 'Active' : 'Suspended', color: MEMBER_STATUS_COLOR[member.status], size: "small", sx: { alignSelf: { xs: 'flex-start', sm: 'center' } } }), _jsxs(FormControl, { size: "small", sx: { minWidth: 160 }, disabled: disabled, children: [_jsx(InputLabel, { id: `role-${member.userId}`, children: "Role" }), _jsxs(Select, { labelId: `role-${member.userId}`, label: "Role", value: member.role, onChange: (event) => void run(member.userId, () => updateMember(member.userId, { roleName: event.target.value })), children: [!roles.assignable.some((role) => role.id === member.role) && (_jsx(MenuItem, { value: member.role, disabled: true, children: orgRoleLabel(member.role, roles.roles) })), roles.assignable.map((role) => (_jsx(MenuItem, { value: role.id, children: role.label }, role.id)))] })] }), _jsxs(Stack, { direction: "row", spacing: 1, children: [_jsx(Button, { size: "small", variant: "outlined", disabled: disabled, onClick: () => void run(member.userId, () => updateMember(member.userId, {
+                                                status: member.status === 'active' ? 'suspended' : 'active',
+                                            })), children: member.status === 'active' ? 'Suspend' : 'Reactivate' }), _jsx(Button, { size: "small", color: "error", variant: "outlined", disabled: disabled, onClick: () => setConfirmRemove(member), children: "Remove" }), RowActions && _jsx(RowActions, { row: member })] })] }), DetailPanel && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(DetailPanel, { row: member }) }))] }, member.userId));
+            }), total > members.length && (_jsxs(Typography, { variant: "body2", color: "text.secondary", children: ["Showing ", members.length, " of ", total, ". Search to narrow the list."] })), _jsxs(Dialog, { open: confirmRemove !== null, onClose: () => setConfirmRemove(null), children: [_jsx(DialogTitle, { children: "Remove member?" }), _jsx(DialogContent, { children: _jsxs(DialogContentText, { children: [confirmRemove?.email, " loses access to this organization at once: their sessions, personal access tokens and device sign-ins for it stop working. Their other organizations are not affected."] }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: () => setConfirmRemove(null), children: "Cancel" }), _jsx(Button, { color: "error", onClick: () => {
+                                    const target = confirmRemove;
+                                    setConfirmRemove(null);
+                                    if (target)
+                                        void run(target.userId, () => removeMember(target.userId));
+                                }, children: "Remove" })] })] })] }));
+}
+//# sourceMappingURL=OrgMembersPanel.js.map

package/dist/identity/ui/org/OrgMembersPanel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrgMembersPanel.js","sourceRoot":"","sources":["../../../../src/identity/ui/org/OrgMembersPanel.tsx"],"names":[],"mappings":"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"}

package/dist/identity/ui/org/OrganizationPage.d.ts

@@ -0,0 +1,54 @@
+/**
+ * Organization (#726, PP-6.7): the people of the CURRENT organization, for
+ * its administrator. Reached through the `Organization` card
+ * (`/admin/settings/organization`, `org_members:read`, `feature: 'orgs'`).
+ *
+ * TWO TABS, ONE DESTINATION, the `UsersPage` precedent: Members and Invites
+ * are parallel answers to one question ("who belongs to this org"), not two
+ * settings pages. The Invites tab gates its own content on `org_invites:read`
+ * because its data comes from a different controller
+ * (`org-invites.controller.ts`); a destination gate is about reachability, a
+ * tab gate about content.
+ *
+ * "Current" is the org the session's token is bound to (the AppBar switcher
+ * changes it); no org id is ever sent from here.
+ */
+import type { ReactElement } from 'react';
+import type { PageSlotsBase } from '../../../core/index.js';
+import type { OrgMembersPanelSlots } from './OrgMembersPanel.js';
+/**
+ * The slots of {@link OrganizationPage}: the page-slot contract and the member
+ * list's slots (`RowActions`, `DetailPanel`, `Toolbar`, passed to the Members
+ * tab). `Sections` is drawn at both ends of the page body, outside the tab strip.
+ *
+ * @example
+ * ```tsx
+ * <OrganizationPage slots={{ BeforeContent: SeatsNotice, RowActions: ({ row }) => <SeatMenu userId={row.userId} /> }} />
+ * ```
+ *
+ * @extensionPoint slot
+ * @stability experimental
+ */
+export interface OrganizationPageSlots extends PageSlotsBase, OrgMembersPanelSlots {
+}
+/**
+ * Props of {@link OrganizationPage}.
+ *
+ * @stability experimental
+ */
+export interface OrganizationPageProps {
+    /** Add to the page without a fork. */
+    slots?: OrganizationPageSlots;
+}
+/**
+ * The `Organization` page (`/admin/settings/organization`): the current
+ * organization's Members tab and, gated on `org_invites:read`, its Invites tab.
+ *
+ * @param props - see {@link OrganizationPageProps}.
+ * @returns the page.
+ *
+ * @extensionPoint component
+ * @stability stable
+ */
+export declare function OrganizationPage({ slots }?: OrganizationPageProps): ReactElement;
+//# sourceMappingURL=OrganizationPage.d.ts.map

package/dist/identity/ui/org/OrganizationPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationPage.d.ts","sourceRoot":"","sources":["../../../../src/identity/ui/org/OrganizationPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;;;;;GAcG;AACH,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,OAAO,CAAC;AAG1C,OAAO,KAAK,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AAK5D,OAAO,KAAK,EAAE,oBAAoB,EAAE,MAAM,sBAAsB,CAAC;AAoBjE;;;;;;;;;;;;GAYG;AACH,MAAM,WAAW,qBAAsB,SAAQ,aAAa,EAAE,oBAAoB;CAAG;AAErF;;;;GAIG;AACH,MAAM,WAAW,qBAAqB;IACpC,sCAAsC;IACtC,KAAK,CAAC,EAAE,qBAAqB,CAAC;CAC/B;AAED;;;;;;;;;GASG;AACH,wBAAgB,gBAAgB,CAAC,EAAE,KAAK,EAAE,GAAE,qBAA0B,GAAG,YAAY,CAkEpF"}

package/dist/identity/ui/org/OrganizationPage.js

@@ -0,0 +1,45 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useState } from 'react';
+import { Box, Container, Paper, Tab, Tabs, Typography } from '@mui/material';
+import { useAuth, usePermissions, useRoles } from '../../headless/index.js';
+import { RequirePermission } from '../../headless/index.js';
+import { DefaultPageHeader } from '../PageHeader.js';
+import { OrgMembersPanel } from './OrgMembersPanel.js';
+import { OrgInvitesPanel } from './OrgInvitesPanel.js';
+/** The page's title, the word of its registry card. */
+const PAGE_TITLE = 'Organization';
+function TabPanel({ children, value, index }) {
+    return (_jsx("div", { role: "tabpanel", hidden: value !== index, children: value === index && _jsx(Box, { sx: { py: { xs: 2, sm: 3 } }, children: children }) }));
+}
+/**
+ * The `Organization` page (`/admin/settings/organization`): the current
+ * organization's Members tab and, gated on `org_invites:read`, its Invites tab.
+ *
+ * @param props - see {@link OrganizationPageProps}.
+ * @returns the page.
+ *
+ * @extensionPoint component
+ * @stability stable
+ */
+export function OrganizationPage({ slots } = {}) {
+    const { activeOrg } = useAuth();
+    const { hasPermission } = usePermissions();
+    const Header = slots?.Header;
+    const BeforeContent = slots?.BeforeContent;
+    const Sections = slots?.Sections;
+    const AfterContent = slots?.AfterContent;
+    const memberSlots = {
+        ...(slots?.RowActions ? { RowActions: slots.RowActions } : {}),
+        ...(slots?.DetailPanel ? { DetailPanel: slots.DetailPanel } : {}),
+        ...(slots?.Toolbar ? { Toolbar: slots.Toolbar } : {}),
+    };
+    const hasMemberSlots = Object.keys(memberSlots).length > 0;
+    // Read once for both tabs: the choices in the dialogs and the labels in the lists.
+    const roles = useRoles('org');
+    const [tabIndex, setTabIndex] = useState(0);
+    const description = activeOrg
+        ? `The members of ${activeOrg.name}, and who is invited to join.`
+        : 'The members of your current organization, and who is invited to join.';
+    return (_jsx(Container, { maxWidth: "lg", children: _jsxs(Box, { sx: { py: { xs: 2, sm: 4 } }, children: [Header ? (_jsx(Header, { title: PAGE_TITLE, description: description, readOnly: !hasPermission('org_members:write'), actions: null })) : (_jsx(DefaultPageHeader, { title: PAGE_TITLE, description: description })), BeforeContent && _jsx(BeforeContent, {}), Sections && _jsx(Sections, { position: "top" }), _jsxs(Paper, { sx: { mt: 2 }, children: [_jsxs(Tabs, { value: tabIndex, onChange: (_, value) => setTabIndex(value), sx: { borderBottom: 1, borderColor: 'divider' }, variant: "fullWidth", children: [_jsx(Tab, { label: "Members" }), _jsx(Tab, { label: "Invites" })] }), _jsxs(Box, { sx: { px: { xs: 2, sm: 3 } }, children: [_jsx(TabPanel, { value: tabIndex, index: 0, children: _jsx(OrgMembersPanel, { roles: roles, ...(hasMemberSlots ? { slots: memberSlots } : {}) }) }), _jsx(TabPanel, { value: tabIndex, index: 1, children: _jsx(RequirePermission, { permission: "org_invites:read", fallback: _jsx(Typography, { color: "text.secondary", children: "You do not have permission to view this organization's invitations." }), children: _jsx(OrgInvitesPanel, { roles: roles }) }) })] })] }), Sections && _jsx(Sections, { position: "bottom" }), AfterContent && _jsx(AfterContent, {})] }) }));
+}
+//# sourceMappingURL=OrganizationPage.js.map

package/dist/identity/ui/org/OrganizationPage.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationPage.js","sourceRoot":"","sources":["../../../../src/identity/ui/org/OrganizationPage.tsx"],"names":[],"mappings":"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"}

package/dist/identity/ui/org/OrganizationsPage.d.ts

@@ -0,0 +1,53 @@
+/**
+ * Organizations (#726, PP-6.7): the deployment's organizations, for its
+ * operator. Reached through the `Organizations` card
+ * (`/admin/settings/organizations`, the SYSTEM permission
+ * `organizations:read`, `feature: 'orgs'`).
+ *
+ * Create (with the first administrator's email, who receives an `org_admin`
+ * invitation) and rename are disabled without `organizations:write`; the API
+ * enforces it, refuses a taken slug, and keeps the slug immutable after
+ * creation. Deleting an organization is not offered (out of scope).
+ */
+import type { ReactElement, ReactNode } from 'react';
+import type { PageSlotsBase, TableSlots } from '../../../core/index.js';
+import type { Organization } from '../../headless/index.js';
+/**
+ * Props of {@link OrganizationsPage}.
+ *
+ * @stability experimental
+ */
+export interface OrganizationsPageProps {
+    /**
+     * Extra actions of one organization row, rendered after Rename: the slot
+     * another slice registers an action through (the user-data slice's
+     * `OffboardOrganizationButton`, #743). `refresh` reloads the list.
+     */
+    renderActions?(organization: Organization, helpers: {
+        refresh(): void;
+    }): ReactNode;
+    /** Add to the page without a fork. */
+    slots?: OrganizationsPageSlots;
+}
+/**
+ * The slots of {@link OrganizationsPage}: the page-slot contract and the table
+ * slots that make sense for a list of organization rows (`RowActions` after
+ * `renderActions`, `DetailPanel` under the row, `Toolbar` next to the search).
+ * There is no `Columns`: the page is a list of cards, not a table.
+ *
+ * @extensionPoint slot
+ * @stability experimental
+ */
+export type OrganizationsPageSlots = PageSlotsBase & Pick<TableSlots<Organization>, 'RowActions' | 'DetailPanel' | 'Toolbar'>;
+/**
+ * The `Organizations` page (`/admin/settings/organizations`): the
+ * deployment's organizations, for operators holding `organizations:read`.
+ *
+ * @param props - see {@link OrganizationsPageProps}.
+ * @returns the page.
+ *
+ * @extensionPoint component
+ * @stability stable
+ */
+export declare function OrganizationsPage(props?: OrganizationsPageProps): ReactElement;
+//# sourceMappingURL=OrganizationsPage.d.ts.map

package/dist/identity/ui/org/OrganizationsPage.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"OrganizationsPage.d.ts","sourceRoot":"","sources":["../../../../src/identity/ui/org/OrganizationsPage.tsx"],"names":[],"mappings":"AAAA;;;;;;;;;;GAUG;AACH,OAAO,KAAK,EAAE,YAAY,EAAE,SAAS,EAAE,MAAM,OAAO,CAAC;AAkBrD,OAAO,KAAK,EAAE,aAAa,EAAE,UAAU,EAAE,MAAM,wBAAwB,CAAC;AAGxE,OAAO,KAAK,EAAE,YAAY,EAAE,MAAM,yBAAyB,CAAC;AA0K5D;;;;GAIG;AACH,MAAM,WAAW,sBAAsB;IACrC;;;;OAIG;IACH,aAAa,CAAC,CAAC,YAAY,EAAE,YAAY,EAAE,OAAO,EAAE;QAAE,OAAO,IAAI,IAAI,CAAA;KAAE,GAAG,SAAS,CAAC;IACpF,sCAAsC;IACtC,KAAK,CAAC,EAAE,sBAAsB,CAAC;CAChC;AAED;;;;;;;;GAQG;AACH,MAAM,MAAM,sBAAsB,GAAG,aAAa,GAAG,IAAI,CAAC,UAAU,CAAC,YAAY,CAAC,EAAE,YAAY,GAAG,aAAa,GAAG,SAAS,CAAC,CAAC;AAE9H;;;;;;;;;GASG;AACH,wBAAgB,iBAAiB,CAAC,KAAK,GAAE,sBAA2B,GAAG,YAAY,CAwGlF"}

package/dist/identity/ui/org/OrganizationsPage.js

@@ -0,0 +1,117 @@
+import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { useEffect, useState } from 'react';
+import { Alert, Box, Button, Chip, Container, Dialog, DialogActions, DialogContent, DialogTitle, Paper, Stack, TextField, Typography, } from '@mui/material';
+import { Add as AddIcon } from '@mui/icons-material';
+import { usePermissions } from '../../headless/index.js';
+import { useOrganizations } from '../../headless/index.js';
+import { DefaultPageHeader } from '../PageHeader.js';
+/** The page's title and subtitle, the words of its registry card. */
+const PAGE_TITLE = 'Organizations';
+const PAGE_DESCRIPTION = 'Every organization in this deployment. A new organization starts with an invitation for its first administrator.';
+/** A slug suggestion from a name. The API validates the final value. */
+function slugFrom(name) {
+    return name
+        .toLowerCase()
+        .normalize('NFKD')
+        .replace(/[̀-ͯ]/g, '')
+        .replace(/[^a-z0-9]+/g, '-')
+        .replace(/^-+|-+$/g, '')
+        .slice(0, 63);
+}
+function CreateOrganizationDialog({ open, onClose, onCreate, }) {
+    const [name, setName] = useState('');
+    const [slug, setSlug] = useState('');
+    const [slugTouched, setSlugTouched] = useState(false);
+    const [firstAdminEmail, setFirstAdminEmail] = useState('');
+    const [error, setError] = useState(null);
+    const [isSubmitting, setIsSubmitting] = useState(false);
+    function close() {
+        setName('');
+        setSlug('');
+        setSlugTouched(false);
+        setFirstAdminEmail('');
+        setError(null);
+        onClose();
+    }
+    async function handleSubmit(event) {
+        event.preventDefault();
+        if (!name.trim() || !slug.trim() || !firstAdminEmail.trim()) {
+            setError('Name, slug and the first administrator are required');
+            return;
+        }
+        setIsSubmitting(true);
+        setError(null);
+        try {
+            await onCreate({ name: name.trim(), slug: slug.trim(), firstAdminEmail: firstAdminEmail.trim() });
+            close();
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : 'Failed to create the organization');
+        }
+        finally {
+            setIsSubmitting(false);
+        }
+    }
+    return (_jsx(Dialog, { open: open, onClose: close, fullWidth: true, maxWidth: "sm", children: _jsxs("form", { onSubmit: handleSubmit, noValidate: true, children: [_jsx(DialogTitle, { children: "Create organization" }), _jsx(DialogContent, { children: _jsxs(Stack, { spacing: 2, sx: { pt: 1 }, children: [error && _jsx(Alert, { severity: "error", children: error }), _jsx(TextField, { label: "Name", value: name, onChange: (event) => {
+                                    setName(event.target.value);
+                                    if (!slugTouched)
+                                        setSlug(slugFrom(event.target.value));
+                                }, autoFocus: true, required: true, fullWidth: true }), _jsx(TextField, { label: "Slug", value: slug, onChange: (event) => {
+                                    setSlugTouched(true);
+                                    setSlug(event.target.value);
+                                }, required: true, fullWidth: true, helperText: "Lower-case letters, digits and hyphens. It cannot be changed later." }), _jsx(TextField, { label: "First administrator's email", type: "email", value: firstAdminEmail, onChange: (event) => setFirstAdminEmail(event.target.value), required: true, fullWidth: true, helperText: "They receive an invitation and become the organization's administrator when they sign in." })] }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: close, children: "Cancel" }), _jsx(Button, { type: "submit", variant: "contained", disabled: isSubmitting, children: "Create" })] })] }) }));
+}
+function RenameOrganizationDialog({ organization, onClose, onRename, }) {
+    const [name, setName] = useState('');
+    const [error, setError] = useState(null);
+    useEffect(() => {
+        setName(organization?.name ?? '');
+        setError(null);
+    }, [organization]);
+    async function handleSubmit(event) {
+        event.preventDefault();
+        if (!organization)
+            return;
+        try {
+            await onRename(organization.id, name.trim());
+            onClose();
+        }
+        catch (err) {
+            setError(err instanceof Error ? err.message : 'Failed to rename the organization');
+        }
+    }
+    return (_jsx(Dialog, { open: organization !== null, onClose: onClose, fullWidth: true, maxWidth: "sm", children: _jsxs("form", { onSubmit: handleSubmit, noValidate: true, children: [_jsx(DialogTitle, { children: "Rename organization" }), _jsx(DialogContent, { children: _jsxs(Stack, { spacing: 2, sx: { pt: 1 }, children: [error && _jsx(Alert, { severity: "error", children: error }), _jsx(TextField, { label: "Name", value: name, onChange: (event) => setName(event.target.value), autoFocus: true, required: true, fullWidth: true, helperText: organization ? `The slug stays ${organization.slug}.` : undefined })] }) }), _jsxs(DialogActions, { children: [_jsx(Button, { onClick: onClose, children: "Cancel" }), _jsx(Button, { type: "submit", variant: "contained", disabled: !name.trim(), children: "Rename" })] })] }) }));
+}
+/**
+ * The `Organizations` page (`/admin/settings/organizations`): the
+ * deployment's organizations, for operators holding `organizations:read`.
+ *
+ * @param props - see {@link OrganizationsPageProps}.
+ * @returns the page.
+ *
+ * @extensionPoint component
+ * @stability stable
+ */
+export function OrganizationsPage(props = {}) {
+    const { slots } = props;
+    const Header = slots?.Header;
+    const BeforeContent = slots?.BeforeContent;
+    const Sections = slots?.Sections;
+    const AfterContent = slots?.AfterContent;
+    const RowActions = slots?.RowActions;
+    const DetailPanel = slots?.DetailPanel;
+    const Toolbar = slots?.Toolbar;
+    const { hasPermission } = usePermissions();
+    const canWrite = hasPermission('organizations:write');
+    const { organizations, total, isLoading, error, fetchOrganizations, createOrg, renameOrg } = useOrganizations();
+    const [search, setSearch] = useState('');
+    const [createOpen, setCreateOpen] = useState(false);
+    const [renaming, setRenaming] = useState(null);
+    useEffect(() => {
+        void fetchOrganizations({ page: 1, pageSize: 100, search: search.trim() || undefined });
+    }, [fetchOrganizations, search]);
+    return (_jsx(Container, { maxWidth: "lg", children: _jsxs(Box, { sx: { py: { xs: 2, sm: 4 } }, children: [Header ? (_jsx(Header, { title: PAGE_TITLE, description: PAGE_DESCRIPTION, readOnly: !canWrite, actions: null })) : (_jsx(DefaultPageHeader, { title: PAGE_TITLE, description: PAGE_DESCRIPTION, descriptionMarginBottom: 3 })), BeforeContent && _jsx(BeforeContent, {}), Sections && _jsx(Sections, { position: "top" }), _jsxs(Stack, { spacing: 2, children: [_jsxs(Stack, { direction: { xs: 'column', sm: 'row' }, spacing: 2, sx: { alignItems: { sm: 'center' } }, children: [_jsx(TextField, { label: "Search organizations", size: "small", value: search, onChange: (event) => setSearch(event.target.value), sx: { maxWidth: { sm: 360 } } }), _jsx(Box, { sx: { flexGrow: 1 } }), _jsx(Button, { variant: "contained", startIcon: _jsx(AddIcon, {}), disabled: !canWrite, onClick: () => setCreateOpen(true), children: "Create organization" })] }), Toolbar && _jsx(Toolbar, {}), error && _jsx(Alert, { severity: "error", children: error }), !isLoading && organizations.length === 0 && !error && (_jsx(Typography, { color: "text.secondary", children: "No organizations match." })), organizations.map((organization) => (_jsxs(Paper, { variant: "outlined", sx: { p: 2 }, "data-testid": `org-${organization.id}`, children: [_jsxs(Stack, { direction: { xs: 'column', sm: 'row' }, spacing: 2, sx: { alignItems: { sm: 'center' } }, children: [_jsxs(Box, { sx: { flexGrow: 1, minWidth: 0 }, children: [_jsx(Typography, { noWrap: true, sx: { fontWeight: 600 }, children: organization.name }), _jsxs(Typography, { variant: "body2", color: "text.secondary", noWrap: true, children: [organization.slug, " \u00B7 ", organization.memberCount, ' ', organization.memberCount === 1 ? 'member' : 'members'] })] }), organization.isDefault && (_jsx(Chip, { label: "Default", size: "small", sx: { alignSelf: { xs: 'flex-start', sm: 'center' } } })), _jsx(Button, { size: "small", variant: "outlined", disabled: !canWrite, onClick: () => setRenaming(organization), children: "Rename" }), props.renderActions?.(organization, {
+                                            refresh: () => void fetchOrganizations({ page: 1, pageSize: 100, search: search.trim() || undefined }),
+                                        }), RowActions && _jsx(RowActions, { row: organization })] }), DetailPanel && (_jsx(Box, { sx: { mt: 2 }, children: _jsx(DetailPanel, { row: organization }) }))] }, organization.id))), total > organizations.length && (_jsxs(Typography, { variant: "body2", color: "text.secondary", children: ["Showing ", organizations.length, " of ", total, ". Search to narrow the list."] }))] }), _jsx(CreateOrganizationDialog, { open: createOpen, onClose: () => setCreateOpen(false), onCreate: createOrg }), _jsx(RenameOrganizationDialog, { organization: renaming, onClose: () => setRenaming(null), onRename: renameOrg }), Sections && _jsx(Sections, { position: "bottom" }), AfterContent && _jsx(AfterContent, {})] }) }));
+}
+//# sourceMappingURL=OrganizationsPage.js.map