[FIX] Messages showing URL preview on Room Actions (#4065)

* using database query instead of Rocketchat search api to get message search results

* getting search data from server then converting it into the format as required for message rendering

* fixing some redundant changes

* remove ts-ignore

* removing redundant statements

* url preview is visible when we see messages in pinned, mentions and starred messages

Co-authored-by: Gerzon Z <gerzonzcanario@gmail.com>

app/views/MessagesView/index.tsx

@@ -22,7 +22,7 @@ import { ChatsStackParamList } from '../../stacks/types';
 import { ISubscription, SubscriptionType } from '../../definitions/ISubscription';
 import { IEmoji } from '../../definitions/IEmoji';
 import { IRoomInfoParam } from '../SearchMessagesView';
-import { TMessageModel } from '../../definitions';
+import { TMessageModel, IUrl } from '../../definitions';
 import { Services } from '../../lib/services';
 
 interface IMessagesViewProps {
@@ -280,8 +280,25 @@ class MessagesView extends React.Component<IMessagesViewProps, any> {
 		try {
 			const result = await this.content.fetchFunc();
 			if (result.success) {
+				const urlRenderMessages = result.messages?.map((message: any) => {
+					if (message.urls && message.urls.length > 0) {
+						message.urls = message.urls?.map((url: any, index: any) => {
+							if (url.meta) {
+								return {
+									_id: index,
+									title: url.meta.pageTitle,
+									description: url.meta.ogDescription,
+									image: url.meta.ogImage,
+									url: url.url
+								} as IUrl;
+							}
+							return {} as IUrl;
+						});
+					}
+					return message;
+				});
 				this.setState({
-					messages: [...messages, ...result.messages],
+					messages: [...messages, ...urlRenderMessages],
 					total: result.total,
 					loading: false
 				});

app/views/SearchMessagesView/index.tsx

@@ -32,6 +32,7 @@ import styles from './styles';
 import { InsideStackParamList, ChatsStackParamList } from '../../stacks/types';
 import { IEmoji } from '../../definitions/IEmoji';
 import { compareServerVersion } from '../../lib/methods/helpers/compareServerVersion';
+import { IUrl } from '../../definitions';
 import { Services } from '../../lib/services';
 
 const QUERY_SIZE = 50;
@@ -155,9 +156,25 @@ class SearchMessagesView extends React.Component<ISearchMessagesViewProps, ISear
 		// If it's not a encrypted room, search messages on the server
 		const result = await Services.searchMessages(this.rid, searchText, QUERY_SIZE, this.offset);
 		if (result.success) {
-			return result.messages;
+			const urlRenderMessages = result.messages?.map(message => {
+				if (message.urls && message.urls.length > 0) {
+					message.urls = message.urls?.map((url, index) => {
+						if (url.meta) {
+							return {
+								_id: index,
+								title: url.meta.pageTitle,
+								description: url.meta.ogDescription,
+								image: url.meta.ogImage,
+								url: url.url
+							} as IUrl;
+						}
+						return {} as IUrl;
+					});
+				}
+				return message;
+			});
+			return urlRenderMessages;
 		}
-
 		return [];
 	};
 	getMessages = async (searchText: string, debounced?: boolean) => {