Merge branch 'develop' of github.com:GetStream/stream-chat-react-native into v6.0.0

khushal87 · khushal87 · commit 2f2fb514a3e1 · 2024-10-23T11:39:57.000+05:30
diff --git a/examples/SampleApp/CHANGELOG.md b/examples/SampleApp/CHANGELOG.md
@@ -1,5 +1,12 @@
 # Change Log
 
+### [1.30.4](https://github.com/GetStream/stream-chat-react-native/compare/sampleapp@v1.30.3...sampleapp@v1.30.4) (2024-10-21)
+
+
+### Workspaces
+
+* Following linked packages updated: [stream-chat-react-native]
+
 ### [1.30.3](https://github.com/GetStream/stream-chat-react-native/compare/sampleapp@v1.30.2...sampleapp@v1.30.3) (2024-10-15)
 
 
diff --git a/examples/SampleApp/package.json b/examples/SampleApp/package.json
@@ -1,6 +1,6 @@
 {
   "name": "sampleapp",
-  "version": "1.30.3",
+  "version": "1.30.4",
   "private": true,
   "repository": {
     "type": "git",
diff --git a/package/CHANGELOG.md b/package/CHANGELOG.md
@@ -1,5 +1,13 @@
 # Change Log
 
+### [5.39.4](https://github.com/GetStream/stream-chat-react-native/compare/v5.39.3...v5.39.4) (2024-10-21)
+
+
+### Bug Fixes
+
+* add sender and receiver background color for message bubble in message overlay ([#2710](https://github.com/GetStream/stream-chat-react-native/issues/2710)) ([7e64290](https://github.com/GetStream/stream-chat-react-native/commit/7e64290c4131c15666102478ca94ce50910d0189))
+* double loading when targetting a message ([#2711](https://github.com/GetStream/stream-chat-react-native/issues/2711)) ([fdb4f17](https://github.com/GetStream/stream-chat-react-native/commit/fdb4f17991ffde7f9c59dd690f8913e9a75e8560))
+
 ### [5.39.3](https://github.com/GetStream/stream-chat-react-native/compare/v5.39.2...v5.39.3) (2024-10-15)
 
 
diff --git a/package/expo-package/package.json b/package/expo-package/package.json
@@ -1,7 +1,7 @@
 {
   "name": "stream-chat-expo",
   "description": "The official Expo SDK for Stream Chat, a service for building chat applications",
-  "version": "5.39.3",
+  "version": "5.39.4",
   "author": {
     "company": "Stream.io Inc",
     "name": "Stream.io Inc"
@@ -10,7 +10,7 @@
   "main": "src/index.js",
   "types": "types/index.d.ts",
   "dependencies": {
-    "stream-chat-react-native-core": "5.39.3"
+    "stream-chat-react-native-core": "5.39.4"
   },
   "peerDependencies": {
     "expo": "^51.0.0",
diff --git a/package/expo-package/yarn.lock b/package/expo-package/yarn.lock
@@ -5113,10 +5113,10 @@ stream-buffers@2.2.x, stream-buffers@~2.2.0:
   resolved "https://registry.yarnpkg.com/stream-buffers/-/stream-buffers-2.2.0.tgz#91d5f5130d1cef96dcfa7f726945188741d09ee4"
   integrity sha512-uyQK/mx5QjHun80FLJTfaWE7JtwfRMKBLkMne6udYOmvH0CawotVa7TfgYHzAnpphn4+TweIx1QKMnRIbipmUg==
 
-stream-chat-react-native-core@5.39.2:
-  version "5.39.2"
-  resolved "https://registry.yarnpkg.com/stream-chat-react-native-core/-/stream-chat-react-native-core-5.39.2.tgz#fd4a09ac47684056214ddfa90d11c5df07131ca2"
-  integrity sha512-aqAURELT3rY686VVLOBOXZvJ9YO5CM9rcXzpUtkwySuprWO1cNBevnDYJkWPpQkAjD9fXUa6ydC6UJkZiibGmA==
+stream-chat-react-native-core@5.39.3:
+  version "5.39.3"
+  resolved "https://registry.yarnpkg.com/stream-chat-react-native-core/-/stream-chat-react-native-core-5.39.3.tgz#ef9257106291c9a289e7f0019bd5268d0972d0b9"
+  integrity sha512-ksru6JLucW/ki+UbfbUQ+OjxcupUwW+URjHo9EROxgiW25hy9LD9iSb9PPJ5MfPhd1nY9wnewHGAznhrx+nqgA==
   dependencies:
     "@gorhom/bottom-sheet" "^4.6.4"
     dayjs "1.10.5"
diff --git a/package/native-package/package.json b/package/native-package/package.json
@@ -1,7 +1,7 @@
 {
   "name": "stream-chat-react-native",
   "description": "The official React Native SDK for Stream Chat, a service for building chat applications",
-  "version": "5.39.3",
+  "version": "5.39.4",
   "author": {
     "company": "Stream.io Inc",
     "name": "Stream.io Inc"
@@ -11,7 +11,7 @@
   "types": "types/index.d.ts",
   "dependencies": {
     "es6-symbol": "^3.1.3",
-    "stream-chat-react-native-core": "5.39.3"
+    "stream-chat-react-native-core": "5.39.4"
   },
   "peerDependencies": {
     "@bam.tech/react-native-image-resizer": ">=3.0.10",
diff --git a/package/native-package/yarn.lock b/package/native-package/yarn.lock
@@ -4289,10 +4289,10 @@ statuses@~1.5.0:
   resolved "https://registry.yarnpkg.com/statuses/-/statuses-1.5.0.tgz#161c7dac177659fd9811f43771fa99381478628c"
   integrity sha512-OpZ3zP+jT1PI7I8nemJX4AKmAX070ZkYPVWV/AaKTJl+tXCTGyVdC1a4SL8RUQYEwk/f34ZX8UTykN68FwrqAA==
 
-stream-chat-react-native-core@5.39.2:
-  version "5.39.2"
-  resolved "https://registry.yarnpkg.com/stream-chat-react-native-core/-/stream-chat-react-native-core-5.39.2.tgz#fd4a09ac47684056214ddfa90d11c5df07131ca2"
-  integrity sha512-aqAURELT3rY686VVLOBOXZvJ9YO5CM9rcXzpUtkwySuprWO1cNBevnDYJkWPpQkAjD9fXUa6ydC6UJkZiibGmA==
+stream-chat-react-native-core@5.39.3:
+  version "5.39.3"
+  resolved "https://registry.yarnpkg.com/stream-chat-react-native-core/-/stream-chat-react-native-core-5.39.3.tgz#ef9257106291c9a289e7f0019bd5268d0972d0b9"
+  integrity sha512-ksru6JLucW/ki+UbfbUQ+OjxcupUwW+URjHo9EROxgiW25hy9LD9iSb9PPJ5MfPhd1nY9wnewHGAznhrx+nqgA==
   dependencies:
     "@gorhom/bottom-sheet" "^4.6.4"
     dayjs "1.10.5"
diff --git a/package/package.json b/package/package.json
@@ -1,7 +1,7 @@
 {
   "name": "stream-chat-react-native-core",
   "description": "The official React Native and Expo components for Stream Chat, a service for building chat applications",
-  "version": "5.39.3",
+  "version": "5.39.4",
   "author": {
     "company": "Stream.io Inc",
     "name": "Stream.io Inc"
diff --git a/package/src/components/MessageList/MessageList.tsx b/package/src/components/MessageList/MessageList.tsx
@@ -983,7 +983,9 @@ const MessageListWithContext = <
         });
       }
       // the message we want to scroll to has not been loaded in the state yet
-      loadChannelAroundMessage({ messageId: messageIdToScroll });
+      if (indexOfParentInMessageList === -1) {
+        loadChannelAroundMessage({ messageId: messageIdToScroll });
+      }
     }, 50);
     // eslint-disable-next-line react-hooks/exhaustive-deps
   }, [targetedMessage, initialScrollToFirstUnreadMessage]);
diff --git a/package/src/components/MessageList/__tests__/MessageList.test.js b/package/src/components/MessageList/__tests__/MessageList.test.js
@@ -351,8 +351,9 @@ describe('MessageList', () => {
       mockedLongMessagesList.push(generateMessage({ timestamp: new Date(), user: user1 }));
     }
     // could be any message that is not within the initially processed ones
-    const { id: targetedMessageId, text: targetedMessageText } = mockedLongMessagesList[3];
-    const latestMessageText = mockedLongMessagesList[mockedLongMessagesList.length - 1].text;
+    const latestMessageText = mockedLongMessagesList[0].text;
+    const { id: targetedMessageId, text: targetedMessageText } =
+      mockedLongMessagesList[mockedLongMessagesList.length - 4];
 
     const mockedChannel = generateChannelResponse({
       members: [generateMember({ user: user1 })],
diff --git a/package/src/components/MessageList/utils/getDateSeparators.ts b/package/src/components/MessageList/utils/getDateSeparators.ts
@@ -36,8 +36,13 @@ export const getDateSeparators = <
     const isDeletedMessageVisibleToSender =
       deletedMessagesVisibilityType === 'sender' || deletedMessagesVisibilityType === 'always';
 
+    const isDeletedMessageVisibleToReceiver =
+      deletedMessagesVisibilityType === 'receiver' || deletedMessagesVisibilityType === 'always';
+
     return (
-      !isMessageTypeDeleted || (userId === message.user?.id && isDeletedMessageVisibleToSender)
+      !isMessageTypeDeleted ||
+      (userId === message.user?.id && isDeletedMessageVisibleToSender) ||
+      (userId !== message.user?.id && isDeletedMessageVisibleToReceiver)
     );
   });
 
diff --git a/package/src/components/MessageList/utils/getGroupStyles.ts b/package/src/components/MessageList/utils/getGroupStyles.ts
@@ -4,7 +4,7 @@ import type { PaginatedMessageListContextValue } from '../../../contexts/paginat
 import type { ThreadContextValue } from '../../../contexts/threadContext/ThreadContext';
 import type { DefaultStreamChatGenerics } from '../../../types/types';
 import { isEditedMessage } from '../../../utils/utils';
-import type { GroupType } from '../hooks/useMessageList';
+import type { GroupType, MessageType } from '../hooks/useMessageList';
 
 export type GetGroupStylesParams<
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
@@ -19,6 +19,88 @@ export type GetGroupStylesParams<
   userId?: string;
 };
 
+export type GroupStyle = '' | 'middle' | 'top' | 'bottom' | 'single';
+
+const getGroupStyle = <
+  StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
+>(
+  dateSeparators: DateSeparators,
+  message: MessageType<StreamChatGenerics>,
+  previousMessage: MessageType<StreamChatGenerics>,
+  nextMessage: MessageType<StreamChatGenerics>,
+  hideDateSeparators?: boolean,
+  maxTimeBetweenGroupedMessages?: number,
+): GroupStyle[] => {
+  const groupStyles: GroupStyle[] = [];
+
+  const isPrevMessageTypeDeleted = previousMessage?.type === 'deleted';
+  const isNextMessageTypeDeleted = nextMessage?.type === 'deleted';
+
+  const userId = message?.user?.id || null;
+
+  const isTopMessage =
+    !previousMessage ||
+    previousMessage.type === 'system' ||
+    previousMessage.type === 'error' ||
+    userId !== previousMessage?.user?.id ||
+    !!isPrevMessageTypeDeleted ||
+    (!hideDateSeparators && dateSeparators[message.id]) ||
+    isEditedMessage(previousMessage);
+
+  const isBottomMessage =
+    !nextMessage ||
+    nextMessage.type === 'system' ||
+    nextMessage.type === 'error' ||
+    userId !== nextMessage?.user?.id ||
+    !!isNextMessageTypeDeleted ||
+    (!hideDateSeparators && dateSeparators[nextMessage.id]) ||
+    (maxTimeBetweenGroupedMessages !== undefined &&
+      (nextMessage.created_at as Date).getTime() - (message.created_at as Date).getTime() >
+        maxTimeBetweenGroupedMessages) ||
+    isEditedMessage(message);
+
+  /**
+   * Add group styles key for top message
+   */
+  if (isTopMessage) {
+    groupStyles.push('top');
+  }
+
+  /**
+   * Add group styles key for bottom message
+   */
+
+  const isMessageTypeDeleted = message.type === 'deleted';
+  if (isBottomMessage) {
+    /**
+     * If the bottom message is also the top, or deleted, or an error,
+     * add the key for single message instead of bottom
+     */
+    if (isTopMessage || isMessageTypeDeleted || message.type === 'error') {
+      groupStyles.splice(0, groupStyles.length);
+      groupStyles.push('single');
+    } else {
+      groupStyles.push('bottom');
+    }
+  }
+
+  /**
+   * Add the key for all non top or bottom messages, if the message is
+   * deleted or an error add the key for single otherwise middle
+   */
+  if (!isTopMessage && !isBottomMessage) {
+    if (isMessageTypeDeleted || message.type === 'error') {
+      groupStyles.splice(0, groupStyles.length);
+      groupStyles.push('single');
+    } else {
+      groupStyles.splice(0, groupStyles.length);
+      groupStyles.push('middle');
+    }
+  }
+
+  return groupStyles;
+};
+
 export const getGroupStyles = <
   StreamChatGenerics extends DefaultStreamChatGenerics = DefaultStreamChatGenerics,
 >(
@@ -43,83 +125,19 @@ export const getGroupStyles = <
   });
 
   for (let i = 0; i < messagesFilteredForNonUser.length; i++) {
-    const previousMessage = messagesFilteredForNonUser[i - 1] as
-      | (typeof messagesFilteredForNonUser)[0]
-      | undefined;
+    const previousMessage = messagesFilteredForNonUser[i - 1];
     const message = messagesFilteredForNonUser[i];
-    const nextMessage = messagesFilteredForNonUser[i + 1] as
-      | (typeof messagesFilteredForNonUser)[0]
-      | undefined;
-    const groupStyles: GroupType[] = [];
-
-    const isPrevMessageTypeDeleted = previousMessage?.type === 'deleted';
-    const isNextMessageTypeDeleted = nextMessage?.type === 'deleted';
-
-    const userId = message?.user?.id || null;
-
-    const isTopMessage =
-      !previousMessage ||
-      previousMessage.type === 'system' ||
-      previousMessage.type === 'error' ||
-      userId !== previousMessage?.user?.id ||
-      !!isPrevMessageTypeDeleted ||
-      (!hideDateSeparators && dateSeparators[message.id]) ||
-      messageGroupStyles[previousMessage.id]?.includes('bottom') ||
-      isEditedMessage(previousMessage);
-
-    const isBottomMessage =
-      !nextMessage ||
-      nextMessage.type === 'system' ||
-      nextMessage.type === 'error' ||
-      userId !== nextMessage?.user?.id ||
-      !!isNextMessageTypeDeleted ||
-      (!hideDateSeparators && dateSeparators[nextMessage.id]) ||
-      (maxTimeBetweenGroupedMessages !== undefined &&
-        nextMessage.created_at.getTime() - message.created_at.getTime() >
-          maxTimeBetweenGroupedMessages) ||
-      isEditedMessage(message);
-
-    /**
-     * Add group styles key for top message
-     */
-    if (isTopMessage) {
-      groupStyles.push('top');
-    }
-
-    /**
-     * Add group styles key for bottom message
-     */
-
-    const isMessageTypeDeleted = message.type === 'deleted';
-    if (isBottomMessage) {
-      /**
-       * If the bottom message is also the top, or deleted, or an error,
-       * add the key for single message instead of bottom
-       */
-      if (isTopMessage || isMessageTypeDeleted || message.type === 'error') {
-        groupStyles.splice(0, groupStyles.length);
-        groupStyles.push('single');
-      } else {
-        groupStyles.push('bottom');
-      }
-    }
-
-    /**
-     * Add the key for all non top or bottom messages, if the message is
-     * deleted or an error add the key for single otherwise middle
-     */
-    if (!isTopMessage && !isBottomMessage) {
-      if (isMessageTypeDeleted || message.type === 'error') {
-        groupStyles.splice(0, groupStyles.length);
-        groupStyles.push('single');
-      } else {
-        groupStyles.splice(0, groupStyles.length);
-        groupStyles.push('middle');
-      }
-    }
+    const nextMessage = messagesFilteredForNonUser[i + 1];
 
     if (message.id) {
-      messageGroupStyles[message.id] = groupStyles;
+      messageGroupStyles[message.id] = getGroupStyle(
+        dateSeparators,
+        message,
+        previousMessage,
+        nextMessage,
+        hideDateSeparators,
+        maxTimeBetweenGroupedMessages,
+      );
     }
   }
 
diff --git a/package/src/version.json b/package/src/version.json
@@ -1,3 +1,3 @@
 {
-  "version": "5.39.3"
+  "version": "5.39.4"
 }

-Original file line number
+Diff line change
@@ @@ -1,5 +1,12 @@ @@
 # Change Log
 +### [1.30.4](https://github.com/GetStream/stream-chat-react-native/compare/[email protected]@v1.30.4) (2024-10-21)
++
++
 +### Workspaces
++
 +* Following linked packages updated: [stream-chat-react-native]
++
 ### [1.30.3](https://github.com/GetStream/stream-chat-react-native/compare/[email protected]@v1.30.3) (2024-10-15)
Original file line number	Diff line number	Diff line change
`@@ -1,6 +1,6 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "sampleapp",`
`3`		`- "version": "1.30.3",`
	`3`	`+ "version": "1.30.4",`
`4`	`4`	`"private": true,`
`5`	`5`	`"repository": {`
`6`	`6`	`"type": "git",`
Original file line number	Diff line number	Diff line change
`@@ -1,7 +1,7 @@`
`1`	`1`	`{`
`2`	`2`	`"name": "stream-chat-react-native-core",`
`3`	`3`	`"description": "The official React Native and Expo components for Stream Chat, a service for building chat applications",`
`4`		`- "version": "5.39.3",`
	`4`	`+ "version": "5.39.4",`
`5`	`5`	`"author": {`
`6`	`6`	`"company": "Stream.io Inc",`
`7`	`7`	`"name": "Stream.io Inc"`