@strato-admin/faker-ecommerce 0.1.1 → 0.3.0

package/dist/ra-core/src/controller/input/useReferenceArrayInputController.js

@@ -0,0 +1,137 @@
+import { useCallback, useMemo } from 'react';
+import { useFormContext, useWatch } from 'react-hook-form';
+import { useGetList, useGetManyAggregate } from '../../dataProvider';
+import { useReferenceParams } from './useReferenceParams';
+import { useWrappedSource } from '../../core';
+/**
+ * Prepare data for the ReferenceArrayInput components
+ *
+ * @example
+ *
+ * const { allChoices, availableChoices, selectedChoices, error, isFetching, isLoading, isPending } = useReferenceArrayInputController({
+ *      record: { referenceIds: ['id1', 'id2']};
+ *      reference: 'reference';
+ *      resource: 'resource';
+ *      source: 'referenceIds';
+ * });
+ *
+ * @param {Object} props
+ * @param {Object} props.record The current resource record
+ * @param {string} props.reference The linked resource name
+ * @param {string} props.resource The current resource name
+ * @param {string} props.source The key of the linked resource identifier
+ *
+ * @param {Props} props
+ *
+ * @return {Object} controllerProps Fetched data and callbacks for the ReferenceArrayInput components
+ */
+export const useReferenceArrayInputController = (props) => {
+    const { debounce, enableGetChoices, filter, page: initialPage = 1, perPage: initialPerPage = 25, sort: initialSort = { field: 'id', order: 'DESC' }, queryOptions = {}, reference, source, } = props;
+    const { getValues } = useFormContext();
+    const finalSource = useWrappedSource(source);
+    // When we change the defaultValue of the child input using react-hook-form resetField function,
+    // useWatch does not seem to get the new value. We fallback to getValues to get it.
+    const value = useWatch({ name: finalSource }) ?? getValues(finalSource);
+    const { meta, ...otherQueryOptions } = queryOptions;
+    /**
+     * Get the records related to the current value (with getMany)
+     */
+    const { data: referenceRecords, error: errorGetMany, isLoading: isLoadingGetMany, isFetching: isFetchingGetMany, isPaused: isPausedGetMany, isPending: isPendingGetMany, isPlaceholderData: isPlaceholderDataGetMany, refetch: refetchGetMany, } = useGetManyAggregate(reference, {
+        ids: value || EmptyArray,
+        meta,
+    }, {
+        enabled: value != null && value.length > 0,
+    });
+    const [params, paramsModifiers] = useReferenceParams({
+        resource: reference,
+        page: initialPage,
+        perPage: initialPerPage,
+        sort: initialSort,
+        debounce,
+        filter,
+    });
+    // filter out not found references - happens when the dataProvider doesn't guarantee referential integrity
+    const finalReferenceRecords = referenceRecords
+        ? referenceRecords.filter(Boolean)
+        : [];
+    const isGetMatchingEnabled = enableGetChoices
+        ? enableGetChoices(params.filterValues)
+        : true;
+    const { data: matchingReferences, total, pageInfo, error: errorGetList, isLoading: isLoadingGetList, isFetching: isFetchingGetList, isPaused: isPausedGetList, isPending: isPendingGetList, isPlaceholderData: isPlaceholderDataGetList, refetch: refetchGetMatching, } = useGetList(reference, {
+        pagination: {
+            page: params.page,
+            perPage: params.perPage,
+        },
+        sort: { field: params.sort, order: params.order },
+        filter: { ...params.filter, ...filter },
+        meta,
+    }, {
+        retry: false,
+        enabled: isGetMatchingEnabled,
+        placeholderData: previousData => previousData,
+        ...otherQueryOptions,
+    });
+    // We merge the currently selected records with the matching ones, otherwise
+    // the component displaying the currently selected records may fail
+    const finalMatchingReferences = matchingReferences && matchingReferences.length > 0
+        ? mergeReferences(matchingReferences, finalReferenceRecords)
+        : finalReferenceRecords.length > 0
+            ? finalReferenceRecords
+            : matchingReferences;
+    const refetch = useCallback(() => {
+        refetchGetMany();
+        refetchGetMatching();
+    }, [refetchGetMany, refetchGetMatching]);
+    const currentSort = useMemo(() => ({
+        field: params.sort,
+        order: params.order,
+    }), [params.sort, params.order]);
+    return {
+        sort: currentSort,
+        allChoices: finalMatchingReferences,
+        availableChoices: matchingReferences,
+        selectedChoices: finalReferenceRecords,
+        displayedFilters: params.displayedFilters,
+        error: errorGetMany || errorGetList,
+        filter,
+        filterValues: params.filterValues,
+        hideFilter: paramsModifiers.hideFilter,
+        isFetching: isFetchingGetMany || isFetchingGetList,
+        isLoading: isLoadingGetMany || isLoadingGetList,
+        isPaused: isPausedGetMany || isPausedGetList,
+        isPending: isPendingGetMany || isPendingGetList,
+        isPlaceholderData: isPlaceholderDataGetMany || isPlaceholderDataGetList,
+        page: params.page,
+        perPage: params.perPage,
+        refetch,
+        resource: reference,
+        setFilters: paramsModifiers.setFilters,
+        setPage: paramsModifiers.setPage,
+        setPerPage: paramsModifiers.setPerPage,
+        setSort: paramsModifiers.setSort,
+        showFilter: paramsModifiers.showFilter,
+        // we return source and not finalSource because child inputs (e.g. AutocompleteArrayInput) already call useInput and compute the final source
+        source,
+        total: total,
+        hasNextPage: pageInfo
+            ? pageInfo.hasNextPage
+            : total != null
+                ? params.page * params.perPage < total
+                : undefined,
+        hasPreviousPage: pageInfo ? pageInfo.hasPreviousPage : params.page > 1,
+        isFromReference: true,
+    };
+};
+const EmptyArray = [];
+// concatenate and deduplicate two lists of records
+const mergeReferences = (ref1, ref2) => {
+    const res = [...ref1];
+    const ids = ref1.map(ref => ref.id);
+    ref2.forEach(ref => {
+        if (!ids.includes(ref.id)) {
+            ids.push(ref.id);
+            res.push(ref);
+        }
+    });
+    return res;
+};

