diff --git a/package.json b/package.json index b115b3386..dc688ed18 100644 --- a/package.json +++ b/package.json @@ -133,7 +133,7 @@ "multiselect-react-dropdown": "^2.0.25", "object-to-formdata": "^4.5.1", "path-browserify": "^1.0.1", - "pl-api": "^0.0.5", + "pl-api": "^0.0.6", "postcss": "^8.4.29", "process": "^0.11.10", "punycode": "^2.1.1", diff --git a/src/actions/security.ts b/src/actions/security.ts index 96235d2bf..2e7984fc4 100644 --- a/src/actions/security.ts +++ b/src/actions/security.ts @@ -50,7 +50,7 @@ const fetchOAuthTokens = () => dispatch({ type: FETCH_TOKENS_REQUEST }); return getClient(getState).settings.getOauthTokens().then((tokens) => { dispatch({ type: FETCH_TOKENS_SUCCESS, tokens }); - }).catch(() => { + }).catch((e) => { dispatch({ type: FETCH_TOKENS_FAIL }); }); }; diff --git a/src/api/hooks/accounts/useAccountList.ts b/src/api/hooks/accounts/useAccountList.ts index af567f611..81a5471d1 100644 --- a/src/api/hooks/accounts/useAccountList.ts +++ b/src/api/hooks/accounts/useAccountList.ts @@ -1,9 +1,10 @@ -import { accountSchema, mutedAccountSchema, type Account as BaseAccount } from 'pl-api'; +import { useInfiniteQuery } from '@tanstack/react-query'; +import { PaginatedResponse, type Account as BaseAccount } from 'pl-api'; import { Entities } from 'soapbox/entity-store/entities'; -import { useEntities } from 'soapbox/entity-store/hooks'; import { useClient } from 'soapbox/hooks'; -import { normalizeAccount, type Account } from 'soapbox/normalizers'; +import { type Account, normalizeAccount } from 'soapbox/normalizers'; +import { flattenPages } from 'soapbox/utils/queries'; import { useRelationships } from './useRelationships'; @@ -14,23 +15,36 @@ interface useAccountListOpts { } const useAccountList = (listKey: string[], entityFn: EntityFn, opts: useAccountListOpts = {}) => { - const { entities, ...rest } = useEntities( - [Entities.ACCOUNTS, ...listKey], - entityFn, - { schema: listKey[0] === 'mutes' ? mutedAccountSchema : accountSchema, enabled: opts.enabled, transform: normalizeAccount }, - ); + const getAccounts = async (pageParam?: Pick, 'next'>) => { + const response = await (pageParam?.next ? pageParam.next() : entityFn()) as PaginatedResponse; + + return { + ...response, + items: response.items.map(normalizeAccount), + }; + }; + + const queryInfo = useInfiniteQuery({ + queryKey: [Entities.ACCOUNTS, ...listKey], + queryFn: ({ pageParam }) => getAccounts(pageParam), + enabled: true, + initialPageParam: { next: null as (() => Promise>) | null }, + getNextPageParam: (config) => config.next ? config : undefined, + }); + + const data = flattenPages(queryInfo.data as any)?.toReversed() || []; const { relationships } = useRelationships( listKey, - entities.map(({ id }) => id), + data.map(({ id }) => id), ); - const accounts: Account[] = entities.map((account) => ({ + const accounts = data.map((account) => ({ ...account, relationship: relationships[account.id], })); - return { accounts, ...rest }; + return { accounts, ...queryInfo }; }; const useBlocks = () => { diff --git a/src/components/sidebar-menu.tsx b/src/components/sidebar-menu.tsx index be37bbf84..43d6e8e8c 100644 --- a/src/components/sidebar-menu.tsx +++ b/src/components/sidebar-menu.tsx @@ -338,7 +338,7 @@ const SidebarMenu: React.FC = (): JSX.Element | null => { {(account.is_admin || account.is_moderator) && ( = ({ status, theme = 'secondary' return (