ra-core
Version:
Core components of react-admin, a frontend Framework for building admin applications on top of REST services, using ES6, React
98 lines • 4.17 kB
JavaScript
;
Object.defineProperty(exports, "__esModule", { value: true });
exports.useRecordSelection = void 0;
const react_1 = require("react");
const store_1 = require("../../store/index.cjs");
/**
* Get the list of selected items for a resource, and callbacks to change the selection
*
* @param args.resource The resource name, e.g. 'posts'
* @param args.storeKey The key to use to store selected items. Pass false to disable synchronization with the store.
* @param args.disableSyncWithStore Controls the selection synchronization with the store
*
* @returns {Object} Destructure as [selectedIds, { select, unselect, toggle, clearSelection }].
*/
const useRecordSelection = (args) => {
const { resource = '', storeKey, disableSyncWithStore } = args;
const finalStoreKey = `${storeKey || resource}.selectedIds`;
const [localSelectionStore, setLocalSelectionStore] = (0, react_1.useState)(defaultIds);
// As we can't conditionally call a hook, if the disableSyncWithStore is true,
// we'll ignore the useStore values later on and won't call set functions either.
const [selectionStore, setSelectionStore] = (0, store_1.useStore)(finalStoreKey, defaultIds);
const [storeKeys, setStoreKeys] = (0, store_1.useStore)(`${resource}.selectedIds.storeKeys`, defaultStoreKeys);
(0, react_1.useEffect)(function addStoreKeyToStore() {
if (!disableSyncWithStore && storeKey) {
setStoreKeys(storeKeys => {
if (!storeKeys.includes(finalStoreKey)) {
return [...storeKeys, finalStoreKey];
}
else {
return storeKeys;
}
});
}
}, [disableSyncWithStore, finalStoreKey, setStoreKeys, storeKey]);
const { getItem, setItem } = (0, store_1.useStoreContext)();
const ids = disableSyncWithStore ? localSelectionStore : selectionStore;
const setStore = (0, react_1.useMemo)(() => disableSyncWithStore ? setLocalSelectionStore : setSelectionStore, [disableSyncWithStore, setSelectionStore]);
const selectionModifiers = (0, react_1.useMemo)(() => ({
select: (idsToSelect) => {
if (!idsToSelect)
return;
setStore(idsToSelect);
},
unselect(idsToRemove, fromAllStoreKeys) {
if (!idsToRemove || idsToRemove.length === 0)
return;
setStore(ids => ids.filter(id => !idsToRemove.includes(id)));
if (!disableSyncWithStore && fromAllStoreKeys) {
storeKeys
.filter(storeKey => storeKey !== finalStoreKey)
.forEach(storeKey => {
const ids = getItem(storeKey);
if (ids) {
setItem(storeKey, ids.filter(id => !idsToRemove.includes(id)));
}
});
}
},
toggle: (id) => {
if (typeof id === 'undefined')
return;
setStore(ids => {
if (!Array.isArray(ids))
return [...ids];
const index = ids.indexOf(id);
const hasId = index > -1;
return hasId
? [...ids.slice(0, index), ...ids.slice(index + 1)]
: [...ids, id];
});
},
clearSelection: (fromAllStoreKeys) => {
setStore(defaultIds);
if (!disableSyncWithStore && fromAllStoreKeys) {
storeKeys
.filter(storeKey => storeKey !== finalStoreKey)
.forEach(storeKey => {
const ids = getItem(storeKey);
if (ids) {
setItem(storeKey, defaultIds);
}
});
}
},
}), [
disableSyncWithStore,
finalStoreKey,
getItem,
setItem,
setStore,
storeKeys,
]);
return [ids, selectionModifiers];
};
exports.useRecordSelection = useRecordSelection;
const defaultIds = [];
const defaultStoreKeys = [];
//# sourceMappingURL=useRecordSelection.js.map