[pull] develop from RocketChat:develop

apps/meteor/client/lib/userStatuses.ts

@@ -1,15 +1,17 @@
 import { UserStatus } from '@rocket.chat/core-typings';
 import type { ICustomUserStatus } from '@rocket.chat/core-typings';
 
-import { sdk } from '../../app/utils/client/lib/SDKClient';
-
 export type UserStatusDescriptor = {
 	id: string;
 	name: string;
 	statusType: UserStatus;
 	localizeName: boolean;
 };
 
+export type UserStatusStreamCallback = (data: { userStatusData: ICustomUserStatus }) => void;
+export type UserStatusStreamer = (event: 'updateCustomUserStatus' | 'deleteCustomUserStatus', cb: UserStatusStreamCallback) => () => void;
+export type UserStatusLister = () => Promise<ICustomUserStatus[] | null | undefined>;
+
 export class UserStatuses implements Iterable<UserStatusDescriptor> {
 	public invisibleAllowed = true;
 
@@ -58,8 +60,8 @@ export class UserStatuses implements Iterable<UserStatusDescriptor> {
 		}
 	}
 
-	public async sync() {
-		const result = await sdk.call('listCustomUserStatus');
+	public async sync(listCustomUserStatus: UserStatusLister) {
+		const result = await listCustomUserStatus();
 		if (!result) {
 			return;
 		}
@@ -69,20 +71,20 @@ export class UserStatuses implements Iterable<UserStatusDescriptor> {
 		}
 	}
 
-	public watch(cb?: () => void) {
-		const updateSubscription = sdk.stream('notify-logged', ['updateCustomUserStatus'], (data) => {
+	public watch(stream: UserStatusStreamer, cb?: () => void) {
+		const unsubscribeUpdate = stream('updateCustomUserStatus', (data) => {
 			this.put(this.createFromCustom(data.userStatusData));
 			cb?.();
 		});
 
-		const deleteSubscription = sdk.stream('notify-logged', ['deleteCustomUserStatus'], (data) => {
+		const unsubscribeDelete = stream('deleteCustomUserStatus', (data) => {
 			this.delete(data.userStatusData._id);
 			cb?.();
 		});
 
 		return () => {
-			updateSubscription.stop();
-			deleteSubscription.stop();
+			unsubscribeUpdate();
+			unsubscribeDelete();
 		};
 	}
 }

apps/meteor/client/navbar/NavBarSettingsToolbar/UserMenu/hooks/useStatusItems.tsx

@@ -1,7 +1,7 @@
 import { Box } from '@rocket.chat/fuselage';
 import type { GenericMenuItemProps } from '@rocket.chat/ui-client';
 import { clientCallbacks } from '@rocket.chat/ui-client';
-import { useEndpoint, useSetting } from '@rocket.chat/ui-contexts';
+import { useEndpoint, useMethod, useSetting, useStream } from '@rocket.chat/ui-contexts';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { useEffect } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -20,13 +20,15 @@ export const useStatusItems = (): GenericMenuItemProps[] => {
 	userStatuses.invisibleAllowed = useSetting('Accounts_AllowInvisibleStatusOption', true);
 
 	const queryClient = useQueryClient();
+	const stream = useStream('notify-logged');
+	const listCustomUserStatus = useMethod('listCustomUserStatus');
 
 	useEffect(
 		() =>
-			userStatuses.watch(() => {
+			userStatuses.watch(stream, () => {
 				queryClient.setQueryData(['user-statuses'], Array.from(userStatuses));
 			}),
-		[queryClient],
+		[queryClient, stream],
 	);
 
 	const { t } = useTranslation();
@@ -46,7 +48,7 @@ export const useStatusItems = (): GenericMenuItemProps[] => {
 	const { data: statuses } = useQuery({
 		queryKey: ['user-statuses'],
 		queryFn: async () => {
-			await userStatuses.sync();
+			await userStatuses.sync(listCustomUserStatus);
 			return Array.from(userStatuses);
 		},
 		staleTime: Infinity,