@strato-admin/faker-ecommerce 0.1.1 → 0.3.0

package/dist/ra-core/src/controller/record/useRecordContext.d.ts

@@ -0,0 +1,34 @@
+import { RaRecord } from '../../types';
+/**
+ * Hook to read the record from a RecordContext.
+ *
+ * Must be used within a <RecordContext> such as provided by the <EditContextProvider>
+ * (e.g. as a descendent of <Edit> or <EditBase>) or within a <ShowContextProvider>
+ * (e.g. as a descendent of <Show> or <ShowBase>)
+ *
+ * @example // basic usage
+ *
+ * import { useRecordContext } from '@strato-admin/ra-core';
+ *
+ * const TitleField = () => {
+ *     const record = useRecordContext();
+ *     return <span>{record && record.title}</span>;
+ * };
+ *
+ * @example // allow record override via props
+ *
+ * import { useRecordContext } from '@strato-admin/ra-core';
+ *
+ * const TitleField = (props) => {
+ *     const record = useRecordContext(props);
+ *     return <span>{record && record.title}</span>;
+ * };
+ * render(<TextField record={record} />);
+ *
+ * @returns {RaRecord} A record object
+ */
+export declare const useRecordContext: <RecordType extends RaRecord | Omit<RaRecord, "id"> = RaRecord>(props?: UseRecordContextParams<RecordType>) => RecordType | undefined;
+export interface UseRecordContextParams<RecordType extends RaRecord | Omit<RaRecord, 'id'> = RaRecord> {
+    record?: RecordType;
+    [key: string]: any;
+}

package/dist/ra-core/src/controller/record/useRecordContext.js

@@ -0,0 +1,36 @@
+import { useContext } from 'react';
+import { RecordContext } from './RecordContext';
+/**
+ * Hook to read the record from a RecordContext.
+ *
+ * Must be used within a <RecordContext> such as provided by the <EditContextProvider>
+ * (e.g. as a descendent of <Edit> or <EditBase>) or within a <ShowContextProvider>
+ * (e.g. as a descendent of <Show> or <ShowBase>)
+ *
+ * @example // basic usage
+ *
+ * import { useRecordContext } from '@strato-admin/ra-core';
+ *
+ * const TitleField = () => {
+ *     const record = useRecordContext();
+ *     return <span>{record && record.title}</span>;
+ * };
+ *
+ * @example // allow record override via props
+ *
+ * import { useRecordContext } from '@strato-admin/ra-core';
+ *
+ * const TitleField = (props) => {
+ *     const record = useRecordContext(props);
+ *     return <span>{record && record.title}</span>;
+ * };
+ * render(<TextField record={record} />);
+ *
+ * @returns {RaRecord} A record object
+ */
+export const useRecordContext = (props) => {
+    // Can't find a way to specify the RecordType when CreateContext is declared
+    // @ts-ignore
+    const context = useContext(RecordContext);
+    return (props && props.record) || context;
+};

package/dist/ra-core/src/controller/saveContext/SaveContext.d.ts

@@ -0,0 +1,20 @@
+import { RaRecord, OnError, OnSuccess, TransformData, MutationMode } from '../../types';
+import { Middleware } from './useMutationMiddlewares';
+export interface SaveContextValue<RecordType extends RaRecord = any, MutateFunc extends (...args: any[]) => any = (...args: any[]) => any> {
+    save?: SaveHandler<RecordType>;
+    /**
+     * @deprecated. Rely on the form isSubmitting value instead
+     */
+    saving?: boolean;
+    mutationMode?: MutationMode;
+    registerMutationMiddleware?: (callback: Middleware<MutateFunc>) => void;
+    unregisterMutationMiddleware?: (callback: Middleware<MutateFunc>) => void;
+}
+export type SaveHandler<RecordType> = (record: Partial<RecordType>, callbacks?: SaveHandlerCallbacks) => Promise<void | RecordType> | Record<string, string>;
+export type SaveHandlerCallbacks = {
+    onSuccess?: OnSuccess;
+    onError?: OnError;
+    transform?: TransformData;
+    meta?: any;
+};
+export declare const SaveContext: import("react").Context<SaveContextValue<any, (...args: any[]) => any>>;

package/dist/ra-core/src/controller/saveContext/SaveContext.js

@@ -0,0 +1,2 @@
+import { createContext } from 'react';
+export const SaveContext = createContext({});

package/dist/ra-core/src/controller/saveContext/index.d.ts

@@ -0,0 +1,6 @@
+export * from './SaveContext';
+export * from './SaveContextProvider';
+export * from './usePickSaveContext';
+export * from './useSaveContext';
+export * from './useMutationMiddlewares';
+export * from './useRegisterMutationMiddleware';

