chore: Move UserPresenceContext to ui-contexts

apps/meteor/app/otr/client/OTRRoom.ts

@@ -1,4 +1,4 @@
-import type { IRoom, IMessage, IUser } from '@rocket.chat/core-typings';
+import type { IRoom, IMessage, IUser, UserPresence } from '@rocket.chat/core-typings';
 import { UserStatus } from '@rocket.chat/core-typings';
 import { Random } from '@rocket.chat/random';
 import EJSON from 'ejson';
@@ -8,7 +8,6 @@ import { Tracker } from 'meteor/tracker';
 
 import GenericModal from '../../../client/components/GenericModal';
 import { imperativeModal } from '../../../client/lib/imperativeModal';
-import type { UserPresence } from '../../../client/lib/presence';
 import { Presence } from '../../../client/lib/presence';
 import { dispatchToastMessage } from '../../../client/lib/toast';
 import { getUidDirectMessage } from '../../../client/lib/utils/getUidDirectMessage';

apps/meteor/client/components/UserStatus/ReactiveUserStatus.tsx

@@ -1,16 +1,15 @@
 import type { IUser } from '@rocket.chat/core-typings';
 import { UserStatus } from '@rocket.chat/ui-client';
+import { useUserPresence } from '@rocket.chat/ui-contexts';
 import type { ComponentProps, ReactElement } from 'react';
 import { memo } from 'react';
 
-import { usePresence } from '../../hooks/usePresence';
-
 type ReactiveUserStatusProps = {
 	uid: IUser['_id'];
 } & ComponentProps<typeof UserStatus.UserStatus>;
 
 const ReactiveUserStatus = ({ uid, ...props }: ReactiveUserStatusProps): ReactElement => {
-	const status = usePresence(uid)?.status;
+	const status = useUserPresence(uid)?.status;
 	return <UserStatus.UserStatus status={status} {...props} />;
 };
 

apps/meteor/client/components/message/MessageHeader.tsx

@@ -8,6 +8,7 @@ import {
 	MessageNameContainer,
 } from '@rocket.chat/fuselage';
 import { useUserDisplayName } from '@rocket.chat/ui-client';
+import { useUserPresence } from '@rocket.chat/ui-contexts';
 import type { KeyboardEvent, ReactElement } from 'react';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -17,8 +18,6 @@ import MessageRoles from './header/MessageRoles';
 import { useMessageListShowUsername, useMessageListShowRealName, useMessageListShowRoles } from './list/MessageListContext';
 import { useFormatDateAndTime } from '../../hooks/useFormatDateAndTime';
 import { useFormatTime } from '../../hooks/useFormatTime';
-import { useUserData } from '../../hooks/useUserData';
-import type { UserPresence } from '../../lib/presence';
 import { useMessageRoles } from './header/hooks/useMessageRoles';
 import { useUserCard } from '../../views/room/contexts/UserCardContext';
 
