chore: Debounce sidebar list (#19590)

Co-authored-by: Guilherme Gazzo <guilherme@gazzo.xyz>

client/sidebar/hooks/useRoomList.ts

@@ -1,4 +1,5 @@
-import { useMemo } from 'react';
+import { useEffect } from 'react';
+import { useDebouncedState } from '@rocket.chat/fuselage-hooks';
 
 import { useQueuedInquiries, useOmnichannelEnabled } from '../../contexts/OmnichannelContext';
 import { useUserPreference, useUserSubscriptions } from '../../contexts/UserContext';
@@ -8,6 +9,8 @@ import { ISubscription } from '../../../definition/ISubscription';
 const query = { open: { $ne: false } };
 
 export const useRoomList = (): Array<ISubscription> => {
+	const [roomList, setRoomList] = useDebouncedState<ISubscription[]>([], 150);
+
 	const showOmnichannel = useOmnichannelEnabled();
 	const sidebarGroupByType = useUserPreference('sidebarGroupByType');
 	const favoritesEnabled = useUserPreference('sidebarShowFavorites');
@@ -20,7 +23,8 @@ export const useRoomList = (): Array<ISubscription> => {
 
 	const inquiries = useQueuedInquiries();
 
-	return useMemo(() => {
+	useEffect(() => {
+		setRoomList(() => {
 			const favorite = new Set();
 			const omnichannel = new Set();
 			const unread = new Set();
@@ -75,6 +79,10 @@ export const useRoomList = (): Array<ISubscription> => {
 			sidebarGroupByType && direct.size && groups.set('Direct', direct);
 			!sidebarGroupByType && groups.set('Conversations', conversation);
 			return [...groups.entries()].flatMap(([key, group]) => [key, ...group]);
+		});
+
 		// eslint-disable-next-line react-hooks/exhaustive-deps
 	}, [rooms, showOmnichannel, inquiries.enabled, inquiries.enabled && inquiries.queue, sidebarShowUnread, favoritesEnabled, showDiscussion, sidebarGroupByType]);
+
+	return roomList;
 };