package/dist/ra-core/src/controller/saveContext/index.js

@@ -0,0 +1,6 @@
+export * from './SaveContext';
+export * from './SaveContextProvider';
+export * from './usePickSaveContext';
+export * from './useSaveContext';
+export * from './useMutationMiddlewares';
+export * from './useRegisterMutationMiddleware';

package/dist/ra-core/src/controller/saveContext/useMutationMiddlewares.d.ts

@@ -0,0 +1,39 @@
+/**
+ * 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 declare const useMutationMiddlewares: <MutateFunc extends (...args: any[]) => any = (...args: any[]) => any>() => UseMutationMiddlewaresResult<MutateFunc>;
+export interface UseMutationMiddlewaresResult<MutateFunc extends (...args: any[]) => any = (...args: any[]) => any> {
+    registerMutationMiddleware: (callback: Middleware<MutateFunc>) => void;
+    getMutateWithMiddlewares: (mutate: MutateFunc) => (...args: Parameters<MutateFunc>) => ReturnType<MutateFunc>;
+    unregisterMutationMiddleware: (callback: Middleware<MutateFunc>) => void;
+}
+export type Middleware<MutateFunc = (...args: any[]) => any> = MutateFunc extends (...a: any[]) => infer R ? (...a: [...U: Parameters<MutateFunc>, next: MutateFunc]) => R : never;

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

@@ -0,0 +1,79 @@
+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;
+};

package/dist/ra-core/src/controller/saveContext/usePickSaveContext.d.ts

@@ -0,0 +1,5 @@
+import { SaveContextValue } from './SaveContext';
+/**
+ * This hook extracts the `save`, `saving` and mutationMode properties from either the `CreateContext` or `EditContext`. This ensures the `SaveContext` doesn't rerender when those two contexts have other properties changes.
+ */
+export declare const usePickSaveContext: <ContextType extends SaveContextValue = SaveContextValue>(context: ContextType) => SaveContextValue;

package/dist/ra-core/src/controller/saveContext/usePickSaveContext.js

@@ -0,0 +1,25 @@
+import { useMemo } from 'react';
+import pick from 'lodash/pick.js';
+/**
+ * This hook extracts the `save`, `saving` and mutationMode properties from either the `CreateContext` or `EditContext`. This ensures the `SaveContext` doesn't rerender when those two contexts have other properties changes.
+ */
+export const usePickSaveContext = (context) => {
+    const value = useMemo(() => pick(context, [
+        'save',
+        'saving',
+        'mutationMode',
+        'registerMutationMiddleware',
+        'unregisterMutationMiddleware',
+    ]), 
+    /* eslint-disable react-hooks/exhaustive-deps */
+    [
+        context.save,
+        context.saving,
+        context.mutationMode,
+        context.registerMutationMiddleware,
+        context.unregisterMutationMiddleware,
+    ]
+    /* eslint-enable react-hooks/exhaustive-deps */
+    );
+    return value;
+};

package/dist/ra-core/src/controller/saveContext/useRegisterMutationMiddleware.d.ts

@@ -0,0 +1,6 @@
+import { Middleware } from './useMutationMiddlewares';
+/**
+ * Internal hook that registers a middleware for the save function in the current SaveContext.
+ * @param callback The middleware function.
+ */
+export declare const useRegisterMutationMiddleware: <MutateFunc extends (...args: any[]) => any = (...args: any[]) => any>(callback: Middleware<MutateFunc>) => void;

package/dist/ra-core/src/controller/saveContext/useRegisterMutationMiddleware.js

@@ -0,0 +1,18 @@
+import { useEffect } from 'react';
+import { useSaveContext } from './useSaveContext';
+/**
+ * Internal hook that registers a middleware for the save function in the current SaveContext.
+ * @param callback The middleware function.
+ */
+export const useRegisterMutationMiddleware = (callback) => {
+    const { registerMutationMiddleware, unregisterMutationMiddleware } = useSaveContext();
+    useEffect(() => {
+        if (!registerMutationMiddleware || !unregisterMutationMiddleware) {
+            return;
+        }
+        registerMutationMiddleware(callback);
+        return () => {
+            unregisterMutationMiddleware(callback);
+        };
+    }, [callback, registerMutationMiddleware, unregisterMutationMiddleware]);
+};

package/dist/ra-core/src/controller/saveContext/useSaveContext.d.ts

