Skip to main content
The CometChatConversations component displays a list of all conversations (one-on-one and group chats) for the currently logged-in user. It shows the last message, unread count, typing indicators, and user presence in real-time.
CometChatConversations showing a list of recent conversations with user avatars, last message previews, timestamps, and unread message badges

Where It Fits

CometChatConversations serves as the main entry point for chat functionality. It displays all conversations and navigates to CometChatMessages when a conversation is selected.
CometChatConversations showing integration flow with conversation list navigating to messages screen

Minimal Render

CometChatConversations showing minimal render with default configuration displaying conversation list

Filtering

Use ConversationRequest.ConversationRequestBuilder to filter which conversations appear in the list. The builder pattern allows chaining multiple filter conditions.

Filter Recipes


Actions and Events

Callback Props

onItemClick

Fires when a user taps on a conversation. Use this to navigate to the messages screen.

onItemLongClick

Fires when a user long-presses on a conversation. Use this to show additional options like delete or mute.

onBack

Fires when the back button is pressed. Use this for custom navigation handling.

onSelection

Fires when conversations are selected in selection mode. Returns the list of selected conversations.

onError

Fires when an error occurs while loading conversations.

onEmpty

Fires when the conversation list is empty.

onLoad

Fires when conversations are successfully loaded.

Actions Reference

Global UI Events

SDK Events (Real-Time, Automatic)


Custom View Slots

listItemView

Replace the entire conversation row with a custom design.

subtitleView

Customize just the subtitle area below the conversation name.

leadingView

Customize the avatar / left section of the conversation row.

titleView

Customize the title area that displays the conversation name.

tailView

Customize the right side of the conversation row (time, unread badge). Note: The setter method is set(trailView:).

Styling

Style Hierarchy

  1. Global styles (CometChatConversation.style) apply to all instances
  2. Instance styles override global for specific instances

Global Level Styling

Instance Level Styling

CometChatConversations with custom styling applied showing customized background, colors, and list item appearance

Key Style Properties

Customization Matrix


Methods

Swipe Action Methods

set(options:)

Sets custom swipe actions for conversation list items, replacing the default options.

add(options:)

Adds additional swipe actions to the existing default options.

Data Manipulation Methods

insert(conversation:at:)

Inserts a conversation at a specific index in the list.

getSelectedConversations()

Returns the list of currently selected conversations when in selection mode.

getConversationList()

Returns the complete list of conversations currently displayed.

Connection Methods

connect()

Manually establishes the WebSocket connection for real-time updates. Use this when you need to reconnect after calling disconnect().

disconnect()

Manually disconnects the WebSocket connection. Use this when you want to temporarily stop receiving real-time updates, such as when the view is not visible.

Text Formatter Methods

set(textFormatters:)

Sets custom text formatters for processing and displaying message text in conversation subtitles.

Props

All props are optional. Sorted alphabetically.

avatarStyle

Customizes the appearance of avatars in conversation list items.

badgeStyle

Customizes the appearance of unread message count badges.

conversationRequestBuilder

Custom request builder for filtering which conversations appear.

dateStyle

Customizes the appearance of date/time labels in conversation list items.

dateTimeFormatter

Custom formatter for date/time display in conversation list items.

customSoundForMessages

Custom sound URL for new message notifications.

disableSoundForMessages

Disables notification sounds for new messages.

disableTyping

Disables typing indicators in the conversation list.

hideBackButton

Hides the back button in the navigation bar.

hideDeleteConversationOption

Hides the delete option in conversation actions.

hideGroupType

Hides the public/private group type icons.

hideNavigationBar

Hides the entire navigation bar.

hideReceipts

Hides read/delivered receipt indicators.

hideSearch

Hides the search bar.

hideUserStatus

Hides online/offline status indicators.

onSearchClick

Callback triggered when the search button is clicked.

privateGroupIcon

Custom icon for private group conversations.

protectedGroupIcon

Custom icon for password-protected group conversations.

receiptStyle

Customizes the appearance of message receipt indicators (sent, delivered, read).

selectionMode

Sets the selection mode for multi-select functionality.

statusIndicatorStyle

Customizes the appearance of online/offline status indicators.

textFormatters

Array of text formatters for customizing message text display.

typingIndicatorStyle

Customizes the appearance of typing indicators in conversation list items.

Events


Date Time Formatter

Customize how timestamps appear in the conversation list using the datePattern callback.

Global Level Formatting

Instance Level Formatting

Available Formatters

Common Customizations


Mention Configuration

Configure how @all mentions appear in conversation list items. When a message contains an @all mention, the conversation subtitle displays the mention with a customizable label.

setMentionAllLabel

Sets a custom label for @all mentions displayed in conversation list items.

Common Patterns

Tab bar integration

Full implementation with tab bar showing CometChatConversations in a real app:

Custom empty state with CTA

Hide all chrome — minimal list

Filter by conversation type