@@ -34,7 +33,7 @@ const MessageHeader = ({ message }: MessageHeaderProps): ReactElement => {
 	const { triggerProps, openUserCard } = useUserCard();
 
 	const showRealName = useMessageListShowRealName();
-	const user: UserPresence = { ...message.u, roles: [], ...useUserData(message.u._id) };
+	const user = { ...message.u, roles: [], ...useUserPresence(message.u._id) };
 	const usernameAndRealNameAreSame = !user.name || user.username === user.name;
 	const showUsername = useMessageListShowUsername() && showRealName && !usernameAndRealNameAreSame;
 	const displayName = useUserDisplayName(user);

apps/meteor/client/components/message/variants/SystemMessage.tsx

@@ -14,15 +14,14 @@ import {
 import { UserAvatar } from '@rocket.chat/ui-avatar';
 import { useUserDisplayName } from '@rocket.chat/ui-client';
 import type { TranslationKey } from '@rocket.chat/ui-contexts';
+import { useUserPresence } from '@rocket.chat/ui-contexts';
 import type { ComponentProps, ReactElement, KeyboardEvent } from 'react';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 
 import { MessageTypes } from '../../../../app/ui-utils/client';
 import { useFormatDateAndTime } from '../../../hooks/useFormatDateAndTime';
 import { useFormatTime } from '../../../hooks/useFormatTime';
-import { useUserData } from '../../../hooks/useUserData';
-import type { UserPresence } from '../../../lib/presence';
 import {
 	useIsSelecting,
 	useToggleSelect,
@@ -46,7 +45,7 @@ const SystemMessage = ({ message, showUserAvatar, ...props }: SystemMessageProps
 	const { triggerProps, openUserCard } = useUserCard();
 
 	const showRealName = useMessageListShowRealName();
-	const user: UserPresence = { ...message.u, roles: [], ...useUserData(message.u._id) };
+	const user = { ...message.u, roles: [], ...useUserPresence(message.u._id) };
 	const usernameAndRealNameAreSame = !user.name || user.username === user.name;
 	const showUsername = useMessageListShowUsername() && showRealName && !usernameAndRealNameAreSame;
 	const displayName = useUserDisplayName(user);

apps/meteor/client/components/message/variants/room/RoomMessageContent.tsx

@@ -2,12 +2,10 @@ import type { IMessage } from '@rocket.chat/core-typings';
 import { isDiscussionMessage, isThreadMainMessage, isE2EEMessage, isQuoteAttachment } from '@rocket.chat/core-typings';
 import { MessageBody } from '@rocket.chat/fuselage';
 import type { TranslationKey } from '@rocket.chat/ui-contexts';
-import { useSetting, useTranslation, useUserId } from '@rocket.chat/ui-contexts';
+import { useSetting, useTranslation, useUserId, useUserPresence } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import { memo } from 'react';
 
-import { useUserData } from '../../../../hooks/useUserData';
-import type { UserPresence } from '../../../../lib/presence';
 import { useChat } from '../../../../views/room/contexts/ChatContext';
 import MessageContentBody from '../../MessageContentBody';
 import ReadReceiptIndicator from '../../ReadReceiptIndicator';
@@ -38,7 +36,7 @@ const RoomMessageContent = ({ message, unread, all, mention, searchText }: RoomM
 	const subscription = useSubscriptionFromMessageQuery(message).data ?? undefined;
 	const broadcast = subscription?.broadcast ?? false;
 	const uid = useUserId();
-	const messageUser: UserPresence = { ...message.u, roles: [], ...useUserData(message.u._id) };
+	const messageUser = { ...message.u, roles: [], ...useUserPresence(message.u._id) };
 	const readReceiptEnabled = useSetting('Message_Read_Receipt_Enabled', false);
 	const chat = useChat();
 	const t = useTranslation();

apps/meteor/client/components/message/variants/thread/ThreadMessageContent.tsx

@@ -2,13 +2,11 @@ import type { IThreadMainMessage, IThreadMessage } from '@rocket.chat/core-typin
 import { isE2EEMessage, isQuoteAttachment } from '@rocket.chat/core-typings';
 import { MessageBody } from '@rocket.chat/fuselage';
 import type { TranslationKey } from '@rocket.chat/ui-contexts';
-import { useSetting, useUserId } from '@rocket.chat/ui-contexts';
+import { useSetting, useUserId, useUserPresence } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import { memo } from 'react';
 import { useTranslation } from 'react-i18next';
 
-import { useUserData } from '../../../../hooks/useUserData';
-import type { UserPresence } from '../../../../lib/presence';
 import MessageContentBody from '../../MessageContentBody';
 import ReadReceiptIndicator from '../../ReadReceiptIndicator';
 import Attachments from '../../content/Attachments';
@@ -32,7 +30,7 @@ const ThreadMessageContent = ({ message }: ThreadMessageContentProps): ReactElem
 	const subscription = useSubscriptionFromMessageQuery(message).data ?? undefined;
 	const broadcast = subscription?.broadcast ?? false;
 	const uid = useUserId();
-	const messageUser: UserPresence = { ...message.u, roles: [], ...useUserData(message.u._id) };
+	const messageUser = { ...message.u, roles: [], ...useUserPresence(message.u._id) };
 	const readReceiptEnabled = useSetting('Message_Read_Receipt_Enabled', false);
 
 	const { t } = useTranslation();

apps/meteor/client/lib/chats/ChatAPI.ts

@@ -1,10 +1,9 @@
-import type { IMessage, IRoom, ISubscription, IE2EEMessage, IUpload } from '@rocket.chat/core-typings';
+import type { IMessage, IRoom, ISubscription, IE2EEMessage, IUpload, Subscribable } from '@rocket.chat/core-typings';
 import type { IActionManager } from '@rocket.chat/ui-contexts';
 
 import type { Upload } from './Upload';
 import type { ReadStateManager } from './readStateManager';
 import type { FormattingButton } from '../../../app/ui-message/client/messageBox/messageBoxFormatting';
-import type { Subscribable } from '../../definitions/Subscribable';
 
 export type ComposerAPI = {
 	release(): void;

apps/meteor/client/lib/presence.ts

@@ -1,4 +1,4 @@
-import type { IUser } from '@rocket.chat/core-typings';
+import type { IUser, UserPresence } from '@rocket.chat/core-typings';
 import { UserStatus } from '@rocket.chat/core-typings';
 import type { EventHandlerOf } from '@rocket.chat/emitter';
 import { Emitter } from '@rocket.chat/emitter';
@@ -22,10 +22,6 @@ const emitter = new Emitter<Events>();
 
 const store = new Map<string, UserPresence>();
 
-export type UserPresence = Readonly<
-	Partial<Pick<IUser, 'name' | 'status' | 'utcOffset' | 'statusText' | 'avatarETag' | 'roles' | 'username'>> & Required<Pick<IUser, '_id'>>
->;
-
 const isUid = (eventType: keyof Events): eventType is UserPresence['_id'] =>
 	Boolean(eventType) && typeof eventType === 'string' && !['reset', 'restart', 'remove'].includes(eventType);
 

apps/meteor/client/providers/UserPresenceProvider.tsx

@@ -1,8 +1,8 @@
-import { useSetting } from '@rocket.chat/ui-contexts';
+import type { UserPresenceContextValue } from '@rocket.chat/ui-contexts';
+import { useSetting, UserPresenceContext } from '@rocket.chat/ui-contexts';
 import type { ReactElement, ReactNode } from 'react';
 import { useMemo, useEffect } from 'react';
 
-import { UserPresenceContext } from '../contexts/UserPresenceContext';
 import { Presence } from '../lib/presence';
 
 type UserPresenceProviderProps = {
@@ -16,30 +16,30 @@ const UserPresenceProvider = ({ children }: UserPresenceProviderProps): ReactEle
 		Presence.setStatus(usePresenceDisabled ? 'disabled' : 'enabled');
 	}, [usePresenceDisabled]);
 
-	return (
-		<UserPresenceContext.Provider
-			value={useMemo(
-				() => ({
-					queryUserData: (uid) => {
-						const subscribe = (callback: () => void) => {
-							Presence.listen(uid, callback);
-
-							return () => {
-								Presence.stop(uid, callback);
-							};
-						};
-
-						const get = () => Presence.store.get(uid);
-
-						return { subscribe, get };
-					},
-				}),
-				[],
-			)}
-		>
-			{children}
-		</UserPresenceContext.Provider>
+	const contextValue: UserPresenceContextValue = useMemo(
+		() => ({
+			queryUserData: (uid) => {
+				if (!uid) {
+					return { get: () => undefined, subscribe: () => () => undefined };
+				}
+
+				const subscribe = (callback: () => void) => {
+					Presence.listen(uid, callback);
+
+					return () => {
+						Presence.stop(uid, callback);
+					};
+				};
+
+				const get = () => Presence.store.get(uid);
+
+				return { subscribe, get };
+			},
+		}),
+		[],
 	);
+
+	return <UserPresenceContext.Provider value={contextValue}>{children}</UserPresenceContext.Provider>;
 };
 
 export default UserPresenceProvider;

apps/meteor/client/views/admin/deviceManagement/DeviceManagementInfo/DeviceManagementInfo.tsx

@@ -1,7 +1,7 @@
 import type { DeviceManagementPopulatedSession } from '@rocket.chat/core-typings';
 import { Box, Button, ButtonGroup, StatusBullet } from '@rocket.chat/fuselage';
 import { UserAvatar } from '@rocket.chat/ui-avatar';
-import { useRoute } from '@rocket.chat/ui-contexts';
+import { useRoute, useUserPresence } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import { useCallback } from 'react';
 import { useTranslation } from 'react-i18next';
@@ -17,7 +17,6 @@ import {
 import { InfoPanel, InfoPanelField, InfoPanelLabel, InfoPanelText } from '../../../../components/InfoPanel';
 import { useDeviceLogout } from '../../../../hooks/useDeviceLogout';
 import { useFormatDateAndTime } from '../../../../hooks/useFormatDateAndTime';
-import { usePresence } from '../../../../hooks/usePresence';
 
 type DeviceManagementInfoProps = DeviceManagementPopulatedSession & {
 	onReload: () => void;
@@ -32,7 +31,7 @@ const DeviceManagementInfo = ({ device, sessionId, loginAt, ip, userId, _user, o
 
 	const { name: clientName, os, version: rcVersion } = device || {};
 	const { username, name } = _user || {};
-	const userPresence = usePresence(userId);
+	const userPresence = useUserPresence(userId);
 
 	const handleCloseContextualBar = useCallback((): void => deviceManagementRouter.push({}), [deviceManagementRouter]);
 

apps/meteor/client/views/room/Header/DirectRoomHeader.tsx

@@ -1,9 +1,8 @@
 import type { IRoom } from '@rocket.chat/core-typings';
-import { useUserId } from '@rocket.chat/ui-contexts';
+import { useUserId, useUserPresence } from '@rocket.chat/ui-contexts';
 import type { ReactElement, ReactNode } from 'react';
 
 import RoomHeader from './RoomHeader';
-import { usePresence } from '../../../hooks/usePresence';
 
 type DirectRoomHeaderProps = {
 	room: IRoom;
@@ -24,7 +23,7 @@ type DirectRoomHeaderProps = {
 const DirectRoomHeader = ({ room, slots }: DirectRoomHeaderProps): ReactElement => {
 	const userId = useUserId();
 	const directUserId = room.uids?.filter((uid) => uid !== userId).shift();
-	const directUserData = usePresence(directUserId);
+	const directUserData = useUserPresence(directUserId);
 
 	return <RoomHeader slots={slots} room={room} topic={directUserData?.statusText} />;
 };

apps/meteor/client/views/room/body/RoomTopic.tsx

@@ -2,10 +2,9 @@ import type { IRoom, IUser } from '@rocket.chat/core-typings';
 import { isTeamRoom } from '@rocket.chat/core-typings';
 import { Box } from '@rocket.chat/fuselage';
 import { RoomBanner, RoomBannerContent } from '@rocket.chat/ui-client';
-import { useUserId, useTranslation, useRouter } from '@rocket.chat/ui-contexts';
+import { useUserId, useTranslation, useRouter, useUserPresence } from '@rocket.chat/ui-contexts';
 
 import MarkdownText from '../../../components/MarkdownText';
-import { usePresence } from '../../../hooks/usePresence';
 import { useCanEditRoom } from '../contextualBar/Info/hooks/useCanEditRoom';
 
 type RoomTopicProps = {
@@ -18,7 +17,7 @@ export const RoomTopic = ({ room }: RoomTopicProps) => {
 	const canEdit = useCanEditRoom(room);
 	const userId = useUserId();
 	const directUserId = room.uids?.filter((uid) => uid !== userId).shift();
-	const directUserData = usePresence(directUserId);
+	const directUserData = useUserPresence(directUserId);
 	const router = useRouter();
 
 	const currentRoute = router.getLocationPathname();

apps/meteor/client/views/room/contextualBar/OTR/OTRWithData.tsx

@@ -1,17 +1,17 @@
+import { useUserPresence } from '@rocket.chat/ui-contexts';
 import type { ReactElement } from 'react';
 import { useEffect } from 'react';
 
 import OTRComponent from './OTR';
 import { OtrRoomState } from '../../../../../app/otr/lib/OtrRoomState';
 import { useOTR } from '../../../../hooks/useOTR';
-import { usePresence } from '../../../../hooks/usePresence';
 import { useRoomToolbox } from '../../contexts/RoomToolboxContext';
 
 const OTRWithData = (): ReactElement => {
 	const { otr, otrState } = useOTR();
 	const { closeTab } = useRoomToolbox();
 
-	const peerUserPresence = usePresence(otr?.getPeerId());
+	const peerUserPresence = useUserPresence(otr?.getPeerId());
 	const userStatus = peerUserPresence?.status;
 	const peerUsername = peerUserPresence?.username;
 	const isOnline = !['offline', 'loading'].includes(userStatus || '');

packages/core-typings/src/IUser.ts

@@ -255,6 +255,10 @@ export type IUserInRole = Pick<
 	'_id' | 'name' | 'username' | 'emails' | 'avatarETag' | 'createdAt' | 'roles' | 'type' | 'active' | '_updatedAt'
 >;
 
+export type UserPresence = Readonly<
+	Partial<Pick<IUser, 'name' | 'status' | 'utcOffset' | 'statusText' | 'avatarETag' | 'roles' | 'username'>> & Required<Pick<IUser, '_id'>>
+>;
+
 export type AvatarUrlObj = {
 	avatarUrl: string;
 };

packages/core-typings/src/index.ts

@@ -9,6 +9,7 @@ export * from './IRoom';
 export * from './IMessage';
 export * from './federation';
 export * from './Serialized';
+export * from './Subscribable';
 export * from './ISetting';
 export * from './ISubscription';
 export * from './ITeam';

packages/mock-providers/jest.config.ts

@@ -4,4 +4,5 @@ import type { Config } from 'jest';
 export default {
 	preset: client.preset,
 	modulePathIgnorePatterns: ['<rootDir>/__tests__/helpers'],
+	testMatch: ['<rootDir>/src/tests/**/**.spec.[jt]s?(x)'],
 } satisfies Config;