snapshot of https://github.com/RocketChat/Rocket.Chat.git (develop, 2026-09-16; blobs > 131072B omitted)

apps/meteor/client/components/message/hooks/useCollapse.ts

@@ -0,0 +1,31 @@
+import { useToggle } from '@rocket.chat/fuselage-hooks';
+import { useAttachmentIsCollapsedByDefault } from '@rocket.chat/ui-contexts';
+import { useCallback } from 'react';
+
+import { useIsCollapsibleToggled } from './useIsCollapsibleToggled';
+import { RoomManager, useOpenedRoom } from '../../../lib/RoomManager';
+
+// `key` identifies this collapsible within the room's store, so its toggled state survives
+// the row unmounting and remounting (e.g. virtua recycling it on scroll), it falls back to
+// plain local state.
+export const useCollapse = (attachmentCollapsed?: boolean, key?: string) => {
+	const collapseByDefault = useAttachmentIsCollapsedByDefault();
+	const defaultCollapsed = !!(collapseByDefault || attachmentCollapsed);
+
+	const rid = useOpenedRoom();
+	const toggled = useIsCollapsibleToggled(key);
+	const [localCollapsed, toggleLocalCollapsed] = useToggle(defaultCollapsed);
+
+	const togglePersistedCollapsed = useCallback(() => {
+		if (!key || !rid) {
+			return;
+		}
+		RoomManager.getStore(rid)?.toggleCollapsible(key);
+	}, [key, rid]);
+
+	if (key) {
+		return [toggled !== defaultCollapsed, togglePersistedCollapsed] as const;
+	}
+
+	return [localCollapsed, () => toggleLocalCollapsed()] as const;
+};

apps/meteor/client/components/message/hooks/useIsCollapsibleToggled.spec.ts

@@ -0,0 +1,57 @@
+import { act, renderHook } from '@testing-library/react';
+
+import { useIsCollapsibleToggled } from './useIsCollapsibleToggled';
+import { RoomManager } from '../../../lib/RoomManager';
+
+jest.mock('../../../../client/lib/RoomHistoryManager', () => ({
+	RoomHistoryManager: {},
+}));
+
+it('should not be toggled by default', () => {
+	RoomManager.open('room-a');
+	const { result } = renderHook(() => useIsCollapsibleToggled('key-a'));
+	expect(result.current).toBe(false);
+});
+
+it('should reflect an already-toggled key in the opened room store', () => {
+	RoomManager.open('room-b');
+	RoomManager.getStore('room-b')?.toggleCollapsible('key-b');
+
+	const { result } = renderHook(() => useIsCollapsibleToggled('key-b'));
+	expect(result.current).toBe(true);
+});
+
+it('should re-render when the store toggles after mount', () => {
+	RoomManager.open('room-c');
+	const { result } = renderHook(() => useIsCollapsibleToggled('key-c'));
+	expect(result.current).toBe(false);
+
+	act(() => {
+		RoomManager.getStore('room-c')?.toggleCollapsible('key-c');
+	});
+	expect(result.current).toBe(true);
+});
+
+it('should not leak a toggle to a different key in the same room', () => {
+	RoomManager.open('room-d');
+	RoomManager.getStore('room-d')?.toggleCollapsible('key-d1');
+
+	const { result } = renderHook(() => useIsCollapsibleToggled('key-d2'));
+	expect(result.current).toBe(false);
+});
+
+it('should be a no-op when there is no key', () => {
+	RoomManager.open('room-e');
+	const { result } = renderHook(() => useIsCollapsibleToggled(undefined));
+	expect(result.current).toBe(false);
+});
+
+it('should be a no-op when there is no opened room', () => {
+	const currentlyOpened = RoomManager.opened;
+	if (currentlyOpened) {
+		RoomManager.back(currentlyOpened);
+	}
+
+	const { result } = renderHook(() => useIsCollapsibleToggled('key-f'));
+	expect(result.current).toBe(false);
+});

apps/meteor/client/components/message/hooks/useIsCollapsibleToggled.ts

