@voyant-travel/admin 0.113.0 → 0.115.0

package/dist/components/team-settings-api.d.ts

@@ -0,0 +1,10 @@
+export interface TeamSettingsPageApi {
+    get: <T = unknown>(path: string) => Promise<T>;
+    post: <T = unknown>(path: string, body?: unknown) => Promise<T>;
+    put: <T = unknown>(path: string, body?: unknown) => Promise<T>;
+    delete: <T = unknown>(path: string) => Promise<T>;
+}
+export declare const TeamSettingsPageApiContext: import("react").Context<TeamSettingsPageApi | null>;
+export declare function createTeamSettingsPageApi(baseUrl: string, fetcher: (url: string, init?: RequestInit) => Promise<Response>): TeamSettingsPageApi;
+export declare function useTeamSettingsPageApi(): TeamSettingsPageApi;
+//# sourceMappingURL=team-settings-api.d.ts.map

package/dist/components/team-settings-api.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"team-settings-api.d.ts","sourceRoot":"","sources":["../../src/components/team-settings-api.ts"],"names":[],"mappings":"AAIA,MAAM,WAAW,mBAAmB;IAClC,GAAG,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;IAC9C,IAAI,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;IAC/D,GAAG,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;IAC9D,MAAM,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;CAClD;AAED,eAAO,MAAM,0BAA0B,qDAAkD,CAAA;AA2BzF,wBAAgB,yBAAyB,CACvC,OAAO,EAAE,MAAM,EACf,OAAO,EAAE,CAAC,GAAG,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,WAAW,KAAK,OAAO,CAAC,QAAQ,CAAC,uBA0BhE;AAED,wBAAgB,sBAAsB,wBAIrC"}

package/dist/components/team-settings-api.js

@@ -0,0 +1,54 @@
+"use client";
+import { createContext, useContext } from "react";
+export const TeamSettingsPageApiContext = createContext(null);
+function joinUrl(baseUrl, path) {
+    const trimmedBase = baseUrl.endsWith("/") ? baseUrl.slice(0, -1) : baseUrl;
+    const trimmedPath = path.startsWith("/") ? path : `/${path}`;
+    return `${trimmedBase}${trimmedPath}`;
+}
+async function readJson(response) {
+    if (!response.ok) {
+        let body;
+        try {
+            body = await response.json();
+        }
+        catch {
+            body = await response.text().catch(() => undefined);
+        }
+        const message = typeof body === "object" && body !== null && "error" in body
+            ? String(body.error)
+            : `API error: ${response.status} ${response.statusText}`;
+        throw new Error(message);
+    }
+    if (response.status === 204)
+        return undefined;
+    return response.json();
+}
+export function createTeamSettingsPageApi(baseUrl, fetcher) {
+    const request = async (path, init = {}) => {
+        const headers = new Headers(init.headers);
+        if (init.body !== undefined && !headers.has("Content-Type")) {
+            headers.set("Content-Type", "application/json");
+        }
+        return readJson(await fetcher(joinUrl(baseUrl, path), { ...init, headers }));
+    };
+    const api = {
+        get: (path) => request(path, { method: "GET" }),
+        post: (path, body) => request(path, {
+            method: "POST",
+            body: body !== undefined ? JSON.stringify(body) : undefined,
+        }),
+        put: (path, body) => request(path, {
+            method: "PUT",
+            body: body !== undefined ? JSON.stringify(body) : undefined,
+        }),
+        delete: (path) => request(path, { method: "DELETE" }),
+    };
+    return api;
+}
+export function useTeamSettingsPageApi() {
+    const api = useContext(TeamSettingsPageApiContext);
+    if (!api)
+        throw new Error("TeamSettingsPage requires a TeamSettingsPageApiContext provider");
+    return api;
+}

package/dist/components/team-settings-cloud.d.ts

@@ -0,0 +1,2 @@
+export declare function CloudTeamView(): import("react/jsx-runtime").JSX.Element;
+//# sourceMappingURL=team-settings-cloud.d.ts.map

package/dist/components/team-settings-cloud.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"team-settings-cloud.d.ts","sourceRoot":"","sources":["../../src/components/team-settings-cloud.tsx"],"names":[],"mappings":"AAqEA,wBAAgB,aAAa,4CAqJ5B"}

package/dist/components/team-settings-cloud.js

