fix: flaky tests, netinfo issues and bump more versions

Author: isekovanic

package/package.json

@@ -107,7 +107,7 @@
     "@op-engineering/op-sqlite": "^11.4.8",
     "@react-native-community/eslint-config": "3.2.0",
     "@react-native-community/eslint-plugin": "1.3.0",
-    "@react-native-community/netinfo": "^11.3.2",
+    "@react-native-community/netinfo": "^11.4.1",
     "@react-native/babel-preset": "0.78.0",
     "@testing-library/jest-native": "^5.4.3",
     "@testing-library/react-native": "13.1.0",

package/src/components/ChannelPreview/__tests__/ChannelPreview.test.tsx

@@ -124,9 +124,12 @@ describe('ChannelPreview', () => {
 
     it('should update the unread count to 0', async () => {
       const channelOnMock = jest.fn().mockReturnValue({ unsubscribe: jest.fn() });
+      const countUnreadMock = jest.fn();
+
+      countUnreadMock.mockReturnValue(10);
 
       const c = generateChannelWrapper({
-        countUnread: jest.fn().mockReturnValue(10),
+        countUnread: countUnreadMock,
         on: channelOnMock,
       });
 
@@ -140,6 +143,8 @@ describe('ChannelPreview', () => {
         expect(getByTestId('unread-count')).toHaveTextContent('10');
       });
 
+      countUnreadMock.mockReturnValue(0);
+
       act(() => {
         dispatchNotificationMarkRead(chatClient, channel || {});
       });
@@ -288,20 +293,27 @@ describe('ChannelPreview', () => {
   });
 
   it('should update the unread count to 0 if the channel is muted', async () => {
-    const channelOnMock = jest.fn().mockReturnValue({ unsubscribe: jest.fn() });
+    const someOtherUser = generateUser({ id: 'not-me' });
 
-    const c = generateChannelWrapper({
-      countUnread: jest.fn().mockReturnValue(10),
-      muteStatus: jest.fn().mockReturnValue({ muted: true }),
-      on: channelOnMock,
-    });
+    const c = generateChannelResponse();
+    await useInitializeChannel(c);
 
-    channel = c as unknown as Channel;
+    channel.muteStatus = jest.fn().mockReturnValue({ muted: true });
 
     const { getByTestId } = render(<TestComponent />);
 
     await waitFor(() => getByTestId('channel-id'));
 
+    for (let i = 0; i < 10; i++) {
+      const message = generateMessage({
+        user: someOtherUser,
+      });
+      act(() => {
+        dispatchMessageNewEvent(chatClient, message, channel || {});
+      });
+    }
+    await waitFor(() => getByTestId('channel-id'));
+
     await waitFor(() => {
       expect(getByTestId('unread-count')).toHaveTextContent('0');
     });
@@ -319,7 +331,7 @@ describe('ChannelPreview', () => {
     });
 
     await waitFor(() => {
-      expect(getByTestId('unread-count')).toHaveTextContent('0');
+      expect(getByTestId('unread-count')).toHaveTextContent('5');
     });
   });
 

package/src/components/MessageList/NetworkDownIndicator.tsx

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useMemo } from 'react';
 import { StyleSheet, Text, View } from 'react-native';
 
 import { useChannelContext } from '../../contexts/channelContext/ChannelContext';
@@ -33,16 +33,14 @@ export const NetworkDownIndicator = () => {
   } = useTheme();
   const { t } = useTranslationContext();
 
-  const getText = () => {
+  const indicatorText = useMemo(() => {
     if (!isOnline) {
       return t('Reconnecting...');
     } else if (error) {
       return t('Error loading messages for this channel...');
     }
     return '';
-  };
-
-  const indicatorText = getText();
+  }, [error, isOnline, t]);
 
   if (!indicatorText) {
     return null;

package/src/components/MessageList/__tests__/MessageList.test.js

@@ -23,7 +23,10 @@ import { Chat } from '../../Chat/Chat';
 import { MessageList } from '../MessageList';
 
 describe('MessageList', () => {
-  afterEach(cleanup);
+  afterEach(() => {
+    cleanup();
+    jest.clearAllMocks();
+  });
 
   it('should add new message at bottom of the list', async () => {
     const user1 = generateUser();
@@ -185,6 +188,10 @@ describe('MessageList', () => {
     );
 
     await waitFor(() => {
+      const all = queryAllByTestId('error-notification');
+      if (all.length > 0) {
+        console.log('FIBER2 NODE: ', all[0]._fiber.stateNode.children);
+      }
       expect(queryAllByTestId('error-notification')).toHaveLength(0);
       expect(getByTestId('message-deleted')).toBeTruthy();
       expect(queryByTestId('only-visible-to-you')).toBeNull();

package/yarn.lock

@@ -1681,7 +1681,7 @@
   resolved "https://registry.yarnpkg.com/@react-native-community/eslint-plugin/-/eslint-plugin-1.3.0.tgz#9e558170c106bbafaa1ef502bd8e6d4651012bf9"
   integrity sha512-+zDZ20NUnSWghj7Ku5aFphMzuM9JulqCW+aPXT6IfIXFbb8tzYTTOSeRFOtuekJ99ibW2fUCSsjuKNlwDIbHFg==
 
-"@react-native-community/netinfo@^11.3.2":
+"@react-native-community/netinfo@^11.4.1":
   version "11.4.1"
   resolved "https://registry.yarnpkg.com/@react-native-community/netinfo/-/netinfo-11.4.1.tgz#a3c247aceab35f75dd0aa4bfa85d2be5a4508688"
   integrity sha512-B0BYAkghz3Q2V09BF88RA601XursIEA111tnc2JOaN7axJWmNefmfjZqw/KdSxKZp7CZUuPpjBmz/WCR9uaHYg==