@@ -0,0 +1,25 @@
+import { useMemo, useSyncExternalStore } from 'react';
+
+import { RoomManager, getCollapsibleEventKey, useOpenedRoom } from '../../../lib/RoomManager';
+
+export const useIsCollapsibleToggled = (key: string | undefined): boolean => {
+	const rid = useOpenedRoom();
+
+	const { subscribe, getSnapshot } = useMemo(() => {
+		const store = rid && key ? RoomManager.getStore(rid) : undefined;
+
+		if (!store || !key) {
+			return {
+				subscribe: () => () => undefined,
+				getSnapshot: () => false,
+			};
+		}
+
+		return {
+			subscribe: (cb: () => void) => store.on(getCollapsibleEventKey(key), cb),
+			getSnapshot: () => store.isCollapsibleToggled(key),
+		};
+	}, [rid, key]);
+
+	return useSyncExternalStore(subscribe, getSnapshot);
+};

apps/meteor/client/components/message/hooks/useMarkAsUnreadMutation.ts

@@ -0,0 +1,33 @@
+import type { IMessage, ISubscription } from '@rocket.chat/core-typings';
+import { useEndpoint, useToastMessageDispatch } from '@rocket.chat/ui-contexts';
+import { useMutation } from '@tanstack/react-query';
+
+import { LegacyRoomManager } from '../../../lib/LegacyRoomManager';
+
+export const useMarkAsUnreadMutation = () => {
+	const dispatchToastMessage = useToastMessageDispatch();
+	const unreadMessages = useEndpoint('POST', '/v1/subscriptions.unread');
+
+	return useMutation({
+		mutationFn: async ({
+			subscription,
+			...props
+		}:
+			| { message: IMessage; subscription: ISubscription }
+			| {
+					roomId: string;
+					subscription: ISubscription;
+			  }) => {
+			LegacyRoomManager.close(subscription.t + subscription.name);
+			if ('message' in props) {
+				const { message } = props;
+				await unreadMessages({ firstUnreadMessage: { _id: message._id } });
+				return;
+			}
+			await unreadMessages({ roomId: props.roomId });
+		},
+		onError: (error) => {
+			dispatchToastMessage({ type: 'error', message: error });
+		},
+	});
+};

apps/meteor/client/components/message/hooks/useNormalizedMessage.ts

@@ -0,0 +1,92 @@
+import { Base64 } from '@rocket.chat/base64';
+import type { IMessage, MessageAttachment } from '@rocket.chat/core-typings';
+import {
+	isFileImageAttachment,
+	isFileAttachment,
+	isFileAudioAttachment,
+	isFileVideoAttachment,
+	isQuoteAttachment,
+} from '@rocket.chat/core-typings';
+import type { Options } from '@rocket.chat/message-parser';
+import { useMemo } from 'react';
+
+import type { MessageWithMdEnforced } from '../../../lib/parseMessageTextToAstMarkdown';
+import { parseMessageTextToAstMarkdown } from '../../../lib/parseMessageTextToAstMarkdown';
+import { useAutoLinkDomains } from '../../../views/room/MessageList/hooks/useAutoLinkDomains';
+import { useMessageListAutoTranslate, useMessageListKatex, useMessageListShowColors } from '../list/MessageListContext';
+
+const normalizeAttachments = (attachments: MessageAttachment[], name?: string, type?: string): MessageAttachment[] => {
+	if (name) {
+		name = String.fromCharCode(...new TextEncoder().encode(name));
+	}
+
+	return attachments.map((attachment) => {
+		if (isQuoteAttachment(attachment) && attachment.attachments) {
+			attachment.attachments = normalizeAttachments(attachment.attachments);
+			return attachment;
+		}
+
+		if (!attachment.encryption) {
+			return attachment;
+		}
+
+		const key = Base64.encode(
+			JSON.stringify({
+				...attachment.encryption,
+				name,
+				type,
+			}),
+		);
+
+		if (isFileAttachment(attachment)) {
+			if (attachment.title_link && !attachment.title_link.startsWith('/file-decrypt/')) {
+				attachment.title_link = `/file-decrypt${attachment.title_link}?key=${encodeURIComponent(key)}`;
+			}
+			if (isFileImageAttachment(attachment) && !attachment.image_url.startsWith('/file-decrypt/')) {
+				attachment.image_url = `/file-decrypt${attachment.image_url}?key=${encodeURIComponent(key)}`;
+			}
+			if (isFileAudioAttachment(attachment) && !attachment.audio_url.startsWith('/file-decrypt/')) {
+				attachment.audio_url = `/file-decrypt${attachment.audio_url}?key=${encodeURIComponent(key)}`;
+			}
+			if (isFileVideoAttachment(attachment) && !attachment.video_url.startsWith('/file-decrypt/')) {
+				attachment.video_url = `/file-decrypt${attachment.video_url}?key=${encodeURIComponent(key)}`;
+			}
+		}
+
+		return attachment;
+	});
+};
+
+export const useNormalizedMessage = <TMessage extends IMessage>(message: TMessage): MessageWithMdEnforced => {
+	const katex = useMessageListKatex();
+	const katexEnabled = !!katex;
+	const customDomains = useAutoLinkDomains();
+	const autoTranslateOptions = useMessageListAutoTranslate();
+	const showColors = useMessageListShowColors();
+
+	return useMemo(() => {
+		const parseOptions: Options = {
+			colors: showColors,
+			emoticons: true,
+			customDomains,
+			...(katexEnabled && {
+				katex: {
+					dollarSyntax: katex.dollarSyntaxEnabled,
+					parenthesisSyntax: katex.parenthesisSyntaxEnabled,
+				},
+			}),
+		};
+
+		const normalizedMessage = parseMessageTextToAstMarkdown(message, parseOptions, autoTranslateOptions);
+
+		if (normalizedMessage.attachments) {
+			normalizedMessage.attachments = normalizeAttachments(
+				normalizedMessage.attachments,
+				normalizedMessage.file?.name,
+				normalizedMessage.file?.type,
+			);
+		}
+
+		return normalizedMessage;
+	}, [showColors, customDomains, katexEnabled, katex?.dollarSyntaxEnabled, katex?.parenthesisSyntaxEnabled, message, autoTranslateOptions]);
+};

