[FIX] Cannot read property 'fetch' of undefined on ThreadMessagesView (#4557)

* [FIX] Cannot read property 'fetch' of undefined on ThreadMessagesView

* added e2e test

* change from _raw to _id

* test thread messages view with a thread created

app/views/ThreadMessagesView/index.tsx

@@ -142,7 +142,7 @@ class ThreadMessagesView extends React.Component<IThreadMessagesViewProps, IThre
 			),
 			headerRight: () => (
 				<HeaderButton.Container>
-					<HeaderButton.Item iconName='search' onPress={this.onSearchPress} />
+					<HeaderButton.Item iconName='search' onPress={this.onSearchPress} testID='thread-messages-view-search-icon' />
 				</HeaderButton.Container>
 			)
 		};
@@ -242,7 +242,7 @@ class ThreadMessagesView extends React.Component<IThreadMessagesViewProps, IThre
 		const { subscription } = this.state;
 		// if there's no subscription, manage data on this.state.messages
 		// note: sync will never be called without subscription
-		if (!subscription) {
+		if (!subscription._id) {
 			this.setState(({ messages }) => ({ messages: [...messages, ...update] }));
 			return;
 		}

e2e/tests/assorted/09-joinfromdirectory.spec.ts

@@ -1,5 +1,6 @@
 import data from '../../data';
 import { navigateToLogin, login, tapBack, sleep } from '../../helpers/app';
+import { sendMessage } from '../../helpers/data_setup';
 
 const testuser = data.users.regular;
 
@@ -26,6 +27,13 @@ describe('Join room from directory', () => {
 	});
 
 	describe('Usage', () => {
+		const threadMessage = `thread-${data.random}`;
+		before(async () => {
+			const result = await sendMessage(data.users.alternate, data.channels.detoxpublic.name, threadMessage);
+			const threadId = result.message._id;
+			await sendMessage(data.users.alternate, result.message.rid, data.random, threadId);
+		});
+
 		it('should tap directory', async () => {
 			await element(by.id('rooms-list-view-directory')).tap();
 			await waitFor(element(by.id('directory-view')))
@@ -37,6 +45,20 @@ describe('Join room from directory', () => {
 			await navigateToRoom(data.channels.detoxpublic.name);
 		});
 
+		it('should navigate to thread messages view and load messages', async () => {
+			await waitFor(element(by.id('room-view-header-threads')))
+				.toBeVisible()
+				.withTimeout(2000);
+			await element(by.id('room-view-header-threads')).tap();
+			await waitFor(element(by.id(`thread-messages-view-${threadMessage}`)))
+				.toBeVisible()
+				.withTimeout(2000);
+			await tapBack();
+			await waitFor(element(by.id('room-view-header-threads')))
+				.toBeVisible()
+				.withTimeout(2000);
+		});
+
 		it('should search user and navigate', async () => {
 			await tapBack();
 			await element(by.id('rooms-list-view-directory')).tap();