From 8a01accaa07548b2a1fdd0ced9a42268e19050f5 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?nicole=20miko=C5=82ajczyk?= Date: Thu, 26 Feb 2026 12:49:39 +0100 Subject: [PATCH] nicolium: call queryClient.setQueryData directly when possible MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Signed-off-by: nicole mikołajczyk --- packages/pl-fe/src/actions/auth.ts | 8 ++--- packages/pl-fe/src/actions/me.ts | 4 +-- packages/pl-fe/src/actions/preload.ts | 14 ++++++-- packages/pl-fe/src/api/batcher.ts | 9 +++++ .../accounts/use-birthday-reminders.ts | 10 +++--- .../src/queries/accounts/use-directory.ts | 10 +++--- .../queries/accounts/use-endorsed-accounts.ts | 15 +++++--- .../accounts/use-familiar-followers.ts | 23 +++++++------ .../queries/accounts/use-follow-requests.ts | 12 +++---- .../pl-fe/src/queries/admin/use-accounts.ts | 9 ++--- packages/pl-fe/src/queries/chats.ts | 16 ++++----- .../use-event-participation-requests.ts | 13 +++---- .../src/queries/groups/use-group-members.ts | 14 ++++---- .../src/queries/search/use-search-accounts.ts | 10 +++--- .../pl-fe/src/queries/search/use-search.ts | 17 +++++++--- .../queries/statuses/use-status-history.ts | 23 ++++++------- .../statuses/use-status-interactions.ts | 8 +++-- packages/pl-fe/src/queries/suggestions.ts | 19 +++++------ .../queries/trends/use-suggested-accounts.ts | 10 +++--- .../pl-fe/src/queries/utils/minify-list.ts | 34 ++++++++++++------- packages/pl-fe/src/stores/shoutbox.ts | 23 +++++-------- 21 files changed, 166 insertions(+), 135 deletions(-) diff --git a/packages/pl-fe/src/actions/auth.ts b/packages/pl-fe/src/actions/auth.ts index a4d07537e..317308102 100644 --- a/packages/pl-fe/src/actions/auth.ts +++ b/packages/pl-fe/src/actions/auth.ts @@ -36,8 +36,6 @@ import { isStandalone } from '@/utils/state'; import { type PlfeResponse, getClient } from '../api'; -import { importEntities } from './importer'; - import type { AppDispatch, RootState } from '@/store'; const SWITCH_ACCOUNT = 'SWITCH_ACCOUNT' as const; @@ -180,7 +178,7 @@ const verifyCredentials = return client.settings .verifyCredentials() .then((account) => { - dispatch(importEntities({ accounts: [account] })); + queryClient.setQueryData(['accounts', account.id], account); dispatch({ type: VERIFY_CREDENTIALS_SUCCESS, token, @@ -194,7 +192,7 @@ const verifyCredentials = // The user is waitlisted const account = error.response.json; const parsedAccount = v.parse(credentialAccountSchema, error.response.json); - dispatch(importEntities({ accounts: [parsedAccount] })); + queryClient.setQueryData(['accounts', parsedAccount.id], parsedAccount); dispatch({ type: VERIFY_CREDENTIALS_SUCCESS, token, @@ -219,7 +217,7 @@ interface AuthAccountRememberSuccessAction { const rememberAuthAccount = (accountUrl: string) => (dispatch: AppDispatch, getState: () => RootState) => KVStore.getItemOrError(`authAccount:${accountUrl}`).then((account) => { - dispatch(importEntities({ accounts: [account] })); + queryClient.setQueryData(['accounts', account.id], account); dispatch({ type: AUTH_ACCOUNT_REMEMBER_SUCCESS, account, diff --git a/packages/pl-fe/src/actions/me.ts b/packages/pl-fe/src/actions/me.ts index 27db72148..52ca24af1 100644 --- a/packages/pl-fe/src/actions/me.ts +++ b/packages/pl-fe/src/actions/me.ts @@ -1,4 +1,5 @@ import { selectAccount } from '@/queries/accounts/selectors'; +import { queryClient } from '@/queries/client'; import { setSentryAccount } from '@/sentry'; import KVStore from '@/storage/kv-store'; import { useComposeStore } from '@/stores/compose'; @@ -8,7 +9,6 @@ import { getAuthUserId, getAuthUserUrl } from '@/utils/auth'; import { getClient } from '../api'; import { loadCredentials } from './auth'; -import { importEntities } from './importer'; import { FE_NAME } from './settings'; import type { AppDispatch, RootState } from '@/store'; @@ -110,7 +110,7 @@ interface MePatchSuccessAction { } const patchMeSuccess = (me: CredentialAccount) => (dispatch: AppDispatch) => { - dispatch(importEntities({ accounts: [me] })); + queryClient.setQueryData(['accounts', me.id], me); useComposeStore.getState().actions.importDefaultSettings(me); dispatch({ type: ME_PATCH_SUCCESS, diff --git a/packages/pl-fe/src/actions/preload.ts b/packages/pl-fe/src/actions/preload.ts index e7af0a279..bd2f29162 100644 --- a/packages/pl-fe/src/actions/preload.ts +++ b/packages/pl-fe/src/actions/preload.ts @@ -1,7 +1,10 @@ import mapValues from 'lodash/mapValues'; +import { accountSchema } from 'pl-api'; +import * as v from 'valibot'; + +import { queryClient } from '@/queries/client'; import { verifyCredentials } from './auth'; -import { importEntities } from './importer'; import type { AppDispatch } from '@/store'; @@ -57,7 +60,14 @@ const preloadMastodon = (data: Record) => (dispatch: AppDispatch) = const { me, access_token } = data.meta; const { url } = data.accounts[me]; - dispatch(importEntities({ accounts: Object.values(data.accounts) })); + for (const account of Object.values(data.accounts)) { + try { + const parsedAccount = v.parse(accountSchema, account); + queryClient.setQueryData(['accounts', parsedAccount.id], parsedAccount); + } catch { + // + } + } dispatch(verifyCredentials(access_token, url)); dispatch({ type: MASTODON_PRELOAD_IMPORT, data }); }; diff --git a/packages/pl-fe/src/api/batcher.ts b/packages/pl-fe/src/api/batcher.ts index 01f930f23..a7b545c0b 100644 --- a/packages/pl-fe/src/api/batcher.ts +++ b/packages/pl-fe/src/api/batcher.ts @@ -28,10 +28,19 @@ const translations = memoize((lang: string, client: PlApiClient) => }), ); +const familiarFollowers = memoize((client: PlApiClient) => + create({ + fetcher: (ids: string[]) => client.accounts.getFamiliarFollowers(ids), + resolver: keyResolver('id'), + scheduler: bufferScheduler(200), + }), +); + const batcher = { relationships, groupRelationships, translations, + familiarFollowers, }; export { batcher }; diff --git a/packages/pl-fe/src/queries/accounts/use-birthday-reminders.ts b/packages/pl-fe/src/queries/accounts/use-birthday-reminders.ts index 8d8424b1a..32dc867a1 100644 --- a/packages/pl-fe/src/queries/accounts/use-birthday-reminders.ts +++ b/packages/pl-fe/src/queries/accounts/use-birthday-reminders.ts @@ -1,20 +1,20 @@ -import { useQuery } from '@tanstack/react-query'; +import { useQuery, useQueryClient } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useClient } from '@/hooks/use-client'; import { useLoggedIn } from '@/hooks/use-logged-in'; const useBirthdayReminders = (month: number, day: number) => { const client = useClient(); - const dispatch = useAppDispatch(); const { isLoggedIn } = useLoggedIn(); + const queryClient = useQueryClient(); return useQuery({ queryKey: ['accountsLists', 'birthdayReminders', month, day], queryFn: () => client.accounts.getBirthdays(day, month).then((accounts) => { - dispatch(importEntities({ accounts })); + for (const account of accounts) { + queryClient.setQueryData(['accounts', account.id], account); + } return accounts.map(({ id }) => id); }), diff --git a/packages/pl-fe/src/queries/accounts/use-directory.ts b/packages/pl-fe/src/queries/accounts/use-directory.ts index f8381910b..81d434547 100644 --- a/packages/pl-fe/src/queries/accounts/use-directory.ts +++ b/packages/pl-fe/src/queries/accounts/use-directory.ts @@ -1,12 +1,10 @@ -import { useInfiniteQuery } from '@tanstack/react-query'; +import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useClient } from '@/hooks/use-client'; const useDirectory = (order: 'active' | 'new', local: boolean = false) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); return useInfiniteQuery({ queryKey: ['accountsLists', 'directory', order, local], @@ -18,7 +16,9 @@ const useDirectory = (order: 'active' | 'new', local: boolean = false) => { offset, }) .then((accounts) => { - dispatch(importEntities({ accounts })); + for (const account of accounts) { + queryClient.setQueryData(['accounts', account.id], account); + } return accounts.map(({ id }) => id); }), initialPageParam: 0, diff --git a/packages/pl-fe/src/queries/accounts/use-endorsed-accounts.ts b/packages/pl-fe/src/queries/accounts/use-endorsed-accounts.ts index f8a05b445..6989179ad 100644 --- a/packages/pl-fe/src/queries/accounts/use-endorsed-accounts.ts +++ b/packages/pl-fe/src/queries/accounts/use-endorsed-accounts.ts @@ -1,18 +1,23 @@ -import { useQuery } from '@tanstack/react-query'; +import { useQuery, useQueryClient } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; +import { batcher } from '@/api/batcher'; import { useClient } from '@/hooks/use-client'; const useEndorsedAccounts = (accountId: string) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); return useQuery({ queryKey: ['accountsLists', 'endorsedAccounts', accountId], queryFn: () => client.accounts.getAccountEndorsements(accountId).then(({ items: accounts }) => { - dispatch(importEntities({ accounts })); + const fetcher = batcher.relationships(client).fetch; + + for (const account of accounts) { + fetcher(account.id); + queryClient.setQueryData(['accounts', account.id], account); + } + return accounts.map(({ id }) => id); }), }); diff --git a/packages/pl-fe/src/queries/accounts/use-familiar-followers.ts b/packages/pl-fe/src/queries/accounts/use-familiar-followers.ts index ba7408618..1b7fba7c8 100644 --- a/packages/pl-fe/src/queries/accounts/use-familiar-followers.ts +++ b/packages/pl-fe/src/queries/accounts/use-familiar-followers.ts @@ -1,27 +1,28 @@ -import { useQuery } from '@tanstack/react-query'; +import { useQuery, useQueryClient } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; +import { batcher } from '@/api/batcher'; import { useClient } from '@/hooks/use-client'; import { useFeatures } from '@/hooks/use-features'; import { useLoggedIn } from '@/hooks/use-logged-in'; const useFamiliarFollowers = (accountId: string) => { const client = useClient(); - const dispatch = useAppDispatch(); const features = useFeatures(); const { isLoggedIn } = useLoggedIn(); + const queryClient = useQueryClient(); return useQuery({ queryKey: ['accountsLists', 'familiarFollowers', accountId], queryFn: () => - client.accounts.getFamiliarFollowers([accountId]).then((response) => { - const result = response.find(({ id }) => id === accountId); - if (!result) return []; - - dispatch(importEntities({ accounts: result.accounts })); - return result.accounts.map(({ id }) => id); - }), + batcher + .familiarFollowers(client) + .fetch(accountId) + .then(({ accounts }) => { + for (const account of accounts) { + queryClient.setQueryData(['accounts', account.id], account); + } + result.accounts.map(({ id }) => id); + }), enabled: isLoggedIn && features.familiarFollowers, }); }; diff --git a/packages/pl-fe/src/queries/accounts/use-follow-requests.ts b/packages/pl-fe/src/queries/accounts/use-follow-requests.ts index 2a88197a2..2a3c476f2 100644 --- a/packages/pl-fe/src/queries/accounts/use-follow-requests.ts +++ b/packages/pl-fe/src/queries/accounts/use-follow-requests.ts @@ -1,7 +1,5 @@ -import { useMutation, type InfiniteData } from '@tanstack/react-query'; +import { useMutation, useQueryClient, type InfiniteData } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useClient } from '@/hooks/use-client'; import { queryClient } from '@/queries/client'; import { makePaginatedResponseQuery } from '@/queries/utils/make-paginated-response-query'; @@ -55,28 +53,28 @@ const useOutgoingFollowRequests = makePaginatedResponseQuery( const useAcceptFollowRequestMutation = (accountId: string) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); return useMutation({ mutationKey: ['accountsLists', 'followRequests', accountId], mutationFn: () => client.myAccount.acceptFollowRequest(accountId), onSettled: (relationship) => { removeFollowRequest(accountId); - dispatch(importEntities({ relationships: [relationship] })); + queryClient.setQueryData(['accountRelationships', accountId], relationship); }, }); }; const useRejectFollowRequestMutation = (accountId: string) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); return useMutation({ mutationKey: ['accountsLists', 'followRequests', accountId], mutationFn: () => client.myAccount.rejectFollowRequest(accountId), onSettled: (relationship) => { removeFollowRequest(accountId); - dispatch(importEntities({ relationships: [relationship] })); + queryClient.setQueryData(['accountRelationships', accountId], relationship); }, }); }; diff --git a/packages/pl-fe/src/queries/admin/use-accounts.ts b/packages/pl-fe/src/queries/admin/use-accounts.ts index e65a1709f..cecd4c585 100644 --- a/packages/pl-fe/src/queries/admin/use-accounts.ts +++ b/packages/pl-fe/src/queries/admin/use-accounts.ts @@ -6,8 +6,6 @@ import { useQueryClient, } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useClient } from '@/hooks/use-client'; import { useOwnAccount } from '@/hooks/use-own-account'; import { useAccount } from '@/queries/accounts/use-account'; @@ -39,13 +37,13 @@ const useAdminAccounts = makePaginatedResponseQuery( const useAdminAccount = (accountId?: string) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); const query = useQuery({ queryKey: ['admin', 'accounts', accountId], queryFn: () => client.admin.accounts.getAccount(accountId!).then(({ account, ...adminAccount }) => { - dispatch(importEntities({ accounts: [account] })); + if (account) queryClient.setQueryData(['accounts', account.id], account); return adminAccount as AdminAccount; }), enabled: !!accountId, @@ -79,14 +77,13 @@ const usePendingUsersCount = () => { const useAdminApproveAccountMutation = (accountId: string) => { const client = useClient(); - const dispatch = useAppDispatch(); const queryClient = useQueryClient(); return useMutation({ mutationKey: ['admin', 'acounts', accountId], mutationFn: () => client.admin.accounts.approveAccount(accountId), onSuccess: ({ account, ...adminAccount }) => { - dispatch(importEntities({ accounts: [account] })); + if (account) queryClient.setQueryData(['accounts', account.id], account); queryClient.setQueryData(['admin', 'accounts', adminAccount.id], adminAccount); queryClient.setQueriesData>>( { diff --git a/packages/pl-fe/src/queries/chats.ts b/packages/pl-fe/src/queries/chats.ts index e2ae2b4e7..90c7f9dc6 100644 --- a/packages/pl-fe/src/queries/chats.ts +++ b/packages/pl-fe/src/queries/chats.ts @@ -4,6 +4,7 @@ import { useInfiniteQuery, useMutation, useQuery, + useQueryClient, } from '@tanstack/react-query'; import sumBy from 'lodash/sumBy'; import { @@ -14,11 +15,9 @@ import { } from 'pl-api'; import * as v from 'valibot'; -import { importEntities } from '@/actions/importer'; import { batcher } from '@/api/batcher'; import { ChatWidgetScreens, useChatContext } from '@/contexts/chat-context'; import { useStatContext } from '@/contexts/stat-context'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useClient } from '@/hooks/use-client'; import { useFeatures } from '@/hooks/use-features'; import { useLoggedIn } from '@/hooks/use-logged-in'; @@ -73,7 +72,6 @@ const useChatMessages = (chat: Chat) => { const useChats = () => { const client = useClient(); - const dispatch = useAppDispatch(); const features = useFeatures(); const { setUnreadChatsCount } = useStatContext(); const { me } = useLoggedIn(); @@ -86,10 +84,12 @@ const useChats = () => { setUnreadChatsCount(sumBy(data, (chat) => chat.unread)); - // Set the relationships to these users in the redux store. + // Fetch account relationships const fetcher = batcher.relationships(client).fetch; - items.map((item) => item.account.id).forEach(fetcher); - dispatch(importEntities({ accounts: items.map((item) => item.account) })); + for (const { account } of items) { + fetcher(account.id); + queryClient.setQueryData(['accounts', account.id], account); + } return response; }; @@ -117,13 +117,13 @@ const useChats = () => { const useChat = (chatId?: string) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); const getChat = async () => { if (chatId) { const data = await client.chats.getChat(chatId); - dispatch(importEntities({ accounts: [data.account] })); + queryClient.setQueryData(['accounts', data.account.id], data.account); return data; } diff --git a/packages/pl-fe/src/queries/events/use-event-participation-requests.ts b/packages/pl-fe/src/queries/events/use-event-participation-requests.ts index c089c7147..c8f7c6d3b 100644 --- a/packages/pl-fe/src/queries/events/use-event-participation-requests.ts +++ b/packages/pl-fe/src/queries/events/use-event-participation-requests.ts @@ -1,11 +1,11 @@ import { useMutation } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; import { useClient } from '@/hooks/use-client'; import { makePaginatedResponseQuery } from '@/queries/utils/make-paginated-response-query'; import { minifyList } from '@/queries/utils/minify-list'; import { updatePaginatedResponse } from '@/queries/utils/update-paginated-response'; -import { store } from '@/store'; + +import { queryClient } from '../client'; import type { PlApiClient } from 'pl-api'; @@ -17,10 +17,11 @@ const minifyRequestList = ( minifyList( response, ({ account, participation_message }) => ({ account_id: account.id, participation_message }), - (requests) => - store.dispatch( - importEntities({ accounts: requests.map((request) => request.account) }) as any, - ), + (requests) => { + for (const { account } of requests) { + queryClient.setQueryData(['accounts', account.id], account); + } + }, ); type MinifiedRequestList = ReturnType; diff --git a/packages/pl-fe/src/queries/groups/use-group-members.ts b/packages/pl-fe/src/queries/groups/use-group-members.ts index 8a47dab3b..839f3fe70 100644 --- a/packages/pl-fe/src/queries/groups/use-group-members.ts +++ b/packages/pl-fe/src/queries/groups/use-group-members.ts @@ -1,9 +1,7 @@ -import { type InfiniteData, useMutation } from '@tanstack/react-query'; +import { type InfiniteData, useMutation, useQueryClient } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; import { useClient } from '@/hooks/use-client'; import { makePaginatedResponseQuery } from '@/queries/utils/make-paginated-response-query'; -import { store } from '@/store'; import { queryClient } from '../client'; import { minifyAccountList, minifyList } from '../utils/minify-list'; @@ -32,9 +30,9 @@ const minifyGroupMembersList = ( response, ({ account, ...groupMember }) => ({ ...groupMember, account_id: account.id }), (groupMembers) => { - store.dispatch( - importEntities({ accounts: groupMembers.map(({ account }) => account) }) as any, - ); + for (const { account } of groupMembers) { + queryClient.setQueryData(['accounts', account.id], account); + } }, ); @@ -62,6 +60,7 @@ const useGroupMembershipRequestsQuery = makePaginatedResponseQuery( const useAcceptGroupMembershipRequestMutation = (groupId: string) => { const client = useClient(); + const queryClient = useQueryClient(); return useMutation({ mutationKey: ['accountsLists', 'groupMembershipRequests', groupId], @@ -78,6 +77,7 @@ const useAcceptGroupMembershipRequestMutation = (groupId: string) => { const useRejectGroupMembershipRequestMutation = (groupId: string) => { const client = useClient(); + const queryClient = useQueryClient(); return useMutation({ mutationKey: ['accountsLists', 'groupMembershipRequests', groupId], @@ -94,6 +94,7 @@ const useRejectGroupMembershipRequestMutation = (groupId: string) => { const usePromoteGroupMemberMutation = (groupId: string) => { const client = useClient(); + const queryClient = useQueryClient(); return useMutation({ mutationKey: ['accountsLists', 'groupMembers', groupId], @@ -107,6 +108,7 @@ const usePromoteGroupMemberMutation = (groupId: string) => { const useDemoteGroupMemberMutation = (groupId: string) => { const client = useClient(); + const queryClient = useQueryClient(); return useMutation({ mutationKey: ['accountsLists', 'groupMembers', groupId], diff --git a/packages/pl-fe/src/queries/search/use-search-accounts.ts b/packages/pl-fe/src/queries/search/use-search-accounts.ts index a9fd19f17..93e5cfbd9 100644 --- a/packages/pl-fe/src/queries/search/use-search-accounts.ts +++ b/packages/pl-fe/src/queries/search/use-search-accounts.ts @@ -1,14 +1,12 @@ -import { useInfiniteQuery } from '@tanstack/react-query'; +import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useClient } from '@/hooks/use-client'; import type { SearchAccountParams } from 'pl-api'; const useAccountSearch = (query: string, params?: Omit) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); return useInfiniteQuery({ queryKey: ['search', 'accountSearch', query.trim(), params], @@ -23,7 +21,9 @@ const useAccountSearch = (query: string, params?: Omit { - dispatch(importEntities({ accounts })); + for (const account of accounts) { + queryClient.setQueryData(['accounts', account.id], account); + } return accounts.map(({ id }) => id); }), enabled: !!query?.trim(), diff --git a/packages/pl-fe/src/queries/search/use-search.ts b/packages/pl-fe/src/queries/search/use-search.ts index ee28249cb..8bd4e430e 100644 --- a/packages/pl-fe/src/queries/search/use-search.ts +++ b/packages/pl-fe/src/queries/search/use-search.ts @@ -1,4 +1,4 @@ -import { useInfiniteQuery } from '@tanstack/react-query'; +import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'; import { importEntities } from '@/actions/importer'; import { useAppDispatch } from '@/hooks/use-app-dispatch'; @@ -11,7 +11,7 @@ const useSearchAccounts = ( params?: Omit, ) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); return useInfiniteQuery({ queryKey: ['search', 'accounts', query, params], @@ -29,7 +29,12 @@ const useSearchAccounts = ( { signal }, ) .then(({ accounts }) => { - dispatch(importEntities({ accounts })); + for (const account of accounts) { + queryClient.setQueryData(['accounts', account.id], account); + if (account.relationship) { + queryClient.setQueryData(['accountRelationships', account.id], account.relationship); + } + } return accounts.map(({ id }) => id); }), enabled: !!query?.trim(), @@ -110,7 +115,7 @@ const useSearchGroups = ( params?: Omit, ) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); return useInfiniteQuery({ queryKey: ['search', 'groups', query, params], @@ -127,7 +132,9 @@ const useSearchGroups = ( { signal }, ) .then(({ groups }) => { - dispatch(importEntities({ groups })); + for (const group of groups) { + queryClient.setQueryData(['groups', group.id], group); + } return groups.map(({ id }) => id); }), enabled: !!query?.trim(), diff --git a/packages/pl-fe/src/queries/statuses/use-status-history.ts b/packages/pl-fe/src/queries/statuses/use-status-history.ts index 1806d4719..fa5b82c00 100644 --- a/packages/pl-fe/src/queries/statuses/use-status-history.ts +++ b/packages/pl-fe/src/queries/statuses/use-status-history.ts @@ -1,8 +1,6 @@ -import { useQuery } from '@tanstack/react-query'; +import { useQuery, useQueryClient } from '@tanstack/react-query'; import { StatusEdit } from 'pl-api'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useClient } from '@/hooks/use-client'; const minifyStatusEdit = ({ account, ...statusEdit }: StatusEdit) => ({ @@ -12,19 +10,18 @@ const minifyStatusEdit = ({ account, ...statusEdit }: StatusEdit) => ({ const useStatusHistory = (statusId: string) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); return useQuery({ queryKey: ['statuses', 'history', statusId], - queryFn: () => - client.statuses - .getStatusHistory(statusId) - .then( - (history) => ( - dispatch(importEntities({ accounts: history.map(({ account }) => account) })), history - ), - ) - .then((history) => history.map(minifyStatusEdit)), + queryFn: async () => { + const history = await client.statuses.getStatusHistory(statusId); + for (const { account } of history) { + // why am i even doing this it's always the same account lol + queryClient.setQueryData(['accounts', account.id], account); + } + return history.map(minifyStatusEdit); + }, }); }; diff --git a/packages/pl-fe/src/queries/statuses/use-status-interactions.ts b/packages/pl-fe/src/queries/statuses/use-status-interactions.ts index ff21ffd46..7ff624faa 100644 --- a/packages/pl-fe/src/queries/statuses/use-status-interactions.ts +++ b/packages/pl-fe/src/queries/statuses/use-status-interactions.ts @@ -44,13 +44,17 @@ const useStatusReblogs = makeUseStatusInteractions('getRebloggedBy'); const useStatusReactions = (statusId: string, emoji?: string) => { const client = useClient(); - const dispatch = useAppDispatch(); + const queryClient = useQueryClient(); return useQuery({ queryKey: ['accountsLists', 'statusReactions', statusId, emoji], queryFn: () => client.statuses.getStatusReactions(statusId, emoji).then((reactions) => { - dispatch(importEntities({ accounts: reactions.map(({ accounts }) => accounts).flat() })); + for (const { accounts } of reactions) { + for (const account of accounts) { + queryClient.setQueryData(['accounts', account.id], account); + } + } return reactions.map(({ accounts, ...reactions }) => reactions); }), diff --git a/packages/pl-fe/src/queries/suggestions.ts b/packages/pl-fe/src/queries/suggestions.ts index ca183fa26..524f7c2d0 100644 --- a/packages/pl-fe/src/queries/suggestions.ts +++ b/packages/pl-fe/src/queries/suggestions.ts @@ -1,28 +1,29 @@ -import { useMutation, keepPreviousData, useQuery } from '@tanstack/react-query'; +import { useMutation, keepPreviousData, useQuery, useQueryClient } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; +import { batcher } from '@/api/batcher'; import { useClient } from '@/hooks/use-client'; import { useLoggedIn } from '@/hooks/use-logged-in'; import { removePageItem } from '../utils/queries'; -import { useRelationshipsQuery } from './accounts/use-relationship'; - const SuggestionKeys = { suggestions: ['suggestions'] as const, }; const useSuggestions = () => { const client = useClient(); - const dispatch = useAppDispatch(); const { isLoggedIn } = useLoggedIn(); + const queryClient = useQueryClient(); const getSuggestions = async () => { const response = await client.myAccount.getSuggestions(); - const accounts = response.map(({ account }) => account); - dispatch(importEntities({ accounts })); + const fetcher = batcher.relationships(client).fetch; + + for (const { account } of response) { + fetcher(account.id); + queryClient.setQueryData(['accounts', account.id], account); + } return response.map(({ account, ...x }) => ({ ...x, account_id: account.id })); }; @@ -34,8 +35,6 @@ const useSuggestions = () => { enabled: isLoggedIn, }); - useRelationshipsQuery(query.data?.map((s) => s.account_id)); - return query; }; diff --git a/packages/pl-fe/src/queries/trends/use-suggested-accounts.ts b/packages/pl-fe/src/queries/trends/use-suggested-accounts.ts index f84ea32e0..749c58e13 100644 --- a/packages/pl-fe/src/queries/trends/use-suggested-accounts.ts +++ b/packages/pl-fe/src/queries/trends/use-suggested-accounts.ts @@ -1,7 +1,5 @@ -import { useQuery } from '@tanstack/react-query'; +import { useQuery, useQueryClient } from '@tanstack/react-query'; -import { importEntities } from '@/actions/importer'; -import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useClient } from '@/hooks/use-client'; import { useFeatures } from '@/hooks/use-features'; @@ -11,14 +9,16 @@ type MinifiedSuggestion = Omit & { account_id: string }; const useSuggestedAccounts = () => { const client = useClient(); - const dispatch = useAppDispatch(); const features = useFeatures(); + const queryClient = useQueryClient(); return useQuery({ queryKey: ['suggestions'], queryFn: () => client.myAccount.getSuggestions().then((suggestions) => { - dispatch(importEntities({ accounts: suggestions.map(({ account }) => account) })); + for (const { account } of suggestions) { + queryClient.setQueryData(['accounts', account.id], account); + } return suggestions.map( ({ account, ...suggestion }): MinifiedSuggestion => ({ account_id: account.id, diff --git a/packages/pl-fe/src/queries/utils/minify-list.ts b/packages/pl-fe/src/queries/utils/minify-list.ts index 976a2b895..211e15b33 100644 --- a/packages/pl-fe/src/queries/utils/minify-list.ts +++ b/packages/pl-fe/src/queries/utils/minify-list.ts @@ -56,7 +56,12 @@ const minifyAccountList = (response: PaginatedResponse): PaginatedRespo response, (account) => account.id, (accounts) => { - store.dispatch(importEntities({ accounts }) as any); + for (const account of accounts) { + queryClient.setQueryData(['accounts', account.id], account); + if (account.relationship) { + queryClient.setQueryData(['accountRelationships', account.id], account.relationship); + } + } }, ); @@ -67,7 +72,12 @@ const minifyBlockedAccountList = ( response, (account) => [account.id, account.block_expires_at], (accounts) => { - store.dispatch(importEntities({ accounts }) as any); + for (const account of accounts) { + queryClient.setQueryData(['accounts', account.id], account); + if (account.relationship) { + queryClient.setQueryData(['accountRelationships', account.id], account.relationship); + } + } }, ); @@ -78,7 +88,12 @@ const minifyMutedAccountList = ( response, (account) => [account.id, account.mute_expires_at], (accounts) => { - store.dispatch(importEntities({ accounts }) as any); + for (const account of accounts) { + queryClient.setQueryData(['accounts', account.id], account); + if (account.relationship) { + queryClient.setQueryData(['accountRelationships', account.id], account.relationship); + } + } }, ); @@ -122,18 +137,13 @@ const minifyGroupedNotifications = ( (results) => { const { accounts, statuses } = results; - store.dispatch( - importEntities({ - accounts, - statuses, - }) as any, - ); + store.dispatch(importEntities({ accounts, statuses }) as any); }, false, ); const minifyAdminAccount = ({ account, ...adminAccount }: AdminAccount) => { - store.dispatch(importEntities({ accounts: [account] }) as any); + if (account) queryClient.setQueryData(['accounts', account.id], account); queryClient.setQueryData(['admin', 'accounts', adminAccount.id], adminAccount); return adminAccount; @@ -144,10 +154,8 @@ const minifyAdminAccountList = (response: PaginatedResponse) => response, (account) => account.id, (accounts) => { - store.dispatch( - importEntities({ accounts: accounts.map((account) => account.account) }) as any, - ); for (const { account, ...adminAccount } of accounts) { + if (account) queryClient.setQueryData(['accounts', account.id], account); queryClient.setQueryData(['admin', 'accounts', adminAccount.id], adminAccount); } }, diff --git a/packages/pl-fe/src/stores/shoutbox.ts b/packages/pl-fe/src/stores/shoutbox.ts index 630358057..446687d04 100644 --- a/packages/pl-fe/src/stores/shoutbox.ts +++ b/packages/pl-fe/src/stores/shoutbox.ts @@ -1,17 +1,12 @@ +import { type PlApiClient, type ShoutMessage as BaseShoutMessage, Account } from 'pl-api'; import { useEffect } from 'react'; import { create } from 'zustand'; import { mutative } from 'zustand-mutative'; -import { importEntities } from '@/actions/importer'; import { useClient } from '@/hooks/use-client'; import { useFeatures } from '@/hooks/use-features'; import { useLoggedIn } from '@/hooks/use-logged-in'; - -import type { store } from '@/store'; -import type { PlApiClient, ShoutMessage as BaseShoutMessage } from 'pl-api'; - -let lazyStore: typeof store; -import('@/store').then(({ store }) => (lazyStore = store)).catch(() => {}); +import { queryClient } from '@/queries/client'; const minifyMessage = ({ author, ...message }: BaseShoutMessage) => ({ author_id: author.id, @@ -40,19 +35,19 @@ const useShoutboxStore = create()( actions: { setMessages: (messages) => { set((state: State) => { - lazyStore?.dispatch( - importEntities( - { accounts: messages.map((msg) => msg.author) }, - { override: false }, - ) as any, - ); + for (const { author } of messages.toReversed()) { + queryClient.setQueryData( + ['accounts', author.id], + (account) => account || author, + ); + } state.messages = messages.map(minifyMessage); state.isLoading = false; }); }, pushMessage: (message) => { set((state: State) => { - lazyStore?.dispatch(importEntities({ accounts: [message.author] }) as any); + queryClient.setQueryData(['accounts', message.author.id], message.author); state.messages.push(minifyMessage(message)); }); },