apps/meteor/client/components/message/hooks/useOembedLayout.ts

@@ -0,0 +1,27 @@
+import { useLayout } from '@rocket.chat/ui-contexts';
+
+import { useMessageListOembedEnabled } from '../list/MessageListContext';
+
+type OembedLayout = {
+	enabled: boolean;
+	maxWidth: number | '100%';
+	maxHeight: number;
+};
+
+/**
+ * Returns the layout parameters for oembeds
+ */
+export const useOembedLayout = (): OembedLayout => {
+	/*
+  Note: both `useSetting` and `useLayout` are hooks that don't force a re-render
+  very often, so this hook is not going to be re-evaluated very often either;
+  this is why we don't need to memoize the result or store it in a context
+  */
+	const enabled = useMessageListOembedEnabled();
+	const { isMobile } = useLayout();
+
+	const maxWidth = isMobile ? ('100%' as const) : 368;
+	const maxHeight = 368;
+
+	return { enabled, maxWidth, maxHeight };
+};

apps/meteor/client/components/message/hooks/usePinMessageMutation.ts

@@ -0,0 +1,32 @@
+import type { IMessage } from '@rocket.chat/core-typings';
+import { useEndpoint, useToastMessageDispatch } from '@rocket.chat/ui-contexts';
+import { useQueryClient, useMutation } from '@tanstack/react-query';
+import { useTranslation } from 'react-i18next';
+
+import { updatePinMessage } from '../../../lib/mutationEffects/updatePinMessage';
+import { roomsQueryKeys } from '../../../lib/queryKeys';
+
+export const usePinMessageMutation = () => {
+	const { t } = useTranslation();
+	const pinMessage = useEndpoint('POST', '/v1/chat.pinMessage');
+	const dispatchToastMessage = useToastMessageDispatch();
+
+	const queryClient = useQueryClient();
+
+	return useMutation({
+		mutationFn: async (message: IMessage) => pinMessage({ messageId: message._id }),
+		onMutate: (message) => {
+			updatePinMessage(message, { pinned: true });
+		},
+		onSuccess: () => {
+			dispatchToastMessage({ type: 'success', message: t('Message_has_been_pinned') });
+		},
+		onError: (error, message) => {
+			dispatchToastMessage({ type: 'error', message: error });
+			updatePinMessage(message, { pinned: false });
+		},
+		onSettled: (_data, _error, message) => {
+			queryClient.invalidateQueries({ queryKey: roomsQueryKeys.pinnedMessages(message.rid) });
+		},
+	});
+};

apps/meteor/client/components/message/hooks/useStarMessageMutation.ts

