fix: failing tests

Author: isekovanic

package/src/components/Message/MessageSimple/MessageAvatar.tsx

@@ -26,6 +26,8 @@ const MessageAvatarWithContext = (props: MessageAvatarPropsWithContext) => {
 
   const visible = typeof showAvatar === 'boolean' ? showAvatar : lastGroupMessage;
 
+  console.log(message);
+
   return (
     <View
       style={[alignment === 'left' ? leftAlign : rightAlign, container]}

package/src/components/Message/MessageSimple/__tests__/MessageAvatar.test.js

@@ -2,37 +2,44 @@ import React from 'react';
 
 import { cleanup, render, screen, waitFor } from '@testing-library/react-native';
 
-import { ThemeProvider } from '../../../../contexts/themeContext/ThemeContext';
 import { defaultTheme } from '../../../../contexts/themeContext/utils/theme';
 import {
   generateMessage,
   generateStaticMessage,
 } from '../../../../mock-builders/generator/message';
 import { generateStaticUser } from '../../../../mock-builders/generator/user';
+import { getTestClientWithUser } from '../../../../mock-builders/mock';
+import { Chat } from '../../../Chat/Chat';
 import { MessageAvatar } from '../MessageAvatar';
 
 afterEach(cleanup);
 
 describe('MessageAvatar', () => {
+  let chatClient;
+
+  beforeEach(async () => {
+    chatClient = await getTestClientWithUser({ id: 'me' });
+  });
+
   it('should render message avatar', async () => {
     const staticUser = generateStaticUser(0);
     const message = generateMessage({
       user: { ...staticUser, image: undefined },
     });
     render(
-      <ThemeProvider style={defaultTheme}>
+      <Chat client={chatClient} style={defaultTheme}>
         <MessageAvatar alignment='right' groupStyles={['bottom']} message={message} />
-      </ThemeProvider>,
+      </Chat>,
     );
 
     await waitFor(() => {
       expect(screen.getByTestId('message-avatar')).toBeTruthy();
     });
 
     screen.rerender(
-      <ThemeProvider style={defaultTheme}>
+      <Chat client={chatClient} style={defaultTheme}>
         <MessageAvatar alignment='right' groupStyles={[]} message={message} />
-      </ThemeProvider>,
+      </Chat>,
     );
 
     await waitFor(() => {
@@ -45,14 +52,14 @@ describe('MessageAvatar', () => {
     });
 
     screen.rerender(
-      <ThemeProvider style={defaultTheme}>
+      <Chat client={chatClient} style={defaultTheme}>
         <MessageAvatar
           alignment='left'
           groupStyles={['single']}
           message={staticMessage}
           showAvatar
         />
-      </ThemeProvider>,
+      </Chat>,
     );
 
     await waitFor(() => {

package/src/components/Message/MessageSimple/__tests__/__snapshots__/MessageAvatar.test.js.snap

@@ -29,10 +29,10 @@ exports[`MessageAvatar should render message avatar 1`] = `
             "width": 24,
           },
           {
-            "backgroundColor": "#D7F7FB",
+            "backgroundColor": "#d1f3f6",
           },
           {
-            "borderColor": "hsla(0, 0%, 0%, 0.1)",
+            "borderColor": "rgba(0, 0, 0, 0.1)",
             "borderWidth": 1,
           },
         ]

package/src/components/MessageMenu/__tests__/MessageUserReactionsAvatar.test.tsx

@@ -2,31 +2,35 @@ import React from 'react';
 
 import { render } from '@testing-library/react-native';
 
-import { ThemeProvider } from '../../../contexts/themeContext/ThemeContext';
 import { defaultTheme } from '../../../contexts/themeContext/utils/theme';
+import { getTestClientWithUser } from '../../../mock-builders/mock';
+import { Chat } from '../../Chat/Chat';
 import { MessageUserReactionsAvatar } from '../MessageUserReactionsAvatar';
 
 describe('MessageUserReactionsAvatar', () => {
   const reaction = { id: 'test-user', image: 'image-url', name: 'Test User', type: 'like' }; // Mock reaction data
+  let chatClient;
+
+  beforeEach(async () => {
+    chatClient = await getTestClientWithUser({ id: 'me' });
+  });
 
   it('should render Avatar with correct image, name, and default size', () => {
     const { queryByTestId } = render(
-      <ThemeProvider theme={defaultTheme}>
+      <Chat client={chatClient} style={defaultTheme}>
         <MessageUserReactionsAvatar reaction={reaction} />
-      </ThemeProvider>,
+      </Chat>,
     );
 
     // Check if the mocked Avatar component is rendered with correct props
     expect(queryByTestId('avatar-image')).toBeTruthy();
   });
 
   it('should render Avatar with correct image, name, and custom size', () => {
-    const customSize = 40;
-
     const { queryByTestId } = render(
-      <ThemeProvider theme={defaultTheme}>
-        <MessageUserReactionsAvatar reaction={reaction} size={customSize} />
-      </ThemeProvider>,
+      <Chat client={chatClient} style={defaultTheme}>
+        <MessageUserReactionsAvatar reaction={reaction} size={'lg'} />
+      </Chat>,
     );
 
     // Check if the mocked Avatar component is rendered with correct custom size

package/src/components/Thread/__tests__/__snapshots__/Thread.test.js.snap

@@ -313,10 +313,10 @@ exports[`Thread should match thread snapshot 1`] = `
                                       "width": 24,
                                     },
                                     {
-                                      "backgroundColor": "#FFF1C2",
+                                      "backgroundColor": "#fcedb9",
                                     },
                                     {
-                                      "borderColor": "hsla(0, 0%, 0%, 0.1)",
+                                      "borderColor": "rgba(0, 0, 0, 0.1)",
                                       "borderWidth": 1,
                                     },
                                   ]
@@ -689,10 +689,10 @@ exports[`Thread should match thread snapshot 1`] = `
                                       "width": 24,
                                     },
                                     {
-                                      "backgroundColor": "#C9FCE7",
+                                      "backgroundColor": "#bdfcdb",
                                     },
                                     {
-                                      "borderColor": "hsla(0, 0%, 0%, 0.1)",
+                                      "borderColor": "rgba(0, 0, 0, 0.1)",
                                       "borderWidth": 1,
                                     },
                                   ]
@@ -1103,10 +1103,10 @@ exports[`Thread should match thread snapshot 1`] = `
                                       "width": 24,
                                     },
                                     {
-                                      "backgroundColor": "#FFF1C2",
+                                      "backgroundColor": "#fcedb9",
                                     },
                                     {
-                                      "borderColor": "hsla(0, 0%, 0%, 0.1)",
+                                      "borderColor": "rgba(0, 0, 0, 0.1)",
                                       "borderWidth": 1,
                                     },
                                   ]
@@ -1483,10 +1483,10 @@ exports[`Thread should match thread snapshot 1`] = `
                                       "width": 24,
                                     },
                                     {
-                                      "backgroundColor": "#C9FCE7",
+                                      "backgroundColor": "#bdfcdb",
                                     },
                                     {
-                                      "borderColor": "hsla(0, 0%, 0%, 0.1)",
+                                      "borderColor": "rgba(0, 0, 0, 0.1)",
                                       "borderWidth": 1,
                                     },
                                   ]
@@ -1887,7 +1887,7 @@ exports[`Thread should match thread snapshot 1`] = `
           },
           {
             "backgroundColor": "#FFFFFF",
-            "borderColor": "#E2E6EA",
+            "borderColor": "#d5dbe1",
             "paddingBottom": 16,
           },
           {},