> ## Documentation Index > Fetch the complete documentation index at: https://cometchat-22654f5b-feature-react-native-sdk-quotedmessage-a.mintlify.site/llms.txt > Use this file to discover all available pages before exploring further. # Property Changes ## Conversations ### New Properties | Name | Type | Description | | ------------------------------------ | --------------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------------- | | `hideSubmitButton` | boolean | Hide the submit (selection) button. | | `receiptsVisibility` | boolean | Toggles message receipts (single/double-tick) inside the subtitle. | | `disableSoundForMessages` | boolean | Toggle sound playback for received messages. | | `customSoundForMessages` | string | Custom sound file path for received messages. | | `datePattern` | `(conversation: CometChat.Conversation) => string` | Function to generate a custom date string for a conversation. | | `ItemView` | `(item: CometChat.Conversation) => JSX.Element` | Completely overrides the default rendering of each conversation item in the list. | | `AppBarOptions` | `() => JSX.Element` | Functional component for rendering options in the app bar. | | `hideBackButton` | boolean | Hide the back button. | | `selectionMode` | `'none' \| 'single' \| 'multiple'` | Selection mode: `'none'`, `'single'`, or `'multiple'`. | | `onSelection` | `(conversations: Array) => void` | Callback when conversation selection is complete. | | `onSubmit` | `(conversations: Array) => void` | Callback when submit selection button is pressed. | | `EmptyView` | `() => JSX.Element` | Custom view for the empty state. | | `ErrorView` | `() => JSX.Element` | Custom view for the error state. | | `LoadingView` | `() => JSX.Element` | Custom view for the loading state. | | `conversationsRequestBuilder` | `CometChat.ConversationsRequestBuilder` | Request builder to fetch conversations. | | `LeadingView` | `(conversation: CometChat.Conversation) => JSX.Element` | Custom leading view for a conversation item. | | `TitleView` | `(conversation: CometChat.Conversation) => JSX.Element` | Custom title view for a conversation item. | | `SubtitleView` | `(conversation: CometChat.Conversation) => JSX.Element` | Custom subtitle view for a conversation item. | | `TrailingView` | `(conversation: CometChat.Conversation) => JSX.Element` | Custom tail view for a conversation item. | | `hideError` | boolean | Hide error view. | | `onItemPress` | `(item: CometChat.Conversation) => void` | Callback for when a conversation item is pressed. | | `onItemLongPress` | `(item: CometChat.Conversation) => void` | Callback for when a conversation item is long pressed. | | `onError` | `(e: CometChat.CometChatException) => void` | Callback when an error occurs while fetching conversations. | | `onBack` | `() => void` | Callback for when the back action is triggered. | | `textFormatters` | `Array` | Array of text formatter classes. | | `style` | `DeepPartial` | Custom styles for the conversation view. | | `hideHeader` | boolean | Hide the header of the conversation list. | | `onEmpty` | `() => void` | Callback triggered when the fetched list is empty. | | `onLoad` | `(list: CometChat.Conversation[]) => void` | Callback triggered once the users have loaded and are not empty. | | `options` | `(conversation: CometChat.Conversation) => MenuItemInterface[]` | A function to replace the default menu items entirely for a conversation. | | `addOptions` | `(conversation: CometChat.Conversation) => MenuItemInterface[]` | A function to append more menu items on top of the default menu items for a conversation. | | `usersStatusVisibility` | boolean | Toggle user status visibility. | | `groupTypeVisibility` | boolean | Toggle group type visibility. | | `deleteConversationOptionVisibility` | boolean | Toggle delete conversation option visibility. | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | -------------------------------- | ----------------------- | -------- | --------------------------------------------------------------------------------- | | `hideSubmitIcon` | `hideSubmitButton` | boolean | Hide the submit (selection) button. | | `disableUsersPresence` | `usersStatusVisibility` | boolean | Toggle user status visibility. | | `hideReceipt` / `disableReceipt` | `receiptsVisibility` | boolean | Controls receipt visibility. | | `tailView` | `TrailingView` | function | Custom tail/trailing view for a conversation item. | | `ListItemView` | `ItemView` | function | Completely overrides the default rendering of each conversation item in the list. | | `AppBarOption` | `AppBarOptions` | function | Functional component for rendering options in the app bar. | | `showBackButton` | `hideBackButton` | boolean | In v5, the prop is inverted (showBackButton=false → hideBackButton=true). | | `conversationsStyle` | `style` | object | Style object for conversations (renamed and type changed). | | `EmptyStateView` | `EmptyView` | function | Custom view for the empty state. | | `ErrorStateView` | `ErrorView` | function | Custom view for the error state. | | `LoadingStateView` | `LoadingView` | function | Custom view for the loading state. | ### Removed Properties | V4 Name | Type | Description | | ------------------------------- | --------- | -------------------------------------------------------- | | `protectedGroupIcon` | ImageType | Custom icon for protected group. | | `privateGroupIcon` | ImageType | Custom icon for private group. | | `readIcon` | ImageType | Custom icon for read message. | | `deliveredIcon` | ImageType | Custom icon for delivered message. | | `sentIcon` | ImageType | Custom icon for sent message. | | `errorIcon` | ImageType | Custom icon for error message. | | `waitingIcon` | ImageType | Custom icon for waiting message. | | `options (swipe actions)` | function | Pass array of `CometChatOptions` type for swipe actions. | | `hideSeparator` | boolean | Toggle separator. | | `backButtonIcon` | ImageType | Icon for back button. | | `title` | string | Title to be shown, default `"Chats"`. | | `emptyStateText` | string | Text to be displayed if no conversation found. | | `errorStateText` | string | Text to be displayed if there is an error. | | `conversationsStyle (old type)` | object | (Renamed to `style`, but if old type, it's removed). | | `listItemStyle` | object | Style object for list item. | | `avatarStyle` | object | Style object for avatar. | | `statusIndicatorStyle` | object | Style object for status indicator. | | `dateStyle` | object | Style object for date. | | `receiptStyle` | object | Style object for receipt. | | `badgeStyle` | object | Style object for badge. | | `confirmDialogStyle` | object | Style object for confirm dialog. | | `disableTyping` | boolean | Toggle typing indicator. | | `disableMentions` | boolean | If true, mentions will be disabled. | ## Users ### New Properties | Name | Type | Description | | ------------------------ | ----------------------------------------------- | --------------------------------------------------------------------------------- | | `onSubmit` | `(list: Array) => void` | Callback when submit selection button is pressed. | | `style` | `DeepPartial` | Custom styling for the users list. | | `TitleView` | `(user: CometChat.User) => JSX.Element` | Custom title view component. | | `ItemView` | `(user: CometChat.User) => JSX.Element` | Function that returns a custom list item view. | | `EmptyView` | `() => JSX.Element` | Custom component to display for the empty state. | | `ErrorView` | `() => JSX.Element` | Custom component to display for the error state. | | `LoadingView` | `() => JSX.Element` | Custom component to display for the loading state. | | `LeadingView` | `(user: CometChat.User) => JSX.Element` | Custom leading view component. | | `hideHeader` | boolean | Hide the header view. | | `searchPlaceholderText` | string | Placeholder text for the search input. | | `usersStatusVisibility` | boolean | Hide the users status. | | `searchKeyword` | string | Search keyword. | | `onError` | `(e: CometChat.CometChatException) => void` | Callback when an error occurs. | | `hideLoadingState` | boolean | Hide the loading skeleton. | | `title` | string | Title for the header. | | `addOptions` | `(user: CometChat.User) => MenuItemInterface[]` | A function to append more menu items on top of the default menu items for a user. | | `hideError` | boolean | Toggle error view visibility. | | `showBackButton` | boolean | Toggle back button visibility. | | `stickyHeaderVisibility` | boolean | Toggle sticky header visibility. | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | ---------------------- | ----------------------- | -------- | -------------------------------------------------------- | | `usersStyle` | `style` | object | Custom styling for the users list. | | `TailView` | `TrailingView` | function | Function that returns a custom trailing view for a user. | | `disableUsersPresence` | `usersStatusVisibility` | boolean | Toggle user status visibility | | `ListItemView` | `ItemView` | function | Function that returns a custom list item view. | ### Removed Properties | V4 Name | Type | Description | | ------------- | ---- | ------------------------------------ | | `listItemKey` | any | Key for list item *(removed in v5)*. | ## Groups ### New Properties | Name | Type | Description | | ----------------------- | ------------------------------------------------- | ---------------------------------------------------------------------------------- | | `TitleView` | `(group: CometChat.Group) => JSX.Element` | Custom title view for a group item. | | `SubtitleView` | `(group: CometChat.Group) => JSX.Element` | Custom subtitle view for a group item. | | `TrailingView` | `(group: CometChat.Group) => JSX.Element` | Custom trailing view for a group item. | | `ItemView` | `(group: CometChat.Group) => JSX.Element` | Completely overrides the default rendering of each group item in the list. | | `AppBarOptions` | `() => JSX.Element` | Functional component for rendering options in the app bar. | | `hideSubmitButton` | boolean | Hide the submit (selection) button. | | `style` | `DeepPartial` | Custom styles for the groups view. | | `searchPlaceholderText` | string | Placeholder text for the search input. | | `selectionMode` | `'none' \| 'single' \| 'multiple'` | Selection mode: `'none'`, `'single'`, or `'multiple'`. | | `onSelection` | `(list: Array) => void` | Callback when group selection is complete. | | `onSubmit` | `(list: Array) => void` | Callback when submit selection button is pressed. | | `hideSearch` | boolean | Hide the search box. | | `EmptyView` | `() => JSX.Element` | Custom view for the empty state. | | `ErrorView` | `() => JSX.Element` | Custom view for the error state. | | `LoadingView` | `() => JSX.Element` | Custom view for the loading state. | | `groupsRequestBuilder` | `CometChat.GroupsRequestBuilder` | Request builder to fetch groups. | | `searchRequestBuilder` | `CometChat.GroupsRequestBuilder` | Request builder for search functionality. | | `privateGroupIcon` | `ImageSourcePropType` | Icon to be used for private groups. | | `passwordGroupIcon` | `ImageSourcePropType` | Icon to be used for password-protected groups. | | `hideError` | boolean | Hide error view. | | `onItemPress` | `(item: CometChat.Group) => void` | Callback for when a group item is pressed. | | `onItemLongPress` | `(item: CometChat.Group) => void` | Callback for when a group item is long pressed. | | `onError` | `(e: CometChat.CometChatException) => void` | Callback when an error occurs while fetching groups. | | `onBack` | `() => void` | Callback for when the back action is triggered. | | `hideHeader` | boolean | Hide the header of the group list. | | `LeadingView` | `(group: CometChat.Group) => JSX.Element` | Custom leading view for a group item. | | `searchKeyword` | string | Search keyword. | | `onEmpty` | `() => void` | Callback triggered when the fetched list is empty. | | `onLoad` | `(list: CometChat.GroupMember[]) => void` | Callback triggered once the groups have loaded and are not empty. | | `hideLoadingState` | boolean | Hide the loading skeleton. | | `groupTypeVisibility` | boolean | Hide the group type *(public/private/password)*. | | `addOptions` | `(group: CometChat.Group) => MenuItemInterface[]` | A function to append more menu items on top of the default menu items for a group. | | `options` | `(group: CometChat.Group) => MenuItemInterface[]` | A function to replace the default menu items entirely for a group. | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | ----------------------- | ----------------------- | ----------------------------------- | -------------------------------------------------------------------------- | | `ListItemView` | `ItemView` | function | Completely overrides the default rendering of each group item in the list. | | `AppBarOption` | `AppBarOptions` | function | Functional component for rendering options in the app bar. | | `hideSubmitIcon` | `hideSubmitButton` | boolean | Hide the submit (selection) button. | | `groupsStyle` | `style` | object | Style object for groups *(renamed and type changed)*. | | `searchPlaceHolderText` | `searchPlaceholderText` | string | Placeholder text for the search input. | | `EmptyStateView` | `EmptyView` | function | Custom view for the empty state. | | `ErrorStateView` | `ErrorView` | function | Custom view for the error state. | | `LoadingStateView` | `LoadingView` | function | Custom view for the loading state. | | `privateGroupIcon` | `privateGroupIcon` | `ImageType` → `ImageSourcePropType` | Icon to be used for private groups *(type changed)*. | | `passwordGroupIcon` | `passwordGroupIcon` | `ImageType` → `ImageSourcePropType` | Icon to be used for password-protected groups *(type changed)*. | ### Removed Properties | V4 Name | Type | Description | | ---------------------- | --------- | ------------------------------------------------------------------------- | | `hideSeperator` | boolean | Toggle separator *(removed, not present in v5)*. | | `listItemStyle` | object | Style object for list item *(removed, not present in v5)*. | | `avatarStyle` | object | Style object for avatar *(removed, not present in v5)*. | | `statusIndicatorStyle` | object | Style object for status indicator *(removed, not present in v5)*. | | `backButtonIcon` | ImageType | Icon for back button *(removed, not present in v5)*. | | `searchBoxIcon` | ImageType | Icon for search box *(removed, not present in v5)*. | | `title` | string | Title to be shown, default `"Groups"` *(removed, not present in v5)*. | | `emptyStateText` | string | Text to be displayed if no group found *(removed, not present in v5)*. | | `errorStateText` | string | Text to be displayed if there is an error *(removed, not present in v5)*. | ## Group Members ### New Properties | Name | Type | Description | | --------------------------- | -------------------------------------------------------------------------------- | ----------------------------------------------------------------------------------- | | `SubtitleView` | `(item: CometChat.GroupMember) => JSX.Element` | Custom subtitle view for a group member item. | | `TitleView` | `(item: CometChat.GroupMember) => JSX.Element` | Custom title view for a group member item. | | `TrailingView` | `(item: CometChat.GroupMember) => JSX.Element` | Custom trailing view for a group member item. | | `EmptyView` | `() => JSX.Element` | Custom view for the empty state. | | `ErrorView` | `() => JSX.Element` | Custom view for the error state. | | `LoadingView` | `() => JSX.Element` | Custom view for the loading state. | | `onItemPress` | `(groupMember: CometChat.GroupMember) => void` | Callback when a group member item is pressed. | | `onItemLongPress` | `(groupMember: CometChat.GroupMember) => void` | Callback when a group member item is long pressed. | | `onSelection` | `(list: CometChat.GroupMember[]) => void` | Callback when group member selection is complete. | | `onSubmit` | `(list: Array) => void` | Callback when submit selection button is pressed. | | `searchRequestBuilder` | `CometChat.GroupMembersRequestBuilder` | Request builder for search functionality. | | `groupMemberRequestBuilder` | `CometChat.GroupMembersRequestBuilder` | Request builder to fetch group members. | | `group` | `CometChat.Group` | The group object for which members are listed. | | `style` | `DeepPartial` | Custom styles for the group member view. | | `ItemView` | `(item: CometChat.GroupMember) => JSX.Element` | Completely overrides the default rendering of each group member item. | | `LeadingView` | `(item: CometChat.GroupMember) => JSX.Element` | Custom leading view for a group member item. | | `onEmpty` | `() => void` | Callback triggered when the fetched list is empty. | | `onLoad` | `(list: CometChat.GroupMember[]) => void` | Callback triggered once the group members have loaded and are not empty. | | `options` | `(member: CometChat.GroupMember, group: CometChat.Group) => MenuItemInterface[]` | Function to replace default menu items entirely for a group member. | | `addOptions` | `(member: CometChat.GroupMember, group: CometChat.Group) => MenuItemInterface[]` | Function to append more menu items on top of default menu items for a group member. | | `hideKickMemberOption` | `boolean` | Hide the "Remove" (Kick) option from the default menu. | | `hideBanMemberOption` | `boolean` | Hide the "Ban" option from the default menu. | | `hideScopeChangeOption` | `boolean` | Hide the "Change Scope" option from the default menu. | | `hideLoadingState` | `boolean` | Hide the loading skeleton. | | `usersStatusVisibility` | `boolean` | Toggle user status visibility. | | `hideHeader` | `boolean` | Hide the header view. | | `onError` | `() => void` | Callback when an error occurs. | | `searchKeyword` | `string` | Search keyword. | | `showBackButton` | `boolean` | Toggle back button visibility. | | `excludeOwner` | `boolean` | Exclude owner from the list. | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | ---------------------- | ----------------------- | -------- | --------------------------------------------------------------------- | | `TailView` | `TrailingView` | function | Custom trailing view for a group member item. | | `groupMemberStyle` | `style` | object | Style object for group member (renamed and type changed). | | `disableUsersPresence` | `usersStatusVisibility` | boolean | Toggle user status visibility | | `ListItemView` | `ItemView` | function | Completely overrides the default rendering of each group member item. | | `EmptyStateView` | `EmptyView` | function | Custom view for the empty state. | | `ErrorStateView` | `ErrorView` | function | Custom view for the error state. | | `LoadingStateView` | `LoadingView` | function | Custom view for the loading state. | ### Removed Properties | V4 Name | Type | Description | | ---------------------- | ---------------- | ---------------------------------------------------------------------- | | `listItemStyle` | object | Style object for list item *(removed in v5)*. | | `avatarStyle` | object | Style object for avatar *(removed in v5)*. | | `statusIndicatorStyle` | object | Style object for status indicator *(removed in v5)*. | | `groupScopeStyle` | object | Styling properties for group scope *(removed in v5)*. | | `title` | string | Title for the list *(removed in v5)*. | | `errorStateText` | string | Text to be displayed when error occurs *(removed in v5)*. | | `emptyStateText` | string | Text to be displayed when the list is empty *(removed in v5)*. | | `theme` | `CometChatTheme` | Theme configuration for the group members component *(removed in v5)*. | *** ## Message Header ### New Properties | Name | Type | Description | | -------------------------- | -------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------ | | `ItemView` | `({ user, group }: { user?: CometChat.User; group?: CometChat.Group }) => JSX.Element` | Custom item view. Receives `{ user, group }`. | | `LeadingView` | `({ user, group }: { user?: CometChat.User; group?: CometChat.Group }) => JSX.Element` | Custom leading view. Receives `{ user, group }`. | | `TitleView` | `({ user, group }: { user?: CometChat.User; group?: CometChat.Group }) => JSX.Element` | Custom title view. Receives `{ user, group }`. | | `SubtitleView` | `({ user, group }: { user?: CometChat.User; group?: CometChat.Group }) => JSX.Element` | Custom subtitle view. Receives `{ user, group }`. | | `TrailingView` | `({ user, group }: { user?: CometChat.User; group?: CometChat.Group }) => JSX.Element` | Custom trailing view. Receives `{ user, group }`. | | `AuxiliaryButtonView` | `({ user, group }: { user?: CometChat.User; group?: CometChat.Group }) => JSX.Element` | Custom auxiliary button view. Receives `{ user, group }`. | | `user` | `CometChat.User` | User object. | | `group` | `CometChat.Group` | Group object. | | `showBackButton` | `boolean` | Toggle back button visibility. | | `onBack` | `() => void` | Callback when back button is pressed. | | `style` | `DeepPartial` | Custom styles. | | `onError` | `(error: CometChat.CometChatException) => void` | Error callback. | | `hideVoiceCallButton` | `boolean` | Toggle visibility of voice call button. | | `hideVideoCallButton` | `boolean` | Toggle visibility of video call button. | | `usersStatusVisibility` | `boolean` | Toggle visibility of user status. | | `hideNewChatButton` | `boolean` | Flag to hide the new chat button for AI agents (only applies to @agentic users). | | `hideChatHistoryButton` | `boolean` | Flag to hide the chat history button for AI agents (only applies to @agentic users). | | `onNewChatButtonClick` | `() => void` | Callback when agent new chat button is clicked (only applies to @agentic users). | | `onChatHistoryButtonClick` | `() => void` | Callback when agent chat history button is clicked (only applies to @agentic users). | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | ---------------------- | ----------------------- | -------- | ----------------------------------------------------------------------- | | `ListItemView` | `ItemView` | function | Custom item view. | | `AppBarOptions` | `TrailingView` | function | Custom trailing view. | | `hideBackIcon` | `showBackButton` | boolean | In v5, the prop is inverted (hideBackIcon=true → showBackButton=false). | | `disableUsersPresence` | `usersStatusVisibility` | boolean | Toggle user status visibility | | `style` | `style` | object | Style object for message header (renamed and type changed). | ### Removed Properties | V4 Name | Type | Description | | ------------------------ | ----------- | ------------------------------------------------------------------------- | | `protectedGroupIcon` | `ImageType` | Custom icon for protected group *(removed in v5)*. | | `privateGroupIcon` | `ImageType` | Custom icon for private group *(removed in v5)*. | | `backButtonIcon` | `ImageType` | Icon for back button *(removed in v5)*. | | `disableTyping` | `boolean` | Controls typing indicator functionality *(removed in v5)*. | | `avatarStyle` | `object` | Style configuration for avatar *(removed in v5)*. | | `statusIndicatorStyle` | `object` | Style configuration for status indicator *(removed in v5)*. | | `headViewContainerStyle` | `object` | Custom styling for headViewContainer in list item *(removed in v5)*. | | `bodyViewContainerStyle` | `object` | Custom styling for bodyViewContainerStyle in list item *(removed in v5)*. | | `tailViewContainerStyle` | `object` | Custom styling for tailViewContainerStyle in list item *(removed in v5)*. | | `listItemStyle` | `object` | Custom styling for list item *(removed in v5)*. | ## Message List ### New Properties | Name | Type | Description | | ----------------------------- | ---------------------------------------------------------------------------------------------------------------------------------------------------------- | ---------------------------------------------------------------------------------------- | | `parentMessageId` | `string` | ID of the parent message when rendering threaded messages. | | `user` | `CometChat.User` | The user object associated with the message list. | | `group` | `CometChat.Group` | The group object associated with the message list. | | `EmptyView` | `() => JSX.Element` | A component to display when there are no messages. | | `ErrorView` | `() => JSX.Element` | A component to display when an error occurs. | | `hideError` | `boolean` | Flag to hide the error view. | | `LoadingView` | `() => JSX.Element` | A component to display while messages are loading. | | `receiptsVisibility` | `boolean` | Flag to hide read receipts. | | `disableSoundForMessages` | `boolean` | Flag to disable sound for incoming messages. | | `customSoundForMessages` | `string` | Custom sound URL for messages. | | `alignment` | `MessageListAlignmentType` | Alignment type for the message list. | | `avatarVisibility` | `boolean` | Flag to show or hide the user's avatar. | | `datePattern` | `(message: CometChat.BaseMessage) => string` | Function that returns a custom string representation for a message's date. | | `dateSeparatorPattern` | `(date: number) => string` | Function that returns a custom date separator string based on a timestamp. | | `templates` | `Array` | An array of message templates for rendering custom message types. | | `addTemplates` | `Array` | An array of message templates for rendering custom message types. | | `messageRequestBuilder` | `CometChat.MessagesRequestBuilder` | Builder for constructing a request to fetch messages. | | `scrollToBottomOnNewMessages` | `boolean` | If true, the message list will scroll to the bottom when new messages arrive. | | `onThreadRepliesPress` | `(messageObject: CometChat.BaseMessage, messageBubbleView: () => JSX.Element \| null) => void` | Callback invoked when the thread replies view is pressed. | | `HeaderView` | `({ user, group, id }: { user?: CometChat.User; group?: CometChat.Group; id?: { uid?: string; guid?: string; parentMessageId?: string } }) => JSX.Element` | Custom header view component. | | `FooterView` | `({ user, group, id }: { user?: CometChat.User; group?: CometChat.Group; id?: { uid?: string; guid?: string; parentMessageId?: string } }) => JSX.Element` | Custom footer view component. | | `onError` | `(e: CometChat.CometChatException) => void` | Callback to handle errors. | | `onBack` | `() => void` | Callback invoked on back navigation. | | `textFormatters` | `Array` | Collection of text formatter classes to apply custom formatting. | | `onReactionPress` | `(reaction: CometChat.ReactionCount, messageObject: CometChat.BaseMessage) => void` | Callback invoked when a reaction is pressed. | | `onReactionLongPress` | `(reaction: CometChat.ReactionCount, messageObject: CometChat.BaseMessage) => void` | Callback invoked when a reaction is long pressed. | | `onReactionListItemPress` | `(messageReaction: CometChat.Reaction, messageObject: CometChat.BaseMessage) => void` | Callback invoked when an item in the reaction list is pressed. | | `style` | `DeepPartial` | Custom styles for the message list component. | | `reactionsRequestBuilder` | `CometChat.ReactionsRequestBuilder` | Builder for constructing a request to fetch reactions. | | `onAddReactionPress` | `() => void` | Callback invoked when the add reaction button is pressed. | | `quickReactionList` | `[string, string?, string?, string?, string?]` | List of quick reactions. | | `onLoad` | `(messageList: CometChat.BaseMessage[]) => void` | Callback to handle when the message list is loaded. | | `onEmpty` | `() => void` | Callback to handle when the message list is empty. | | `hideReplyInThreadOption` | `boolean` | Flag to hide the reply in thread option. | | `hideShareMessageOption` | `boolean` | Flag to hide the share message option. | | `hideEditMessageOption` | `boolean` | Flag to hide the edit message option. | | `hideTranslateMessageOption` | `boolean` | Flag to hide the translate message option. | | `hideDeleteMessageOption` | `boolean` | Flag to hide the delete message option. | | `hideReactionOption` | `boolean` | Flag to hide the react to message option. | | `hideMessagePrivatelyOption` | `boolean` | Flag to hide the message privately option. | | `hideCopyMessageOption` | `boolean` | Flag to hide the copy message option. | | `hideMessageInfoOption` | `boolean` | Flag to hide the message info option. | | `hideGroupActionMessages` | `boolean` | Flag to hide group action messages. | | `hideTimestamp` | `boolean` | Flag to hide the timestamp on message bubbles. | | `suggestedMessages` | `Array` | Array of suggested messages for AI agent empty view (only applies to @agentic users). | | `hideSuggestedMessages` | `boolean` | Flag to hide suggested messages in AI agent empty view (only applies to @agentic users). | | `emptyChatGreetingView` | `React.ReactNode` | Custom AI agent greeting view (only applies to @agentic users). | | `emptyChatIntroMessageView` | `React.ReactNode` | Custom AI agent intro message view (only applies to @agentic users). | | `emptyChatImageView` | `React.ReactNode` | Custom AI agent image/avatar view (only applies to @agentic users). | | `onSuggestedMessageClick` | `(suggestion: string) => void` | Callback when suggested message is clicked (only applies to @agentic users). | | `aiAssistantTools` | `CometChatAIAssistantTools` | Custom AI assistant tools with action functions (only applies to @agentic users). | | `streamingSpeed` | `number` | Controls the speed of AI message streaming (only applies to @agentic users). | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | -------------------------------- | ---------------------- | -------------------------- | -------------------------------------------------- | | `EmptyStateView` | `EmptyView` | `() => JSX.Element` | Custom component to display for the empty state. | | `ErrorStateView` | `ErrorView` | `() => JSX.Element` | Custom component to display for the error state. | | `LoadingStateView` | `LoadingView` | `() => JSX.Element` | Custom component to display for the loading state. | | `hideReceipt` / `disableReceipt` | `receiptsVisibility` | `boolean` | Controls receipt visibility. | | `showAvatar` | `avatarVisibility` | `boolean` | Toggle visibility for avatar. | | `dateSeparatorPattern` | `dateSeparatorPattern` | `(date: number) => string` | Signature clarified with parameter name. | ### Removed Properties | V4 Name | Type | Description | | --------------------------------- | --------------------------------------------------- | ------------------------------------------ | | `emptyStateText` | `string` | Text to be displayed if no message found. | | `errorStateText` | `string` | Text to be displayed if there is an error. | | `readIcon` | `ImageType` | Custom icon for read message. | | `deliveredIcon` | `ImageType` | Custom icon for delivered message. | | `sentIcon` | `ImageType` | Custom icon for sent message. | | `waitIcon` | `ImageType` | Custom icon for waiting message. | | `errorIcon` | `ImageType` | Custom icon for error message. | | `wrapperMessageBubbleStyle` | `MessageBubbleStyleInterface` | Style for message bubble wrapper. | | `avatarStyle` | `AvatarStyleInterface` | Style configuration for avatar. | | `dateSeperatorStyle` | `DateStyleInterface` | Style for date separator. | | `actionSheetStyle` | `ActionSheetStylesInterface` | Style for action sheet. | | `messageListStyle` | `MessageListStyleInterface` | Style configuration for message list. | | `messageInformationConfiguration` | `CometChatMessageInformationConfigurationInterface` | Configuration for message information. | | `reactionsConfiguration` | `ReactionsConfigurationInterface` | Message Reaction Configuration. | | `reactionListConfiguration` | `ReactionListConfigurationInterface` | Message Reaction List Configuration. | | `quickReactionConfiguration` | `QuickReactionsConfigurationInterface` | Quick Reaction Configuration. | | `emojiKeyboardStyle` | `EmojiKeyboardStyle` | Emoji Keyboard style. | | `disableReactions` | `boolean` | Disables the reactions functionality. | | `disableMentions` | `boolean` | Disables mentions functionality. | | `timeStampAlignment` | `MessageTimeAlignmentType` | Alignment for message timestamps. | | `newMessageIndicatorText` | `string` | Custom text for new message indicator. | | `hideActionSheetHeader` | `boolean` | Hide the header of the action sheet. | ## Message Composer ### New Properties | Name | Type | Description | | ----------------------------------- | --------------------------------------------------------------------------------------------------------------------------------------------------- | ------------------------------------------------------------------------------------------ | | `id` | `string \| number` | Message composer identifier. | | `user` | `CometChat.User` | CometChat SDK’s user object. | | `group` | `CometChat.Group` | CometChat SDK’s group object. | | `disableSoundForOutgoingMessages` | `boolean` | Flag to turn off sound for outgoing messages. | | `customSoundForOutgoingMessage` | `any` | Custom audio sound to be played while sending messages. | | `disableTypingEvents` | `boolean` | Flag to disable typing events. | | `initialComposertext` | `string` | Initial text to be displayed in the composer. | | `HeaderView` | `({ user, group }: { user?: CometChat.User; group?: CometChat.Group }) => JSX.Element` | Renders a preview section at the top of the composer. | | `onTextChange` | `(text: string) => void` | Callback triggered when the input text changes. | | `attachmentOptions` | `({ user, group, composerId }: { user?: CometChat.User; group?: CometChat.Group; composerId: Map; }) => CometChatMessageComposerAction[]` | Returns the attachment options for the composer. | | `AuxiliaryButtonView` | `({ user, group, composerId }: { user?: CometChat.User; group?: CometChat.Group; composerId: string \| number; }) => JSX.Element` | Replaces the default Auxiliary Button. | | `SendButtonView` | `({ user, group, composerId }: { user?: CometChat.User; group?: CometChat.Group; composerId: string \| number; }) => JSX.Element` | Replaces the default Send Button. | | `parentMessageId` | `string \| number` | Message id required for threaded messages. | | `style` | `DeepPartial` | Custom styles for the message composer component. | | `hideVoiceRecordingButton` | `boolean` | Flag to hide the voice recording button. | | `onSendButtonPress` | `(message: CometChat.BaseMessage) => void` | Callback triggered when the send button is pressed. | | `onError` | `(error: CometChat.CometChatException) => void` | Callback triggered when an error occurs. | | `keyboardAvoidingViewProps` | `KeyboardAvoidingViewProps` | Override properties for the KeyboardAvoidingView. | | `textFormatters` | `Array` | Collection of text formatter classes to apply custom formatting. | | `disableMentions` | `boolean` | Flag to disable mention functionality. | | `imageQuality` | `IntRange<1, 100>` | Controls image quality when taking pictures from the camera. | | `hideCameraOption` | `boolean` | If true, hides the camera option from the attachment options. | | `hideImageAttachmentOption` | `boolean` | If true, hides the image attachment option from the attachment options. | | `hideVideoAttachmentOption` | `boolean` | If true, hides the video attachment option from the attachment options. | | `hideAudioAttachmentOption` | `boolean` | If true, hides the audio attachment option from the attachment options. | | `hideFileAttachmentOption` | `boolean` | If true, hides the file/document attachment option from the attachment options. | | `hidePollsAttachmentOption` | `boolean` | If true, hides the polls option from the attachment options. | | `hideCollaborativeDocumentOption` | `boolean` | If true, hides the collaborative document option. | | `hideCollaborativeWhiteboardOption` | `boolean` | If true, hides the collaborative whiteboard option. | | `hideAttachmentButton` | `boolean` | If true, hides the entire attachment button from the composer. | | `hideStickersButton` | `boolean` | If true, hides the stickers button from the composer. | | `hideSendButton` | `boolean` | If true, hides the send button from the composer. | | `hideAuxiliaryButtons` | `boolean` | If true, hides all auxiliary buttons (such as voice input, GIFs, or other plugin buttons). | | `addAttachmentOptions` | `({ user, group, composerId }: { user?: CometChat.User; group?: CometChat.Group; composerId: Map; }) => CometChatMessageComposerAction[]` | Returns additional attachment options for the composer. | | `auxiliaryButtonsAlignment` | `"left" \| "right"` | Determines the alignment of auxiliary buttons. | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | ------------------------- | --------------------------------- | -------------------------- | --------------------------------------- | | `disableSoundForMessages` | `disableSoundForOutgoingMessages` | `boolean` | Renamed for clarity. | | `customSoundForMessage` | `customSoundForOutgoingMessage` | `any` | Renamed for clarity. | | `text` | `initialComposertext` | `string` | Renamed for clarity. | | `onChangeText` | `onTextChange` | `(text: string) => void` | Renamed for clarity. | | `hideVoiceRecording` | `hideVoiceRecordingButton` | `boolean` | Renamed for clarity. | | `attachmentOptions` | `attachmentOptions` | function signature changed | Function signature updated. | | `SecondaryButtonView` | `AuxiliaryButtonView` | function signature changed | Function signature updated and renamed. | ### Removed Properties | V4 Name | Type | Description | | ----------------------- | ------------------------------- | ----------------------------------------------------------- | | `FooterView` | `React.FC` | Preview section at the bottom of the composer. | | `placeHolderText` | `string` | Text shown in the composer when the input message is empty. | | `maxHeight` | `number` | Threshold value for input expansion. | | `attachmentIcon` | `ImageType` | Attachment icon. | | `messageComposerStyle` | `MessageComposerStyleInterface` | Message Composer Styles. | | `hideLiveReaction` | `boolean` | Hide the live reaction button. | | `liveReactionIcon` | `ImageType` | Live reaction icon. | | `voiceRecordingIconURL` | `string \| ImageType` | Image URL for the voice recording icon. | | `mediaRecorderStyle` | `MediaRecorderStyle` | Voice Recording Styles. | | `pauseIconUrl` | `ImageType` | Pause icon. | | `playIconUrl` | `ImageType` | Play icon. | | `recordIconUrl` | `ImageType` | Record icon. | | `deleteIconUrl` | `ImageType` | Delete icon. | | `stopIconUrl` | `ImageType` | Stop icon. | | `submitIconUrl` | `ImageType` | Submit icon. | | `AIIconURL` | `string` | AI Icon URL. | | `aiOptionsStyle` | `AIOptionsStyle` | AI Options Style. | ## Incoming Call ### New Properties | Name | Type | Description | | ---------------------- | ------------------------------------------------------------------ | ----------------------------------------------------------------- | | `call` | `CometChat.Call \| CometChat.CustomMessage \| any` | The incoming call object, which can be a Call or a CustomMessage. | | `ItemView` | `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Custom view for the entire call item. | | `TitleView` | `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Custom view for the title section of the call item. | | `SubtitleView` | `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Custom view for the subtitle section of the call item. | | `LeadingView` | `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Custom view for the leading section of the call item. | | `TrailingView` | `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Custom view for the trailing section of the call item. | | `disableSoundForCalls` | `boolean` | Flag to disable sound for incoming calls. | | `customSoundForCalls` | `string` | Path or identifier for a custom sound to play for incoming calls. | | `onAccept` | `(message: CometChat.BaseMessage) => void` | Callback fired when the call is accepted. | | `onDecline` | `(message: CometChat.BaseMessage) => void` | Callback fired when the call is declined. | | `onError` | `(e: CometChat.CometChatException) => void` | Callback fired when an error occurs. | | `callSettingsBuilder` | `typeof CometChatCalls.CallSettingsBuilder` | Optional custom call settings builder. | | `style` | `DeepPartial` | Custom style overrides for the incoming call component. | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | ------------------- | -------------- | --------------------------------------------------------------- | ---------------------------------------------------------- | | `SubtitleView` | `SubtitleView` | function signature changed | Function signature updated. | | `incomingCallStyle` | `style` | `IncomingCallStyleInterface` → `DeepPartial` | Style object for incoming call (renamed and type changed). | | `onAccept` | `onAccept` | function signature changed | Function signature updated. | | `onDecline` | `onDecline` | function signature changed | Function signature updated. | ### Removed Properties | V4 Name | Type | Description | | ------------------------ | --------------------------- | ------------------------------- | | `title` | `string` | Custom title text. | | `acceptButtonText` | `string` | Accept button text. | | `declineButtonText` | `string` | Decline button text. | | `avatarStyle` | `AvatarStyleInterface` | Style configuration for avatar. | | `ongoingCallScreenStyle` | `OngoingCallStyleInterface` | Style for ongoing call screen. | ## Outgoing Call ### New Properties | Name | Type | Description | | ------------------------ | ------------------------------------------------------------------ | --------------------------------------------------- | | `onEndCallButtonPressed` | `(call: CometChat.Call) => void` | Callback for when the end/cancel button is pressed. | | `EndCallView` | `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Custom view for the end call button. | | `TitleView` | `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Custom view for the title section. | | `SubtitleView` | `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Custom view for the subtitle section. | | `AvatarView` | `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Custom view for the avatar section. | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | ------------------------ | ------------------------ | -------------------------------------------------------------------------------- | --------------------------------------- | | `onDeclineButtonPressed` | `onEndCallButtonPressed` | `(call: CometChat.Call) => void` | Renamed for clarity and consistency. | | `declineButtonIcon` | `EndCallView` | `ImageType` → `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Changed from icon/image to custom view. | | `declineButtonText` | `EndCallView` | `string` → `(call: CometChat.Call \| CometChat.CustomMessage) => JSX.Element` | Changed from text to custom view. | | `outgoingCallStyle` | `style` | `OutgoingCallStyleInterface` → `DeepPartial` | Style object renamed and type changed. | ### Removed Properties | V4 Name | Type | Description | | -------------------------- | ------------------------------------------- | ----------------------------------------------------- | | `buttonStyle` | `ButtonStyleInterface` | Style object for button (removed, not present in v5). | | `avatarStyle` | `AvatarStyleInterface` | Style object for avatar (removed, not present in v5). | | `declineButtonText` | `string` | Decline button text (replaced by `EndCallView`). | | `declineButtonIcon` | `ImageType` | Decline button icon (replaced by `EndCallView`). | | `onDeclineButtonPressed` | `(call: CometChat.Call) => void` | Callback (renamed to `onEndCallButtonPressed`). | | `outgoingCallStyle` | `OutgoingCallStyleInterface` | Style object (renamed to `style`). | | `callSettingsBuilder` | `typeof CometChatCalls.CallSettingsBuilder` | (Moved to new properties, type clarified). | | `theme` | `CometChatTheme` | Theme configuration (removed, not present in v5). | | `cardStyle` | `CardStyleInterface` | Card style (removed, not present in v5). | | `ongoingCallConfiguration` | `OngoingCallConfigurationInterface` | Ongoing call config (removed, not present in v5). | ## Call Buttons ### New Properties | Name | Type | Description | | --------------------------- | ---------------------------------------------------------------------------------------------------------------------- | -------------------------------------------------------- | | `callSettingsBuilder` | `(user?: CometChat.User, group?: CometChat.Group, isAudioOnly?: boolean) => typeof CometChatCalls.CallSettingsBuilder` | Function to build call settings for call initialization. | | `outgoingCallConfiguration` | `OutgoingCallConfiguration` | Configuration for outgoing calls. | | `style` | `DeepPartial` | Custom style overrides for the call button. | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | ----------------- | --------------------- | ----------------------------------------------------------- | -------------------------------------- | | `hideVoiceCall` | `hideVoiceCallButton` | `boolean` | Renamed for clarity. | | `hideVideoCall` | `hideVideoCallButton` | `boolean` | Renamed for clarity. | | `callButtonStyle` | `style` | `CallButtonStyleInterface` → `DeepPartial` | Style object renamed and type changed. | ### Removed Properties | V4 Name | Type | Description | | -------------------- | ---------------------------------------------------------------------- | ----------------------------------- | | `voiceCallIconImage` | `ImageType` | Image icon for voice calls. | | `voiceCallIconText` | `string` | Text label for the voice call icon. | | `videoCallIconImage` | `ImageType` | Image icon for video calls. | | `videoCallIconText` | `string` | Text label for the video call icon. | | `onVoiceCallPress` | `(params: { user?: CometChat.User, group?: CometChat.Group }) => void` | Callback for voice call icon click. | | `onVideoCallPress` | `(params: { user?: CometChat.User, group?: CometChat.Group }) => void` | Callback for video call icon click. | | `callButtonStyle` | `CallButtonStyleInterface` | Style object (renamed to `style`). | ## Call Logs ### New Properties | Name | Type | Description | | --------------------------- | -------------------------------------------------- | ----------------------------------------------------------------------- | | `LeadingView` | `(call?: any) => JSX.Element` | Custom component for the leading view of each call log item. | | `TitleView` | `(call?: any) => JSX.Element` | Custom component for the title view of each call log item. | | `SubtitleView` | `(call?: any) => JSX.Element` | Custom component for the subtitle view of each call log item. | | `ItemView` | `(call?: any) => JSX.Element` | Custom component for the entire call log item. | | `TrailingView` | `(call?: any) => JSX.Element` | Custom component for the trailing view of each call log item. | | `AppBarOptions` | `() => JSX.Element` | Custom options to render in the AppBar. | | `callLogRequestBuilder` | `any` | Builder for custom call log requests. | | `datePattern` | `ValueOf` | Date format pattern for call logs. | | `showBackButton` | `boolean` | Flag to show the back button in the header. | | `EmptyView` | `() => JSX.Element` | Custom component to render when the call log list is empty. | | `ErrorView` | `(e: CometChat.CometChatException) => JSX.Element` | Custom component to render in case of an error. | | `LoadingView` | `() => JSX.Element` | Custom component to render while loading call logs. | | `hideError` | `boolean` | Flag to hide the error view. | | `onCallIconPress` | `(item: any) => void` | Callback when the call icon is pressed. | | `onError` | `(e: CometChat.CometChatException) => void` | Callback for handling errors. | | `onBack` | `() => void` | Callback for when the back button is pressed. | | `onItemPress` | `(call: any) => void` | Callback for when a call log item is pressed. | | `style` | `DeepPartial` | Custom style overrides for the call logs. | | `outgoingCallConfiguration` | `CometChatOutgoingCallInterface` | Configuration for outgoing calls. | | `onLoad` | `(list: any[]) => void` | Callback when the list is fetched and loaded. | | `onEmpty` | `() => void` | Callback when the list is empty (no items). | | `onItemLongPress` | `(prop: { call: any }) => void` | Called on a long press of the default list item view. | | `hideHeader` | `boolean` | Hide the toolbar header. | | `hideLoadingState` | `boolean` | Hide the loading state. | | `addOptions` | `(call: any) => MenuItemInterface[]` | Append more menu items on top of the default menu items for a call log. | | `options` | `(call: any) => MenuItemInterface[]` | Replace the default menu items entirely for a call log. | ### Renamed Properties | V4 Name | V5 Name | Type | Description | | ------------------ | ---------------- | -------------------------------------------------------------------------- | --------------------------------------------------------- | | `TailView` | `TrailingView` | `(param: { call?: any }) => JSX.Element` → `(call?: any) => JSX.Element` | Signature and name updated for trailing view. | | `ListItemView` | `ItemView` | `(param: { call?: any }) => JSX.Element` → `(call?: any) => JSX.Element` | Signature and name updated for item view. | | `EmptyStateView` | `EmptyView` | `() => JSX.Element` | Custom component for empty state. | | `ErrorStateView` | `ErrorView` | `() => JSX.Element` → `(e: CometChat.CometChatException) => JSX.Element` | Signature and name updated for error view. | | `LoadingStateView` | `LoadingView` | `() => JSX.Element` | Custom component for loading state. | | `callLogsStyle` | `style` | `CallLogsStyleInterface` → `DeepPartial` | Style object renamed and type changed. | | `AppBarOptions` | `AppBarOptions` | `() => JSX.Element` | (Remains, but usage clarified.) | | `options` | `options` | Function signature updated | Now receives `(call: any)` instead of `{ message: any }`. | | `datePattern` | `datePattern` | Type updated | Now uses `ValueOf`. | | `showBackButton` | `showBackButton` | `boolean` | (Remains, but usage clarified.) | ### Removed Properties | V4 Name | Type | Description | | -------------------------- | ------------------------------- | ------------------------------------------------ | | `title` | `string` | Title of the call log list component. | | `emptyStateText` | `string` | Text to be displayed when the state is empty. | | `errorStateText` | `string` | Text to be displayed when error occurs. | | `loadingIcon` | `ImageType` | Icon to be displayed when loading. | | `avatarStyle` | `AvatarStyleInterface` | Style configuration for avatar. | | `listItemStyle` | `ListItemStyleInterface` | Style configuration for individual list items. | | `headViewContainerStyle` | `StyleProp` | Custom styling for headViewContainer. | | `bodyViewContainerStyle` | `StyleProp` | Custom styling for bodyViewContainer. | | `tailViewContainerStyle` | `StyleProp` | Custom styling for tailViewContainer. | | `missedAudioCallIconUrl` | `string` | Custom missed audio call icon URL. | | `missedVideoCallIconUrl` | `string` | Custom missed video call icon URL. | | `incomingAudioCallIconUrl` | `string` | Custom incoming audio call icon URL. | | `incomingVideoCallIconUrl` | `string` | Custom incoming video call icon URL. | | `outgoingAudioCallIconUrl` | `string` | Custom outgoing audio call icon URL. | | `outgoingVideoCallIconUrl` | `string` | Custom outgoing video call icon URL. | | `BackButton` | `JSX.Element` | Custom back button element. | | `onInfoIconPress` | `(prop: { call: any }) => void` | Callback for info icon press. | | `infoIcon` | `ImageType` | Info icon image. | | `theme` | `CometChatTheme` | Theme configuration for the call logs component. | | `hideSeperator` | `boolean` | Toggle visibility of separator. |