package/dist/ra-core/src/controller/input/useReferenceInputController.d.ts

@@ -0,0 +1,54 @@
+import { type UseQueryOptions } from '@tanstack/react-query';
+import type { FilterPayload, GetListResult, RaRecord, SortPayload } from '../../types';
+import type { ChoicesContextValue } from '../../form';
+/**
+ * A hook for choosing a reference record. Useful for foreign keys.
+ *
+ * This hook fetches the possible values in the reference resource
+ * (using `dataProvider.getList()`), it returns the possible choices
+ * as the `choices` attribute.
+ *
+ * @example
+ * const {
+ *      choices, // the available reference resource
+ * } = useReferenceInputController({
+ *      input, // the input props
+ *      resource: 'comments',
+ *      reference: 'posts',
+ *      source: 'post_id',
+ * });
+ *
+ * The hook also allow to filter results. It returns a `setFilters`
+ * function. It uses the value to create a filter for the query.
+ * You can also add a permanentFilter to further filter the result:
+ *
+ * @example
+ * const {
+ *      choices, // the available reference resource
+ *      setFilter,
+ * } = useReferenceInputController({
+ *      input, // the input props
+ *      resource: 'comments',
+ *      reference: 'posts',
+ *      source: 'post_id',
+ *      permanentFilter: {
+ *          author: 'john'
+ *      },
+ * });
+ */
+export declare const useReferenceInputController: <RecordType extends RaRecord = any>(props: UseReferenceInputControllerParams<RecordType>) => ChoicesContextValue<RecordType>;
+export interface UseReferenceInputControllerParams<RecordType extends RaRecord = any> {
+    debounce?: number;
+    filter?: FilterPayload;
+    queryOptions?: Omit<UseQueryOptions<GetListResult<RecordType> | RecordType[]>, 'queryFn' | 'queryKey'> & {
+        meta?: any;
+    };
+    page?: number;
+    perPage?: number;
+    record?: RaRecord;
+    reference: string;
+    resource?: string;
+    sort?: SortPayload;
+    source: string;
+    enableGetChoices?: (filters: any) => boolean;
+}

