regression: Members list not being updated after invite is revoked (#37981)

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 = {

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<MembersListPage>) => {
 			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;
 

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();