@sendbird/uikit-react-native 3.4.0 → 3.4.2

package/lib/module/fragments/createGroupChannelListFragment.js

@@ -1,6 +1,7 @@
 import React from 'react';
-import { useGroupChannelList } from '@sendbird/uikit-chat-hooks';
-import { PASS, useAppState, useFreshCallback } from '@sendbird/uikit-utils';
+import { GroupChannelFilter } from '@sendbird/chat/groupChannel';
+import { useGroupChannelList } from '@sendbird/uikit-tools';
+import { PASS, confirmAndMarkAsDelivered, useAppState, useFreshCallback } from '@sendbird/uikit-utils';
 import StatusComposition from '../components/StatusComposition';
 import GroupChannelPreviewContainer from '../containers/GroupChannelPreviewContainer';
 import createGroupChannelListModule from '../domain/groupChannelList/module/createGroupChannelListModule';
@@ -11,45 +12,45 @@ const createGroupChannelListFragment = initModule => {
     let {
       onPressChannel,
       onPressCreateChannel,
-      collectionCreator,
       renderGroupChannelPreview,
       skipTypeSelection = false,
       flatListProps = {},
-      menuItemCreator = PASS
+      menuItemCreator = PASS,
+      channelListQueryParams,
+      collectionCreator
     } = _ref;
     const {
       sdk,
-      currentUser,
       sbOptions,
       markAsDeliveredWithChannel
     } = useSendbirdChat();
     const {
       groupChannels,
-      next,
-      loading
-    } = useGroupChannelList(sdk, currentUser === null || currentUser === void 0 ? void 0 : currentUser.userId, {
-      collectionCreator,
-      enableCollectionWithoutLocalCache: true
+      loadMore,
+      initialized
+    } = useGroupChannelList(sdk, {
+      collectionCreator: getCollectionCreator(sdk, channelListQueryParams, collectionCreator),
+      markAsDelivered: confirmAndMarkAsDelivered
     });
-    if (sbOptions.appInfo.deliveryReceiptEnabled) {
-      useAppState('change', status => {
+    useAppState('change', status => {
+      if (sbOptions.appInfo.deliveryReceiptEnabled) {
         if (status === 'active') groupChannels.forEach(markAsDeliveredWithChannel);
-      });
-    }
+      }
+    });
     const _renderGroupChannelPreview = useFreshCallback(props => {
       if (renderGroupChannelPreview) return renderGroupChannelPreview(props);
       return /*#__PURE__*/React.createElement(GroupChannelPreviewContainer, props);
     });
     const isChannelTypeAvailable = sbOptions.appInfo.broadcastChannelEnabled || sbOptions.appInfo.superGroupChannelEnabled;
     return /*#__PURE__*/React.createElement(GroupChannelListModule.Provider, null, /*#__PURE__*/React.createElement(GroupChannelListModule.Header, null), /*#__PURE__*/React.createElement(StatusComposition, {
-      loading: loading,
+      loading: !initialized,
       LoadingComponent: /*#__PURE__*/React.createElement(GroupChannelListModule.StatusLoading, null)
     }, /*#__PURE__*/React.createElement(GroupChannelListModule.List, {
       onPressChannel: onPressChannel,
       menuItemCreator: menuItemCreator,
       renderGroupChannelPreview: _renderGroupChannelPreview,
       groupChannels: groupChannels,
-      onLoadNext: next,
+      onLoadNext: loadMore,
       flatListProps: {
         ListEmptyComponent: /*#__PURE__*/React.createElement(GroupChannelListModule.StatusEmpty, null),
         contentContainerStyle: {
@@ -63,5 +64,18 @@ const createGroupChannelListFragment = initModule => {
     }));
   };
 };
+function getCollectionCreator(sdk, channelListQueryParams, deprecatedCreatorProp) {
+  if (!channelListQueryParams && deprecatedCreatorProp) return deprecatedCreatorProp;
+  return defaultParams => {
+    const params = {
+      ...defaultParams,
+      ...channelListQueryParams
+    };
+    return sdk.groupChannel.createGroupChannelCollection({
+      ...params,
+      filter: new GroupChannelFilter(params)
+    });
+  };
+}
 export default createGroupChannelListFragment;
 //# sourceMappingURL=createGroupChannelListFragment.js.map

package/lib/module/fragments/createGroupChannelListFragment.js.map

@@ -1 +1 @@
-{"version":3,"names":["React","useGroupChannelList","PASS","useAppState","useFreshCallback","StatusComposition","GroupChannelPreviewContainer","createGroupChannelListModule","useSendbirdChat","createGroupChannelListFragment","initModule","GroupChannelListModule","_ref","onPressChannel","onPressCreateChannel","collectionCreator","renderGroupChannelPreview","skipTypeSelection","flatListProps","menuItemCreator","sdk","currentUser","sbOptions","markAsDeliveredWithChannel","groupChannels","next","loading","userId","enableCollectionWithoutLocalCache","appInfo","deliveryReceiptEnabled","status","forEach","_renderGroupChannelPreview","props","createElement","isChannelTypeAvailable","broadcastChannelEnabled","superGroupChannelEnabled","Provider","Header","LoadingComponent","StatusLoading","List","onLoadNext","ListEmptyComponent","StatusEmpty","contentContainerStyle","flexGrow","TypeSelector","onSelectType"],"sources":["createGroupChannelListFragment.tsx"],"sourcesContent":["import React from 'react';\n\nimport { useGroupChannelList } from '@sendbird/uikit-chat-hooks';\nimport { PASS, useAppState, useFreshCallback } from '@sendbird/uikit-utils';\n\nimport StatusComposition from '../components/StatusComposition';\nimport GroupChannelPreviewContainer from '../containers/GroupChannelPreviewContainer';\nimport createGroupChannelListModule from '../domain/groupChannelList/module/createGroupChannelListModule';\nimport type {\n  GroupChannelListFragment,\n  GroupChannelListModule,\n  GroupChannelListProps,\n} from '../domain/groupChannelList/types';\nimport { useSendbirdChat } from '../hooks/useContext';\n\nconst createGroupChannelListFragment = (initModule?: Partial<GroupChannelListModule>): GroupChannelListFragment => {\n  const GroupChannelListModule = createGroupChannelListModule(initModule);\n  return ({\n    onPressChannel,\n    onPressCreateChannel,\n    collectionCreator,\n    renderGroupChannelPreview,\n    skipTypeSelection = false,\n    flatListProps = {},\n    menuItemCreator = PASS,\n  }) => {\n    const { sdk, currentUser, sbOptions, markAsDeliveredWithChannel } = useSendbirdChat();\n    const { groupChannels, next, loading } = useGroupChannelList(sdk, currentUser?.userId, {\n      collectionCreator,\n      enableCollectionWithoutLocalCache: true,\n    });\n\n    if (sbOptions.appInfo.deliveryReceiptEnabled) {\n      useAppState('change', (status) => {\n        if (status === 'active') groupChannels.forEach(markAsDeliveredWithChannel);\n      });\n    }\n\n    const _renderGroupChannelPreview: GroupChannelListProps['List']['renderGroupChannelPreview'] = useFreshCallback(\n      (props) => {\n        if (renderGroupChannelPreview) return renderGroupChannelPreview(props);\n        return <GroupChannelPreviewContainer {...props} />;\n      },\n    );\n\n    const isChannelTypeAvailable =\n      sbOptions.appInfo.broadcastChannelEnabled || sbOptions.appInfo.superGroupChannelEnabled;\n\n    return (\n      <GroupChannelListModule.Provider>\n        <GroupChannelListModule.Header />\n        <StatusComposition loading={loading} LoadingComponent={<GroupChannelListModule.StatusLoading />}>\n          <GroupChannelListModule.List\n            onPressChannel={onPressChannel}\n            menuItemCreator={menuItemCreator}\n            renderGroupChannelPreview={_renderGroupChannelPreview}\n            groupChannels={groupChannels}\n            onLoadNext={next}\n            flatListProps={{\n              ListEmptyComponent: <GroupChannelListModule.StatusEmpty />,\n              contentContainerStyle: { flexGrow: 1 },\n              ...flatListProps,\n            }}\n          />\n        </StatusComposition>\n        <GroupChannelListModule.TypeSelector\n          skipTypeSelection={isChannelTypeAvailable ? skipTypeSelection : true}\n          onSelectType={onPressCreateChannel}\n        />\n      </GroupChannelListModule.Provider>\n    );\n  };\n};\n\nexport default createGroupChannelListFragment;\n"],"mappings":"AAAA,OAAOA,KAAK,MAAM,OAAO;AAEzB,SAASC,mBAAmB,QAAQ,4BAA4B;AAChE,SAASC,IAAI,EAAEC,WAAW,EAAEC,gBAAgB,QAAQ,uBAAuB;AAE3E,OAAOC,iBAAiB,MAAM,iCAAiC;AAC/D,OAAOC,4BAA4B,MAAM,4CAA4C;AACrF,OAAOC,4BAA4B,MAAM,gEAAgE;AAMzG,SAASC,eAAe,QAAQ,qBAAqB;AAErD,MAAMC,8BAA8B,GAAIC,UAA4C,IAA+B;EACjH,MAAMC,sBAAsB,GAAGJ,4BAA4B,CAACG,UAAU,CAAC;EACvE,OAAOE,IAAA,IAQD;IAAA,IARE;MACNC,cAAc;MACdC,oBAAoB;MACpBC,iBAAiB;MACjBC,yBAAyB;MACzBC,iBAAiB,GAAG,KAAK;MACzBC,aAAa,GAAG,CAAC,CAAC;MAClBC,eAAe,GAAGjB;IACpB,CAAC,GAAAU,IAAA;IACC,MAAM;MAAEQ,GAAG;MAAEC,WAAW;MAAEC,SAAS;MAAEC;IAA2B,CAAC,GAAGf,eAAe,EAAE;IACrF,MAAM;MAAEgB,aAAa;MAAEC,IAAI;MAAEC;IAAQ,CAAC,GAAGzB,mBAAmB,CAACmB,GAAG,EAAEC,WAAW,aAAXA,WAAW,uBAAXA,WAAW,CAAEM,MAAM,EAAE;MACrFZ,iBAAiB;MACjBa,iCAAiC,EAAE;IACrC,CAAC,CAAC;IAEF,IAAIN,SAAS,CAACO,OAAO,CAACC,sBAAsB,EAAE;MAC5C3B,WAAW,CAAC,QAAQ,EAAG4B,MAAM,IAAK;QAChC,IAAIA,MAAM,KAAK,QAAQ,EAAEP,aAAa,CAACQ,OAAO,CAACT,0BAA0B,CAAC;MAC5E,CAAC,CAAC;IACJ;IAEA,MAAMU,0BAAsF,GAAG7B,gBAAgB,CAC5G8B,KAAK,IAAK;MACT,IAAIlB,yBAAyB,EAAE,OAAOA,yBAAyB,CAACkB,KAAK,CAAC;MACtE,oBAAOlC,KAAA,CAAAmC,aAAA,CAAC7B,4BAA4B,EAAK4B,KAAK,CAAI;IACpD,CAAC,CACF;IAED,MAAME,sBAAsB,GAC1Bd,SAAS,CAACO,OAAO,CAACQ,uBAAuB,IAAIf,SAAS,CAACO,OAAO,CAACS,wBAAwB;IAEzF,oBACEtC,KAAA,CAAAmC,aAAA,CAACxB,sBAAsB,CAAC4B,QAAQ,qBAC9BvC,KAAA,CAAAmC,aAAA,CAACxB,sBAAsB,CAAC6B,MAAM,OAAG,eACjCxC,KAAA,CAAAmC,aAAA,CAAC9B,iBAAiB;MAACqB,OAAO,EAAEA,OAAQ;MAACe,gBAAgB,eAAEzC,KAAA,CAAAmC,aAAA,CAACxB,sBAAsB,CAAC+B,aAAa;IAAI,gBAC9F1C,KAAA,CAAAmC,aAAA,CAACxB,sBAAsB,CAACgC,IAAI;MAC1B9B,cAAc,EAAEA,cAAe;MAC/BM,eAAe,EAAEA,eAAgB;MACjCH,yBAAyB,EAAEiB,0BAA2B;MACtDT,aAAa,EAAEA,aAAc;MAC7BoB,UAAU,EAAEnB,IAAK;MACjBP,aAAa,EAAE;QACb2B,kBAAkB,eAAE7C,KAAA,CAAAmC,aAAA,CAACxB,sBAAsB,CAACmC,WAAW,OAAG;QAC1DC,qBAAqB,EAAE;UAAEC,QAAQ,EAAE;QAAE,CAAC;QACtC,GAAG9B;MACL;IAAE,EACF,CACgB,eACpBlB,KAAA,CAAAmC,aAAA,CAACxB,sBAAsB,CAACsC,YAAY;MAClChC,iBAAiB,EAAEmB,sBAAsB,GAAGnB,iBAAiB,GAAG,IAAK;MACrEiC,YAAY,EAAEpC;IAAqB,EACnC,CAC8B;EAEtC,CAAC;AACH,CAAC;AAED,eAAeL,8BAA8B"}
+{"version":3,"names":["React","GroupChannelFilter","useGroupChannelList","PASS","confirmAndMarkAsDelivered","useAppState","useFreshCallback","StatusComposition","GroupChannelPreviewContainer","createGroupChannelListModule","useSendbirdChat","createGroupChannelListFragment","initModule","GroupChannelListModule","_ref","onPressChannel","onPressCreateChannel","renderGroupChannelPreview","skipTypeSelection","flatListProps","menuItemCreator","channelListQueryParams","collectionCreator","sdk","sbOptions","markAsDeliveredWithChannel","groupChannels","loadMore","initialized","getCollectionCreator","markAsDelivered","status","appInfo","deliveryReceiptEnabled","forEach","_renderGroupChannelPreview","props","createElement","isChannelTypeAvailable","broadcastChannelEnabled","superGroupChannelEnabled","Provider","Header","loading","LoadingComponent","StatusLoading","List","onLoadNext","ListEmptyComponent","StatusEmpty","contentContainerStyle","flexGrow","TypeSelector","onSelectType","deprecatedCreatorProp","defaultParams","params","groupChannel","createGroupChannelCollection","filter"],"sources":["createGroupChannelListFragment.tsx"],"sourcesContent":["import React from 'react';\n\nimport { GroupChannelCollection, GroupChannelFilter } from '@sendbird/chat/groupChannel';\nimport { useGroupChannelList } from '@sendbird/uikit-tools';\nimport { PASS, SendbirdChatSDK, confirmAndMarkAsDelivered, useAppState, useFreshCallback } from '@sendbird/uikit-utils';\n\nimport StatusComposition from '../components/StatusComposition';\nimport GroupChannelPreviewContainer from '../containers/GroupChannelPreviewContainer';\nimport createGroupChannelListModule from '../domain/groupChannelList/module/createGroupChannelListModule';\nimport type {\n  GroupChannelListFragment,\n  GroupChannelListModule,\n  GroupChannelListProps,\n} from '../domain/groupChannelList/types';\nimport { useSendbirdChat } from '../hooks/useContext';\n\nconst createGroupChannelListFragment = (initModule?: Partial<GroupChannelListModule>): GroupChannelListFragment => {\n  const GroupChannelListModule = createGroupChannelListModule(initModule);\n  return ({\n    onPressChannel,\n    onPressCreateChannel,\n    renderGroupChannelPreview,\n    skipTypeSelection = false,\n    flatListProps = {},\n    menuItemCreator = PASS,\n    channelListQueryParams,\n    collectionCreator,\n  }) => {\n    const { sdk, sbOptions, markAsDeliveredWithChannel } = useSendbirdChat();\n    const { groupChannels, loadMore, initialized } = useGroupChannelList(sdk, {\n      collectionCreator: getCollectionCreator(sdk, channelListQueryParams, collectionCreator),\n      markAsDelivered: confirmAndMarkAsDelivered,\n    });\n\n    useAppState('change', (status) => {\n      if (sbOptions.appInfo.deliveryReceiptEnabled) {\n        if (status === 'active') groupChannels.forEach(markAsDeliveredWithChannel);\n      }\n    });\n\n    const _renderGroupChannelPreview: GroupChannelListProps['List']['renderGroupChannelPreview'] = useFreshCallback(\n      (props) => {\n        if (renderGroupChannelPreview) return renderGroupChannelPreview(props);\n        return <GroupChannelPreviewContainer {...props} />;\n      },\n    );\n\n    const isChannelTypeAvailable =\n      sbOptions.appInfo.broadcastChannelEnabled || sbOptions.appInfo.superGroupChannelEnabled;\n\n    return (\n      <GroupChannelListModule.Provider>\n        <GroupChannelListModule.Header />\n        <StatusComposition loading={!initialized} LoadingComponent={<GroupChannelListModule.StatusLoading />}>\n          <GroupChannelListModule.List\n            onPressChannel={onPressChannel}\n            menuItemCreator={menuItemCreator}\n            renderGroupChannelPreview={_renderGroupChannelPreview}\n            groupChannels={groupChannels}\n            onLoadNext={loadMore}\n            flatListProps={{\n              ListEmptyComponent: <GroupChannelListModule.StatusEmpty />,\n              contentContainerStyle: { flexGrow: 1 },\n              ...flatListProps,\n            }}\n          />\n        </StatusComposition>\n        <GroupChannelListModule.TypeSelector\n          skipTypeSelection={isChannelTypeAvailable ? skipTypeSelection : true}\n          onSelectType={onPressCreateChannel}\n        />\n      </GroupChannelListModule.Provider>\n    );\n  };\n};\n\nfunction getCollectionCreator(\n  sdk: SendbirdChatSDK,\n  channelListQueryParams?: GroupChannelListProps['Fragment']['channelListQueryParams'],\n  deprecatedCreatorProp?: () => GroupChannelCollection,\n) {\n  if (!channelListQueryParams && deprecatedCreatorProp) return deprecatedCreatorProp;\n\n  return (defaultParams: GroupChannelListProps['Fragment']['channelListQueryParams']) => {\n    const params = { ...defaultParams, ...channelListQueryParams };\n    return sdk.groupChannel.createGroupChannelCollection({\n      ...params,\n      filter: new GroupChannelFilter(params),\n    });\n  };\n}\n\nexport default createGroupChannelListFragment;\n"],"mappings":"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"}

package/lib/module/types.js.map

@@ -1 +1 @@
-{"version":3,"names":["TypingIndicatorType"],"sources":["types.ts"],"sourcesContent":["import type { ErrorInfo, ReactNode } from 'react';\n\nimport type { SendbirdUser } from '@sendbird/uikit-utils';\n\nexport type KeyValuePairGet = [string, string | null];\nexport type KeyValuePairSet = [string, string];\nexport interface LocalCacheStorage {\n  getAllKeys(): Promise<readonly string[] | string[]>;\n  getItem(key: string): Promise<string | null>;\n  setItem(key: string, value: string): Promise<void>;\n  removeItem(key: string): Promise<void>;\n\n  multiSet?(keyValuePairs: Array<KeyValuePairSet>): Promise<void>;\n  multiGet?(keys: string[]): Promise<readonly KeyValuePairGet[] | KeyValuePairGet[]>;\n  multiRemove?(keys: string[]): Promise<void>;\n}\n\nexport type ErrorBoundaryProps = { error: Error; errorInfo: ErrorInfo; reset: () => void };\n\nexport type CommonComponent<P = {}> = (props: P & { children?: ReactNode }) => null | ReactNode;\n\nexport type MentionedUser = {\n  range: Range;\n  user: SendbirdUser;\n};\n\nexport type Range = {\n  start: number;\n  end: number;\n};\n\nexport enum TypingIndicatorType {\n  Text = 'text',\n  Bubble = 'bubble',\n}\n"],"mappings":"AA+BA,WAAYA,mBAAmB,0BAAnBA,mBAAmB;EAAnBA,mBAAmB;EAAnBA,mBAAmB;EAAA,OAAnBA,mBAAmB;AAAA"}
+{"version":3,"names":["TypingIndicatorType"],"sources":["types.ts"],"sourcesContent":["import type { ComponentType, ErrorInfo, ReactNode } from 'react';\n\nimport type { SendbirdUser } from '@sendbird/uikit-utils';\n\nexport type KeyValuePairGet = [string, string | null];\nexport type KeyValuePairSet = [string, string];\nexport interface LocalCacheStorage {\n  getAllKeys(): Promise<readonly string[] | string[]>;\n  getItem(key: string): Promise<string | null>;\n  setItem(key: string, value: string): Promise<void>;\n  removeItem(key: string): Promise<void>;\n\n  multiSet?(keyValuePairs: Array<KeyValuePairSet>): Promise<void>;\n  multiGet?(keys: string[]): Promise<readonly KeyValuePairGet[] | KeyValuePairGet[]>;\n  multiRemove?(keys: string[]): Promise<void>;\n}\n\nexport type ErrorBoundaryProps = { error: Error; errorInfo: ErrorInfo; reset: () => void };\n\nexport type CommonComponent<P = {}> = ComponentType<P & { children?: ReactNode | undefined }>;\n\nexport type MentionedUser = {\n  range: Range;\n  user: SendbirdUser;\n};\n\nexport type Range = {\n  start: number;\n  end: number;\n};\n\nexport enum TypingIndicatorType {\n  Text = 'text',\n  Bubble = 'bubble',\n}\n"],"mappings":"AA+BA,WAAYA,mBAAmB,0BAAnBA,mBAAmB;EAAnBA,mBAAmB;EAAnBA,mBAAmB;EAAA,OAAnBA,mBAAmB;AAAA"}

package/lib/module/version.js

@@ -1,3 +1,3 @@
-const VERSION = '3.4.0';
+const VERSION = '3.4.2';
 export default VERSION;
 //# sourceMappingURL=version.js.map

package/lib/module/version.js.map

@@ -1 +1 @@
-{"version":3,"names":["VERSION"],"sources":["version.ts"],"sourcesContent":["const VERSION = '3.4.0';\nexport default VERSION;\n"],"mappings":"AAAA,MAAMA,OAAO,GAAG,OAAO;AACvB,eAAeA,OAAO"}
+{"version":3,"names":["VERSION"],"sources":["version.ts"],"sourcesContent":["const VERSION = '3.4.2';\nexport default VERSION;\n"],"mappings":"AAAA,MAAMA,OAAO,GAAG,OAAO;AACvB,eAAeA,OAAO"}

package/lib/typescript/src/components/ChannelInput/index.d.ts

@@ -1,7 +1,7 @@
 import React from 'react';
 import { StyleProp, TextStyle } from 'react-native';
 import { SendbirdBaseChannel, SendbirdFileMessage, SendbirdFileMessageCreateParams, SendbirdFileMessageUpdateParams, SendbirdMember, SendbirdUserMessage, SendbirdUserMessageCreateParams, SendbirdUserMessageUpdateParams } from '@sendbird/uikit-utils';
-import type { MentionedUser, Range } from '../../types';
+import type { CommonComponent, MentionedUser, Range } from '../../types';
 import type { AttachmentsButtonProps } from './AttachmentsButton';
 import type { MessageToReplyPreviewProps } from './MessageToReplyPreview';
 import { VoiceMessageInputProps } from './VoiceMessageInput';
@@ -30,7 +30,7 @@ export type ChannelInputProps = {
     setMessageToEdit: (message?: undefined | SendbirdUserMessage | SendbirdFileMessage) => void;
     messageToReply?: undefined | SendbirdUserMessage | SendbirdFileMessage;
     setMessageToReply?: (message?: undefined | SendbirdUserMessage | SendbirdFileMessage) => void;
-    SuggestedMentionList?: (props: SuggestedMentionListProps) => React.ReactNode | null;
+    SuggestedMentionList?: CommonComponent<SuggestedMentionListProps>;
     AttachmentsButton?: (props: AttachmentsButtonProps) => React.ReactNode | null;
     MessageToReplyPreview?: (props: MessageToReplyPreviewProps) => React.ReactNode | null;
     VoiceMessageInput?: (props: VoiceMessageInputProps) => React.ReactNode | null;

package/lib/typescript/src/components/ChannelMessageList/index.d.ts

@@ -3,7 +3,6 @@ import { FlatList, FlatListProps } from 'react-native';
 import { BottomSheetItem } from '@sendbird/uikit-react-native-foundation';
 import { SendbirdFileMessage, SendbirdGroupChannel, SendbirdMessage, SendbirdOpenChannel, SendbirdUserMessage } from '@sendbird/uikit-utils';
 import type { UserProfileContextType } from '../../contexts/UserProfileCtx';
-import type { CommonComponent } from '../../types';
 type HandleableMessage = SendbirdUserMessage | SendbirdFileMessage;
 export type ChannelMessageListProps<T extends SendbirdGroupChannel | SendbirdOpenChannel> = {
     enableMessageGrouping: boolean;
@@ -42,15 +41,15 @@ export type ChannelMessageListProps<T extends SendbirdGroupChannel | SendbirdOpe
         bottomSheetItem?: BottomSheetItem;
         isFirstItem: boolean;
     }) => React.ReactElement | null;
-    renderNewMessagesButton: null | CommonComponent<{
+    renderNewMessagesButton: null | ((props: {
         visible: boolean;
         onPress: () => void;
         newMessages: SendbirdMessage[];
-    }>;
-    renderScrollToBottomButton: null | CommonComponent<{
+    }) => React.ReactElement | null);
+    renderScrollToBottomButton: null | ((props: {
         visible: boolean;
         onPress: () => void;
-    }>;
+    }) => React.ReactElement | null);
     flatListProps?: Omit<FlatListProps<SendbirdMessage>, 'data' | 'renderItem'>;
 } & {
     ref?: Ref<FlatList<SendbirdMessage>> | undefined;

package/lib/typescript/src/containers/SendbirdUIKitContainer.d.ts

@@ -13,7 +13,7 @@ import type { StringSet } from '../localization/StringSet.type';
 import type { ClipboardServiceInterface, FileServiceInterface, MediaServiceInterface, NotificationServiceInterface, PlayerServiceInterface, RecorderServiceInterface } from '../platform/types';
 import type { ErrorBoundaryProps, LocalCacheStorage } from '../types';
 export declare const SendbirdUIKit: Readonly<{
-    VERSION: "3.4.0";
+    VERSION: "3.4.2";
     PLATFORM: string;
     DEFAULT: {
         AUTO_PUSH_TOKEN_REGISTRATION: boolean;

package/lib/typescript/src/domain/groupChannel/types.d.ts

@@ -1,11 +1,13 @@
 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, SendbirdFileMessage, SendbirdFileMessageCreateParams, SendbirdFileMessageUpdateParams, SendbirdGroupChannel, SendbirdMessage, SendbirdUser, SendbirdUserMessage, SendbirdUserMessageCreateParams, SendbirdUserMessageUpdateParams } from '@sendbird/uikit-utils';
 import type { ChannelInputProps, SuggestedMentionListProps } from '../../components/ChannelInput';
 import type { ChannelMessageListProps } from '../../components/ChannelMessageList';
 import type { CommonComponent } from '../../types';
 import type { PubSub } from '../../utils/pubsub';
+export type MessageListQueryParamsType = Omit<MessageCollectionParams, 'filter'> & MessageFilterParams;
 export interface GroupChannelProps {
     Fragment: {
         channel: SendbirdGroupChannel;
@@ -25,8 +27,17 @@ 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;
@@ -120,7 +131,7 @@ export interface GroupChannelModule {
     StatusEmpty: CommonComponent;
     StatusLoading: CommonComponent;
 }
-export type GroupChannelFragment = CommonComponent<GroupChannelProps['Fragment']>;
+export type GroupChannelFragment = React.FC<GroupChannelProps['Fragment']>;
 export type GroupChannelPubSubContextPayload = {
     type: 'MESSAGE_SENT_PENDING' | 'MESSAGE_SENT_SUCCESS';
     data: {

package/lib/typescript/src/domain/groupChannelBannedUsers/types.d.ts

@@ -46,4 +46,4 @@ export interface GroupChannelBannedUsersModule {
     StatusLoading: CommonComponent;
     StatusError: CommonComponent<GroupChannelBannedUsersProps['StatusError']>;
 }
-export type GroupChannelBannedUsersFragment = CommonComponent<GroupChannelBannedUsersProps['Fragment']>;
+export type GroupChannelBannedUsersFragment = React.FC<GroupChannelBannedUsersProps['Fragment']>;

package/lib/typescript/src/domain/groupChannelList/types.d.ts

@@ -1,18 +1,29 @@
 import type React from 'react';
 import type { FlatListProps } from 'react-native';
+import type { GroupChannelCollectionParams, GroupChannelFilterParams } from '@sendbird/chat/groupChannel';
 import type { UseGroupChannelListOptions } from '@sendbird/uikit-chat-hooks';
 import type { ActionMenuItem } from '@sendbird/uikit-react-native-foundation';
 import type { SendbirdGroupChannel } from '@sendbird/uikit-utils';
 import type { CommonComponent } from '../../types';
+export type ChannelListQueryParamsType = Omit<GroupChannelCollectionParams, 'filter'> & GroupChannelFilterParams;
 export interface GroupChannelListProps {
     Fragment: {
         onPressChannel: GroupChannelListProps['List']['onPressChannel'];
         onPressCreateChannel: (channelType: GroupChannelType) => void;
         renderGroupChannelPreview?: GroupChannelListProps['List']['renderGroupChannelPreview'];
         skipTypeSelection?: boolean;
-        collectionCreator?: UseGroupChannelListOptions['collectionCreator'];
         flatListProps?: GroupChannelListProps['List']['flatListProps'];
         menuItemCreator?: GroupChannelListProps['List']['menuItemCreator'];
+        /**
+         * @description You can specify the query parameters for the channel list.
+         * @example
+         * ```
+         * <GroupChannelListFragment channelListQueryParams={{ limit: 20, includeEmpty: false }} />
+         * ```
+         * */
+        channelListQueryParams?: ChannelListQueryParamsType;
+        /** @deprecated Please use `channelListQueryParams` instead */
+        collectionCreator?: UseGroupChannelListOptions['collectionCreator'];
     };
     Header: {};
     List: {
@@ -56,5 +67,5 @@ export interface GroupChannelListModule {
     StatusEmpty: CommonComponent;
     StatusLoading: CommonComponent;
 }
-export type GroupChannelListFragment = CommonComponent<GroupChannelListProps['Fragment']>;
+export type GroupChannelListFragment = React.FC<GroupChannelListProps['Fragment']>;
 export type GroupChannelType = 'GROUP' | 'SUPER_GROUP' | 'BROADCAST';

package/lib/typescript/src/domain/groupChannelModeration/types.d.ts

@@ -40,4 +40,4 @@ export interface GroupChannelModerationModule {
     Header: CommonComponent<GroupChannelModerationProps['Header']>;
     Menu: CommonComponent<GroupChannelModerationProps['Menu']>;
 }
-export type GroupChannelModerationFragment = CommonComponent<GroupChannelModerationProps['Fragment']>;
+export type GroupChannelModerationFragment = React.FC<GroupChannelModerationProps['Fragment']>;

package/lib/typescript/src/domain/groupChannelMutedMembers/types.d.ts

@@ -46,4 +46,4 @@ export interface GroupChannelMutedMembersModule {
     StatusLoading: CommonComponent;
     StatusError: CommonComponent<GroupChannelMutedMembersProps['StatusError']>;
 }
-export type GroupChannelMutedMembersFragment = CommonComponent<GroupChannelMutedMembersProps['Fragment']>;
+export type GroupChannelMutedMembersFragment = React.FC<GroupChannelMutedMembersProps['Fragment']>;

package/lib/typescript/src/domain/groupChannelNotifications/types.d.ts

@@ -30,4 +30,4 @@ export interface GroupChannelNotificationsModule {
     Header: CommonComponent<GroupChannelNotificationsProps['Header']>;
     View: CommonComponent<GroupChannelNotificationsProps['View']>;
 }
-export type GroupChannelNotificationsFragment = CommonComponent<GroupChannelNotificationsProps['Fragment']>;
+export type GroupChannelNotificationsFragment = React.FC<GroupChannelNotificationsProps['Fragment']>;

package/lib/typescript/src/domain/groupChannelOperators/types.d.ts

@@ -48,4 +48,4 @@ export interface GroupChannelOperatorsModule {
     StatusLoading: CommonComponent;
     StatusError: CommonComponent<GroupChannelOperatorsProps['StatusError']>;
 }
-export type GroupChannelOperatorsFragment = CommonComponent<GroupChannelOperatorsProps['Fragment']>;
+export type GroupChannelOperatorsFragment = React.FC<GroupChannelOperatorsProps['Fragment']>;

package/lib/typescript/src/domain/groupChannelSettings/types.d.ts

@@ -48,4 +48,4 @@ export interface GroupChannelSettingsModule {
     Info: CommonComponent<GroupChannelSettingsProps['Info']>;
     Menu: CommonComponent<GroupChannelSettingsProps['Menu']>;
 }
-export type GroupChannelSettingsFragment = CommonComponent<GroupChannelSettingsProps['Fragment']>;
+export type GroupChannelSettingsFragment = React.FC<GroupChannelSettingsProps['Fragment']>;

package/lib/typescript/src/domain/groupChannelUserList/types.d.ts

@@ -1,3 +1,4 @@
+/// <reference types="react" />
 import type { UseUserListOptions } from '@sendbird/uikit-chat-hooks';
 import type { SendbirdGroupChannel, SendbirdGroupChannelCreateParams, SendbirdMember, UserStruct } from '@sendbird/uikit-utils';
 import type { CommonComponent } from '../../types';
@@ -36,7 +37,7 @@ export interface GroupChannelMembersProps {
         queryCreator?: UseUserListOptions<SendbirdMember>['queryCreator'];
     };
 }
-export type GroupChannelMembersFragment = CommonComponent<GroupChannelMembersProps['Fragment']>;
+export type GroupChannelMembersFragment = React.FC<GroupChannelMembersProps['Fragment']>;
 export interface GroupChannelRegisterOperatorProps {
     Fragment: {
         channel: SendbirdGroupChannel;
@@ -47,4 +48,4 @@ export interface GroupChannelRegisterOperatorProps {
         queryCreator?: UseUserListOptions<SendbirdMember>['queryCreator'];
     };
 }
-export type GroupChannelRegisterOperatorFragment = CommonComponent<GroupChannelRegisterOperatorProps['Fragment']>;
+export type GroupChannelRegisterOperatorFragment = React.FC<GroupChannelRegisterOperatorProps['Fragment']>;

package/lib/typescript/src/domain/messageSearch/types.d.ts

@@ -50,4 +50,4 @@ export interface MessageSearchModule {
     StatusLoading: CommonComponent;
     StatusError: CommonComponent<MessageSearchProps['StatusError']>;
 }
-export type MessageSearchFragment = CommonComponent<MessageSearchProps['Fragment']>;
+export type MessageSearchFragment = React.FC<MessageSearchProps['Fragment']>;

package/lib/typescript/src/domain/openChannel/types.d.ts

@@ -63,7 +63,7 @@ export interface OpenChannelModule {
     StatusEmpty: CommonComponent;
     StatusLoading: CommonComponent;
 }
-export type OpenChannelFragment = CommonComponent<OpenChannelProps['Fragment']>;
+export type OpenChannelFragment = React.FC<OpenChannelProps['Fragment']>;
 export type OpenChannelPubSubContextPayload = {
     type: 'MESSAGE_SENT_PENDING' | 'MESSAGE_SENT_SUCCESS';
     data: {

package/lib/typescript/src/domain/openChannelBannedUsers/types.d.ts

@@ -46,4 +46,4 @@ export interface OpenChannelBannedUsersModule {
     StatusLoading: CommonComponent;
     StatusError: CommonComponent<OpenChannelBannedUsersProps['StatusError']>;
 }
-export type OpenChannelBannedUsersFragment = CommonComponent<OpenChannelBannedUsersProps['Fragment']>;
+export type OpenChannelBannedUsersFragment = React.FC<OpenChannelBannedUsersProps['Fragment']>;

package/lib/typescript/src/domain/openChannelCreate/types.d.ts

@@ -37,4 +37,4 @@ export interface OpenChannelCreateModule {
     ProfileInput: CommonComponent<OpenChannelCreateProps['ProfileInput']>;
     StatusLoading: CommonComponent;
 }
-export type OpenChannelCreateFragment = CommonComponent<OpenChannelCreateProps['Fragment']>;
+export type OpenChannelCreateFragment = React.FC<OpenChannelCreateProps['Fragment']>;

package/lib/typescript/src/domain/openChannelList/types.d.ts

@@ -48,4 +48,4 @@ export interface OpenChannelListModule {
     StatusLoading: CommonComponent;
     StatusError: CommonComponent<OpenChannelListProps['StatusError']>;
 }
-export type OpenChannelListFragment = CommonComponent<OpenChannelListProps['Fragment']>;
+export type OpenChannelListFragment = React.FC<OpenChannelListProps['Fragment']>;

package/lib/typescript/src/domain/openChannelModeration/types.d.ts

@@ -40,4 +40,4 @@ export interface OpenChannelModerationModule {
     Header: CommonComponent<OpenChannelModerationProps['Header']>;
     Menu: CommonComponent<OpenChannelModerationProps['Menu']>;
 }
-export type OpenChannelModerationFragment = CommonComponent<OpenChannelModerationProps['Fragment']>;
+export type OpenChannelModerationFragment = React.FC<OpenChannelModerationProps['Fragment']>;

package/lib/typescript/src/domain/openChannelMutedParticipants/types.d.ts

@@ -46,4 +46,4 @@ export interface OpenChannelMutedParticipantsModule {
     StatusLoading: CommonComponent;
     StatusError: CommonComponent<OpenChannelMutedParticipantsProps['StatusError']>;
 }
-export type OpenChannelMutedParticipantsFragment = CommonComponent<OpenChannelMutedParticipantsProps['Fragment']>;
+export type OpenChannelMutedParticipantsFragment = React.FC<OpenChannelMutedParticipantsProps['Fragment']>;

package/lib/typescript/src/domain/openChannelOperators/types.d.ts

@@ -48,4 +48,4 @@ export interface OpenChannelOperatorsModule {
     StatusLoading: CommonComponent;
     StatusError: CommonComponent<OpenChannelOperatorsProps['StatusError']>;
 }
-export type OpenChannelOperatorsFragment = CommonComponent<OpenChannelOperatorsProps['Fragment']>;
+export type OpenChannelOperatorsFragment = React.FC<OpenChannelOperatorsProps['Fragment']>;

package/lib/typescript/src/domain/openChannelSettings/types.d.ts

@@ -46,4 +46,4 @@ export interface OpenChannelSettingsModule {
     Info: CommonComponent<OpenChannelSettingsProps['Info']>;
     Menu: CommonComponent<OpenChannelSettingsProps['Menu']>;
 }
-export type OpenChannelSettingsFragment = CommonComponent<OpenChannelSettingsProps['Fragment']>;
+export type OpenChannelSettingsFragment = React.FC<OpenChannelSettingsProps['Fragment']>;

package/lib/typescript/src/domain/openChannelUserList/types.d.ts

@@ -1,6 +1,6 @@
+import type React from 'react';
 import type { UseUserListOptions } from '@sendbird/uikit-chat-hooks';
 import type { SendbirdOpenChannel, SendbirdParticipant, SendbirdUser } from '@sendbird/uikit-utils';
-import type { CommonComponent } from '../../types';
 import type { UserListProps } from '../userList/types';
 export interface OpenChannelParticipantsProps {
     Fragment: {
@@ -11,7 +11,7 @@ export interface OpenChannelParticipantsProps {
         sortComparator?: UseUserListOptions<SendbirdUser | SendbirdParticipant>['sortComparator'];
     };
 }
-export type OpenChannelParticipantsFragment = CommonComponent<OpenChannelParticipantsProps['Fragment']>;
+export type OpenChannelParticipantsFragment = React.FC<OpenChannelParticipantsProps['Fragment']>;
 export interface OpenChannelRegisterOperatorProps {
     Fragment: {
         channel: SendbirdOpenChannel;
@@ -22,4 +22,4 @@ export interface OpenChannelRegisterOperatorProps {
         sortComparator?: UseUserListOptions<SendbirdUser | SendbirdParticipant>['sortComparator'];
     };
 }
-export type OpenChannelRegisterOperatorFragment = CommonComponent<OpenChannelRegisterOperatorProps['Fragment']>;
+export type OpenChannelRegisterOperatorFragment = React.FC<OpenChannelRegisterOperatorProps['Fragment']>;

package/lib/typescript/src/types.d.ts

@@ -1,4 +1,4 @@
-import type { ErrorInfo, ReactNode } from 'react';
+import type { ComponentType, ErrorInfo, ReactNode } from 'react';
 import type { SendbirdUser } from '@sendbird/uikit-utils';
 export type KeyValuePairGet = [string, string | null];
 export type KeyValuePairSet = [string, string];
@@ -16,9 +16,9 @@ export type ErrorBoundaryProps = {
     errorInfo: ErrorInfo;
     reset: () => void;
 };
-export type CommonComponent<P = {}> = (props: P & {
-    children?: ReactNode;
-}) => null | ReactNode;
+export type CommonComponent<P = {}> = ComponentType<P & {
+    children?: ReactNode | undefined;
+}>;
 export type MentionedUser = {
     range: Range;
     user: SendbirdUser;

package/lib/typescript/src/version.d.ts

@@ -1,2 +1,2 @@
-declare const VERSION = "3.4.0";
+declare const VERSION = "3.4.2";
 export default VERSION;

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@sendbird/uikit-react-native",
-  "version": "3.4.0",
+  "version": "3.4.2",
   "description": "Sendbird UIKit for React Native: A feature-rich and customizable chat UI kit with messaging, channel management, and user authentication.",
   "keywords": [
     "sendbird",
@@ -60,10 +60,10 @@
   },
   "dependencies": {
     "@openspacelabs/react-native-zoomable-view": "^2.1.5",
-    "@sendbird/uikit-chat-hooks": "3.4.0",
-    "@sendbird/uikit-react-native-foundation": "3.4.0",
+    "@sendbird/uikit-chat-hooks": "3.4.2",
+    "@sendbird/uikit-react-native-foundation": "3.4.2",
     "@sendbird/uikit-tools": "0.0.1-alpha.58",
-    "@sendbird/uikit-utils": "3.4.0"
+    "@sendbird/uikit-utils": "3.4.2"
   },
   "devDependencies": {
     "@bam.tech/react-native-image-resizer": "^3.0.4",
@@ -203,5 +203,5 @@
       ]
     ]
   },
-  "gitHead": "fc6ddd204fd8c7f4ff417351580147d868bf3889"
+  "gitHead": "e38806326b5f9c7d351ab270e5b4815707c598fb"
 }

package/src/components/ChannelInput/index.tsx

@@ -19,7 +19,7 @@ import {
 
 import { useSendbirdChat } from '../../hooks/useContext';
 import useMentionTextInput from '../../hooks/useMentionTextInput';
-import type { MentionedUser, Range } from '../../types';
+import type { CommonComponent, MentionedUser, Range } from '../../types';
 import type { AttachmentsButtonProps } from './AttachmentsButton';
 import AttachmentsButton from './AttachmentsButton';
 import EditInput from './EditInput';
@@ -67,7 +67,7 @@ export type ChannelInputProps = {
   setMessageToReply?: (message?: undefined | SendbirdUserMessage | SendbirdFileMessage) => void;
 
   // mention
-  SuggestedMentionList?: (props: SuggestedMentionListProps) => React.ReactNode | null;
+  SuggestedMentionList?: CommonComponent<SuggestedMentionListProps>;
 
   // sub-components
   AttachmentsButton?: (props: AttachmentsButtonProps) => React.ReactNode | null;

package/src/components/ChannelMessageList/index.tsx

@@ -32,7 +32,6 @@ import {
 import type { UserProfileContextType } from '../../contexts/UserProfileCtx';
 import { useLocalization, usePlatformService, useSendbirdChat, useUserProfile } from '../../hooks/useContext';
 import SBUUtils from '../../libs/SBUUtils';
-import type { CommonComponent } from '../../types';
 import ChatFlatList from '../ChatFlatList';
 import { ReactionAddons } from '../ReactionAddons';
 
@@ -78,15 +77,10 @@ export type ChannelMessageListProps<T extends SendbirdGroupChannel | SendbirdOpe
     bottomSheetItem?: BottomSheetItem;
     isFirstItem: boolean;
   }) => React.ReactElement | null;
-  renderNewMessagesButton: null | CommonComponent<{
-    visible: boolean;
-    onPress: () => void;
-    newMessages: SendbirdMessage[];
-  }>;
-  renderScrollToBottomButton: null | CommonComponent<{
-    visible: boolean;
-    onPress: () => void;
-  }>;
+  renderNewMessagesButton:
+    | null
+    | ((props: { visible: boolean; onPress: () => void; newMessages: SendbirdMessage[] }) => React.ReactElement | null);
+  renderScrollToBottomButton: null | ((props: { visible: boolean; onPress: () => void }) => React.ReactElement | null);
   flatListProps?: Omit<FlatListProps<SendbirdMessage>, 'data' | 'renderItem'>;
 } & {
   ref?: Ref<FlatList<SendbirdMessage>> | undefined;

package/src/components/GroupChannelMessageRenderer/GroupChannelMessageOutgoingStatus.tsx

@@ -15,13 +15,13 @@ type Props = {
   style?: StyleProp<ImageStyle>;
 };
 const GroupChannelMessageOutgoingStatus = ({ channel, message, style }: Props) => {
-  if (!message.isUserMessage() && !message.isFileMessage()) return null;
-  if (channel.isEphemeral) return null;
-
   const { sdk } = useSendbirdChat();
   const { colors } = useUIKitTheme();
   const outgoingStatus = useMessageOutgoingStatus(sdk, channel, message);
 
+  if (!message.isUserMessage() && !message.isFileMessage()) return null;
+  if (channel.isEphemeral) return null;
+
   if (outgoingStatus === 'PENDING') {
     return <LoadingSpinner size={SIZE} style={style} />;
   }

package/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;
@@ -169,7 +181,7 @@ export interface GroupChannelModule {
   StatusLoading: CommonComponent;
 }
 
-export type GroupChannelFragment = CommonComponent<GroupChannelProps['Fragment']>;
+export type GroupChannelFragment = React.FC<GroupChannelProps['Fragment']>;
 
 export type GroupChannelPubSubContextPayload =
   | {

package/src/domain/groupChannelBannedUsers/types.ts

@@ -49,4 +49,4 @@ export interface GroupChannelBannedUsersModule {
   StatusError: CommonComponent<GroupChannelBannedUsersProps['StatusError']>;
 }
 
-export type GroupChannelBannedUsersFragment = CommonComponent<GroupChannelBannedUsersProps['Fragment']>;
+export type GroupChannelBannedUsersFragment = React.FC<GroupChannelBannedUsersProps['Fragment']>;