@@ -0,0 +1,185 @@
+"use client";
+import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
+import { useMutation, useQuery, useQueryClient } from "@tanstack/react-query";
+import { API_KEY_PERMISSION_GROUPS, hasApiKeyPermission, permissionStringsToPermissions, } from "@voyant-travel/types/api-keys";
+import { MEMBER_ROLE_PRESETS, scopesForRole } from "@voyant-travel/types/member-roles";
+import { Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, Input, Label, } from "@voyant-travel/ui/components";
+import { Checkbox } from "@voyant-travel/ui/components/checkbox";
+import { ScrollArea } from "@voyant-travel/ui/components/scroll-area";
+import { Skeleton } from "@voyant-travel/ui/components/skeleton";
+import { Copy, Loader2, Mail, Trash2, UserPlus } from "lucide-react";
+import { useState } from "react";
+import { formatMessage } from "../lib/i18n.js";
+import { useLocale } from "../providers/locale.js";
+import { useOperatorAdminMessages } from "../providers/operator-admin-messages.js";
+import { useTeamSettingsPageApi } from "./team-settings-api.js";
+const CLOUD_MEMBERS_QK = ["admin-team-members"];
+const CLOUD_INVITES_QK = ["admin-team-invitations"];
+export function CloudTeamView() {
+    const api = useTeamSettingsPageApi();
+    const messages = useOperatorAdminMessages();
+    const { resolvedLocale } = useLocale();
+    const queryClient = useQueryClient();
+    const membersQuery = useQuery({
+        queryKey: CLOUD_MEMBERS_QK,
+        queryFn: () => api.get("/v1/admin/team/members"),
+    });
+    const invitesQuery = useQuery({
+        queryKey: CLOUD_INVITES_QK,
+        queryFn: () => api.get("/v1/admin/team/invitations"),
+    });
+    const revoke = useMutation({
+        mutationFn: (id) => api.delete(`/v1/admin/team/invitations/${id}`),
+        onSuccess: () => void queryClient.invalidateQueries({ queryKey: CLOUD_INVITES_QK }),
+    });
+    const members = membersQuery.data?.data ?? [];
+    const invites = invitesQuery.data?.data ?? [];
+    const pending = invites.filter((i) => i.state === "pending" || i.state === "expired");
+    return (_jsxs("div", { className: "flex flex-col gap-6 p-6", children: [_jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: messages.team.title }), _jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: messages.team.description })] }), _jsx(CloudInviteMemberDialog, {})] }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: messages.team.members.title }), _jsx(CardDescription, { children: messages.team.members.description })] }), _jsx(CardContent, { children: membersQuery.isPending ? (_jsx("ul", { className: "flex flex-col divide-y", children: Array.from({ length: 3 }).map((_, i) => (_jsxs("li", { className: "flex items-center gap-4 py-3", children: [_jsxs("div", { className: "min-w-0 flex-1 space-y-1.5", children: [_jsx(Skeleton, { className: "h-3.5 w-48" }), _jsx(Skeleton, { className: "h-3 w-24" })] }), _jsx(Skeleton, { className: "h-7 w-24" })] }, i))) })) : members.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: messages.team.members.empty })) : (_jsx("ul", { className: "flex flex-col divide-y", children: members.map((member) => (_jsxs("li", { className: "flex items-center gap-4 py-3", children: [_jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate text-sm font-medium", children: member.email ?? member.externalUserId }), _jsx("p", { className: "text-xs text-muted-foreground", children: member.roleName ?? member.roleSlug ?? messages.team.members.role })] }), member.hasFullPlatformAccess ? (_jsx("span", { className: "rounded-full bg-muted px-2.5 py-1 text-xs text-muted-foreground", title: messages.team.members.fullAccessHint, children: messages.team.members.fullAccess })) : (_jsxs("div", { className: "flex items-center gap-2", children: [_jsx("span", { className: "text-xs text-muted-foreground", children: memberAccessSummary(member, messages) }), _jsx(MemberPermissionsDialog, { member: member })] }))] }, member.membershipId))) })) })] }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: messages.team.pendingInvitations }), _jsx(CardDescription, { children: pending.length === 0
+                                    ? messages.team.noOutstandingInvitations
+                                    : formatMessage(pending.length === 1
+                                        ? messages.team.invitationWaitingSingular
+                                        : messages.team.invitationWaitingPlural, { count: pending.length }) })] }), _jsx(CardContent, { children: invitesQuery.isPending ? (_jsx(Skeleton, { className: "h-10 w-full" })) : pending.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: messages.team.nothingHereYet })) : (_jsx("ul", { className: "flex flex-col divide-y", children: pending.map((invite) => (_jsxs("li", { className: "flex items-center gap-4 py-3", children: [_jsx(Mail, { className: "h-4 w-4 shrink-0 text-muted-foreground" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate text-sm font-medium", children: invite.email }), _jsx("p", { className: "text-xs text-muted-foreground", children: formatMessage(messages.team.expires, {
+                                                    date: new Date(invite.expiresAt).toLocaleString(resolvedLocale),
+                                                }) })] }), _jsxs(Button, { type: "button", variant: "ghost", size: "sm", className: "text-destructive", onClick: () => {
+                                            if (confirm(formatMessage(messages.team.revokeConfirm, { email: invite.email }))) {
+                                                revoke.mutate(invite.id);
+                                            }
+                                        }, disabled: revoke.isPending, children: [_jsx(Trash2, { className: "mr-1 h-3.5 w-3.5" }), messages.team.revoke] })] }, invite.id))) })) })] })] }));
+}
+function CloudInviteMemberDialog() {
+    const api = useTeamSettingsPageApi();
+    const messages = useOperatorAdminMessages();
+    const queryClient = useQueryClient();
+    const [open, setOpen] = useState(false);
+    const [email, setEmail] = useState("");
+    const [roleSlug, setRoleSlug] = useState("");
+    const [result, setResult] = useState(null);
+    const [error, setError] = useState(null);
+    const [copied, setCopied] = useState(false);
+    const rolesQuery = useQuery({
+        queryKey: ["admin-team-roles"],
+        queryFn: () => api.get("/v1/admin/team/roles"),
+        enabled: open,
+    });
+    const roles = rolesQuery.data?.data ?? [];
+    const create = useMutation({
+        mutationFn: () => api.post("/v1/admin/team/invitations", {
+            email: email.trim(),
+            roleSlug: roleSlug || undefined,
+        }),
+        onSuccess: (response) => {
+            setResult(response.data);
+            setError(null);
+            void queryClient.invalidateQueries({ queryKey: CLOUD_INVITES_QK });
+        },
+        onError: (e) => setError(e instanceof Error ? e.message : messages.team.errorCouldNotSendInvitation),
+    });
+    const close = () => {
+        setOpen(false);
+        window.setTimeout(() => {
+            setEmail("");
+            setRoleSlug("");
+            setResult(null);
+            setError(null);
+            setCopied(false);
+        }, 200);
+    };
+    const copyLink = async () => {
+        if (!result)
+            return;
+        await navigator.clipboard.writeText(result.acceptInvitationUrl);
+        setCopied(true);
+        window.setTimeout(() => setCopied(false), 1500);
+    };
+    return (_jsxs(_Fragment, { children: [_jsxs(Button, { size: "sm", onClick: () => setOpen(true), children: [_jsx(UserPlus, { className: "mr-1 h-4 w-4" }), messages.team.inviteMember] }), _jsx(Dialog, { open: open, onOpenChange: (o) => (o ? setOpen(true) : close()), children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: messages.team.inviteDialogTitle }), _jsx(DialogDescription, { children: messages.team.inviteDialogDescription })] }), result ? (_jsxs("div", { className: "space-y-4", children: [_jsx("div", { className: "rounded-md border bg-muted/30 p-3 text-sm", children: _jsx("p", { children: formatMessage(messages.team.inviteCreated, { email: result.email }) }) }), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { children: messages.team.acceptLink }), _jsxs("div", { className: "flex gap-2", children: [_jsx(Input, { value: result.acceptInvitationUrl, readOnly: true, className: "font-mono text-xs" }), _jsxs(Button, { type: "button", variant: "outline", size: "sm", onClick: () => void copyLink(), children: [_jsx(Copy, { className: "mr-1 h-3.5 w-3.5" }), copied ? messages.team.copied : messages.team.copy] })] })] }), _jsx(DialogFooter, { children: _jsx(Button, { onClick: close, children: messages.team.done }) })] })) : (_jsxs("form", { className: "space-y-4", onSubmit: (e) => {
+                                e.preventDefault();
+                                create.mutate();
+                            }, children: [error && (_jsx("div", { className: "rounded-md bg-destructive/10 p-3 text-sm text-destructive", children: error })), _jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "cloud-invite-email", children: messages.team.emailLabel }), _jsx(Input, { id: "cloud-invite-email", type: "email", value: email, onChange: (e) => setEmail(e.target.value), placeholder: messages.team.emailPlaceholder, required: true, autoComplete: "off", autoFocus: true })] }), roles.length > 0 && (_jsxs("div", { className: "space-y-2", children: [_jsx(Label, { htmlFor: "cloud-invite-role", children: messages.team.members.roleLabel }), _jsxs("select", { id: "cloud-invite-role", value: roleSlug, onChange: (e) => setRoleSlug(e.target.value), className: "flex h-9 w-full rounded-md border border-input bg-transparent px-3 py-1 text-sm shadow-sm", children: [_jsx("option", { value: "", children: messages.team.members.role }), roles.map((role) => (_jsx("option", { value: role.slug, children: role.name }, role.slug)))] })] })), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: close, children: messages.team.cancel }), _jsxs(Button, { type: "submit", disabled: create.isPending, children: [create.isPending && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), messages.team.sendInvitation] })] })] }))] }) })] }));
+}
+/** Expand a (possibly wildcard) scope list to the concrete catalog permissions it grants. */
+function expandToConcrete(scopes) {
+    const permissions = permissionStringsToPermissions(scopes);
+    return new Set(API_KEY_PERMISSION_GROUPS.flatMap((group) => group.permissions
+        .filter((p) => hasApiKeyPermission(permissions, p.resource, p.action))
+        .map((p) => `${p.resource}:${p.action}`)));
+}
+/** The member's effective scopes today: explicit set, else role default if they have access. */
+function memberCurrentScopes(member) {
+    if (member.permissions && member.permissions.length > 0)
+        return member.permissions;
+    if (member.hasDeploymentAccess)
+        return scopesForRole(member.roleSlug) ?? [];
+    return [];
+}
+function memberAccessSummary(member, messages) {
+    if (!member.hasDeploymentAccess)
+        return messages.team.members.noAccess;
+    if (member.permissions && member.permissions.length > 0)
+        return messages.team.members.custom;
+    return member.roleName ?? member.roleSlug ?? messages.team.members.roleDefault;
+}
+// Concrete-scope presets. "Admin" is intentionally NOT here: full access must
+// persist the real `*` wildcard (so it covers PII + future resources), not an
+// expansion of the visible catalog — handled as a dedicated control below.
+const SCOPE_PRESETS = [
+    { key: "editor", label: MEMBER_ROLE_PRESETS.editor.label, scopes: scopesForRole("editor") ?? [] },
+    { key: "viewer", label: MEMBER_ROLE_PRESETS.viewer.label, scopes: scopesForRole("viewer") ?? [] },
+];
+/**
+ * Granular permission editor for a deployment member (cloud mode). Operates on
+ * concrete `resource:action` strings drawn from the shared API-key catalog;
+ * presets seed the selection and any box is then toggleable. Saving an empty
+ * selection revokes the member's access to this deployment.
+ */
+function MemberPermissionsDialog({ member }) {
+    const api = useTeamSettingsPageApi();
+    const messages = useOperatorAdminMessages();
+    const queryClient = useQueryClient();
+    const [open, setOpen] = useState(false);
+    const [selected, setSelected] = useState(new Set());
+    // Full access is a real `*`, not an expansion of the visible catalog — so it
+    // keeps PII + any future resources. Tracked separately from the checklist.
+    const [wildcard, setWildcard] = useState(false);
+    const openDialog = () => {
+        const scopes = memberCurrentScopes(member);
+        setWildcard(scopes.includes("*"));
+        setSelected(expandToConcrete(scopes));
+        setOpen(true);
+    };
+    const save = useMutation({
+        mutationFn: () => api.put(`/v1/admin/team/members/${member.membershipId}/permissions`, {
+            permissions: wildcard ? ["*"] : [...selected],
+        }),
+        onSuccess: () => {
+            void queryClient.invalidateQueries({ queryKey: CLOUD_MEMBERS_QK });
+            setOpen(false);
+        },
+    });
+    const applyPreset = (scopes) => {
+        setWildcard(false);
+        setSelected(expandToConcrete([...scopes]));
+    };
+    const applyFullAccess = () => {
+        setWildcard(true);
+        setSelected(expandToConcrete(["*"]));
+    };
+    const toggle = (key, checked) => {
+        setWildcard(false);
+        setSelected((prev) => {
+            const next = new Set(prev);
+            if (checked)
+                next.add(key);
+            else
+                next.delete(key);
+            return next;
+        });
+    };
+    return (_jsxs(_Fragment, { children: [_jsx(Button, { type: "button", variant: "outline", size: "sm", onClick: openDialog, children: messages.team.members.managePermissions }), _jsx(Dialog, { open: open, onOpenChange: (o) => (o ? openDialog() : setOpen(false)), children: _jsxs(DialogContent, { children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: messages.team.members.permissionsTitle }), _jsx(DialogDescription, { children: messages.team.members.permissionsDescription })] }), _jsxs("div", { className: "flex flex-wrap items-center gap-2", children: [_jsxs("span", { className: "text-xs text-muted-foreground", children: [messages.team.members.presetLabel, ":"] }), _jsx(Button, { type: "button", variant: wildcard ? "default" : "secondary", size: "sm", onClick: applyFullAccess, children: MEMBER_ROLE_PRESETS.admin.label }), SCOPE_PRESETS.map((preset) => (_jsx(Button, { type: "button", variant: "secondary", size: "sm", onClick: () => applyPreset(preset.scopes), children: preset.label }, preset.key))), _jsx(Button, { type: "button", variant: "ghost", size: "sm", onClick: () => {
+                                        setWildcard(false);
+                                        setSelected(new Set());
+                                    }, children: messages.team.members.noAccess })] }), _jsx(ScrollArea, { className: "h-80 pr-4", children: _jsx("div", { className: "flex flex-col gap-4", children: API_KEY_PERMISSION_GROUPS.map((group) => (_jsxs("div", { className: "space-y-2", children: [_jsx("p", { className: "text-sm font-medium", children: group.label }), _jsx("div", { className: "grid grid-cols-1 gap-1.5 sm:grid-cols-2", children: group.permissions.map((perm) => {
+                                                const key = `${perm.resource}:${perm.action}`;
+                                                return (_jsxs("label", { htmlFor: `perm-${key}`, className: "flex items-center gap-2 text-sm", children: [_jsx(Checkbox, { id: `perm-${key}`, checked: selected.has(key), onCheckedChange: (c) => toggle(key, c === true) }), _jsx("span", { children: perm.label })] }, key));
+                                            }) })] }, group.resource))) }) }), _jsxs(DialogFooter, { children: [_jsx(Button, { type: "button", variant: "ghost", onClick: () => setOpen(false), children: messages.team.cancel }), _jsxs(Button, { type: "button", disabled: save.isPending, onClick: () => save.mutate(), children: [save.isPending && _jsx(Loader2, { className: "mr-2 h-4 w-4 animate-spin" }), save.isPending ? messages.team.members.saving : messages.team.members.save] })] })] }) })] }));
+}

