Fix components order

RocketChat · May 13, 2022 · 943be61 · 943be61
1 parent 2927ae6
commit 943be61
Show file tree

Hide file tree

Showing 4 changed files with 24 additions and 47 deletions.
diff --git a/apps/meteor/client/views/room/MessageList/components/EncryptedMessageRender.tsx b/apps/meteor/client/views/room/MessageList/components/EncryptedMessageRender.tsx
@@ -2,31 +2,15 @@ import { IMessage } from '@rocket.chat/core-typings';
 import { useTranslation } from '@rocket.chat/ui-contexts';
 import React, { ReactElement } from 'react';
 
-import MessageBodyRender from '../../../../components/Message/MessageBodyRender';
-import { useMessageActions } from '../../contexts/MessageContext';
-import { useParsedMessage } from '../hooks/useParsedMessage';
+import MessageRender from './MessageRender';
 
 const EncryptedMessageRender = ({ message }: { message: IMessage }): ReactElement => {
-	const tokens = useParsedMessage(message.msg);
 	const t = useTranslation();
-
-	const {
-		actions: { openUserCard, openRoom },
-	} = useMessageActions();
-
 	if (message.e2e === 'pending') {
 		return <>{t('E2E_message_encrypted_placeholder')}</>;
 	}
 
-	return (
-		<MessageBodyRender
-			onUserMentionClick={openUserCard}
-			onChannelMentionClick={openRoom}
-			mentions={message?.mentions || []}
-			channels={message?.channels || []}
-			tokens={tokens}
-		/>
-	);
+	return <MessageRender message={message} />;
 };
 
 export default EncryptedMessageRender;
diff --git a/apps/meteor/client/views/room/MessageList/components/MessageContent.tsx b/apps/meteor/client/views/room/MessageList/components/MessageContent.tsx
@@ -4,6 +4,7 @@ import { MessageBody } from '@rocket.chat/fuselage';
 import { useUserId, TranslationKey } from '@rocket.chat/ui-contexts';
 import React, { FC, memo } from 'react';
 
+import { isE2EEMessage } from '../../../../../lib/isE2EEMessage';
 import Attachments from '../../../../components/Message/Attachments';
 import MessageActions from '../../../../components/Message/MessageActions';
 import BroadcastMetric from '../../../../components/Message/Metrics/Broadcast';
@@ -16,6 +17,7 @@ import MessageLocation from '../../../location/MessageLocation';
 import { useMessageActions, useMessageOembedIsEnabled, useMessageRunActionLink } from '../../contexts/MessageContext';
 import { useMessageListShowReadReceipt } from '../contexts/MessageListContext';
 import { isOwnUserMessage } from '../lib/isOwnUserMessage';
+import EncryptedMessageRender from './EncryptedMessageRender';
 import ReactionsList from './MessageReactionsList';
 import ReadReceipt from './MessageReadReceipt';
 import MessageRender from './MessageRender';
@@ -40,14 +42,20 @@ const MessageContent: FC<{ message: IMessage; sequential: boolean; subscription?
 
 	const mineUid = useUserId();
 
+	const isEncryptedMessage = isE2EEMessage(message);
+
 	return (
 		<>
-			<MessageBody data-qa-type='message-body'>
-				<MessageRender message={message} />
-			</MessageBody>
+			{!message.blocks && (
+				<MessageBody data-qa-type='message-body'>
+					{isEncryptedMessage ? <EncryptedMessageRender message={message} /> : <MessageRender message={message} />}
+				</MessageBody>
+			)}
 			{message.blocks && <MessageBlock mid={message._id} blocks={message.blocks} appId rid={message.rid} />}
 			{message.attachments && <Attachments attachments={message.attachments} file={message.file} />}
 
+			{oembedIsEnabled && !!message.urls?.length && <PreviewList urls={message.urls} />}
+
 			{message.actionLinks?.length && (
 				<MessageActions
 					mid={message._id}
@@ -93,8 +101,6 @@ const MessageContent: FC<{ message: IMessage; sequential: boolean; subscription?
 				<BroadcastMetric replyBroadcast={(): void => replyBroadcast(message)} mid={message._id} username={user.username} />
 			)}
 
-			{oembedIsEnabled && message.urls && <PreviewList urls={message.urls} />}
-
 			{shouldShowReadReceipt && <ReadReceipt unread={message.unread} />}
 		</>
 	);

diff --git a/apps/meteor/client/views/room/MessageList/components/MessageRender.tsx b/apps/meteor/client/views/room/MessageList/components/MessageRender.tsx
@@ -2,38 +2,26 @@
 import { IMessage } from '@rocket.chat/core-typings';
 import React, { FC, memo } from 'react';
 
-import { isE2EEMessage } from '../../../../../lib/isE2EEMessage';
 import MessageBodyRender from '../../../../components/Message/MessageBodyRender';
 import { useMessageActions } from '../../contexts/MessageContext';
 import { useParsedMessage } from '../hooks/useParsedMessage';
-import EncryptedMessageRender from './EncryptedMessageRender';
 
 const MessageRender: FC<{ message: IMessage; isThreadPreview?: boolean }> = ({ message, isThreadPreview }) => {
 	const {
 		actions: { openRoom, openUserCard },
 	} = useMessageActions();
 
-	const isEncryptedMessage = isE2EEMessage(message);
-
 	const tokens = useParsedMessage(message.msg);
 
 	return (
-		<>
-			{!isEncryptedMessage && !message.blocks && message.md && (
-				<MessageBodyRender
-					onUserMentionClick={openUserCard}
-					onChannelMentionClick={openRoom}
-					mentions={message?.mentions || []}
-					channels={message?.channels || []}
-					tokens={tokens}
-					isThreadPreview={isThreadPreview}
-				/>
-			)}
-
-			{!isEncryptedMessage && !message.blocks && !message.md && message.msg}
-
-			{isEncryptedMessage && <EncryptedMessageRender message={message} />}
-		</>
+		<MessageBodyRender
+			onUserMentionClick={openUserCard}
+			onChannelMentionClick={openRoom}
+			mentions={message?.mentions || []}
+			channels={message?.channels || []}
+			tokens={tokens}
+			isThreadPreview={isThreadPreview}
+		/>
 	);
 };
 

diff --git a/apps/meteor/client/views/room/MessageList/components/UrlPreview/PreviewList.tsx b/apps/meteor/client/views/room/MessageList/components/UrlPreview/PreviewList.tsx
@@ -1,7 +1,7 @@
 import { Box } from '@rocket.chat/fuselage';
 import React, { ReactElement } from 'react';
 
-import { useMessageOembedIsEnabled, useMessageOembedMaxWidth } from '../../../contexts/MessageContext';
+import { useMessageOembedMaxWidth } from '../../../contexts/MessageContext';
 import OEmbedResolver from './OEmbedResolver';
 import UrlPreview from './UrlPreview';
 
@@ -108,11 +108,10 @@ const isPreviewData = (data: PreviewData | false): data is PreviewData => !!data
 const isMetaPreview = (_data: PreviewData['data'], type: PreviewTypes): _data is PreviewMetadata => type === 'oembed';
 
 const PreviewList = ({ urls }: PreviewListProps): ReactElement | null => {
-	const oembedIsEnabled = useMessageOembedIsEnabled();
 	const oembedWidth = useMessageOembedMaxWidth();
 
-	if (!oembedIsEnabled || !urls) {
-		return null;
+	if (!urls) {
+		throw new Error('urls is undefined - PreviewList');
 	}
 
 	const metaAndHeaders = urls.map(processMetaAndHeaders).filter(isPreviewData);