@strato-admin/core 0.1.1 → 0.3.0

package/dist/ra-core/src/form/validation/setSubmissionErrors.d.ts

@@ -0,0 +1,21 @@
+import { FieldValues, UseFormSetError } from 'react-hook-form';
+/**
+ * This internal function is used to convert an object matching the form shape with errors to a
+ * format compatible with react-hook-form. It's used to handle submission errors. Only useful when
+ * you are implementing a custom form without leveraging our Form component.
+ *
+ * @example
+ * const MyForm = () => {
+ *     const { register, handleSubmit, setError } = useForm();
+ *     const onSubmit = data => {
+ *         return saveAsync(data).catch(error => setSubmissionErrors(error.body.details));
+ *     };
+ *
+ *     return (
+ *         <form onSubmit={handleSubmit(onSubmit)}>
+ *             ...
+ *         </form>
+ *     );
+ * };
+ */
+export declare const setSubmissionErrors: (errors: FieldValues, setError: UseFormSetError<FieldValues>) => void;

package/dist/ra-core/src/form/validation/setSubmissionErrors.js

@@ -0,0 +1,34 @@
+/**
+ * This internal function is used to convert an object matching the form shape with errors to a
+ * format compatible with react-hook-form. It's used to handle submission errors. Only useful when
+ * you are implementing a custom form without leveraging our Form component.
+ *
+ * @example
+ * const MyForm = () => {
+ *     const { register, handleSubmit, setError } = useForm();
+ *     const onSubmit = data => {
+ *         return saveAsync(data).catch(error => setSubmissionErrors(error.body.details));
+ *     };
+ *
+ *     return (
+ *         <form onSubmit={handleSubmit(onSubmit)}>
+ *             ...
+ *         </form>
+ *     );
+ * };
+ */
+export const setSubmissionErrors = (errors, setError) => {
+    const setErrorFromObject = (errors, rootPath) => {
+        Object.entries(errors).forEach(([name, error]) => {
+            if (typeof error === 'object') {
+                setErrorFromObject(error, `${rootPath}${name}.`);
+                return;
+            }
+            setError(`${rootPath}${name}`, {
+                type: 'server',
+                message: error.toString(),
+            });
+        });
+    };
+    setErrorFromObject(errors, '');
+};

package/dist/ra-core/src/form/validation/useGetValidationErrorMessage.d.ts

@@ -0,0 +1,26 @@
+import { ValidationErrorMessage } from './validate';
+/**
+ * @deprecated
+ * This internal hook returns a function that can translate an error message.
+ * It handles simple string errors and those which have a message and args.
+ * Only useful if you are implementing custom inputs without leveraging our useInput hook.
+ *
+ * @example
+ * const MyInput = props => {
+ *      const { field, fieldState } = useController(props);
+ *      useEffect(() => {
+ *          if (fieldState.error) {
+ *              const errorMessage = useGetValidationErrorMessage(fieldState.error);
+ *              alert(errorMessage);
+ *          }
+ *      }, [fieldState.error]);
+ *
+ *      return (
+ *          <input {...field} />
+ *      );
+ * }
+ *
+ * @see ValidationErrorMessage
+ * @see ValidationErrorMessageWithArgs
+ */
+export declare const useGetValidationErrorMessage: () => (error: ValidationErrorMessage) => string;

package/dist/ra-core/src/form/validation/useGetValidationErrorMessage.js

@@ -0,0 +1,35 @@
+import { useTranslate } from '../../i18n';
+/**
+ * @deprecated
+ * This internal hook returns a function that can translate an error message.
+ * It handles simple string errors and those which have a message and args.
+ * Only useful if you are implementing custom inputs without leveraging our useInput hook.
+ *
+ * @example
+ * const MyInput = props => {
+ *      const { field, fieldState } = useController(props);
+ *      useEffect(() => {
+ *          if (fieldState.error) {
+ *              const errorMessage = useGetValidationErrorMessage(fieldState.error);
+ *              alert(errorMessage);
+ *          }
+ *      }, [fieldState.error]);
+ *
+ *      return (
+ *          <input {...field} />
+ *      );
+ * }
+ *
+ * @see ValidationErrorMessage
+ * @see ValidationErrorMessageWithArgs
+ */
+export const useGetValidationErrorMessage = () => {
+    const translate = useTranslate();
+    return (error) => {
+        if (error.message != null) {
+            const { message, args } = error;
+            return translate(message, { _: message, ...args });
+        }
+        return translate(error, { _: error });
+    };
+};