@@ -0,0 +1,14 @@
+import { SaveContextValue } from './SaveContext';
+/**
+ * Get the save() function and its status
+ *
+ * Used in forms.
+ *
+ * @example
+ *
+ * const {
+ *     save,
+ *     saving
+ * } = useSaveContext();
+ */
+export declare const useSaveContext: <PropsType extends SaveContextValue = SaveContextValue>(_props?: PropsType) => SaveContextValue;

package/dist/ra-core/src/controller/saveContext/useSaveContext.js

@@ -0,0 +1,17 @@
+import { useContext } from 'react';
+import { SaveContext } from './SaveContext';
+/**
+ * Get the save() function and its status
+ *
+ * Used in forms.
+ *
+ * @example
+ *
+ * const {
+ *     save,
+ *     saving
+ * } = useSaveContext();
+ */
+export const useSaveContext = (_props) => {
+    return useContext(SaveContext);
+};

package/dist/ra-core/src/controller/show/index.d.ts

@@ -0,0 +1,6 @@
+export * from './ShowBase';
+export * from './ShowContext';
+export * from './ShowContextProvider';
+export * from './ShowController';
+export * from './useShowController';
+export * from './useShowContext';

package/dist/ra-core/src/controller/show/index.js

@@ -0,0 +1,6 @@
+export * from './ShowBase';
+export * from './ShowContext';
+export * from './ShowContextProvider';
+export * from './ShowController';
+export * from './useShowController';
+export * from './useShowContext';

package/dist/ra-core/src/controller/show/useShowController.d.ts

@@ -0,0 +1,75 @@
+import { RaRecord } from '../../types';
+import { UseGetOneHookValue, UseGetOneOptions } from '../../dataProvider';
+import { RedirectionSideEffect } from '../../routing';
+/**
+ * Prepare data for the Show view.
+ *
+ * useShowController does a few things:
+ * - it grabs the id from the URL and the resource name from the ResourceContext,
+ * - it fetches the record via useGetOne,
+ * - it prepares the page title.
+ *
+ * @param {Object} props The props passed to the Show component.
+ *
+ * @return {Object} controllerProps Fetched data and callbacks for the Show view
+ *
+ * @example
+ *
+ * import { useShowController } from 'react-admin';
+ * import ShowView from './ShowView';
+ *
+ * const MyShow = () => {
+ *     const controllerProps = useShowController();
+ *     return <ShowView {...controllerProps} />;
+ * };
+ *
+ * @example // useShowController can also take its parameters from props
+ *
+ * import { useShowController } from 'react-admin';
+ * import ShowView from './ShowView';
+ *
+ * const MyShow = () => {
+ *     const controllerProps = useShowController({ resource: 'posts', id: 1234 });
+ *     return <ShowView {...controllerProps} />;
+ * };
+ */
+export declare const useShowController: <RecordType extends RaRecord = any, ErrorType = Error>(props?: ShowControllerProps<RecordType, ErrorType>) => ShowControllerResult<RecordType, ErrorType>;
+export interface ShowControllerProps<RecordType extends RaRecord = any, ErrorType = Error> {
+    disableAuthentication?: boolean;
+    id?: RecordType['id'];
+    queryOptions?: UseGetOneOptions<RecordType, ErrorType>;
+    resource?: string;
+    redirectOnError?: RedirectionSideEffect;
+}
+export interface ShowControllerBaseResult<RecordType extends RaRecord = any> {
+    defaultTitle?: string;
+    isFetching: boolean;
+    isLoading: boolean;
+    isPaused?: boolean;
+    isPlaceholderData?: boolean;
+    redirectOnError?: RedirectionSideEffect;
+    resource: string;
+    record?: RecordType;
+    refetch: UseGetOneHookValue<RecordType>['refetch'];
+}
+export interface ShowControllerLoadingResult<RecordType extends RaRecord = any> extends ShowControllerBaseResult<RecordType> {
+    record: undefined;
+    error: null;
+    isPending: true;
+}
+export interface ShowControllerLoadingErrorResult<RecordType extends RaRecord = any, TError = Error> extends ShowControllerBaseResult<RecordType> {
+    record: undefined;
+    error: TError;
+    isPending: false;
+}
+export interface ShowControllerRefetchErrorResult<RecordType extends RaRecord = any, TError = Error> extends ShowControllerBaseResult<RecordType> {
+    record: RecordType;
+    error: TError;
+    isPending: false;
+}
+export interface ShowControllerSuccessResult<RecordType extends RaRecord = any> extends ShowControllerBaseResult<RecordType> {
+    record: RecordType;
+    error: null;
+    isPending: false;
+}
+export type ShowControllerResult<RecordType extends RaRecord = any, ErrorType = Error> = ShowControllerLoadingResult<RecordType> | ShowControllerLoadingErrorResult<RecordType, ErrorType> | ShowControllerRefetchErrorResult<RecordType, ErrorType> | ShowControllerSuccessResult<RecordType>;