package/dist/components/team-settings-page.d.ts

@@ -1,8 +1,5 @@
-export interface TeamSettingsPageApi {
-    get: <T = unknown>(path: string) => Promise<T>;
-    post: <T = unknown>(path: string, body?: unknown) => Promise<T>;
-    delete: <T = unknown>(path: string) => Promise<T>;
-}
+import { type TeamSettingsPageApi } from "./team-settings-api.js";
+export type { TeamSettingsPageApi };
 export interface TeamSettingsPageProps {
     api?: TeamSettingsPageApi;
 }

package/dist/components/team-settings-page.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"team-settings-page.d.ts","sourceRoot":"","sources":["../../src/components/team-settings-page.tsx"],"names":[],"mappings":"AAiDA,MAAM,WAAW,mBAAmB;IAClC,GAAG,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;IAC9C,IAAI,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,EAAE,IAAI,CAAC,EAAE,OAAO,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;IAC/D,MAAM,EAAE,CAAC,CAAC,GAAG,OAAO,EAAE,IAAI,EAAE,MAAM,KAAK,OAAO,CAAC,CAAC,CAAC,CAAA;CAClD;AAED,MAAM,WAAW,qBAAqB;IACpC,GAAG,CAAC,EAAE,mBAAmB,CAAA;CAC1B;AA4DD,wBAAgB,gBAAgB,CAAC,EAAE,GAAG,EAAE,OAAO,EAAE,GAAE,qBAA0B,2CAG5E"}
+{"version":3,"file":"team-settings-page.d.ts","sourceRoot":"","sources":["../../src/components/team-settings-page.tsx"],"names":[],"mappings":"AA2BA,OAAO,EAEL,KAAK,mBAAmB,EAGzB,MAAM,wBAAwB,CAAA;AAwB/B,YAAY,EAAE,mBAAmB,EAAE,CAAA;AAEnC,MAAM,WAAW,qBAAqB;IACpC,GAAG,CAAC,EAAE,mBAAmB,CAAA;CAC1B;AAED,wBAAgB,gBAAgB,CAAC,EAAE,GAAG,EAAE,OAAO,EAAE,GAAE,qBAA0B,2CAG5E"}