package/dist/ra-core/src/form/validation/useNotifyIsFormInvalid.d.ts

@@ -0,0 +1,9 @@
+import { Control } from 'react-hook-form';
+/**
+ * This hook display an error message on submit in Form and SaveButton.
+ *
+ * We can't do the form validity check in the form submit handler
+ * as the form state may not have been updated yet when onSubmit validation mode is enabled
+ * or when the form hasn't been touched at all.
+ */
+export declare const useNotifyIsFormInvalid: (control?: Control, enabled?: boolean) => void;

package/dist/ra-core/src/form/validation/useNotifyIsFormInvalid.js

@@ -0,0 +1,30 @@
+import { useEffect, useRef } from 'react';
+import { useFormState } from 'react-hook-form';
+import { useNotify } from '../../notification';
+/**
+ * This hook display an error message on submit in Form and SaveButton.
+ *
+ * We can't do the form validity check in the form submit handler
+ * as the form state may not have been updated yet when onSubmit validation mode is enabled
+ * or when the form hasn't been touched at all.
+ */
+export const useNotifyIsFormInvalid = (control, enabled = true) => {
+    const { submitCount, errors } = useFormState(control ? { control } : undefined);
+    const submitCountRef = useRef(submitCount);
+    const notify = useNotify();
+    useEffect(() => {
+        // Checking the submit count allows us to only display the notification after users
+        // tried to submit
+        if (submitCount > submitCountRef.current && enabled) {
+            submitCountRef.current = submitCount;
+            if (Object.keys(errors).length > 0) {
+                const serverError = typeof errors.root?.serverError?.message === 'string'
+                    ? errors.root.serverError.message
+                    : undefined;
+                notify(serverError || "strato.message.invalid_form', {
+                    type: 'error',
+                });
+            }
+        }
+    }, [errors, submitCount, notify, enabled]);
+};

package/dist/ra-core/src/form/validation/useUnique.d.ts

@@ -0,0 +1,57 @@
+import { InputProps } from '../useInput';
+/**
+ * A hook that returns a validation function checking for a record field uniqueness
+ * by calling the dataProvider getList function with a filter.
+ *
+ * @example // Passing options at declaration time
+ * const UserCreateForm = () => {
+ *     const unique = useUnique({ message: 'Username is already used'});
+ *     return (
+ *         <SimpleForm>
+ *             <TextInput source="username" validate={unique()} />
+ *         </SimpleForm>
+ *     );
+ * }
+ *
+ * @example // Passing options at call time
+ * const UserCreateForm = () => {
+ *     const unique = useUnique();
+ *     return (
+ *         <SimpleForm>
+ *             <TextInput source="username" validate={unique({ message: 'Username is already used'})} />
+ *         </SimpleForm>
+ *     );
+ * }
+ *
+ * @example // With additional filters
+ * const UserCreateForm = () => {
+ *     const unique = useUnique();
+ *     return (
+ *         <SimpleForm>
+ *             <ReferenceInput source="organization_id" reference="organizations" />
+ *             <FormDataConsumer>
+ *                 {({ formData }) => (
+ *                     <TextInput
+ *                         source="username"
+ *                         validate={unique({ filter: { organization_id: formData.organization_id })}
+ *                     />
+ *                 )}
+ *             </FormDataConsumer>
+ *         </SimpleForm>
+ *     );
+ * }
+ */
+export declare const useUnique: (options?: UseUniqueOptions) => (callTimeOptions?: UseUniqueOptions) => (value: any, allValues: any, props: InputProps) => Promise<string | {
+    message: any;
+    args: {
+        source: string;
+        value: any;
+        field: string | number | bigint | true | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | Promise<string | number | bigint | boolean | import("react").ReactPortal | import("react").ReactElement<unknown, string | import("react").JSXElementConstructor<any>> | Iterable<import("react").ReactNode> | null | undefined> | null;
+    };
+} | undefined>;
+export type UseUniqueOptions = {
+    debounce?: number;
+    resource?: string;
+    message?: string;
+    filter?: Record<string, any>;
+};

package/dist/ra-core/src/form/validation/useUnique.js