package/dist/ra-core/src/controller/show/useShowController.js

@@ -0,0 +1,110 @@
+import { useAuthenticated, useRequireAccess } from '../../auth';
+import { useGetOne, } from '../../dataProvider';
+import { useTranslate } from '../../i18n';
+import { useRedirect, useParams } from '../../routing';
+import { useNotify } from '../../notification';
+import { useResourceContext, useGetResourceLabel, useGetRecordRepresentation, } from '../../core';
+/**
+ * Prepare data for the Show view.
+ *
+ * useShowController does a few things:
+ * - it grabs the id from the URL and the resource name from the ResourceContext,
+ * - it fetches the record via useGetOne,
+ * - it prepares the page title.
+ *
+ * @param {Object} props The props passed to the Show component.
+ *
+ * @return {Object} controllerProps Fetched data and callbacks for the Show view
+ *
+ * @example
+ *
+ * import { useShowController } from 'react-admin';
+ * import ShowView from './ShowView';
+ *
+ * const MyShow = () => {
+ *     const controllerProps = useShowController();
+ *     return <ShowView {...controllerProps} />;
+ * };
+ *
+ * @example // useShowController can also take its parameters from props
+ *
+ * import { useShowController } from 'react-admin';
+ * import ShowView from './ShowView';
+ *
+ * const MyShow = () => {
+ *     const controllerProps = useShowController({ resource: 'posts', id: 1234 });
+ *     return <ShowView {...controllerProps} />;
+ * };
+ */
+export const useShowController = (props = {}) => {
+    const { disableAuthentication = false, id: propsId, queryOptions = {}, redirectOnError = DefaultRedirectOnError, } = props;
+    const resource = useResourceContext(props);
+    if (!resource) {
+        throw new Error(`useShowController requires a non-empty resource prop or context`);
+    }
+    const { isPending: isPendingAuthenticated } = useAuthenticated({
+        enabled: !disableAuthentication,
+    });
+    const { isPending: isPendingCanAccess } = useRequireAccess({
+        action: 'show',
+        resource,
+        enabled: !disableAuthentication && !isPendingAuthenticated,
+    });
+    const getRecordRepresentation = useGetRecordRepresentation(resource);
+    const translate = useTranslate();
+    const notify = useNotify();
+    const redirect = useRedirect();
+    const { id: routeId } = useParams();
+    if (!routeId && !propsId) {
+        throw new Error('useShowController requires an id prop or a route with an /:id? parameter.');
+    }
+    const id = propsId != null ? propsId : routeId;
+    const { meta, ...otherQueryOptions } = queryOptions;
+    const { data: record, error, isLoading, isFetching, isPaused, isPending, isPlaceholderData, refetch, } = useGetOne(resource, { id, meta }, {
+        enabled: (!isPendingAuthenticated && !isPendingCanAccess) ||
+            disableAuthentication,
+        onError: () => {
+            notify("strato.notification.item_doesnt_exist', {
+                type: 'error',
+            });
+            redirect(redirectOnError, resource, id);
+        },
+        retry: false,
+        ...otherQueryOptions,
+    });
+    // eslint-disable-next-line eqeqeq
+    if (record && record.id && record.id != id) {
+        throw new Error(`useShowController: Fetched record's id attribute (${record.id}) must match the requested 'id' (${id})`);
+    }
+    const getResourceLabel = useGetResourceLabel();
+    const recordRepresentation = getRecordRepresentation(record);
+    const defaultTitle = translate(`resources.${resource}.page.show`, {
+        id,
+        record,
+        recordRepresentation: typeof recordRepresentation === 'string'
+            ? recordRepresentation
+            : '',
+        _: translate("strato.page.show', {
+            name: getResourceLabel(resource, 1),
+            id,
+            record,
+            recordRepresentation: typeof recordRepresentation === 'string'
+                ? recordRepresentation
+                : '',
+        }),
+    });
+    return {
+        defaultTitle,
+        error,
+        isLoading,
+        isFetching,
+        isPaused,
+        isPending,
+        isPlaceholderData,
+        record,
+        redirectOnError,
+        refetch,
+        resource,
+    };
+};
+const DefaultRedirectOnError = 'list';

package/dist/ra-core/src/controller/useFilterState.d.ts