package/dist/components/team-settings-page.js

@@ -5,59 +5,13 @@ import { useVoyantReactContext } from "@voyant-travel/react";
 import { Button, Card, CardContent, CardDescription, CardHeader, CardTitle, Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, DialogTitle, Input, Label, } from "@voyant-travel/ui/components";
 import { Skeleton } from "@voyant-travel/ui/components/skeleton";
 import { Copy, Loader2, Mail, Trash2, UserPlus } from "lucide-react";
-import { createContext, useContext, useMemo, useState } from "react";
+import { useMemo, useState } from "react";
 import { formatMessage } from "../lib/i18n.js";
 import { useLocale } from "../providers/locale.js";
 import { useOperatorAdminMessages } from "../providers/operator-admin-messages.js";
+import { createTeamSettingsPageApi, TeamSettingsPageApiContext, useTeamSettingsPageApi, } from "./team-settings-api.js";
+import { CloudTeamView } from "./team-settings-cloud.js";
 const QK = ["admin-invitations"];
-const TeamSettingsPageApiContext = createContext(null);
-function joinUrl(baseUrl, path) {
-    const trimmedBase = baseUrl.endsWith("/") ? baseUrl.slice(0, -1) : baseUrl;
-    const trimmedPath = path.startsWith("/") ? path : `/${path}`;
-    return `${trimmedBase}${trimmedPath}`;
-}
-async function readJson(response) {
-    if (!response.ok) {
-        let body;
-        try {
-            body = await response.json();
-        }
-        catch {
-            body = await response.text().catch(() => undefined);
-        }
-        const message = typeof body === "object" && body !== null && "error" in body
-            ? String(body.error)
-            : `API error: ${response.status} ${response.statusText}`;
-        throw new Error(message);
-    }
-    if (response.status === 204)
-        return undefined;
-    return response.json();
-}
-function createTeamSettingsPageApi(baseUrl, fetcher) {
-    const request = async (path, init = {}) => {
-        const headers = new Headers(init.headers);
-        if (init.body !== undefined && !headers.has("Content-Type")) {
-            headers.set("Content-Type", "application/json");
-        }
-        return readJson(await fetcher(joinUrl(baseUrl, path), { ...init, headers }));
-    };
-    const api = {
-        get: (path) => request(path, { method: "GET" }),
-        post: (path, body) => request(path, {
-            method: "POST",
-            body: body !== undefined ? JSON.stringify(body) : undefined,
-        }),
-        delete: (path) => request(path, { method: "DELETE" }),
-    };
-    return api;
-}
-function useTeamSettingsPageApi() {
-    const api = useContext(TeamSettingsPageApiContext);
-    if (!api)
-        throw new Error("TeamSettingsPage requires a TeamSettingsPageApiContext provider");
-    return api;
-}
 export function TeamSettingsPage({ api: apiProp } = {}) {
     if (apiProp)
         return _jsx(TeamSettingsPageContent, { api: apiProp });
@@ -69,6 +23,19 @@ function TeamSettingsPageWithDefaultApi() {
     return _jsx(TeamSettingsPageContent, { api: api });
 }
 function TeamSettingsPageContent({ api }) {
+    // The auth mode decides which team surface backs the page: local invitations
+    // (credential users in this deployment's DB) or the Voyant Cloud member roster
+    // proxied through /v1/admin/team/*. Default to local until known.
+    const bootstrapQuery = useQuery({
+        queryKey: ["admin-team-auth-mode"],
+        queryFn: () => api.get("/auth/bootstrap-status"),
+        staleTime: 5 * 60 * 1000,
+    });
+    const isCloud = bootstrapQuery.data?.authMode === "voyant-cloud";
+    return (_jsx(TeamSettingsPageApiContext.Provider, { value: api, children: isCloud ? _jsx(CloudTeamView, {}) : _jsx(LocalTeamView, {}) }));
+}
+function LocalTeamView() {
+    const api = useTeamSettingsPageApi();
     const messages = useOperatorAdminMessages();
     const { resolvedLocale } = useLocale();
     const queryClient = useQueryClient();
@@ -83,25 +50,25 @@ function TeamSettingsPageContent({ api }) {
     const invites = invitesQuery.data?.data ?? [];
     const pending = invites.filter((i) => !i.redeemedAt && new Date(i.expiresAt) > new Date());
     const spent = invites.filter((i) => i.redeemedAt || new Date(i.expiresAt) <= new Date());
-    return (_jsx(TeamSettingsPageApiContext.Provider, { value: api, children: _jsxs("div", { className: "flex flex-col gap-6 p-6", children: [_jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: messages.team.title }), _jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: messages.team.description })] }), _jsx(InviteMemberDialog, {})] }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: messages.team.pendingInvitations }), _jsx(CardDescription, { children: pending.length === 0
-                                        ? messages.team.noOutstandingInvitations
-                                        : formatMessage(pending.length === 1
-                                            ? messages.team.invitationWaitingSingular
-                                            : messages.team.invitationWaitingPlural, { count: pending.length }) })] }), _jsx(CardContent, { children: invitesQuery.isPending ? (_jsx("ul", { className: "flex flex-col divide-y", children: Array.from({ length: 3 }).map((_, i) => (_jsxs("li", { className: "flex items-center gap-4 py-3", children: [_jsx(Skeleton, { className: "h-4 w-4 rounded" }), _jsxs("div", { className: "min-w-0 flex-1 space-y-1.5", children: [_jsx(Skeleton, { className: "h-3.5 w-48" }), _jsx(Skeleton, { className: "h-3 w-40" })] }), _jsx(Skeleton, { className: "h-7 w-20" })] }, i))) })) : pending.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: messages.team.nothingHereYet })) : (_jsx("ul", { className: "flex flex-col divide-y", children: pending.map((invite) => (_jsxs("li", { className: "flex items-center gap-4 py-3", children: [_jsx(Mail, { className: "h-4 w-4 shrink-0 text-muted-foreground" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate text-sm font-medium", children: invite.email }), _jsx("p", { className: "text-xs text-muted-foreground", children: formatMessage(messages.team.expires, {
-                                                        date: new Date(invite.expiresAt).toLocaleString(resolvedLocale),
-                                                    }) })] }), _jsxs(Button, { type: "button", variant: "ghost", size: "sm", className: "text-destructive", onClick: () => {
-                                                if (confirm(formatMessage(messages.team.revokeConfirm, {
-                                                    email: invite.email,
-                                                }))) {
-                                                    revoke.mutate(invite.id);
-                                                }
-                                            }, disabled: revoke.isPending, children: [_jsx(Trash2, { className: "mr-1 h-3.5 w-3.5" }), messages.team.revoke] })] }, invite.id))) })) })] }), spent.length > 0 ? (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: messages.team.history }), _jsx(CardDescription, { children: messages.team.historyDescription })] }), _jsx(CardContent, { children: _jsx("ul", { className: "flex flex-col divide-y text-sm", children: spent.map((invite) => (_jsxs("li", { className: "flex items-center gap-4 py-2.5 text-muted-foreground", children: [_jsx(Mail, { className: "h-4 w-4 shrink-0" }), _jsx("span", { className: "min-w-0 flex-1 truncate", children: invite.email }), _jsx("span", { className: "text-xs", children: invite.redeemedAt
-                                                ? formatMessage(messages.team.redeemed, {
-                                                    date: new Date(invite.redeemedAt).toLocaleDateString(resolvedLocale),
-                                                })
-                                                : formatMessage(messages.team.expired, {
-                                                    date: new Date(invite.expiresAt).toLocaleDateString(resolvedLocale),
-                                                }) })] }, invite.id))) }) })] })) : null] }) }));
+    return (_jsxs("div", { className: "flex flex-col gap-6 p-6", children: [_jsxs("div", { className: "flex items-start justify-between gap-4", children: [_jsxs("div", { children: [_jsx("h1", { className: "text-2xl font-semibold tracking-tight", children: messages.team.title }), _jsx("p", { className: "mt-1 text-sm text-muted-foreground", children: messages.team.description })] }), _jsx(InviteMemberDialog, {})] }), _jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: messages.team.pendingInvitations }), _jsx(CardDescription, { children: pending.length === 0
+                                    ? messages.team.noOutstandingInvitations
+                                    : formatMessage(pending.length === 1
+                                        ? messages.team.invitationWaitingSingular
+                                        : messages.team.invitationWaitingPlural, { count: pending.length }) })] }), _jsx(CardContent, { children: invitesQuery.isPending ? (_jsx("ul", { className: "flex flex-col divide-y", children: Array.from({ length: 3 }).map((_, i) => (_jsxs("li", { className: "flex items-center gap-4 py-3", children: [_jsx(Skeleton, { className: "h-4 w-4 rounded" }), _jsxs("div", { className: "min-w-0 flex-1 space-y-1.5", children: [_jsx(Skeleton, { className: "h-3.5 w-48" }), _jsx(Skeleton, { className: "h-3 w-40" })] }), _jsx(Skeleton, { className: "h-7 w-20" })] }, i))) })) : pending.length === 0 ? (_jsx("p", { className: "text-sm text-muted-foreground", children: messages.team.nothingHereYet })) : (_jsx("ul", { className: "flex flex-col divide-y", children: pending.map((invite) => (_jsxs("li", { className: "flex items-center gap-4 py-3", children: [_jsx(Mail, { className: "h-4 w-4 shrink-0 text-muted-foreground" }), _jsxs("div", { className: "min-w-0 flex-1", children: [_jsx("p", { className: "truncate text-sm font-medium", children: invite.email }), _jsx("p", { className: "text-xs text-muted-foreground", children: formatMessage(messages.team.expires, {
+                                                    date: new Date(invite.expiresAt).toLocaleString(resolvedLocale),
+                                                }) })] }), _jsxs(Button, { type: "button", variant: "ghost", size: "sm", className: "text-destructive", onClick: () => {
+                                            if (confirm(formatMessage(messages.team.revokeConfirm, {
+                                                email: invite.email,
+                                            }))) {
+                                                revoke.mutate(invite.id);
+                                            }
+                                        }, disabled: revoke.isPending, children: [_jsx(Trash2, { className: "mr-1 h-3.5 w-3.5" }), messages.team.revoke] })] }, invite.id))) })) })] }), spent.length > 0 ? (_jsxs(Card, { children: [_jsxs(CardHeader, { children: [_jsx(CardTitle, { children: messages.team.history }), _jsx(CardDescription, { children: messages.team.historyDescription })] }), _jsx(CardContent, { children: _jsx("ul", { className: "flex flex-col divide-y text-sm", children: spent.map((invite) => (_jsxs("li", { className: "flex items-center gap-4 py-2.5 text-muted-foreground", children: [_jsx(Mail, { className: "h-4 w-4 shrink-0" }), _jsx("span", { className: "min-w-0 flex-1 truncate", children: invite.email }), _jsx("span", { className: "text-xs", children: invite.redeemedAt
+                                            ? formatMessage(messages.team.redeemed, {
+                                                date: new Date(invite.redeemedAt).toLocaleDateString(resolvedLocale),
+                                            })
+                                            : formatMessage(messages.team.expired, {
+                                                date: new Date(invite.expiresAt).toLocaleDateString(resolvedLocale),
+                                            }) })] }, invite.id))) }) })] })) : null] }));
 }
 function InviteMemberDialog() {
     const messages = useOperatorAdminMessages();

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@voyant-travel/admin",
-  "version": "0.113.0",
+  "version": "0.115.0",
   "license": "Apache-2.0",
   "type": "module",
   "sideEffects": false,
@@ -181,11 +181,12 @@
     "react": "^19.0.0",
     "react-dom": "^19.0.0",
     "recharts": "^3.0.0",
-    "@voyant-travel/ui": "^0.107.0"
+    "@voyant-travel/ui": "^0.108.1"
   },
   "dependencies": {
-    "@voyant-travel/i18n": "^0.106.1",
-    "@voyant-travel/react": "^0.104.1"
+    "@voyant-travel/i18n": "^0.108.0",
+    "@voyant-travel/react": "^0.104.1",
+    "@voyant-travel/types": "^0.105.0"
   },
   "devDependencies": {
     "@tanstack/react-query": "^5.100.11",
@@ -200,7 +201,7 @@
     "recharts": "3.8.1",
     "typescript": "^6.0.2",
     "vitest": "^4.1.2",
-    "@voyant-travel/ui": "^0.107.0",
+    "@voyant-travel/ui": "^0.108.1",
     "@voyant-travel/voyant-typescript-config": "^0.1.0"
   },
   "files": [