@byline/admin 2.4.0 → 2.4.1

package/dist/modules/admin-users/components/create.js

@@ -0,0 +1,268 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { revalidateLogic, useForm } from "@tanstack/react-form-start";
+import { passwordSchema } from "@byline/core/validation";
+import { Alert, Button, Checkbox, Input, LoaderEllipsis } from "@byline/ui/react";
+import classnames from "classnames";
+import { z } from "zod";
+import { useBylineAdminServices } from "../../../services/admin-services-context.js";
+import create_module from "./create.module.js";
+const createAdminUserFormSchema = z.object({
+    email: z.email({
+        message: 'Enter a valid email address'
+    }).min(3).max(254, 'Email must not exceed 254 characters'),
+    password: passwordSchema,
+    given_name: z.string().max(100, 'Given name must not exceed 100 characters'),
+    family_name: z.string().max(100, 'Family name must not exceed 100 characters'),
+    username: z.string().max(100, 'Username must not exceed 100 characters'),
+    is_super_admin: z.boolean(),
+    is_enabled: z.boolean(),
+    is_email_verified: z.boolean()
+});
+const initialValues = {
+    email: '',
+    password: '',
+    given_name: '',
+    family_name: '',
+    username: '',
+    is_super_admin: false,
+    is_enabled: true,
+    is_email_verified: false
+};
+function normaliseText(value) {
+    return value.trim().length > 0 ? value : null;
+}
+function CreateAdminUser({ onClose, onSuccess }) {
+    const { createAdminUser } = useBylineAdminServices();
+    const [formError, setFormError] = useState(null);
+    const form = useForm({
+        defaultValues: initialValues,
+        validationLogic: revalidateLogic({
+            mode: 'blur',
+            modeAfterSubmission: 'change'
+        }),
+        validators: {
+            onDynamic: createAdminUserFormSchema
+        },
+        onSubmit: async ({ value })=>{
+            setFormError(null);
+            try {
+                const created = await createAdminUser({
+                    data: {
+                        email: value.email,
+                        password: value.password,
+                        given_name: normaliseText(value.given_name),
+                        family_name: normaliseText(value.family_name),
+                        username: normaliseText(value.username),
+                        is_super_admin: value.is_super_admin,
+                        is_enabled: value.is_enabled,
+                        is_email_verified: value.is_email_verified
+                    }
+                });
+                form.reset(initialValues);
+                onSuccess?.(created);
+            } catch (err) {
+                const code = getErrorCode(err);
+                if ('admin.users.emailInUse' === code) return void form.setFieldMeta('email', (meta)=>({
+                        ...meta,
+                        errorMap: {
+                            ...meta.errorMap,
+                            onServer: 'This email is already in use.'
+                        },
+                        errors: [
+                            'This email is already in use.'
+                        ]
+                    }));
+                setFormError('Could not create this admin user. Please try again.');
+            }
+        }
+    });
+    return /*#__PURE__*/ jsx("div", {
+        className: classnames('byline-user-create-wrap', create_module.wrap),
+        children: /*#__PURE__*/ jsxs("form", {
+            noValidate: true,
+            onSubmit: (event)=>{
+                event.preventDefault();
+                event.stopPropagation();
+                form.handleSubmit();
+            },
+            className: classnames('byline-user-create-form', create_module.form),
+            children: [
+                formError ? /*#__PURE__*/ jsx(Alert, {
+                    intent: "danger",
+                    children: formError
+                }) : null,
+                /*#__PURE__*/ jsxs("div", {
+                    className: classnames('byline-user-create-grid', create_module.grid),
+                    children: [
+                        /*#__PURE__*/ jsx(form.Field, {
+                            name: "given_name",
+                            children: (field)=>/*#__PURE__*/ jsx(Input, {
+                                    label: "Given name",
+                                    id: "new-given-name",
+                                    name: field.name,
+                                    value: field.state.value,
+                                    onBlur: field.handleBlur,
+                                    onChange: (e)=>field.handleChange(e.currentTarget.value),
+                                    error: field.state.meta.errors.length > 0,
+                                    errorText: firstError(field.state.meta.errors),
+                                    autoComplete: "given-name"
+                                })
+                        }),
+                        /*#__PURE__*/ jsx(form.Field, {
+                            name: "family_name",
+                            children: (field)=>/*#__PURE__*/ jsx(Input, {
+                                    label: "Family name",
+                                    id: "new-family-name",
+                                    name: field.name,
+                                    value: field.state.value,
+                                    onBlur: field.handleBlur,
+                                    onChange: (e)=>field.handleChange(e.currentTarget.value),
+                                    error: field.state.meta.errors.length > 0,
+                                    errorText: firstError(field.state.meta.errors),
+                                    autoComplete: "family-name"
+                                })
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsx(form.Field, {
+                    name: "username",
+                    children: (field)=>/*#__PURE__*/ jsx(Input, {
+                            label: "Username",
+                            id: "new-username",
+                            name: field.name,
+                            value: field.state.value,
+                            onBlur: field.handleBlur,
+                            onChange: (e)=>field.handleChange(e.currentTarget.value),
+                            error: field.state.meta.errors.length > 0,
+                            errorText: firstError(field.state.meta.errors),
+                            helpText: "Optional.",
+                            autoComplete: "username"
+                        })
+                }),
+                /*#__PURE__*/ jsx(form.Field, {
+                    name: "email",
+                    children: (field)=>/*#__PURE__*/ jsx(Input, {
+                            label: "Email",
+                            id: "new-email",
+                            name: field.name,
+                            type: "email",
+                            value: field.state.value,
+                            onBlur: field.handleBlur,
+                            onChange: (e)=>field.handleChange(e.currentTarget.value),
+                            error: field.state.meta.errors.length > 0,
+                            errorText: firstError(field.state.meta.errors),
+                            autoComplete: "email",
+                            required: true
+                        })
+                }),
+                /*#__PURE__*/ jsx(form.Field, {
+                    name: "password",
+                    children: (field)=>/*#__PURE__*/ jsx(Input, {
+                            label: "Initial password",
+                            id: "new-password",
+                            name: field.name,
+                            type: "password",
+                            value: field.state.value,
+                            onBlur: field.handleBlur,
+                            onChange: (e)=>field.handleChange(e.currentTarget.value),
+                            error: field.state.meta.errors.length > 0,
+                            errorText: firstError(field.state.meta.errors),
+                            helpText: "The user can change it from their own account after signing in.",
+                            autoComplete: "new-password",
+                            required: true
+                        })
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    className: classnames('byline-user-create-flags', create_module.flags),
+                    children: [
+                        /*#__PURE__*/ jsx(form.Field, {
+                            name: "is_enabled",
+                            children: (field)=>/*#__PURE__*/ jsx(Checkbox, {
+                                    id: "new-is-enabled",
+                                    name: field.name,
+                                    label: "Enabled",
+                                    checked: field.state.value,
+                                    onCheckedChange: (checked)=>field.handleChange(true === checked),
+                                    helpText: "Disabled accounts cannot sign in."
+                                })
+                        }),
+                        /*#__PURE__*/ jsx(form.Field, {
+                            name: "is_email_verified",
+                            children: (field)=>/*#__PURE__*/ jsx(Checkbox, {
+                                    id: "new-is-email-verified",
+                                    name: field.name,
+                                    label: "Email verified",
+                                    checked: field.state.value,
+                                    onCheckedChange: (checked)=>field.handleChange(true === checked),
+                                    helpText: "Skip the verification flow for this account."
+                                })
+                        }),
+                        /*#__PURE__*/ jsx(form.Field, {
+                            name: "is_super_admin",
+                            children: (field)=>/*#__PURE__*/ jsx(Checkbox, {
+                                    id: "new-is-super-admin",
+                                    name: field.name,
+                                    label: "Super admin",
+                                    checked: field.state.value,
+                                    onCheckedChange: (checked)=>field.handleChange(true === checked),
+                                    helpText: "Super admins bypass every ability check — grant with care."
+                                })
+                        })
+                    ]
+                }),
+                /*#__PURE__*/ jsxs("div", {
+                    className: classnames('byline-user-create-actions', create_module.actions),
+                    children: [
+                        /*#__PURE__*/ jsx(Button, {
+                            type: "button",
+                            intent: "secondary",
+                            size: "sm",
+                            onClick: onClose,
+                            className: classnames('byline-user-create-action', create_module.action),
+                            children: "Cancel"
+                        }),
+                        /*#__PURE__*/ jsx(form.Subscribe, {
+                            selector: (state)=>({
+                                    canSubmit: state.canSubmit,
+                                    isSubmitting: state.isSubmitting
+                                }),
+                            children: ({ canSubmit, isSubmitting })=>/*#__PURE__*/ jsx(Button, {
+                                    size: "sm",
+                                    intent: "primary",
+                                    type: "submit",
+                                    disabled: !canSubmit || isSubmitting,
+                                    className: classnames('byline-user-create-action', create_module.action),
+                                    children: true === isSubmitting ? /*#__PURE__*/ jsx(LoaderEllipsis, {
+                                        size: 42
+                                    }) : 'Save'
+                                })
+                        })
+                    ]
+                })
+            ]
+        })
+    });
+}
+function firstError(errors) {
+    for (const err of errors){
+        if ('string' == typeof err) return err;
+        if (err && 'object' == typeof err && 'message' in err) {
+            const msg = err.message;
+            if ('string' == typeof msg) return msg;
+        }
+    }
+}
+function getErrorCode(err) {
+    if (err && 'object' == typeof err) {
+        const e = err;
+        if ('string' == typeof e.code) return e.code;
+        if (e.cause && 'object' == typeof e.cause && 'code' in e.cause) {
+            const cause = e.cause;
+            if ('string' == typeof cause.code) return cause.code;
+        }
+    }
+    return null;
+}
+export { CreateAdminUser };

package/dist/modules/admin-users/components/create.module.js

@@ -0,0 +1,10 @@
+import "./create_module.css";
+const create_module = {
+    wrap: "wrap-zOIv8P",
+    form: "form-LV97FA",
+    grid: "grid-SZGMP9",
+    flags: "flags-OuOEIh",
+    actions: "actions-krs2ow",
+    action: "action-bnHG9_"
+};
+export default create_module;

package/dist/modules/admin-users/components/create_module.css

@@ -0,0 +1,45 @@
+:is(.wrap-zOIv8P, .byline-user-create-wrap) {
+  gap: var(--spacing-8);
+  padding: var(--spacing-4);
+  margin-top: var(--spacing-4);
+  flex-direction: column;
+  display: flex;
+}
+
+:is(.form-LV97FA, .byline-user-create-form) {
+  gap: var(--spacing-16);
+  padding-top: var(--spacing-8);
+  flex-direction: column;
+  display: flex;
+}
+
+:is(.grid-SZGMP9, .byline-user-create-grid) {
+  gap: var(--spacing-16);
+  grid-template-columns: 1fr;
+  display: grid;
+}
+
+@media (min-width: 40rem) {
+  :is(.grid-SZGMP9, .byline-user-create-grid) {
+    grid-template-columns: 1fr 1fr;
+  }
+}
+
+:is(.flags-OuOEIh, .byline-user-create-flags) {
+  gap: var(--spacing-8);
+  flex-direction: column;
+  display: flex;
+}
+
+:is(.actions-krs2ow, .byline-user-create-actions) {
+  justify-content: flex-end;
+  align-items: center;
+  gap: var(--spacing-8);
+  margin-top: var(--spacing-16);
+  display: flex;
+}
+
+:is(.action-bnHG9_, .byline-user-create-action) {
+  min-width: 4rem;
+}
+

package/dist/modules/admin-users/components/roles.d.ts

@@ -0,0 +1,11 @@
+import type { AdminRoleResponse, UserRolesResponse } from '../../admin-roles/index.js';
+import type { AdminUserResponse } from '../index.js';
+interface UserRolesProps {
+    user: AdminUserResponse;
+    allRoles: AdminRoleResponse[];
+    initialRoleIds: string[];
+    onClose?: () => void;
+    onSaved?: (response: UserRolesResponse) => void;
+}
+export declare function UserRoles({ user, allRoles, initialRoleIds, onClose, onSaved }: UserRolesProps): import("react").JSX.Element;
+export {};

package/dist/modules/admin-users/components/roles.js

@@ -0,0 +1,148 @@
+"use client";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useState } from "react";
+import { Alert, Button, Checkbox, LoaderEllipsis } from "@byline/ui/react";
+import classnames from "classnames";
+import { useBylineAdminServices } from "../../../services/admin-services-context.js";
+import roles_module from "./roles.module.js";
+function setsEqual(a, b) {
+    if (a.size !== b.size) return false;
+    for (const item of a)if (!b.has(item)) return false;
+    return true;
+}
+function UserRoles({ user, allRoles, initialRoleIds, onClose, onSaved }) {
+    const { setUserRoles } = useBylineAdminServices();
+    const [initialSet, setInitialSet] = useState(()=>new Set(initialRoleIds));
+    const [selected, setSelected] = useState(()=>new Set(initialRoleIds));
+    const [saving, setSaving] = useState(false);
+    const [error, setError] = useState(null);
+    const [successMessage, setSuccessMessage] = useState(null);
+    const isDirty = !setsEqual(selected, initialSet);
+    function handleToggle(roleId, checked) {
+        setSelected((current)=>{
+            const next = new Set(current);
+            if (checked) next.add(roleId);
+            else next.delete(roleId);
+            return next;
+        });
+        setSuccessMessage(null);
+    }
+    async function handleSave() {
+        if (saving) return;
+        setSaving(true);
+        setError(null);
+        setSuccessMessage(null);
+        try {
+            const response = await setUserRoles({
+                data: {
+                    userId: user.id,
+                    roleIds: Array.from(selected)
+                }
+            });
+            const storedSet = new Set(response.roles.map((r)=>r.id));
+            setInitialSet(storedSet);
+            setSelected(new Set(storedSet));
+            setSuccessMessage('Saved.');
+            onSaved?.(response);
+        } catch (err) {
+            const code = getErrorCode(err);
+            if ('admin.roles.userNotFound' === code) setError('This user no longer exists.');
+            else 'admin.roles.notFound' === code ? setError('One or more selected roles no longer exist. Reload the page and try again.') : setError('Could not save roles. Please try again.');
+        } finally{
+            setSaving(false);
+        }
+    }
+    return /*#__PURE__*/ jsxs("div", {
+        className: classnames('byline-user-roles-wrap', roles_module.wrap),
+        children: [
+            error ? /*#__PURE__*/ jsx(Alert, {
+                intent: "danger",
+                children: error
+            }) : null,
+            successMessage ? /*#__PURE__*/ jsx(Alert, {
+                intent: "success",
+                children: successMessage
+            }) : null,
+            0 === allRoles.length ? /*#__PURE__*/ jsxs("p", {
+                className: classnames('muted', 'byline-user-roles-empty', roles_module.empty),
+                children: [
+                    "No roles have been created yet. Create roles in",
+                    ' ',
+                    /*#__PURE__*/ jsx("span", {
+                        className: "muted",
+                        children: "/admin/roles"
+                    }),
+                    " first."
+                ]
+            }) : /*#__PURE__*/ jsx("div", {
+                className: classnames('byline-user-roles-list', roles_module.list),
+                children: allRoles.map((role)=>/*#__PURE__*/ jsxs("div", {
+                        className: classnames('byline-user-roles-row', roles_module.row),
+                        children: [
+                            /*#__PURE__*/ jsx(Checkbox, {
+                                id: `role-${role.id}`,
+                                name: `role-${role.id}`,
+                                checked: selected.has(role.id),
+                                disabled: saving,
+                                onCheckedChange: (checked)=>handleToggle(role.id, true === checked),
+                                containerClasses: classnames('byline-user-roles-checkbox-auto', roles_module["checkbox-auto"]),
+                                componentClasses: classnames('byline-user-roles-checkbox-auto', roles_module["checkbox-auto"])
+                            }),
+                            /*#__PURE__*/ jsxs("label", {
+                                htmlFor: `role-${role.id}`,
+                                className: classnames('byline-user-roles-label', roles_module.label),
+                                children: [
+                                    /*#__PURE__*/ jsxs("div", {
+                                        className: classnames('byline-user-roles-label-head', roles_module["label-head"]),
+                                        children: [
+                                            /*#__PURE__*/ jsx("span", {
+                                                className: classnames('byline-user-roles-name', roles_module.name),
+                                                children: role.name
+                                            }),
+                                            /*#__PURE__*/ jsx("code", {
+                                                className: classnames('byline-user-roles-machine', roles_module.machine),
+                                                children: role.machine_name
+                                            })
+                                        ]
+                                    }),
+                                    role.description ? /*#__PURE__*/ jsx("p", {
+                                        className: classnames('muted', "byline-user-roles-description", roles_module.description),
+                                        children: role.description
+                                    }) : null
+                                ]
+                            })
+                        ]
+                    }, role.id))
+            }),
+            /*#__PURE__*/ jsxs("div", {
+                className: classnames('byline-user-roles-actions', roles_module.actions),
+                children: [
+                    /*#__PURE__*/ jsx(Button, {
+                        type: "button",
+                        intent: "secondary",
+                        size: "xs",
+                        onClick: onClose,
+                        disabled: saving,
+                        className: classnames('byline-user-roles-action', roles_module.action),
+                        children: successMessage ? 'Close' : 'Cancel'
+                    }),
+                    /*#__PURE__*/ jsx(Button, {
+                        type: "button",
+                        intent: "primary",
+                        size: "xs",
+                        onClick: ()=>void handleSave(),
+                        disabled: saving || !isDirty,
+                        className: classnames('byline-user-roles-action', roles_module.action),
+                        children: saving ? /*#__PURE__*/ jsx(LoaderEllipsis, {
+                            size: 30
+                        }) : 'Save'
+                    })
+                ]
+            })
+        ]
+    });
+}
+function getErrorCode(err) {
+    return 'string' == typeof err?.code ? err.code : null;
+}
+export { UserRoles };

package/dist/modules/admin-users/components/roles.module.js

@@ -0,0 +1,18 @@
+import "./roles_module.css";
+const roles_module = {
+    wrap: "wrap-YWdaNF",
+    empty: "empty-ZsVXJY",
+    list: "list-RsMY7h",
+    row: "row-F_1l24",
+    label: "label-N6501i",
+    "label-head": "label-head-gZregN",
+    labelHead: "label-head-gZregN",
+    name: "name-hgEsQB",
+    machine: "machine-VzeuNO",
+    description: "description-xE3mA4",
+    actions: "actions-A6I1GP",
+    action: "action-etRmtU",
+    "checkbox-auto": "checkbox-auto-ioL2ME",
+    checkboxAuto: "checkbox-auto-ioL2ME"
+};
+export default roles_module;

package/dist/modules/admin-users/components/roles_module.css

@@ -0,0 +1,75 @@
+:is(.wrap-YWdaNF, .byline-user-roles-wrap) {
+  gap: var(--spacing-12);
+  padding: var(--spacing-4);
+  margin-top: var(--spacing-4);
+  flex-direction: column;
+  display: flex;
+}
+
+:is(.empty-ZsVXJY, .byline-user-roles-empty) {
+  margin: 0;
+  font-style: italic;
+}
+
+:is(.list-RsMY7h, .byline-user-roles-list) {
+  gap: var(--spacing-4);
+  flex-direction: column;
+  display: flex;
+}
+
+:is(.row-F_1l24, .byline-user-roles-row) {
+  align-items: flex-start;
+  gap: var(--spacing-8);
+  padding: var(--spacing-4) 0;
+  display: flex;
+}
+
+:is(.label-N6501i, .byline-user-roles-label) {
+  cursor: pointer;
+  flex: 1 1 0;
+  min-width: 0;
+}
+
+:is(.label-head-gZregN, .byline-user-roles-label-head) {
+  align-items: center;
+  gap: var(--spacing-8);
+  display: flex;
+}
+
+:is(.name-hgEsQB, .byline-user-roles-name) {
+  font-size: var(--font-size-sm);
+  font-weight: var(--font-weight-medium);
+}
+
+:is(.machine-VzeuNO, .byline-user-roles-machine) {
+  background-color: var(--gray-100);
+  font-size: var(--font-size-xs);
+  border-radius: var(--border-radius-sm);
+  padding: .125rem .375rem;
+}
+
+:is(.description-xE3mA4, .byline-user-roles-description) {
+  font-size: var(--font-size-xs);
+  margin-bottom: 0;
+}
+
+:is(.actions-A6I1GP, .byline-user-roles-actions) {
+  justify-content: flex-end;
+  align-items: center;
+  gap: var(--spacing-8);
+  margin-top: var(--spacing-16);
+  display: flex;
+}
+
+:is(.action-etRmtU, .byline-user-roles-action) {
+  min-width: 4rem;
+}
+
+:is(.checkbox-auto-ioL2ME, .byline-user-roles-checkbox-auto) {
+  width: auto !important;
+}
+
+:is(:is([data-theme="dark"], .dark) .machine-VzeuNO, :is([data-theme="dark"], .dark) .byline-user-roles-machine) {
+  background-color: var(--canvas-800);
+}
+

package/dist/modules/admin-users/components/set-password.d.ts

@@ -0,0 +1,8 @@
+import type { AdminUserResponse } from '../index.js';
+interface SetPasswordProps {
+    user: AdminUserResponse;
+    onClose?: () => void;
+    onSuccess?: (user: AdminUserResponse) => void;
+}
+export declare function SetPassword({ user, onClose, onSuccess }: SetPasswordProps): import("react").JSX.Element;
+export {};