@@ -0,0 +1,46 @@
+import { FilterPayload } from '../types';
+interface UseFilterStateOptions {
+    filterToQuery?: (v: string) => FilterPayload;
+    permanentFilter?: FilterPayload;
+    debounceTime?: number;
+}
+/**
+ * @typedef UseFilterStateProps
+ * @property {Object} filter: The filter object.
+ * @property {setFilter} setFilter: Update the filter with the given string
+ */
+interface UseFilterStateProps {
+    filter: FilterPayload;
+    setFilter: (v: string) => void;
+}
+/**
+ * Hooks to provide filter state and setFilter which updates the query part of the filter
+ *
+ * @example
+ *
+ * const { filter, setFilter } = useFilter({
+ *      filterToQuery: v => ({ query: v }),
+ *      permanentFilter: { foo: 'bar' },
+ *      debounceTime: 500,
+ * });
+ * // filter initial value:
+ * {
+ *      query: '',
+ *      foo: 'bar'
+ * }
+ *  // after updating filter
+ *  setFilter('needle');
+ *  {
+ *      query: 'needle',
+ *      foo: 'bar'
+ *  }
+ *
+ * @param {Object} option
+ * @param {Function} option.filterToQuery Function to convert the filter string to a filter object. Defaults to v => ({ q: v }).
+ * @param {Object} option.permanentFilter Permanent filter to be merged with the filter string. Defaults to {}.
+ * @param {number} option.debounceTime Time in ms between filter updates - used to debounce the search. Defaults to 500ms.
+ *
+ * @returns {UseFilterStateOptions} The filter props
+ */
+declare const _default: ({ filterToQuery, permanentFilter, debounceTime, }: UseFilterStateOptions) => UseFilterStateProps;
+export default _default;

package/dist/ra-core/src/controller/useFilterState.js

@@ -0,0 +1,70 @@
+import { useEffect, useRef, useCallback, useState } from 'react';
+import debounce from 'lodash/debounce.js';
+import isEqual from 'lodash/isEqual.js';
+const defaultFilter = {};
+const defaultFilterToQuery = (v) => ({ q: v });
+/**
+ * Hooks to provide filter state and setFilter which updates the query part of the filter
+ *
+ * @example
+ *
+ * const { filter, setFilter } = useFilter({
+ *      filterToQuery: v => ({ query: v }),
+ *      permanentFilter: { foo: 'bar' },
+ *      debounceTime: 500,
+ * });
+ * // filter initial value:
+ * {
+ *      query: '',
+ *      foo: 'bar'
+ * }
+ *  // after updating filter
+ *  setFilter('needle');
+ *  {
+ *      query: 'needle',
+ *      foo: 'bar'
+ *  }
+ *
+ * @param {Object} option
+ * @param {Function} option.filterToQuery Function to convert the filter string to a filter object. Defaults to v => ({ q: v }).
+ * @param {Object} option.permanentFilter Permanent filter to be merged with the filter string. Defaults to {}.
+ * @param {number} option.debounceTime Time in ms between filter updates - used to debounce the search. Defaults to 500ms.
+ *
+ * @returns {UseFilterStateOptions} The filter props
+ */
+export default ({ filterToQuery = defaultFilterToQuery, permanentFilter = {}, debounceTime = 500, }) => {
+    const permanentFilterProp = useRef(permanentFilter);
+    const latestValue = useRef(undefined);
+    const [filter, setFilterValue] = useState({
+        ...permanentFilter,
+        ...filterToQuery(''),
+    });
+    // Developers often pass an object literal as permanent filter
+    // e.g. <ReferenceInput source="book_id" reference="books" filter={{ is_published: true }}>
+    // The effect should execute again when the parent component updates the filter value,
+    // but not when the object literal describes the same values. Therefore,
+    // we use JSON.stringify(permanentFilter) in the `useEffect` and `useCallback`
+    // dependencies instead of permanentFilter.
+    const permanentFilterSignature = JSON.stringify(permanentFilter);
+    useEffect(() => {
+        if (!isEqual(permanentFilterProp.current, permanentFilter)) {
+            permanentFilterProp.current = permanentFilter;
+            setFilterValue({
+                ...permanentFilter,
+                ...filterToQuery(latestValue.current || ''),
+            });
+        }
+    }, [permanentFilterSignature, permanentFilterProp, filterToQuery]); // eslint-disable-line react-hooks/exhaustive-deps
+    // eslint-disable-next-line react-hooks/exhaustive-deps
+    const setFilter = useCallback(debounce((value) => {
+        setFilterValue({
+            ...permanentFilter,
+            ...filterToQuery(value),
+        });
+        latestValue.current = value;
+    }, debounceTime), [permanentFilterSignature]);
+    return {
+        filter: filter ?? defaultFilter,
+        setFilter,
+    };
+};