package/dist/ra-core/src/controller/input/useReferenceInputController.js

@@ -0,0 +1,208 @@
+import { useCallback, useEffect, useMemo, useState } from 'react';
+import { useWatch } from 'react-hook-form';
+import { keepPreviousData } from '@tanstack/react-query';
+import { useGetList } from '../../dataProvider';
+import { useReference } from '../useReference';
+import { useReferenceParams } from './useReferenceParams';
+import { useWrappedSource } from '../../core';
+/**
+ * A hook for choosing a reference record. Useful for foreign keys.
+ *
+ * This hook fetches the possible values in the reference resource
+ * (using `dataProvider.getList()`), it returns the possible choices
+ * as the `choices` attribute.
+ *
+ * @example
+ * const {
+ *      choices, // the available reference resource
+ * } = useReferenceInputController({
+ *      input, // the input props
+ *      resource: 'comments',
+ *      reference: 'posts',
+ *      source: 'post_id',
+ * });
+ *
+ * The hook also allow to filter results. It returns a `setFilters`
+ * function. It uses the value to create a filter for the query.
+ * You can also add a permanentFilter to further filter the result:
+ *
+ * @example
+ * const {
+ *      choices, // the available reference resource
+ *      setFilter,
+ * } = useReferenceInputController({
+ *      input, // the input props
+ *      resource: 'comments',
+ *      reference: 'posts',
+ *      source: 'post_id',
+ *      permanentFilter: {
+ *          author: 'john'
+ *      },
+ * });
+ */
+export const useReferenceInputController = (props) => {
+    const { debounce, enableGetChoices, filter, page: initialPage = 1, perPage: initialPerPage = 25, sort: initialSort, queryOptions = {}, reference, source, } = props;
+    const { meta, ...otherQueryOptions } = queryOptions;
+    const [params, paramsModifiers] = useReferenceParams({
+        resource: reference,
+        page: initialPage,
+        perPage: initialPerPage,
+        sort: initialSort,
+        debounce,
+        filter,
+    });
+    // selection logic
+    const finalSource = useWrappedSource(source);
+    const currentValue = useWatch({ name: finalSource });
+    const isGetMatchingEnabled = enableGetChoices
+        ? enableGetChoices(params.filterValues)
+        : true;
+    // fetch possible values
+    const { data: possibleValuesData, total, pageInfo, isFetching: isFetchingPossibleValues, isLoading: isLoadingPossibleValues, isPaused: isPausedPossibleValues, isPending: isPendingPossibleValues, isPlaceholderData: isPlaceholderDataPossibleValues, error: errorPossibleValues, refetch: refetchGetList, } = useGetList(reference, {
+        pagination: {
+            page: params.page,
+            perPage: params.perPage,
+        },
+        sort: { field: params.sort, order: params.order },
+        filter: { ...params.filter, ...filter },
+        meta,
+    }, {
+        enabled: isGetMatchingEnabled,
+        placeholderData: keepPreviousData,
+        ...otherQueryOptions,
+    });
+    // fetch current value
+    const { referenceRecord: currentReferenceRecord, refetch: refetchReference, error: errorReference, isLoading: isLoadingReference, isFetching: isFetchingReference, isPaused: isPausedReference, isPending: isPendingReference, isPlaceholderData: isPlaceholderDataReference, } = useReference({
+        id: currentValue,
+        reference,
+        // @ts-ignore the types of the queryOptions for the getMAny and getList are not compatible
+        options: {
+            enabled: currentValue != null && currentValue !== '',
+            meta,
+            ...otherQueryOptions,
+        },
+    });
+    const isPending = 
+    // The reference query isn't enabled when there is no value yet but as it has no data, react-query will flag it as pending
+    (currentValue != null && currentValue !== '' && isPendingReference) ||
+        isPendingPossibleValues;
+    const isPaused = isPausedReference || isPausedPossibleValues;
+    // We need to delay the update of the referenceRecord and the finalData
+    // to the next React state update, because otherwise it can raise a warning
+    // with AutocompleteInput saying the current value is not in the list of choices
+    const [referenceRecord, setReferenceRecord] = useState(undefined);
+    useEffect(() => {
+        setReferenceRecord(currentReferenceRecord);
+    }, [currentReferenceRecord]);
+    // add current value to possible sources
+    const { finalData, finalTotal } = useMemo(() => {
+        if (isPaused && possibleValuesData == null && referenceRecord == null) {
+            return {
+                finalData: null,
+                finalTotal: null,
+            };
+        }
+        if (referenceRecord == null ||
+            possibleValuesData == null ||
+            (possibleValuesData ?? []).find(record => record.id === referenceRecord.id)) {
+            // Here we might have the referenceRecord but no data (because of enableGetChoices for instance)
+            const finalData = possibleValuesData ?? [];
+            if (referenceRecord &&
+                finalData.find(r => r.id === referenceRecord.id) == null) {
+                finalData.push(referenceRecord);
+            }
+            return {
+                finalData,
+                finalTotal: total ?? finalData.length,
+            };
+        }
+        else {
+            return {
+                finalData: [referenceRecord, ...(possibleValuesData ?? [])],
+                finalTotal: total == null ? undefined : total + 1,
+            };
+        }
+    }, [isPaused, referenceRecord, possibleValuesData, total]);
+    const refetch = useCallback(() => {
+        refetchGetList();
+        refetchReference();
+    }, [refetchGetList, refetchReference]);
+    const currentSort = useMemo(() => ({
+        field: params.sort,
+        order: params.order,
+    }), [params.sort, params.order]);
+    return useMemo(() => ({
+        sort: currentSort,
+        // TODO v6: we shouldn't return a default empty array. This is actually enforced at the type level in other hooks such as useListController
+        allChoices: finalData ?? [],
+        // TODO v6: same as above
+        availableChoices: possibleValuesData ?? [],
+        // TODO v6: same as above
+        selectedChoices: referenceRecord ? [referenceRecord] : [],
+        displayedFilters: params.displayedFilters,
+        error: errorReference || errorPossibleValues,
+        filter: params.filter,
+        filterValues: params.filterValues,
+        hideFilter: paramsModifiers.hideFilter,
+        isFetching: isFetchingReference || isFetchingPossibleValues,
+        isLoading: isLoadingReference || isLoadingPossibleValues,
+        isPaused: isPausedReference || isPausedPossibleValues,
+        isPending,
+        isPlaceholderData: isPlaceholderDataReference ||
+            isPlaceholderDataPossibleValues,
+        page: params.page,
+        perPage: params.perPage,
+        refetch,
+        resource: reference,
+        setFilters: paramsModifiers.setFilters,
+        setPage: paramsModifiers.setPage,
+        setPerPage: paramsModifiers.setPerPage,
+        setSort: paramsModifiers.setSort,
+        showFilter: paramsModifiers.showFilter,
+        // we return source and not finalSource because child inputs (e.g. AutocompleteInput) already call useInput and compute the final source
+        source,
+        total: finalTotal,
+        hasNextPage: pageInfo
+            ? pageInfo.hasNextPage
+            : total != null
+                ? params.page * params.perPage < total
+                : undefined,
+        hasPreviousPage: pageInfo
+            ? pageInfo.hasPreviousPage
+            : params.page > 1,
+        isFromReference: true,
+    }), [
+        currentSort,
+        errorPossibleValues,
+        errorReference,
+        finalData,
+        finalTotal,
+        isFetchingPossibleValues,
+        isFetchingReference,
+        isLoadingPossibleValues,
+        isLoadingReference,
+        isPausedPossibleValues,
+        isPausedReference,
+        isPending,
+        isPlaceholderDataReference,
+        isPlaceholderDataPossibleValues,
+        pageInfo,
+        params.displayedFilters,
+        params.filter,
+        params.filterValues,
+        params.page,
+        params.perPage,
+        paramsModifiers.hideFilter,
+        paramsModifiers.setFilters,
+        paramsModifiers.setPage,
+        paramsModifiers.setPerPage,
+        paramsModifiers.setSort,
+        paramsModifiers.showFilter,
+        possibleValuesData,
+        reference,
+        referenceRecord,
+        refetch,
+        source,
+        total,
+    ]);
+};

