RelationInputWrapper: Do not attempt fetching relations, if count == 0

This commit is contained in:
Gustav Hansen 2022-09-12 09:41:37 +02:00
parent 3f72ff3a73
commit 29e2e43132
3 changed files with 12 additions and 7 deletions

View File

@ -28,9 +28,11 @@ export const RelationInputWrapper = ({
const { formatMessage } = useIntl();
const { connectRelation, disconnectRelation, loadRelation, modifiedData, slug, initialData } =
useCMEditViewDataManager();
const relationsCount = initialData[name]?.count ?? 0;
const { relations, search, searchFor } = useRelation(`${slug}-${name}-${initialData?.id ?? ''}`, {
relation: {
enabled: relationsCount > 0 && !!endpoints.relation,
endpoint: endpoints.relation,
onLoad(data) {
loadRelation({ target: { name, value: data.results } });
@ -51,15 +53,18 @@ export const RelationInputWrapper = ({
},
});
// TODO: we should initialize the empty connect/ disconnect
// arrays before adding the first relation to it instead of
// calling loadRelation()
useEffect(() => {
if (!endpoints.relation) {
loadRelation({ target: { name, value: [] } });
}
}, [loadRelation, name, endpoints.relation]);
useEffect(() => {
if (relationsCount === 0 || !!endpoints.relation) {
loadRelation({ target: { name, value: [] } });
}
}, [relationsCount, endpoints.relation, loadRelation, name]);
const isMorph = useMemo(() => relationType.toLowerCase().includes('morph'), [relationType]);
const isSingleRelation = [
'oneWay',
@ -122,7 +127,7 @@ export const RelationInputWrapper = ({
id: intlLabel.id,
defaultMessage: `${intlLabel.defaultMessage} ({numberOfEntries})`,
},
{ numberOfEntries: initialData[name]?.count ?? 0 }
{ numberOfEntries: relationsCount }
)}
labelLoadMore={
// TODO: only display if there are more; derive from count

View File

@ -118,8 +118,8 @@ describe('useRelation', () => {
});
});
test('doesn not fetch relations if a relation endpoint was not passed', async () => {
await setup(undefined, { relation: { endpoint: undefined } });
test('doesn not fetch relations if it was not enabled', async () => {
await setup(undefined, { relation: { enabled: false } });
expect(axiosInstance.get).not.toBeCalled();
});

View File

@ -38,7 +38,7 @@ export const useRelation = (cacheKey, { relation, search }) => {
};
const relationsRes = useInfiniteQuery(['relation', cacheKey], fetchRelations, {
enabled: !!relation?.endpoint,
enabled: !!relation?.enabled ?? true,
getNextPageParam(lastPage) {
// the API may send an empty 204 response
if (!lastPage || lastPage.pagination.page >= lastPage.pagination.pageCount) {