@@ -0,0 +1,32 @@
+import type { IMessage } from '@rocket.chat/core-typings';
+import { useToastMessageDispatch, useEndpoint } from '@rocket.chat/ui-contexts';
+import { useQueryClient, useMutation } from '@tanstack/react-query';
+import { useTranslation } from 'react-i18next';
+
+import { toggleStarredMessage } from '../../../lib/mutationEffects/starredMessage';
+import { roomsQueryKeys } from '../../../lib/queryKeys';
+
+export const useStarMessageMutation = () => {
+	const { t } = useTranslation();
+	const dispatchToastMessage = useToastMessageDispatch();
+
+	const queryClient = useQueryClient();
+
+	const starMessage = useEndpoint('POST', '/v1/chat.starMessage');
+
+	return useMutation({
+		mutationFn: async (message: IMessage) => {
+			await starMessage({ messageId: message._id });
+		},
+		onSuccess: (_data, message) => {
+			toggleStarredMessage(message, true);
+			dispatchToastMessage({ type: 'success', message: t('Message_has_been_starred') });
+		},
+		onError: (error) => {
+			dispatchToastMessage({ type: 'error', message: error });
+		},
+		onSettled: (_data, _error, message) => {
+			queryClient.invalidateQueries({ queryKey: roomsQueryKeys.starredMessages(message.rid) });
+		},
+	});
+};

apps/meteor/client/components/message/hooks/useSubscriptionFromMessageQuery.ts

@@ -0,0 +1,16 @@
+import type { IMessage } from '@rocket.chat/core-typings';
+import { useQuery } from '@tanstack/react-query';
+
+import { useChat } from '../../../views/room/contexts/ChatContext';
+
+export const useSubscriptionFromMessageQuery = (message: IMessage) => {
+	const chat = useChat();
+
+	return useQuery({
+		queryKey: ['messages', message._id, 'subscription'],
+
+		queryFn: async () => {
+			return chat?.data.getSubscriptionFromMessage(message) ?? null;
+		},
+	});
+};

apps/meteor/client/components/message/hooks/useUnpinMessageMutation.ts

@@ -0,0 +1,32 @@
+import type { IMessage } from '@rocket.chat/core-typings';
+import { useEndpoint, useToastMessageDispatch } from '@rocket.chat/ui-contexts';
+import { useQueryClient, useMutation } from '@tanstack/react-query';
+import { useTranslation } from 'react-i18next';
+
+import { updatePinMessage } from '../../../lib/mutationEffects/updatePinMessage';
+import { roomsQueryKeys } from '../../../lib/queryKeys';
+
+export const useUnpinMessageMutation = () => {
+	const { t } = useTranslation();
+	const unpinMessage = useEndpoint('POST', '/v1/chat.unPinMessage');
+	const dispatchToastMessage = useToastMessageDispatch();
+
+	const queryClient = useQueryClient();
+
+	return useMutation({
+		mutationFn: async (message: IMessage) => unpinMessage({ messageId: message._id }),
+		onMutate: (message) => {
+			updatePinMessage(message, { pinned: false });
+		},
+		onSuccess: () => {
+			dispatchToastMessage({ type: 'success', message: t('Message_has_been_unpinned') });
+		},
+		onError: (error, message) => {
+			dispatchToastMessage({ type: 'error', message: error });
+			updatePinMessage(message, { pinned: true });
+		},
+		onSettled: (_data, _error, message) => {
+			queryClient.invalidateQueries({ queryKey: roomsQueryKeys.pinnedMessages(message.rid) });
+		},
+	});
+};

apps/meteor/client/components/message/hooks/useUnstarMessageMutation.ts

@@ -0,0 +1,32 @@
+import type { IMessage } from '@rocket.chat/core-typings';
+import { useToastMessageDispatch, useEndpoint } from '@rocket.chat/ui-contexts';
+import { useQueryClient, useMutation } from '@tanstack/react-query';
+import { useTranslation } from 'react-i18next';
+
+import { toggleStarredMessage } from '../../../lib/mutationEffects/starredMessage';
+import { roomsQueryKeys } from '../../../lib/queryKeys';
+
+export const useUnstarMessageMutation = () => {
+	const { t } = useTranslation();
+	const dispatchToastMessage = useToastMessageDispatch();
+
+	const queryClient = useQueryClient();
+
+	const unstarMessage = useEndpoint('POST', '/v1/chat.unStarMessage');
+
+	return useMutation({
+		mutationFn: async (message: IMessage) => {
+			await unstarMessage({ messageId: message._id });
+		},
+		onSuccess: (_data, message) => {
+			toggleStarredMessage(message, false);
+			dispatchToastMessage({ type: 'success', message: t('Message_has_been_unstarred') });
+		},
+		onError: (error) => {
+			dispatchToastMessage({ type: 'error', message: error });
+		},
+		onSettled: (_data, _error, message) => {
+			queryClient.invalidateQueries({ queryKey: roomsQueryKeys.starredMessages(message.rid) });
+		},
+	});
+};