package/dist/ra-core/src/controller/input/useReferenceParams.d.ts

@@ -0,0 +1,106 @@
+import { SortPayload, FilterPayload } from '../../types';
+/**
+ * Get the reference inputs parameters (page, sort, filters) and modifiers.
+ *
+ * @returns {Array} A tuple [parameters, modifiers].
+ * Destructure as [
+ *    { page, perPage, sort, order, filter, filterValues, displayedFilters, requestSignature },
+ *    { setFilters, hideFilter, showFilter, setPage, setPerPage, setSort }
+ * ]
+ *
+ * @example
+ *
+ * const [referenceParams, referenceParamsActions] = useReferenceParams({
+ *      resource: 'posts',
+ *      filterDefaultValues: {
+ *          published: true
+ *      },
+ *      sort: {
+ *          field: 'published_at',
+ *          order: 'DESC'
+ *      },
+ *      perPage: 25
+ * });
+ *
+ * const {
+ *      page,
+ *      perPage,
+ *      sort,
+ *      order,
+ *      filter,
+ *      filterValues,
+ *      displayedFilters,
+ *      requestSignature
+ * } = referenceParams;
+ *
+ * const {
+ *      setFilters,
+ *      hideFilter,
+ *      showFilter,
+ *      setPage,
+ *      setPerPage,
+ *      setSort,
+ * } = referenceParamsActions;
+ */
+export declare const useReferenceParams: ({ resource, filter, sort, page, perPage, debounce, }: ReferenceParamsOptions) => [Parameters, Modifiers];
+export declare const validQueryParams: string[];
+/**
+ * Merge list params from 2 different sources:
+ *   - the params stored in the local state
+ *   - the props passed to the List component (including the filter defaultValues)
+ */
+export declare const getQuery: ({ params, filterDefaultValues, sort, page, perPage, }: {
+    params: any;
+    filterDefaultValues: any;
+    sort: any;
+    page: any;
+    perPage: any;
+}) => ReferenceParams;
+/**
+ * Check if user has already set custom sort, page, or filters for this list
+ *
+ * User params come from the Redux store as the params props. By default,
+ * this object is:
+ *
+ * { filter: {}, order: null, page: 1, perPage: null, sort: null }
+ *
+ * To check if the user has custom params, we must compare the params
+ * to these initial values.
+ *
+ * @param {Object} params
+ */
+export declare const hasCustomParams: (params: ReferenceParams) => any;
+export declare const getNumberOrDefault: (possibleNumber: string | number | undefined, defaultValue: number) => number;
+export interface ReferenceParamsOptions {
+    resource: string;
+    page?: number;
+    perPage?: number;
+    sort?: SortPayload;
+    filter?: FilterPayload;
+    debounce?: number;
+}
+export interface ReferenceParams {
+    sort: string;
+    order: 'ASC' | 'DESC';
+    page: number;
+    perPage: number;
+    filter: any;
+    displayedFilters: any;
+}
+interface Parameters extends ReferenceParams {
+    filterValues: object;
+    displayedFilters: {
+        [key: string]: boolean;
+    };
+    requestSignature: any[];
+}
+interface Modifiers {
+    changeParams: (action: any) => void;
+    setPage: (page: number) => void;
+    setPerPage: (pageSize: number) => void;
+    setSort: (sort: SortPayload) => void;
+    setFilters: (filters: any, displayedFilters?: any, debounce?: boolean) => void;
+    hideFilter: (filterName: string) => void;
+    showFilter: (filterName: string, defaultValue: any) => void;
+}
+export {};