Chore: Migrate methods/loadSurroundingMessages to Typescript

app/containers/MessageBox/index.tsx

@@ -925,8 +925,8 @@ class MessageBox extends Component<IMessageBoxProps, IMessageBoxState> {
 				let msg = `[ ](${permalink}) `;
 
 				// if original message wasn't sent by current user and neither from a direct room
-				if (user.username !== replyingMessage.u.username && roomType !== 'd' && replyWithMention) {
-					msg += `@${replyingMessage.u.username} `;
+				if (user.username !== replyingMessage?.u?.username && roomType !== 'd' && replyWithMention) {
+					msg += `@${replyingMessage?.u?.username} `;
 				}
 
 				msg = `${msg} ${message}`;

app/definitions/IMessage.ts

@@ -1,11 +1,25 @@
 import Model from '@nozbe/watermelondb/Model';
 import { MarkdownAST } from '@rocket.chat/message-parser';
 
+import {
+	MESSAGE_TYPE_LOAD_MORE,
+	MESSAGE_TYPE_LOAD_NEXT_CHUNK,
+	MESSAGE_TYPE_LOAD_PREVIOUS_CHUNK
+} from '../constants/messageTypeLoad';
 import { IAttachment } from './IAttachment';
 import { IReaction } from './IReaction';
 import { IUrl } from './IUrl';
 
-export type MessageType = 'jitsi_call_started' | 'discussion-created' | 'e2e' | 'load_more' | 'rm' | 'uj';
+export type MessageType =
+	| 'jitsi_call_started'
+	| 'discussion-created'
+	| 'e2e'
+	| 'load_more'
+	| 'rm'
+	| 'uj'
+	| typeof MESSAGE_TYPE_LOAD_MORE
+	| typeof MESSAGE_TYPE_LOAD_NEXT_CHUNK
+	| typeof MESSAGE_TYPE_LOAD_PREVIOUS_CHUNK;
 
 export interface IUserMessage {
 	_id: string;
@@ -38,6 +52,12 @@ export interface ITranslations {
 
 export type E2EType = 'pending' | 'done';
 
+interface IFileThread {
+	_id: string;
+	name: string;
+	type: string;
+}
+
 export interface ILastMessage {
 	_id: string;
 	rid: string;
@@ -66,15 +86,15 @@ export interface IMessage {
 	id?: string;
 	t?: MessageType;
 	ts: string | Date;
-	u: IUserMessage;
+	u?: IUserMessage;
 	alias?: string;
 	parseUrls?: boolean;
 	groupable?: boolean;
 	avatar?: string;
 	emoji?: string;
 	attachments?: IAttachment[];
 	urls?: IUrl[];
-	_updatedAt: Date;
+	_updatedAt?: Date;
 	status?: number;
 	pinned?: boolean;
 	starred?: boolean;
@@ -99,6 +119,8 @@ export interface IMessage {
 	tshow?: boolean;
 	md?: MarkdownAST;
 	subscription?: { id: string };
+	file?: IFileThread;
+	files?: IFileThread[];
 }
 
 export type TMessageModel = IMessage & Model;

app/definitions/ISubscription.ts

@@ -24,6 +24,8 @@ export interface IVisitor {
 	lastMessageTs: Date;
 }
 
+type RelationModified<T extends Model> = { fetch(): Promise<T[]> } & Relation<T>;
+
 export interface ISubscription {
 	_id: string; // _id belongs watermelonDB
 	id: string; // id from server
@@ -81,10 +83,10 @@ export interface ISubscription {
 	teamId?: string;
 	teamMain?: boolean;
 	// https://nozbe.github.io/WatermelonDB/Relation.html#relation-api
-	messages: Relation<TMessageModel>;
-	threads: Relation<TThreadModel>;
-	threadMessages: Relation<TThreadMessageModel>;
-	uploads: Relation<TUploadModel>;
+	messages: RelationModified<TMessageModel>;
+	threads: RelationModified<TThreadModel>;
+	threadMessages: RelationModified<TThreadMessageModel>;
+	uploads: RelationModified<TUploadModel>;
 }
 
 export type TSubscriptionModel = ISubscription & Model;

app/definitions/IThread.ts

@@ -1,37 +1,10 @@
 import Model from '@nozbe/watermelondb/Model';
-import { MarkdownAST } from '@rocket.chat/message-parser';
 
 import { IAttachment } from './IAttachment';
 import { IEditedBy, IUserChannel, IUserMention, IUserMessage, MessageType } from './IMessage';
 import { IReaction } from './IReaction';
 import { IUrl } from './IUrl';
 
-interface IFileThread {
-	_id: string;
-	name: string;
-	type: string;
-}
-
-export interface IThreadResult {
-	_id: string;
-	rid: string;
-	ts: string | Date;
-	msg?: string;
-	file?: IFileThread;
-	files?: IFileThread[];
-	groupable?: boolean;
-	attachments?: IAttachment[];
-	md?: MarkdownAST;
-	u: IUserMessage;
-	_updatedAt: Date;
-	urls?: IUrl[];
-	mentions?: IUserMention[];
-	channels?: IUserChannel[];
-	replies?: string[];
-	tcount?: number;
-	tlm?: Date;
-}
-
 export interface IThread {
 	id: string;
 	tmsg?: string;

app/definitions/IThreadMessage.ts

@@ -12,7 +12,7 @@ export interface IThreadMessage {
 	t?: MessageType;
 	rid: string;
 	ts: string | Date;
-	u: IUserMessage;
+	u?: IUserMessage;
 	alias?: string;
 	parseUrls?: boolean;
 	groupable?: boolean;

app/lib/methods/loadSurroundingMessages.js → app/lib/methods/loadSurroundingMessages.ts

@@ -5,31 +5,33 @@ import orderBy from 'lodash/orderBy';
 import log from '../../utils/log';
 import { getMessageById } from '../database/services/Message';
 import { MESSAGE_TYPE_LOAD_NEXT_CHUNK, MESSAGE_TYPE_LOAD_PREVIOUS_CHUNK } from '../../constants/messageTypeLoad';
+import sdk from '../rocketchat/services/sdk';
+import { IMessage } from '../../definitions';
 import { generateLoadMoreId } from '../utils';
 import updateMessages from './updateMessages';
 
 const COUNT = 50;
 
-export default function loadSurroundingMessages({ messageId, rid }) {
+export default function loadSurroundingMessages({ messageId, rid }: { messageId: string; rid: string }) {
 	return new Promise(async (resolve, reject) => {
 		try {
-			const data = await this.methodCallWrapper('loadSurroundingMessages', { _id: messageId, rid }, COUNT);
-			let messages = EJSON.fromJSONValue(data?.messages);
+			const data = await sdk.methodCallWrapper('loadSurroundingMessages', { _id: messageId, rid }, COUNT);
+			let messages: IMessage[] = EJSON.fromJSONValue(data?.messages);
 			messages = orderBy(messages, 'ts');
 
 			const message = messages.find(m => m._id === messageId);
-			const { tmid } = message;
+			const tmid = message?.tmid;
 
 			if (messages?.length) {
 				if (data?.moreBefore) {
 					const firstMessage = messages[0];
 					const firstMessageRecord = await getMessageById(firstMessage._id);
 					if (!firstMessageRecord) {
-						const loadMoreItem = {
+						const loadMoreItem: IMessage = {
 							_id: generateLoadMoreId(firstMessage._id),
 							rid: firstMessage.rid,
 							tmid,
-							ts: moment(firstMessage.ts).subtract(1, 'millisecond'),
+							ts: moment(firstMessage.ts).subtract(1, 'millisecond').toDate(),
 							t: MESSAGE_TYPE_LOAD_PREVIOUS_CHUNK,
 							msg: firstMessage.msg
 						};
@@ -41,22 +43,22 @@ export default function loadSurroundingMessages({ messageId, rid }) {
 					const lastMessage = messages[messages.length - 1];
 					const lastMessageRecord = await getMessageById(lastMessage._id);
 					if (!lastMessageRecord) {
-						const loadMoreItem = {
+						const loadMoreItem: IMessage = {
 							_id: generateLoadMoreId(lastMessage._id),
 							rid: lastMessage.rid,
 							tmid,
-							ts: moment(lastMessage.ts).add(1, 'millisecond'),
+							ts: moment(lastMessage.ts).add(1, 'millisecond').toDate(),
 							t: MESSAGE_TYPE_LOAD_NEXT_CHUNK,
 							msg: lastMessage.msg
 						};
 						messages.push(loadMoreItem);
 					}
 				}
+
 				await updateMessages({ rid, update: messages });
 				return resolve(messages);
-			} else {
-				return resolve([]);
 			}
+			return resolve([]);
 		} catch (e) {
 			log(e);
 			reject(e);

app/lib/methods/updateMessages.ts

@@ -13,7 +13,7 @@ import { getSubscriptionByRoomId } from '../database/services/Subscription';
 interface IUpdateMessages {
 	rid: string;
 	update: IMessage[];
-	remove: IMessage[];
+	remove?: IMessage[];
 	loaderItem?: TMessageModel;
 }
 

app/views/ThreadMessagesView/index.tsx

@@ -7,7 +7,6 @@ import { EdgeInsets, withSafeAreaInsets } from 'react-native-safe-area-context';
 import { HeaderBackButton, StackNavigationOptions, StackNavigationProp } from '@react-navigation/stack';
 import { RouteProp } from '@react-navigation/native';
 import { Observable, Subscription } from 'rxjs';
-import Database from '@nozbe/watermelondb/Database';
 
 import ActivityIndicator from '../../containers/ActivityIndicator';
 import I18n from '../../i18n';
@@ -33,13 +32,12 @@ import EventEmitter from '../../utils/events';
 import { LISTENER } from '../../containers/Toast';
 import SearchHeader from '../../containers/SearchHeader';
 import { ChatsStackParamList } from '../../stacks/types';
-import { IThreadResult, TThreadModel } from '../../definitions/IThread';
 import { Filter } from './filters';
 import DropdownItemHeader from './Dropdown/DropdownItemHeader';
 import Dropdown from './Dropdown';
 import Item from './Item';
 import styles from './styles';
-import { SubscriptionType, TSubscriptionModel } from '../../definitions/ISubscription';
+import { IMessage, SubscriptionType, TSubscriptionModel, TThreadModel } from '../../definitions';
 
 const API_FETCH_COUNT = 50;
 
@@ -259,8 +257,8 @@ class ThreadMessagesView extends React.Component<IThreadMessagesViewProps, IThre
 		remove,
 		lastThreadSync
 	}: {
-		update: IThreadResult[];
-		remove?: IThreadResult[];
+		update: IMessage[];
+		remove?: IMessage[];
 		lastThreadSync: Date;
 	}) => {
 		const { subscription } = this.state;
@@ -272,11 +270,9 @@ class ThreadMessagesView extends React.Component<IThreadMessagesViewProps, IThre
 		}
 
 		try {
-			const db: Database = database.active;
+			const db = database.active;
 			const threadsCollection = db.get('threads');
-			// TODO: Refactor when migrate room
-			// @ts-ignore
-			const allThreadsRecords = (await subscription.threads.fetch()) as TThreadModel[];
+			const allThreadsRecords = await subscription.threads.fetch();
 			let threadsToCreate: any[] = [];
 			let threadsToUpdate: any[] = [];
 			let threadsToDelete: any[] = [];