stream-chat-react-native-core 8.11.0 → 8.12.0

package/src/contexts/messagesContext/MessagesContext.tsx

@@ -31,6 +31,7 @@ import type {
   MessageProps,
 } from '../../components/Message/Message';
 import type { MessageAvatarProps } from '../../components/Message/MessageSimple/MessageAvatar';
+import type { MessageBlockedProps } from '../../components/Message/MessageSimple/MessageBlocked';
 import type { MessageBounceProps } from '../../components/Message/MessageSimple/MessageBounce';
 import type { MessageContentProps } from '../../components/Message/MessageSimple/MessageContent';
 import type { MessageDeletedProps } from '../../components/Message/MessageSimple/MessageDeleted';
@@ -55,7 +56,11 @@ import type { MessageSystemProps } from '../../components/MessageList/MessageSys
 import type { ScrollToBottomButtonProps } from '../../components/MessageList/ScrollToBottomButton';
 import { TypingIndicatorContainerProps } from '../../components/MessageList/TypingIndicatorContainer';
 import { UnreadMessagesNotificationProps } from '../../components/MessageList/UnreadMessagesNotification';
-import type { getGroupStyles } from '../../components/MessageList/utils/getGroupStyles';
+import type {
+  getGroupStyles,
+  GroupStyle,
+  MessageGroupStylesParams,
+} from '../../components/MessageList/utils/getGroupStyles';
 import { MessageActionListProps } from '../../components/MessageMenu/MessageActionList';
 import type {
   MessageActionListItemProps,
@@ -206,6 +211,11 @@ export type MessagesContextValue = Pick<MessageContextValue, 'isMessageAIGenerat
    * Defaults to: [MessageAvatar](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/Message/MessageSimple/MessageAvatar.tsx)
    **/
   MessageAvatar: React.ComponentType<MessageAvatarProps>;
+  /**
+   * UI component for MessageBlocked
+   * Defaults to: [MessageBlocked](https://github.com/GetStream/stream-chat-react-native/blob/main/package/src/components/Message/MessageSimple/MessageBlocked.tsx)
+   */
+  MessageBlocked: React.ComponentType<MessageBlockedProps>;
   /**
    * UI Component for MessageBounce
    */
@@ -401,7 +411,12 @@ export type MessagesContextValue = Pick<MessageContextValue, 'isMessageAIGenerat
    */
   forceAlignMessages?: Alignment | boolean;
 
+  /**
+   * @deprecated in favor of `getMessageGroupStyle`
+   */
   getMessagesGroupStyles?: typeof getGroupStyles;
+
+  getMessageGroupStyle?: (params: MessageGroupStylesParams) => GroupStyle[];
   /**
    * Handler to access when a ban user action is invoked.
    * @param message

package/src/contexts/themeContext/utils/theme.ts

@@ -655,6 +655,12 @@ export type Theme = {
     };
     messageGroupedSingleOrBottomContainer: ViewStyle;
     messageGroupedTopContainer: ViewStyle;
+    messageBlocked: {
+      container: ViewStyle;
+      line: ViewStyle;
+      text: TextStyle;
+      textContainer: ViewStyle;
+    };
     pinnedHeader: {
       container: ViewStyle;
       label: TextStyle;
@@ -1469,6 +1475,12 @@ export const defaultTheme: Theme = {
       container: {},
       roundedView: {},
     },
+    messageBlocked: {
+      container: {},
+      line: {},
+      text: {},
+      textContainer: {},
+    },
     messageGroupedSingleOrBottomContainer: {},
     messageGroupedTopContainer: {},
     pinnedHeader: {

package/src/state-store/channel-unread-state.ts

@@ -0,0 +1,28 @@
+import { StateStore } from 'stream-chat';
+
+import type { ChannelUnreadState as ChannelUnreadStateType } from '../types/types';
+
+export type ChannelUnreadStateStoreType = {
+  channelUnreadState?: ChannelUnreadStateType;
+};
+
+const INITIAL_STATE: ChannelUnreadStateStoreType = {
+  channelUnreadState: undefined,
+};
+
+export class ChannelUnreadStateStore {
+  public state: StateStore<ChannelUnreadStateStoreType>;
+
+  constructor() {
+    this.state = new StateStore<ChannelUnreadStateStoreType>(INITIAL_STATE);
+  }
+
+  set channelUnreadState(data: ChannelUnreadStateStoreType['channelUnreadState']) {
+    this.state.next({ channelUnreadState: data });
+  }
+
+  get channelUnreadState() {
+    const { channelUnreadState } = this.state.getLatestValue();
+    return channelUnreadState;
+  }
+}

package/src/state-store/message-list-prev-next-state.ts

@@ -0,0 +1,58 @@
+import { LocalMessage, StateStore } from 'stream-chat';
+
+export type MessagePreviousAndNextMessageStoreType = {
+  messageList: Record<
+    string,
+    {
+      previousMessage: LocalMessage;
+      nextMessage: LocalMessage;
+    }
+  >;
+};
+
+const INITIAL_STATE: MessagePreviousAndNextMessageStoreType = {
+  messageList: {},
+};
+
+export class MessagePreviousAndNextMessageStore {
+  public state: StateStore<MessagePreviousAndNextMessageStoreType>;
+
+  constructor() {
+    this.state = new StateStore<MessagePreviousAndNextMessageStoreType>(INITIAL_STATE);
+  }
+
+  // The default value of isFlashList is true as the logic in the function makes more sense when the list is not reversed.
+  public setMessageListPreviousAndNextMessage({
+    messages,
+    isFlashList = true,
+  }: {
+    messages: LocalMessage[];
+    isFlashList?: boolean;
+  }) {
+    const currentValue = this.state.getLatestValue();
+    const prevMessageList: MessagePreviousAndNextMessageStoreType['messageList'] =
+      currentValue.messageList;
+    const newMessageList: MessagePreviousAndNextMessageStoreType['messageList'] = {};
+    for (let i = 0; i < messages.length; i++) {
+      const message = messages[i];
+      const previousMessage = isFlashList ? messages[i - 1] : messages[i + 1];
+      const nextMessage = isFlashList ? messages[i + 1] : messages[i - 1];
+
+      const existing = prevMessageList[message.id];
+
+      if (
+        existing &&
+        existing.previousMessage === previousMessage &&
+        existing.nextMessage === nextMessage
+      ) {
+        newMessageList[message.id] = existing;
+      } else {
+        newMessageList[message.id] = {
+          nextMessage,
+          previousMessage,
+        };
+      }
+    }
+    this.state.partialNext({ messageList: newMessageList });
+  }
+}

package/src/store/apis/getChannelMessages.ts

@@ -4,7 +4,6 @@ import { selectMessagesForChannels } from './queries/selectMessagesForChannels';
 
 import { selectReactionsForMessages } from './queries/selectReactionsForMessages';
 
-import { isBlockedMessage } from '../../utils/utils';
 import { mapStorableToMessage } from '../mappers/mapStorableToMessage';
 import { createSelectQuery } from '../sqlite-utils/createSelectQuery';
 import { SqliteClient } from '../SqliteClient';
@@ -82,17 +81,15 @@ export const getChannelMessages = async ({
       cidVsMessages[m.cid] = [];
     }
 
-    if (!isBlockedMessage(m)) {
-      cidVsMessages[m.cid].push(
-        mapStorableToMessage({
-          currentUserId,
-          messageRow: m,
-          pollRow: messageIdsVsPolls[m.poll_id],
-          reactionRows: messageIdVsReactions[m.id],
-          reminderRow: messageIdsVsReminders[m.id],
-        }),
-      );
-    }
+    cidVsMessages[m.cid].push(
+      mapStorableToMessage({
+        currentUserId,
+        messageRow: m,
+        pollRow: messageIdsVsPolls[m.poll_id],
+        reactionRows: messageIdVsReactions[m.id],
+        reminderRow: messageIdsVsReminders[m.id],
+      }),
+    );
   });
 
   return cidVsMessages;

package/src/utils/utils.ts

@@ -10,7 +10,6 @@ import type {
 } from 'stream-chat';
 
 import { IconProps } from '../../src/icons/utils/base';
-import type { TableRowJoinedUser } from '../store/types';
 import { ValueOf } from '../types/types';
 
 export type ReactionData = {
@@ -74,10 +73,12 @@ export const getIndicatorTypeForFileState = (
  * @param message
  * @returns boolean
  */
-export const isBlockedMessage = (message: LocalMessage | TableRowJoinedUser<'messages'>) => {
-  // The only indicator for the blocked message is its message type is error and that the message text contains "Message was blocked by moderation policies".
-  const pattern = /\bMessage was blocked by moderation policies\b/;
-  return message.type === 'error' && message.text && pattern.test(message.text);
+export const isBlockedMessage = (message: LocalMessage) => {
+  return (
+    message.type === 'error' &&
+    (message.moderation_details?.action === 'MESSAGE_RESPONSE_ACTION_REMOVE' ||
+      message.moderation?.action === 'remove')
+  );
 };
 
 /**
@@ -86,9 +87,9 @@ export const isBlockedMessage = (message: LocalMessage | TableRowJoinedUser<'mes
  * @returns boolean
  */
 export const isBouncedMessage = (message: LocalMessage) =>
-  (message.type === 'error' &&
-    message?.moderation_details?.action === 'MESSAGE_RESPONSE_ACTION_BOUNCE') ||
-  message?.moderation?.action === 'bounce';
+  message.type === 'error' &&
+  (message?.moderation_details?.action === 'MESSAGE_RESPONSE_ACTION_BOUNCE' ||
+    message?.moderation?.action === 'bounce');
 
 /**
  * Utility to check if the message is a edited message.

package/src/version.json

@@ -1,3 +1,3 @@
 {
-  "version": "8.11.0"
+  "version": "8.12.0"
 }

package/src/components/MessageList/utils/__tests__/getDateSeparators.test.ts

@@ -1,71 +0,0 @@
-import type { PaginatedMessageListContextValue } from '../../../../contexts/paginatedMessageListContext/PaginatedMessageListContext';
-import { getDateSeparators } from '../getDateSeparators';
-
-describe('getDateSeparators', () => {
-  it('should return an empty object if no messages are passed', () => {
-    expect(getDateSeparators({ messages: [] })).toEqual({});
-  });
-
-  it('should return a date separator for each message in a new day', () => {
-    const firstDate = new Date('2020-01-01T00:00:00.000Z');
-    const secondDate = new Date('2020-01-02T00:00:00.000Z');
-    const messages = [
-      {
-        created_at: firstDate,
-        id: '1',
-        text: 'foo',
-      },
-      {
-        created_at: secondDate,
-        id: '2',
-        text: 'bar',
-      },
-      {
-        created_at: secondDate,
-        id: '3',
-        text: 'baz',
-      },
-    ] as PaginatedMessageListContextValue['messages'];
-
-    expect(getDateSeparators({ messages })).toEqual({
-      1: firstDate,
-      2: secondDate,
-    });
-  });
-
-  it('should return a date separator for the visible message in a day if deleted messages are not visible to the user', () => {
-    const firstDate = new Date('2020-01-01T00:00:00.000Z');
-    const secondDate = new Date('2020-01-02T00:00:00.000Z');
-
-    const messages = [
-      {
-        created_at: firstDate,
-        id: '1',
-        text: 'foo',
-        type: 'regular',
-      },
-      {
-        created_at: secondDate,
-        id: '2',
-        text: 'bar',
-        type: 'deleted',
-      },
-      {
-        created_at: secondDate,
-        id: '3',
-        text: 'baz',
-        type: 'regular',
-      },
-    ] as PaginatedMessageListContextValue['messages'];
-
-    expect(getDateSeparators({ deletedMessagesVisibilityType: 'never', messages })).toEqual({
-      1: firstDate,
-      3: secondDate,
-    });
-
-    expect(getDateSeparators({ deletedMessagesVisibilityType: 'receiver', messages })).toEqual({
-      1: firstDate,
-      3: secondDate,
-    });
-  });
-});