pl-fe: refactor for code reuse
Signed-off-by: mkljczk <git@mkljczk.pl>
This commit is contained in:
parent
5efacc274f
commit
4f95b1617c
7 changed files with 64 additions and 84 deletions
|
@ -2,7 +2,8 @@
|
|||
import { type InfiniteData, useInfiniteQuery, useMutation } from '@tanstack/react-query';
|
||||
|
||||
import { importEntities } from 'pl-fe/actions/importer';
|
||||
import { minifyList } from 'pl-fe/api/normalizers/minify-list';
|
||||
import { makePaginatedResponseQuery } from 'pl-fe/api/utils/make-paginated-response-query';
|
||||
import { minifyList } from 'pl-fe/api/utils/minify-list';
|
||||
import { useClient } from 'pl-fe/hooks/use-client';
|
||||
import { queryClient } from 'pl-fe/queries/client';
|
||||
import { store } from 'pl-fe/store';
|
||||
|
@ -24,17 +25,10 @@ const removeRequest = (statusId: string, accountId: string) =>
|
|||
pages: data.pages.map(({ items, ...page }) => ({ ...page, items: items.filter(({ account_id }) => account_id !== accountId) })),
|
||||
} : undefined);
|
||||
|
||||
const useEventParticipationRequests = (statusId: string) => {
|
||||
const client = useClient();
|
||||
|
||||
return useInfiniteQuery({
|
||||
queryKey: ['accountsLists', 'eventParticipationRequests', statusId],
|
||||
queryFn: ({ pageParam }) => pageParam.next?.() || client.events.getEventParticipationRequests(statusId).then(minifyRequestList),
|
||||
initialPageParam: { previous: null, next: null, items: [], partial: false } as MinifiedRequestList,
|
||||
getNextPageParam: (page) => page.next ? page : undefined,
|
||||
select: (data) => data.pages.map(page => page.items).flat(),
|
||||
});
|
||||
};
|
||||
const useEventParticipationRequests = makePaginatedResponseQuery(
|
||||
(statusId: string) => ['accountsLists', 'eventParticipationRequests', statusId],
|
||||
(client, params) => client.events.getEventParticipationRequests(...params).then(minifyRequestList),
|
||||
);
|
||||
|
||||
const useAcceptEventParticipationRequestMutation = (statusId: string, accountId: string) => {
|
||||
const client = useClient();
|
||||
|
|
|
@ -1,21 +1,9 @@
|
|||
import { makePaginatedResponseQuery } from 'pl-fe/api/utils/make-paginated-response-query';
|
||||
import { minifyAccountList } from 'pl-fe/api/utils/minify-list';
|
||||
|
||||
import { useInfiniteQuery } from '@tanstack/react-query';
|
||||
|
||||
import { minifyAccountList } from 'pl-fe/api/normalizers/minify-list';
|
||||
import { useClient } from 'pl-fe/hooks/use-client';
|
||||
|
||||
import type { PaginatedResponse } from 'pl-api';
|
||||
|
||||
const useEventParticipations = (statusId: string) => {
|
||||
const client = useClient();
|
||||
|
||||
return useInfiniteQuery({
|
||||
queryKey: ['accountsLists', 'eventParticipations', statusId],
|
||||
queryFn: ({ pageParam }) => pageParam.next?.() || client.events.getEventParticipations(statusId).then(minifyAccountList),
|
||||
initialPageParam: { previous: null, next: null, items: [], partial: false } as PaginatedResponse<string>,
|
||||
getNextPageParam: (page) => page.next ? page : undefined,
|
||||
select: (data) => data.pages.map(page => page.items).flat(),
|
||||
});
|
||||
};
|
||||
const useEventParticipations = makePaginatedResponseQuery(
|
||||
(statusId: string) => ['accountsLists', 'eventParticipations', statusId],
|
||||
(client, params) => client.events.getEventParticipations(...params).then(minifyAccountList),
|
||||
);
|
||||
|
||||
export { useEventParticipations };
|
||||
|
|
|
@ -1,7 +1,7 @@
|
|||
import { useMutation, type InfiniteData } from '@tanstack/react-query';
|
||||
|
||||
import { useInfiniteQuery, useMutation, type InfiniteData } from '@tanstack/react-query';
|
||||
|
||||
import { minifyAccountList } from 'pl-fe/api/normalizers/minify-list';
|
||||
import { makePaginatedResponseQuery } from 'pl-fe/api/utils/make-paginated-response-query';
|
||||
import { minifyAccountList } from 'pl-fe/api/utils/minify-list';
|
||||
import { useClient } from 'pl-fe/hooks/use-client';
|
||||
import { queryClient } from 'pl-fe/queries/client';
|
||||
|
||||
|
@ -23,17 +23,11 @@ const removeFollowRequest = (accountId: string) =>
|
|||
pages: data.pages.map(({ items, ...page }) => ({ ...page, items: items.filter((id) => id !== accountId) })),
|
||||
} : undefined);
|
||||
|
||||
const makeUseFollowRequests = <T>(select: ((data: InfiniteData<PaginatedResponse<string, true>, PaginatedResponse<string, true>>) => T)) => () => {
|
||||
const client = useClient();
|
||||
|
||||
return useInfiniteQuery({
|
||||
queryKey: ['accountsLists', 'followRequests'],
|
||||
queryFn: ({ pageParam }) => pageParam.next?.() || client.myAccount.getFollowRequests().then(minifyAccountList),
|
||||
initialPageParam: { previous: null, next: null, items: [], partial: false } as PaginatedResponse<string>,
|
||||
getNextPageParam: (page) => page.next ? page : undefined,
|
||||
select,
|
||||
});
|
||||
};
|
||||
const makeUseFollowRequests = <T>(select: ((data: InfiniteData<PaginatedResponse<string>>) => T)) => makePaginatedResponseQuery(
|
||||
() => ['accountsLists', 'followRequests'],
|
||||
(client) => client.myAccount.getFollowRequests().then(minifyAccountList),
|
||||
select,
|
||||
);
|
||||
|
||||
const useFollowRequests = makeUseFollowRequests((data) => data.pages.map(page => page.items).flat());
|
||||
|
||||
|
|
|
@ -1,33 +1,25 @@
|
|||
import { useInfiniteQuery, useQuery } from '@tanstack/react-query';
|
||||
import { useQuery } from '@tanstack/react-query';
|
||||
|
||||
import { importEntities } from 'pl-fe/actions/importer';
|
||||
import { minifyAccountList } from 'pl-fe/api/normalizers/minify-list';
|
||||
import { makePaginatedResponseQuery } from 'pl-fe/api/utils/make-paginated-response-query';
|
||||
import { minifyAccountList } from 'pl-fe/api/utils/minify-list';
|
||||
import { useAppDispatch } from 'pl-fe/hooks/use-app-dispatch';
|
||||
import { useClient } from 'pl-fe/hooks/use-client';
|
||||
|
||||
import type { PaginatedResponse } from 'pl-api';
|
||||
|
||||
const useStatusInteractions = (statusId: string, method: 'getDislikedBy' | 'getFavouritedBy' | 'getRebloggedBy') => {
|
||||
const client = useClient();
|
||||
|
||||
const queryKey = {
|
||||
getDislikedBy: 'statusDislikes',
|
||||
getFavouritedBy: 'statusFavourites',
|
||||
getRebloggedBy: 'statusReblogs',
|
||||
}[method];
|
||||
|
||||
return useInfiniteQuery({
|
||||
queryKey: ['accountsLists', queryKey, statusId],
|
||||
queryFn: ({ pageParam }) => pageParam.next?.() || client.statuses[method](statusId).then(minifyAccountList),
|
||||
initialPageParam: { previous: null, next: null, items: [], partial: false } as PaginatedResponse<string>,
|
||||
getNextPageParam: (page) => page.next ? page : undefined,
|
||||
select: (data) => data.pages.map(page => page.items).flat(),
|
||||
});
|
||||
const queryKey = {
|
||||
getDislikedBy: 'statusDislikes',
|
||||
getFavouritedBy: 'statusFavourites',
|
||||
getRebloggedBy: 'statusReblogs',
|
||||
};
|
||||
|
||||
const useStatusDislikes = (statusId: string) => useStatusInteractions(statusId, 'getDislikedBy');
|
||||
const useStatusFavourites = (statusId: string) => useStatusInteractions(statusId, 'getFavouritedBy');
|
||||
const useStatusReblogs = (statusId: string) => useStatusInteractions(statusId, 'getRebloggedBy');
|
||||
const makeUseStatusInteractions = (method: 'getDislikedBy' | 'getFavouritedBy' | 'getRebloggedBy') => makePaginatedResponseQuery(
|
||||
(statusId: string) => ['accountsLists', queryKey[method], statusId],
|
||||
(client, params) => client.statuses[method](...params).then(minifyAccountList),
|
||||
);
|
||||
|
||||
const useStatusDislikes = makeUseStatusInteractions('getDislikedBy');
|
||||
const useStatusFavourites = makeUseStatusInteractions('getFavouritedBy');
|
||||
const useStatusReblogs = makeUseStatusInteractions('getRebloggedBy');
|
||||
|
||||
const useStatusReactions = (statusId: string, emoji?: string) => {
|
||||
const client = useClient();
|
||||
|
|
|
@ -1,20 +1,9 @@
|
|||
import { useInfiniteQuery } from '@tanstack/react-query';
|
||||
import { makePaginatedResponseQuery } from 'pl-fe/api/utils/make-paginated-response-query';
|
||||
import { minifyStatusList } from 'pl-fe/api/utils/minify-list';
|
||||
|
||||
import { minifyStatusList } from 'pl-fe/api/normalizers/minify-list';
|
||||
import { useClient } from 'pl-fe/hooks/use-client';
|
||||
|
||||
import type { PaginatedResponse } from 'pl-api';
|
||||
|
||||
const useStatusQuotes = (statusId: string) => {
|
||||
const client = useClient();
|
||||
|
||||
return useInfiniteQuery({
|
||||
queryKey: ['statusLists', 'quotes', statusId],
|
||||
queryFn: ({ pageParam }) => pageParam.next?.() || client.statuses.getStatusQuotes(statusId).then(minifyStatusList),
|
||||
initialPageParam: { previous: null, next: null, items: [], partial: false } as PaginatedResponse<string>,
|
||||
getNextPageParam: (page) => page.next ? page : undefined,
|
||||
select: (data) => data.pages.map(page => page.items).flat(),
|
||||
});
|
||||
};
|
||||
const useStatusQuotes = makePaginatedResponseQuery(
|
||||
(statusId: string) => ['statusLists', 'quotes', statusId],
|
||||
(client, params) => client.statuses.getStatusQuotes(...params).then(minifyStatusList),
|
||||
);
|
||||
|
||||
export { useStatusQuotes };
|
||||
|
|
|
@ -0,0 +1,23 @@
|
|||
import { type InfiniteData, useInfiniteQuery } from '@tanstack/react-query';
|
||||
|
||||
import { useClient } from 'pl-fe/hooks/use-client';
|
||||
|
||||
import type { PaginatedResponse, PlApiClient } from 'pl-api';
|
||||
|
||||
const makePaginatedResponseQuery = <T1 extends Array<any>, T2, T3 = Array<T2>>(
|
||||
queryKey: (...params: T1) => string[],
|
||||
queryFn: (client: PlApiClient, params: T1) => Promise<PaginatedResponse<T2>>,
|
||||
select?: (data: InfiniteData<PaginatedResponse<T2>>) => T3,
|
||||
) => (...params: T1) => {
|
||||
const client = useClient();
|
||||
|
||||
return useInfiniteQuery({
|
||||
queryKey: queryKey(...params),
|
||||
queryFn: ({ pageParam }) => pageParam.next?.() || queryFn(client, params),
|
||||
initialPageParam: { previous: null, next: null, items: [], partial: false } as Awaited<ReturnType<typeof queryFn>>,
|
||||
getNextPageParam: (page) => page.next ? page : undefined,
|
||||
select: select ?? ((data) => data.pages.map(page => page.items).flat() as T3),
|
||||
});
|
||||
};
|
||||
|
||||
export { makePaginatedResponseQuery };
|
Loading…
Reference in a new issue