diff --git a/packages/pl-fe/src/components/dropdown-menu/dropdown-menu-item.tsx b/packages/pl-fe/src/components/dropdown-menu/dropdown-menu-item.tsx index d2728c3b4..0b68ba190 100644 --- a/packages/pl-fe/src/components/dropdown-menu/dropdown-menu-item.tsx +++ b/packages/pl-fe/src/components/dropdown-menu/dropdown-menu-item.tsx @@ -5,7 +5,7 @@ import React, { useEffect, useRef } from 'react'; import Counter from '@/components/ui/counter'; import Icon from '@/components/ui/icon'; import Toggle from '@/components/ui/toggle'; -import { userTouching } from '@/is-mobile'; +import { userTouching } from '@/utils/is-mobile'; type Menu = Array; diff --git a/packages/pl-fe/src/components/dropdown-menu/dropdown-menu.tsx b/packages/pl-fe/src/components/dropdown-menu/dropdown-menu.tsx index ffd25f91e..5137cf41d 100644 --- a/packages/pl-fe/src/components/dropdown-menu/dropdown-menu.tsx +++ b/packages/pl-fe/src/components/dropdown-menu/dropdown-menu.tsx @@ -16,9 +16,9 @@ import ReactSwipeableViews from 'react-swipeable-views'; import IconButton from '@/components/ui/icon-button'; import Portal from '@/components/ui/portal'; -import { userTouching } from '@/is-mobile'; import { useModalsActions } from '@/stores/modals'; import { useUiStoreActions } from '@/stores/ui'; +import { userTouching } from '@/utils/is-mobile'; import DropdownMenuItem, { type Menu } from './dropdown-menu-item'; diff --git a/packages/pl-fe/src/components/extended-video-player.tsx b/packages/pl-fe/src/components/extended-video-player.tsx index 39fcf65b5..f1b2ed22f 100644 --- a/packages/pl-fe/src/components/extended-video-player.tsx +++ b/packages/pl-fe/src/components/extended-video-player.tsx @@ -1,6 +1,6 @@ import React, { useEffect, useRef } from 'react'; -import { isIOS } from '@/is-mobile'; +import { isIOS } from '@/utils/is-mobile'; interface IExtendedVideoPlayer { src: string; diff --git a/packages/pl-fe/src/components/hover-account-wrapper.tsx b/packages/pl-fe/src/components/hover-account-wrapper.tsx index 62aa7fd58..8ad6a263e 100644 --- a/packages/pl-fe/src/components/hover-account-wrapper.tsx +++ b/packages/pl-fe/src/components/hover-account-wrapper.tsx @@ -2,8 +2,8 @@ import clsx from 'clsx'; import debounce from 'lodash/debounce'; import React, { useRef } from 'react'; -import { isMobile } from '@/is-mobile'; import { useAccountHoverCardActions } from '@/stores/account-hover-card'; +import { isMobile } from '@/utils/is-mobile'; const showAccountHoverCard = debounce((openAccountHoverCard, ref, accountId) => { openAccountHoverCard(ref, accountId); diff --git a/packages/pl-fe/src/components/hover-status-wrapper.tsx b/packages/pl-fe/src/components/hover-status-wrapper.tsx index 0ca992dbb..524ce9747 100644 --- a/packages/pl-fe/src/components/hover-status-wrapper.tsx +++ b/packages/pl-fe/src/components/hover-status-wrapper.tsx @@ -2,8 +2,8 @@ import clsx from 'clsx'; import debounce from 'lodash/debounce'; import React, { useRef } from 'react'; -import { isMobile } from '@/is-mobile'; import { useStatusHoverCardActions } from '@/stores/status-hover-card'; +import { isMobile } from '@/utils/is-mobile'; const showStatusHoverCard = debounce((openStatusHoverCard, ref, statusId) => { openStatusHoverCard(ref, statusId); diff --git a/packages/pl-fe/src/components/media-gallery.tsx b/packages/pl-fe/src/components/media-gallery.tsx index 2928ef8aa..9a4b48910 100644 --- a/packages/pl-fe/src/components/media-gallery.tsx +++ b/packages/pl-fe/src/components/media-gallery.tsx @@ -14,7 +14,7 @@ import { useFrontendConfig } from '@/hooks/use-frontend-config'; import { useSettings } from '@/stores/settings'; import { truncateFilename } from '@/utils/media'; -import { isIOS } from '../is-mobile'; +import { isIOS } from '../utils/is-mobile'; import { isPanoramic, isPortrait, diff --git a/packages/pl-fe/src/modals/media-modal.tsx b/packages/pl-fe/src/modals/media-modal.tsx index 70b47bc28..227bedd1a 100644 --- a/packages/pl-fe/src/modals/media-modal.tsx +++ b/packages/pl-fe/src/modals/media-modal.tsx @@ -19,8 +19,8 @@ import ZoomableImage from '@/features/ui/components/zoomable-image'; import Video from '@/features/video'; import { useAppDispatch } from '@/hooks/use-app-dispatch'; import { useAppSelector } from '@/hooks/use-app-selector'; -import { userTouching } from '@/is-mobile'; import { makeGetStatus } from '@/selectors'; +import { userTouching } from '@/utils/is-mobile'; import type { BaseModalProps } from '@/features/ui/components/modal-root'; import type { MediaAttachment } from 'pl-api'; diff --git a/packages/pl-fe/src/pages/accounts/account-gallery.tsx b/packages/pl-fe/src/pages/accounts/account-gallery.tsx index 35545acbd..75e599fb4 100644 --- a/packages/pl-fe/src/pages/accounts/account-gallery.tsx +++ b/packages/pl-fe/src/pages/accounts/account-gallery.tsx @@ -12,11 +12,11 @@ import Column from '@/components/ui/column'; import Spinner from '@/components/ui/spinner'; import { profileMediaRoute } from '@/features/ui/router'; import { type AccountGalleryAttachment, useAccountGallery } from '@/hooks/use-account-gallery'; -import { isIOS } from '@/is-mobile'; import { useAccount } from '@/queries/accounts/use-account'; import { useAccountLookup } from '@/queries/accounts/use-account-lookup'; import { useModalsActions } from '@/stores/modals'; import { useSettings } from '@/stores/settings'; +import { isIOS } from '@/utils/is-mobile'; interface IMediaItem { attachment: AccountGalleryAttachment; 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 908a427d3..c5801c8d1 100644 --- a/packages/pl-fe/src/queries/groups/use-group-members.ts +++ b/packages/pl-fe/src/queries/groups/use-group-members.ts @@ -24,18 +24,21 @@ const removeGroupMember = (groupId: string, accountId: string) => : undefined, ); +const minifyGroupMember = ({ account, ...groupMember }: GroupMember) => ({ + ...groupMember, + account_id: account.id, +}); + +type MinifiedGroupMember = ReturnType; + const minifyGroupMembersList = ( response: PaginatedResponse, -): PaginatedResponse & { account_id: string }> => - minifyList( - response, - ({ account, ...groupMember }) => ({ ...groupMember, account_id: account.id }), - (groupMembers) => { - for (const { account } of groupMembers) { - queryClient.setQueryData(queryKeys.accounts.show(account.id), account); - } - }, - ); +): PaginatedResponse => + minifyList(response, minifyGroupMember, (groupMembers) => { + for (const { account } of groupMembers) { + queryClient.setQueryData(queryKeys.accounts.show(account.id), account); + } + }); const useGroupMembers = makePaginatedResponseQuery( (groupId: string, role?: GroupRole) => queryKeys.accountsLists.groupMembers.byRole(groupId, role), @@ -129,8 +132,6 @@ const useDemoteGroupMemberMutation = (groupId: string) => { }); }; -type MinifiedGroupMember = ReturnType['items'][0]; - export { useGroupMembers, useKickGroupMemberMutation, diff --git a/packages/pl-fe/src/queries/keys.ts b/packages/pl-fe/src/queries/keys.ts index dafe016cd..1178c7298 100644 --- a/packages/pl-fe/src/queries/keys.ts +++ b/packages/pl-fe/src/queries/keys.ts @@ -1,4 +1,5 @@ import type { MinifiedScrobble } from './accounts/account-scrobble'; +import type { MinifiedGroupMember } from './groups/use-group-members'; import type { FilterType } from './notifications/use-notifications'; import type { DraftStatus } from './statuses/use-draft-statuses'; import type { MinifiedInteractionRequest } from './statuses/use-interaction-requests'; @@ -155,11 +156,11 @@ const accountsLists = { groupMembers: { root: (groupId: string) => { const key = ['accountsLists', 'groupMembers', groupId] as const; - return key as TaggedKey>>; + return key as TaggedKey>>; }, byRole: (groupId: string, role?: GroupRole) => { const key = ['accountsLists', 'groupMembers', groupId, role] as const; - return key as TaggedKey>>; + return key as TaggedKey>>; }, }, groupMembershipRequests: (groupId: string) => { @@ -356,7 +357,10 @@ const notifications = { root: ['notifications'] as const, list: (activeFilter?: FilterType) => { const key = ['notifications', activeFilter] as const; - return key as TaggedKey>>; + return key as TaggedKey< + typeof key, + InfiniteData, false>> + >; }, }; @@ -435,7 +439,7 @@ const settings = { >, domainBlocks: ['settings', 'domainBlocks'] as TaggedKey< ['settings', 'domainBlocks'], - Array + InfiniteData> >, }; @@ -457,7 +461,7 @@ const security = { root: ['security'] as const, oauthTokens: ['security', 'oauthTokens'] as TaggedKey< ['security', 'oauthTokens'], - Array + InfiniteData> >, }; @@ -563,7 +567,10 @@ const draftStatuses = { const scheduledStatuses = { root: ['scheduledStatuses'] as const, - all: ['scheduledStatuses'] as TaggedKey<['scheduledStatuses'], Array>, + all: ['scheduledStatuses'] as TaggedKey< + ['scheduledStatuses'], + InfiniteData> + >, }; const interactionRequests = { diff --git a/packages/pl-fe/src/queries/utils/update-paginated-response.ts b/packages/pl-fe/src/queries/utils/update-paginated-response.ts index ec920251e..c0fc674cf 100644 --- a/packages/pl-fe/src/queries/utils/update-paginated-response.ts +++ b/packages/pl-fe/src/queries/utils/update-paginated-response.ts @@ -14,18 +14,15 @@ const updatePaginatedResponse = < items: PaginatedResponse>['items'], ) => PaginatedResponse>['items'], ) => - queryClient.setQueryData>>>( - queryKey, - (data) => { - if (!data) return undefined; - return { - ...data, - pages: data.pages.map((page) => ({ - ...page, - items: updater(page.items), - })), - }; - }, - ); + queryClient.setQueryData(queryKey, (data) => { + if (!data) return undefined; + return { + ...data, + pages: data.pages.map((page) => ({ + ...page, + items: updater(page.items), + })), + }; + }); export { updatePaginatedResponse }; diff --git a/packages/pl-fe/src/utils/chats.ts b/packages/pl-fe/src/utils/chats.ts index 8590a61cf..650926be1 100644 --- a/packages/pl-fe/src/utils/chats.ts +++ b/packages/pl-fe/src/utils/chats.ts @@ -21,7 +21,7 @@ const updateChatInChatSearchQuery = (newChat: Chat) => { * Re-order the ChatSearch query by the last message timestamp. */ const reOrderChatListItems = () => { - sortQueryData(queryKeys.chats.search, (chatA, chatB) => + sortQueryData(queryKeys.chats.search, (chatA, chatB) => compareDate(chatA.last_message?.created_at as string, chatB.last_message?.created_at as string), ); }; diff --git a/packages/pl-fe/src/is-mobile.ts b/packages/pl-fe/src/utils/is-mobile.ts similarity index 100% rename from packages/pl-fe/src/is-mobile.ts rename to packages/pl-fe/src/utils/is-mobile.ts diff --git a/packages/pl-fe/src/utils/queries.ts b/packages/pl-fe/src/utils/queries.ts index 955e65174..af66c5ea5 100644 --- a/packages/pl-fe/src/utils/queries.ts +++ b/packages/pl-fe/src/utils/queries.ts @@ -1,6 +1,6 @@ import { queryClient } from '@/queries/client'; -import type { InfiniteData, QueryKey } from '@tanstack/react-query'; +import type { DataTag, InfiniteData, QueryKey } from '@tanstack/react-query'; import type { PaginatedResponse } from 'pl-api'; interface Entity { @@ -52,8 +52,11 @@ const updatePageItem = ( }; /** Insert the new item at the beginning of the first page. */ -const appendPageItem = (queryKey: QueryKey, newItem: T) => { - queryClient.setQueryData>>(queryKey, (data) => { +const appendPageItem = ( + queryKey: DataTag>>, + newItem: T, +) => { + queryClient.setQueryData(queryKey, (data) => { if (data) { const pages = [...data.pages]; pages[0] = { ...pages[0], items: [newItem, ...pages[0].items] }; @@ -90,8 +93,11 @@ const paginateQueryData = (array: T[] | undefined) => return resultArray; }, []); -const sortQueryData = (queryKey: QueryKey, comparator: (a: T, b: T) => number) => { - queryClient.setQueryData>>(queryKey, (prevResult) => { +const sortQueryData = ( + queryKey: DataTag>>, + comparator: (a: T, b: T) => number, +) => { + queryClient.setQueryData(queryKey, (prevResult) => { if (prevResult) { const nextResult = { ...prevResult }; const flattenedQueryData = flattenPages(nextResult);