feat: Scroll the conversation to top

apps/meteor/client/hooks/roomActions/useGetTopMessageRoomAction.ts

@@ -0,0 +1,16 @@
+import { useMemo } from 'react';
+
+import type { RoomToolboxActionConfig } from '../../views/room/contexts/RoomToolboxContext';
+
+export const useGetTopMessageRoomAction = () => {
+	return useMemo((): RoomToolboxActionConfig | undefined => {
+		return {
+			id: 'go-to-start-of-the-conversation',
+			title: 'Go_to_first_message',
+			icon: 'arrow-up',
+			order: 21,
+			type: 'organization',
+			groups: ['channel', 'group', 'direct', 'direct_multiple', 'team'],
+		};
+	}, []);
+};

apps/meteor/client/ui.ts

@@ -14,6 +14,7 @@ import { useContactProfileRoomAction } from './hooks/roomActions/useContactProfi
 import { useDiscussionsRoomAction } from './hooks/roomActions/useDiscussionsRoomAction';
 import { useE2EERoomAction } from './hooks/roomActions/useE2EERoomAction';
 import { useExportMessagesRoomAction } from './hooks/roomActions/useExportMessagesRoomAction';
+import { useGetTopMessageRoomAction } from './hooks/roomActions/useGetTopMessageRoomAction';
 import { useKeyboardShortcutListRoomAction } from './hooks/roomActions/useKeyboardShortcutListRoomAction';
 import { useMembersListRoomAction } from './hooks/roomActions/useMembersListRoomAction';
 import { useMentionsRoomAction } from './hooks/roomActions/useMentionsRoomAction';
@@ -69,6 +70,7 @@ export const roomActionHooks = [
 	useUploadedFilesListRoomAction,
 	useVoIPRoomInfoRoomAction,
 	useWebRTCVideoRoomAction,
+	useGetTopMessageRoomAction,
 ] satisfies (() => RoomToolboxActionConfig | undefined)[];
 
 export const quickActionHooks = [

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

@@ -11,6 +11,7 @@ import {
 	useTranslation,
 	useUser,
 	useUserPreference,
+	useRouteParameter,
 } from '@rocket.chat/ui-contexts';
 import type { MouseEventHandler, ReactElement, UIEvent } from 'react';
 import React, { memo, useCallback, useEffect, useMemo, useRef, useState } from 'react';
@@ -59,6 +60,7 @@ import { useRetentionPolicy } from './hooks/useRetentionPolicy';
 import { useUnreadMessages } from './hooks/useUnreadMessages';
 
 const RoomBody = (): ReactElement => {
+	const tabActionId = useRouteParameter('tab');
 	const formatDate = useFormatDate();
 	const t = useTranslation();
 	const isLayoutEmbedded = useEmbeddedLayout();
@@ -117,6 +119,12 @@ const RoomBody = (): ReactElement => {
 		setHasNewMessages(false);
 	}, [scrollMessageList]);
 
+	const sendToTop = useCallback(() => {
+		scrollMessageList(() => {
+			return { left: 30, top: 0 };
+		});
+	}, [scrollMessageList]);
+
 	const sendToBottomIfNecessary = useCallback(() => {
 		if (atBottomRef.current === true) {
 			sendToBottom();
@@ -271,6 +279,13 @@ const RoomBody = (): ReactElement => {
 		};
 	}, [sendToBottomIfNecessary]);
 
+	useEffect(() => {
+		if (tabActionId === 'go-to-start-of-the-conversation') {
+			sendToTop();
+			toolbox.closeTab();
+		}
+	}, [tabActionId, sendToTop, toolbox]);
+
 	const router = useRouter();
 
 	const debouncedReadMessageRead = useMemo(

packages/i18n/src/locales/en.i18n.json

@@ -4914,6 +4914,7 @@
   "spy-voip-calls": "Spy Voip Calls",
   "spy-voip-calls_description": "Permission to spy voip calls",
   "SSL": "SSL",
+  "Go_to_first_message" : "Go_to_first_message",
   "Star": "Star",
   "Star_Message": "Star Message",
   "Starred_Messages": "Starred Messages",