Update useGroups queries with EntityStore improvements

This commit is contained in:
Alex Gleason 2023-03-09 15:05:54 -06:00
parent fa2884c11b
commit 14a84e557c
No known key found for this signature in database
GPG key ID: 7211D1F99744FBB7
2 changed files with 21 additions and 51 deletions

View file

@ -1,36 +1,13 @@
import { useEffect } from 'react';
import { useEntities, useEntity } from 'soapbox/entity-store/hooks'; import { useEntities, useEntity } from 'soapbox/entity-store/hooks';
import { normalizeGroup, normalizeGroupRelationship } from 'soapbox/normalizers'; import { normalizeGroup, normalizeGroupRelationship } from 'soapbox/normalizers';
import type { Group, GroupRelationship } from 'soapbox/types/entities'; import type { Group, GroupRelationship } from 'soapbox/types/entities';
// HACK: normalizers currently don't have the desired API.
// TODO: rewrite normalizers as Zod parsers.
const parseGroup = (entity: unknown) => normalizeGroup(entity as Record<string, any>);
const parseGroupRelationship = (entity: unknown) => normalizeGroupRelationship(entity as Record<string, any>);
function useGroups() { function useGroups() {
const result = useEntities<Group>(['Group', ''], '/api/v1/groups', { parser: parseGroup }); const { entities, ...result } = useEntities<Group>(['Group', ''], '/api/v1/groups', { parser: parseGroup });
const { entities, isLoading, fetchEntities } = result; const { relationships } = useGroupRelationships(entities.map(entity => entity.id));
const { entities: relationships } = useGroupRelationships(entities.map(entity => entity.id));
// Note: we have to fetch them in the hook right now because I haven't implemented const groups = entities.map((group) => group.set('relationship', relationships[group.id] || null));
// max-age or cache expiry in the entity store yet. It's planned.
useEffect(() => {
if (!isLoading) {
fetchEntities();
}
}, []);
const groups = entities.map((group) => {
// TODO: a generalistic useRelationships() hook that returns a map of values (would be faster).
const relationship = relationships.find(r => r.id === group.id);
if (relationship) {
return group.set('relationship', relationship);
}
return group;
});
return { return {
...result, ...result,
@ -38,46 +15,39 @@ function useGroups() {
}; };
} }
function useGroup(groupId: string) { function useGroup(groupId: string, refetch = true) {
const result = useEntity<Group>(['Group', groupId], `/api/v1/groups/${groupId}`, { parser: parseGroup }); const { entity: group, ...result } = useEntity<Group>(['Group', groupId], `/api/v1/groups/${groupId}`, { parser: parseGroup, refetch });
const { entity, isLoading, fetchEntity } = result; const { entity: relationship } = useGroupRelationship(groupId);
const { relationship } = useGroupRelationship(groupId);
useEffect(() => {
if (!isLoading) {
fetchEntity();
}
}, []);
return { return {
...result, ...result,
group: entity?.set('relationship', relationship), group: group?.set('relationship', relationship || null),
}; };
} }
function useGroupRelationship(groupId: string) { function useGroupRelationship(groupId: string) {
const { relationships, ...rest } = useGroupRelationships([groupId]); return useEntity<GroupRelationship>(['GroupRelationship', groupId], `/api/v1/groups/relationships?id[]=${groupId}`, { parser: parseGroupRelationship });
return {
...rest,
relationship: relationships[0],
};
} }
function useGroupRelationships(groupIds: string[]) { function useGroupRelationships(groupIds: string[]) {
const q = groupIds.map(id => `id[]=${id}`).join('&'); const q = groupIds.map(id => `id[]=${id}`).join('&');
const result = useEntities<GroupRelationship>(['GroupRelationship', ''], `/api/v1/groups/relationships?${q}`, { parser: parseGroupRelationship }); const endpoint = groupIds.length ? `/api/v1/groups/relationships?${q}` : undefined;
const { entities, isLoading, fetchEntities } = result; const { entities, ...result } = useEntities<GroupRelationship>(['GroupRelationship', ''], endpoint, { parser: parseGroupRelationship });
useEffect(() => { const relationships = entities.reduce<Record<string, GroupRelationship>>((map, relationship) => {
if (!isLoading) { map[relationship.id] = relationship;
fetchEntities(); return map;
} }, {});
}, groupIds);
return { return {
...result, ...result,
relationships: entities, relationships,
}; };
} }
// HACK: normalizers currently don't have the desired API.
// TODO: rewrite normalizers as Zod parsers.
const parseGroup = (entity: unknown) => normalizeGroup(entity as Record<string, any>);
const parseGroupRelationship = (entity: unknown) => normalizeGroupRelationship(entity as Record<string, any>);
export { useGroup, useGroups }; export { useGroup, useGroups };

View file

@ -1,4 +1,4 @@
import { useGroups } from 'soapbox/queries/groups'; import { useGroups } from 'soapbox/hooks';
import { useFeatures } from './useFeatures'; import { useFeatures } from './useFeatures';