@@ -0,0 +1,107 @@
+import { useCallback, useRef } from 'react';
+import merge from 'lodash/merge.js';
+import set from 'lodash/set.js';
+import { useResourceContext } from '../../core';
+import { useDataProvider } from '../../dataProvider';
+import { useTranslate, useTranslateLabel } from '../../i18n';
+import { asyncDebounce } from '../../util';
+import { useRecordContext } from '../../controller';
+import { isEmpty } from './validate';
+/**
+ * A hook that returns a validation function checking for a record field uniqueness
+ * by calling the dataProvider getList function with a filter.
+ *
+ * @example // Passing options at declaration time
+ * const UserCreateForm = () => {
+ *     const unique = useUnique({ message: 'Username is already used'});
+ *     return (
+ *         <SimpleForm>
+ *             <TextInput source="username" validate={unique()} />
+ *         </SimpleForm>
+ *     );
+ * }
+ *
+ * @example // Passing options at call time
+ * const UserCreateForm = () => {
+ *     const unique = useUnique();
+ *     return (
+ *         <SimpleForm>
+ *             <TextInput source="username" validate={unique({ message: 'Username is already used'})} />
+ *         </SimpleForm>
+ *     );
+ * }
+ *
+ * @example // With additional filters
+ * const UserCreateForm = () => {
+ *     const unique = useUnique();
+ *     return (
+ *         <SimpleForm>
+ *             <ReferenceInput source="organization_id" reference="organizations" />
+ *             <FormDataConsumer>
+ *                 {({ formData }) => (
+ *                     <TextInput
+ *                         source="username"
+ *                         validate={unique({ filter: { organization_id: formData.organization_id })}
+ *                     />
+ *                 )}
+ *             </FormDataConsumer>
+ *         </SimpleForm>
+ *     );
+ * }
+ */
+export const useUnique = (options) => {
+    const dataProvider = useDataProvider();
+    const translateLabel = useTranslateLabel();
+    const resource = useResourceContext(options);
+    if (!resource) {
+        throw new Error('useUnique: missing resource prop or context');
+    }
+    const translate = useTranslate();
+    const record = useRecordContext();
+    const debouncedGetList = useRef(
+    // The initial value is here to set the correct type on useRef
+    asyncDebounce(dataProvider.getList, options?.debounce ?? DEFAULT_DEBOUNCE));
+    const validateUnique = useCallback((callTimeOptions) => {
+        const { message, filter, debounce: interval, } = merge({
+            debounce: DEFAULT_DEBOUNCE,
+            filter: {},
+            message: "strato.validation.unique',
+        }, options, callTimeOptions);
+        debouncedGetList.current = asyncDebounce(dataProvider.getList, interval);
+        return async (value, allValues, props) => {
+            if (isEmpty(value)) {
+                return undefined;
+            }
+            try {
+                const finalFilter = set(merge({}, filter), props.source, value);
+                const { data, total } = await debouncedGetList.current(resource, {
+                    filter: finalFilter,
+                    pagination: { page: 1, perPage: 1 },
+                    sort: { field: 'id', order: 'ASC' },
+                });
+                if (typeof total !== 'undefined' &&
+                    total > 0 &&
+                    !data.some(r => r.id === record?.id)) {
+                    return {
+                        message,
+                        args: {
+                            source: props.source,
+                            value,
+                            field: translateLabel({
+                                label: props.label,
+                                source: props.source,
+                                resource,
+                            }),
+                        },
+                    };
+                }
+            }
+            catch (error) {
+                return translate("strato.notification.http_error');
+            }
+            return undefined;
+        };
+    }, [dataProvider, options, record, resource, translate, translateLabel]);
+    return validateUnique;
+};
+const DEFAULT_DEBOUNCE = 1000;

package/dist/ra-core/src/form/validation/validate.d.ts

@@ -0,0 +1,168 @@
+export declare const isEmpty: (value: any) => boolean;
+export interface ValidationErrorMessageWithArgs {
+    message: string;
+    args: {
+        [key: string]: ValidationErrorMessageWithArgs | any;
+    };
+}
+export type ValidationErrorMessage = string | ValidationErrorMessageWithArgs;
+export type Validator = (value: any, values: any, props: any) => ValidationErrorMessage | null | undefined | Promise<ValidationErrorMessage | null | undefined>;
+export interface GetValidationMessageParams {
+    args: any;
+    value: any;
+    values: any;
+}
+export type GetValidationMessage = (params: GetValidationMessageParams) => ValidationErrorMessage;
+export declare const combine2Validators: (validator1: Validator, validator2: Validator) => Validator;
+export declare const composeValidators: (...validators: any[]) => Validator;
+export declare const composeSyncValidators: (...validators: any[]) => (value: any, values: any, meta: any) => ValidationErrorMessage | Promise<ValidationErrorMessage | null | undefined> | undefined;
+/**
+ * Required validator
+ *
+ * Returns an error if the value is null, undefined, or empty
+ *
+ * @param {string|Function} message
+ *
+ * @example
+ *
+ * const titleValidators = [required('The title is required')];
+ * <TextInput name="title" validate={titleValidators} />
+ */
+export declare const required: (message?: any) => ((value: any, values: any) => string | {
+    message: string;
+    args: any;
+} | undefined) & {
+    isRequired: boolean;
+};
+/**
+ * Minimum length validator
+ *
+ * Returns an error if the value has a length less than the parameter
+ *
+ * @param {integer} min
+ * @param {string|Function} message
+ *
+ * @example
+ *
+ * const passwordValidators = [minLength(10, 'Should be at least 10 characters')];
+ * <TextInput type="password" name="password" validate={passwordValidators} />
+ */
+export declare const minLength: (min: any, message?: any) => (value: any, values: any) => string | {
+    message: string;
+    args: any;
+} | undefined;
+/**
+ * Maximum length validator
+ *
+ * Returns an error if the value has a length higher than the parameter
+ *
+ * @param {integer} max
+ * @param {string|Function} message
+ *
+ * @example
+ *
+ * const nameValidators = [maxLength(10, 'Should be at most 10 characters')];
+ * <TextInput name="name" validate={nameValidators} />
+ */
+export declare const maxLength: (max: any, message?: any) => (value: any, values: any) => string | {
+    message: string;
+    args: any;
+} | undefined;
+/**
+ * Minimum validator
+ *
+ * Returns an error if the value is less than the parameter
+ *
+ * @param {integer} min
+ * @param {string|Function} message
+ *
+ * @example
+ *
+ * const fooValidators = [minValue(5, 'Should be more than 5')];
+ * <NumberInput name="foo" validate={fooValidators} />
+ */
+export declare const minValue: (min: any, message?: any) => (value: any, values: any) => string | {
+    message: string;
+    args: any;
+} | undefined;
+/**
+ * Maximum validator
+ *
+ * Returns an error if the value is higher than the parameter
+ *
+ * @param {integer} max
+ * @param {string|Function} message
+ *
+ * @example
+ *
+ * const fooValidators = [maxValue(10, 'Should be less than 10')];
+ * <NumberInput name="foo" validate={fooValidators} />
+ */
+export declare const maxValue: (max: any, message?: any) => (value: any, values: any) => string | {
+    message: string;
+    args: any;
+} | undefined;
+/**
+ * Number validator
+ *
+ * Returns an error if the value is not a number
+ *
+ * @param {string|Function} message
+ *
+ * @example
+ *
+ * const ageValidators = [number('Must be a number')];
+ * <TextInput name="age" validate={ageValidators} />
+ */
+export declare const number: (message?: any) => (value: any, values: any) => string | {
+    message: string;
+    args: any;
+} | undefined;
+/**
+ * Regular expression validator
+ *
+ * Returns an error if the value does not match the pattern given as parameter
+ *
+ * @param {RegExp} pattern
+ * @param {string|Function} message
+ *
+ * @example
+ *
+ * const zipValidators = [regex(/^\d{5}(?:[-\s]\d{4})?$/, 'Must be a zip code')];
+ * <TextInput name="zip" validate={zipValidators} />
+ */
+export declare const regex: any;
+/**
+ * Email validator
+ *
+ * Returns an error if the value is not a valid email
+ *
+ * @param {string|Function} message
+ *
+ * @example
+ *
+ * const emailValidators = [email('Must be an email')];
+ * <TextInput name="email" validate={emailValidators} />
+ */
+export declare const email: (message?: any) => any;
+/**
+ * Choices validator
+ *
+ * Returns an error if the value is not among the list passed as parameter
+ *
+ * @param {array} list
+ * @param {string|Function} message
+ *
+ * @example
+ *
+ * const genderValidators = [choices(['male', 'female'], 'Must be either Male or Female')];
+ * <TextInput name="gender" validate={genderValidators} />
+ */
+export declare const choices: (list: any, message?: any) => (value: any, values: any) => string | {
+    message: string;
+    args: any;
+} | undefined;
+/**
+ * Given a validator, returns a boolean indicating whether the field is required or not.
+ */
+export declare const isRequired: (validate: any) => boolean;