chore: introduced a new messageListQueryParams

Author: bang9

packages/uikit-react-native/src/domain/groupChannel/types.ts

@@ -1,6 +1,7 @@
 import type React from 'react';
 import type { FlatList } from 'react-native';
 
+import type { MessageCollectionParams, MessageFilterParams } from '@sendbird/chat/groupChannel';
 import type { UseGroupChannelMessagesOptions } from '@sendbird/uikit-chat-hooks';
 import type {
   OnBeforeHandler,
@@ -20,6 +21,7 @@ import type { ChannelMessageListProps } from '../../components/ChannelMessageLis
 import type { CommonComponent } from '../../types';
 import type { PubSub } from '../../utils/pubsub';
 
+export type MessageListQueryParamsType = Omit<MessageCollectionParams, 'filter'> & MessageFilterParams;
 export interface GroupChannelProps {
   Fragment: {
     channel: SendbirdGroupChannel;
@@ -43,9 +45,19 @@ export interface GroupChannelProps {
     keyboardAvoidOffset?: GroupChannelProps['Provider']['keyboardAvoidOffset'];
     flatListProps?: GroupChannelProps['MessageList']['flatListProps'];
     sortComparator?: UseGroupChannelMessagesOptions['sortComparator'];
-    collectionCreator?: UseGroupChannelMessagesOptions['collectionCreator'];
 
     searchItem?: GroupChannelProps['MessageList']['searchItem'];
+
+    /**
+     * @description You can specify the query parameters for the message list.
+     * @example
+     * ```
+     * <GroupChannelFragment messageListQueryParams={{ prevResultLimit: 20, customTypesFilter: ['filter'] }} />
+     * ```
+     * */
+    messageListQueryParams?: MessageListQueryParamsType;
+    /** @deprecated Please use `messageListQueryParams` instead */
+    collectionCreator?: UseGroupChannelMessagesOptions['collectionCreator'];
   };
   Header: {
     shouldHideRight: () => boolean;

packages/uikit-react-native/src/fragments/createGroupChannelFragment.tsx

@@ -1,14 +1,13 @@
 import React, { useCallback, useEffect, useMemo, useState } from 'react';
 
+import { MessageCollection, MessageFilter } from '@sendbird/chat/groupChannel';
 import { ReplyType } from '@sendbird/chat/message';
 import { Box } from '@sendbird/uikit-react-native-foundation';
 import { useGroupChannelMessages } from '@sendbird/uikit-tools';
+import type { SendbirdFileMessage, SendbirdGroupChannel, SendbirdUserMessage } from '@sendbird/uikit-utils';
 import {
   NOOP,
   PASS,
-  SendbirdFileMessage,
-  SendbirdGroupChannel,
-  SendbirdUserMessage,
   confirmAndMarkAsRead,
   messageComparator,
   useFreshCallback,
@@ -52,9 +51,10 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
     onBeforeUpdateFileMessage = PASS,
     channel,
     keyboardAvoidOffset,
-    collectionCreator,
     sortComparator = messageComparator,
     flatListProps,
+    messageListQueryParams,
+    collectionCreator,
   }) => {
     const { playerService, recorderService } = usePlatformService();
     const { sdk, currentUser, sbOptions } = useSendbirdChat();
@@ -96,7 +96,7 @@ const createGroupChannelFragment = (initModule?: Partial<GroupChannelModule>): G
       },
       onChannelDeleted,
       onCurrentUserBanned: onChannelDeleted,
-      collectionCreator,
+      collectionCreator: getCollectionCreator(channel, messageListQueryParams, collectionCreator),
       sortComparator,
       markAsRead: confirmAndMarkAsRead,
       replyType,
@@ -260,4 +260,20 @@ function shouldRenderInput(channel: SendbirdGroupChannel) {
   return true;
 }
 
+function getCollectionCreator(
+  channel: SendbirdGroupChannel,
+  messageListQueryParams?: GroupChannelProps['Fragment']['messageListQueryParams'],
+  deprecatedCreatorProp?: () => MessageCollection,
+) {
+  if (!messageListQueryParams && deprecatedCreatorProp) return deprecatedCreatorProp;
+
+  return (defaultParams: GroupChannelProps['Fragment']['messageListQueryParams']) => {
+    const params = { ...defaultParams, ...messageListQueryParams };
+    return channel.createMessageCollection({
+      ...params,
+      filter: new MessageFilter(params),
+    });
+  };
+}
+
 export default createGroupChannelFragment;

sample/src/screens/uikit/groupChannel/GroupChannelScreen.tsx

@@ -97,6 +97,10 @@ const GroupChannelScreen = () => {
         // Navigate to group channel settings
         navigation.push(Routes.GroupChannelSettings, params);
       }}
+      // messageListQueryParams={{
+      //   prevResultLimit: 20,
+      //   customTypesFilter: ['filter'],
+      // }}
     />
   );
 };