ra-core/dist/controller/saveContext/useMutationMiddlewares.js

Core components of react-admin, a frontend Framework for building admin applications on top of REST services, using ES6, React

import { useCallback, useMemo, useRef } from 'react';
/**
 * Internal hook used to handle mutation middlewares.
 *
 * @example
 * // We have a form creating an order for a new customer.
 * // The form contains the customer fields in addition to the order fields
 * // but they should be saved as a new customer resource record
 * // and the order should only reference this new customer
 * type Order = { id: string; reference: string };
 * type OrderCreateFormData = { id: string; reference: string; customer: Customer };
 * type Customer = { id: string; email: string; firstName: string; lastName: string };
 *
 * const CustomerForm = props => {
 *     const [createCustomer] = useCreate<Customer>();
 *     const middleware: Middleware<UseCreateResult<OrderCreateFormData>[0]> = useCallback(async (resource, params, next) => {
 *         const { data } = params;
 *         const { user, ...orderData } = data;
 *         const { data = newCustomer } = await createCustomer('customers', { data: user });
 *         const orderDataWithCustomer = { ...orderData, customerId: newCustomer.id };
 *         next(resource, { data: orderDataWithCustomer });
 *     }, [createCustomer]);
 *     useRegisterMutationMiddleware(middleware);
 *
 *     return (
 *         <>
 *             <TextInput source="user.email" />
 *             <TextInput source="user.firstName" />
 *             <TextInput source="user.lastName" />
 *         </>
 *     );
 * }
 */
export const useMutationMiddlewares = () => {
    const callbacks = useRef([]);
    const registerMutationMiddleware = useCallback((callback) => {
        callbacks.current.push(callback);
    }, []);
    const unregisterMutationMiddleware = useCallback((callback) => {
        callbacks.current = callbacks.current.filter(cb => cb !== callback);
    }, []);
    const getMutateWithMiddlewares = useCallback((fn) => {
        // Stores the current callbacks in a closure to avoid losing them if the calling component is unmounted
        const currentCallbacks = [...callbacks.current];
        return (...args) => {
            let index = currentCallbacks.length - 1;
            // Called by middlewares to call the next middleware function
            // Should take the same arguments as the original mutation function
            const next = (...newArgs) => {
                // Decrement the middlewares counter so that when next is called again, we
                // call the next middleware
                index--;
                // If there are no more middlewares, we call the original mutation function
                if (index >= 0) {
                    return currentCallbacks[index](...newArgs, next);
                }
                else {
                    return fn(...newArgs);
                }
            };
            if (currentCallbacks.length > 0) {
                // Call the first middleware with the same args as the original mutation function
                // with an additional next function
                return currentCallbacks[index](...args, next);
            }
            return fn(...args);
        };
    }, []);
    const functions = useMemo(() => ({
        registerMutationMiddleware,
        getMutateWithMiddlewares,
        unregisterMutationMiddleware,
    }), [
        registerMutationMiddleware,
        getMutateWithMiddlewares,
        unregisterMutationMiddleware,
    ]);
    return functions;
};
//# sourceMappingURL=useMutationMiddlewares.js.map