diff --git a/apps/meteor/client/lib/queryKeys.ts b/apps/meteor/client/lib/queryKeys.ts index 8dff5a60689..9d1a86dea8f 100644 --- a/apps/meteor/client/lib/queryKeys.ts +++ b/apps/meteor/client/lib/queryKeys.ts @@ -26,6 +26,10 @@ export const roomsQueryKeys = { threads: (rid: IRoom['_id']) => [...roomsQueryKeys.room(rid), 'threads'] as const, roles: (rid: IRoom['_id']) => [...roomsQueryKeys.room(rid), 'roles'] as const, info: (rid: IRoom['_id']) => [...roomsQueryKeys.room(rid), 'info'] as const, + members: (rid: IRoom['_id'], roomType: RoomType, type?: 'all' | 'online', filter?: string) => + !type && !filter + ? ([...roomsQueryKeys.room(rid), 'members', roomType] as const) + : ([...roomsQueryKeys.room(rid), 'members', roomType, type, filter] as const), }; export const subscriptionsQueryKeys = { diff --git a/apps/meteor/client/views/hooks/useMembersList.ts b/apps/meteor/client/views/hooks/useMembersList.ts index 128b227d28d..476b8eef425 100644 --- a/apps/meteor/client/views/hooks/useMembersList.ts +++ b/apps/meteor/client/views/hooks/useMembersList.ts @@ -5,6 +5,7 @@ import { useInfiniteQuery, useQueryClient } from '@tanstack/react-query'; import { useEffect } from 'react'; import { calculateRoomRolePriorityFromRoles } from '../../../lib/roles/calculateRoomRolePriorityFromRoles'; +import { roomsQueryKeys } from '../../lib/queryKeys'; type MembersListOptions = { rid: string; @@ -73,7 +74,7 @@ const updateMemberInCache = ( useRealName = false, ) => { queryClient.setQueryData( - [options.roomType, 'members', options.rid, options.type, options.debouncedText], + roomsQueryKeys.members(options.rid, options.roomType, options.type, options.debouncedText), (oldData: InfiniteData) => { if (!oldData) { return oldData; @@ -136,7 +137,7 @@ export const useMembersList = (options: MembersListOptions) => { }, [options, queryClient, subscribeToNotifyLoggedIn, useRealName]); return useInfiniteQuery({ - queryKey: [options.roomType, 'members', options.rid, options.type, options.debouncedText], + queryKey: roomsQueryKeys.members(options.rid, options.roomType, options.type, options.debouncedText), queryFn: async ({ pageParam }) => { const start = pageParam ?? 0; diff --git a/apps/meteor/client/views/room/hooks/useUserInfoActions/actions/useRemoveUserAction.tsx b/apps/meteor/client/views/room/hooks/useUserInfoActions/actions/useRemoveUserAction.tsx index 19b1078f8ee..28c3d6252f4 100644 --- a/apps/meteor/client/views/room/hooks/useUserInfoActions/actions/useRemoveUserAction.tsx +++ b/apps/meteor/client/views/room/hooks/useUserInfoActions/actions/useRemoveUserAction.tsx @@ -12,10 +12,12 @@ import { useUserRoom, useUserSubscription, } from '@rocket.chat/ui-contexts'; +import { useQueryClient } from '@tanstack/react-query'; import { useMemo } from 'react'; import { useEndpointMutation } from '../../../../../hooks/useEndpointMutation'; import * as Federation from '../../../../../lib/federation/Federation'; +import { roomsQueryKeys } from '../../../../../lib/queryKeys'; import { roomCoordinator } from '../../../../../lib/rooms/roomCoordinator'; import RemoveUsersModal from '../../../../teams/contextualBar/members/RemoveUsersModal'; import { getRoomDirectives } from '../../../lib/getRoomDirectives'; @@ -34,6 +36,7 @@ export const useRemoveUserAction = ( } const t = useTranslation(); + const queryClient = useQueryClient(); const currentUser = useUser(); const subscription = useUserSubscription(rid); @@ -69,6 +72,7 @@ export const useRemoveUserAction = ( const { mutateAsync: removeFromRoom } = useEndpointMutation('POST', removeFromRoomEndpoint, { onSuccess: () => { dispatchToastMessage({ type: 'success', message: t('User_has_been_removed_from_s', roomName) }); + queryClient.invalidateQueries({ queryKey: roomsQueryKeys.members(room._id, room.t) }); }, onSettled: () => { closeModal();