ra-core
Version:
Core components of react-admin, a frontend Framework for building admin applications on top of REST services, using ES6, React
180 lines • 7.38 kB
JavaScript
"use strict";
Object.defineProperty(exports, "__esModule", { value: true });
exports.useInfiniteListController = void 0;
const react_1 = require("react");
const auth_1 = require("../../auth/index.cjs");
const i18n_1 = require("../../i18n/index.cjs");
const notification_1 = require("../../notification/index.cjs");
const dataProvider_1 = require("../../dataProvider/index.cjs");
const export_1 = require("../../export/index.cjs");
const core_1 = require("../../core/index.cjs");
const useRecordSelection_1 = require("./useRecordSelection.cjs");
const useListParams_1 = require("./useListParams.cjs");
const useSelectAll_1 = require("./useSelectAll.cjs");
const util_1 = require("../../util/index.cjs");
/**
* Prepare data for the InfiniteList view
*
* @param {Object} props The props passed to the InfiniteList component.
*
* @return {Object} controllerProps Fetched and computed data for the List view
*
* @example
*
* import { useInfiniteListController } from 'react-admin';
* import ListView from './ListView';
*
* const MyList = props => {
* const controllerProps = useInfiniteListController(props);
* return <ListView {...controllerProps} {...props} />;
* }
*/
const useInfiniteListController = (props = {}) => {
const { debounce = 500, disableAuthentication = false, disableSyncWithLocation = false, exporter = export_1.defaultExporter, filter, filterDefaultValues, perPage = 10, queryOptions, sort, storeKey, } = props;
const resource = (0, core_1.useResourceContext)(props);
const { meta, ...otherQueryOptions } = queryOptions ?? {};
if (!resource) {
throw new Error(`<InfiniteList> was called outside of a ResourceContext and without a resource prop. You must set the resource prop.`);
}
if (filter && (0, react_1.isValidElement)(filter)) {
throw new Error('<InfiniteList> received a React element as `filter` props. If you intended to set the list filter elements, use the `filters` (with an s) prop instead. The `filter` prop is internal and should not be set by the developer.');
}
const { isPending: isPendingAuthenticated } = (0, auth_1.useAuthenticated)({
enabled: !disableAuthentication,
});
const { isPending: isPendingCanAccess } = (0, auth_1.useRequireAccess)({
action: 'list',
resource,
enabled: !disableAuthentication && !isPendingAuthenticated,
});
const translate = (0, i18n_1.useTranslate)();
const notify = (0, notification_1.useNotify)();
const dataProvider = (0, dataProvider_1.useDataProvider)();
const [query, queryModifiers] = (0, useListParams_1.useListParams)({
debounce,
disableSyncWithLocation,
filterDefaultValues,
perPage,
resource,
sort,
storeKey,
});
const [selectedIds, selectionModifiers] = (0, useRecordSelection_1.useRecordSelection)({ resource });
const onUnselectItems = (0, react_1.useCallback)((fromAllStoreKeys) => {
return selectionModifiers.unselect(selectedIds, fromAllStoreKeys);
}, [selectedIds, selectionModifiers]);
const { data, total, error, isLoading, isPaused, isPending, isPlaceholderData, isFetching, hasNextPage, hasPreviousPage, fetchNextPage, isFetchingNextPage, fetchPreviousPage, isFetchingPreviousPage, refetch, meta: responseMeta, } = (0, dataProvider_1.useInfiniteGetList)(resource, {
pagination: {
page: query.page,
perPage: query.perPage,
},
sort: { field: query.sort, order: query.order },
filter: { ...query.filter, ...filter },
meta,
}, {
enabled: (!isPendingAuthenticated && !isPendingCanAccess) ||
disableAuthentication,
placeholderData: previousData => previousData,
retry: false,
onError: error => notify(error?.message || 'ra.notification.http_error', {
type: 'error',
messageArgs: {
_: error?.message,
},
}),
...otherQueryOptions,
});
const onSelectAll = (0, useSelectAll_1.useSelectAll)({
resource,
sort: { field: query.sort, order: query.order },
filter: { ...query.filter, ...filter },
});
// change page if there is no data
(0, react_1.useEffect)(() => {
if (query.page <= 0 ||
(!isFetching &&
query.page > 1 &&
(data == null || data?.pages.length === 0))) {
// Query for a page that doesn't exist, set page to 1
queryModifiers.setPage(1);
return;
}
if (total == null) {
return;
}
const totalPages = Math.ceil(total / query.perPage) || 1;
if (!isFetching && query.page > totalPages) {
// Query for a page out of bounds, set page to the last existing page
// It occurs when deleting the last element of the last page
queryModifiers.setPage(totalPages);
}
}, [isFetching, query.page, query.perPage, data, queryModifiers, total]);
const currentSort = (0, react_1.useMemo)(() => ({
field: query.sort,
order: query.order,
}), [query.sort, query.order]);
const getResourceLabel = (0, core_1.useGetResourceLabel)();
const defaultTitle = translate(`resources.${resource}.page.list`, {
_: translate('ra.page.list', {
name: getResourceLabel(resource, 2),
}),
});
const unwrappedData = (0, react_1.useMemo)(() => data?.pages?.reduce((acc, page) => [...acc, ...page.data], []), [data]);
const getData = (0, util_1.useEvent)(async ({ maxResults, meta: metaOverride } = {}) => {
if (total === 0) {
return [];
}
const limit = maxResults ?? (total != null ? total : DEFAULT_MAX_RESULTS);
const { data } = await dataProvider.getList(resource, {
sort: currentSort,
filter: filter
? { ...query.filterValues, ...filter }
: query.filterValues,
pagination: { page: 1, perPage: limit },
meta: metaOverride ?? meta,
});
return data;
});
return {
sort: currentSort,
data: unwrappedData,
defaultTitle,
displayedFilters: query.displayedFilters,
error,
exporter,
filter,
filterValues: query.filterValues,
hideFilter: queryModifiers.hideFilter,
isFetching,
isLoading,
isPaused,
isPending,
isPlaceholderData,
onSelect: selectionModifiers.select,
onSelectAll,
onToggleItem: selectionModifiers.toggle,
onUnselectItems,
page: query.page,
perPage: query.perPage,
refetch,
resource,
selectedIds,
setFilters: queryModifiers.setFilters,
setPage: queryModifiers.setPage,
setPerPage: queryModifiers.setPerPage,
setSort: queryModifiers.setSort,
showFilter: queryModifiers.showFilter,
total: total,
hasNextPage,
hasPreviousPage,
fetchNextPage,
isFetchingNextPage,
fetchPreviousPage,
isFetchingPreviousPage,
meta: responseMeta,
getData,
};
};
exports.useInfiniteListController = useInfiniteListController;
const DEFAULT_MAX_RESULTS = 1000;
//# sourceMappingURL=useInfiniteListController.js.map