fix: use ComponentType instead of function structure in CommonComponent type

packages/uikit-react-native/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;

packages/uikit-react-native/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;

packages/uikit-react-native/src/types.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';
 
@@ -17,7 +17,7 @@ export interface LocalCacheStorage {
 
 export type ErrorBoundaryProps = { error: Error; 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;