> ## Documentation Index
> Fetch the complete documentation index at: https://cometchat-22654f5b-docs-rn-guide-message-privately.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.
# Threaded Messages
> Add threaded messages in CometChat iOS UI Kit with parent message context, reply views, message composers, and thread navigation.
Enhance your iOS chat app with threaded messaging by integrating CometChat's UIKit for iOS, allowing users to reply to specific messages within a focused thread view.
## Overview
Threaded messages allow users to reply to specific messages within a conversation, creating a sub-conversation for improved clarity and context. With CometChat's UIKit for iOS, you can:
* Display a dedicated thread view
* View and send replies to a selected message
* Maintain context between the main conversation and the thread
## Prerequisites
Before implementing this feature, ensure you have:
1. Completed [Getting Started](/ui-kit/ios/getting-started) setup
2. CometChat UIKit v5+ installed
3. User logged in with `CometChatUIKit.login()`
## Components
| Component | Description |
| -------------------------------- | ------------------------------------------------------------- |
| `CometChatMessageList` | Displays messages and provides `onThreadRepliesClick` handler |
| `CometChatThreadedMessageHeader` | Shows the parent message context at the top of the thread |
| `CometChatMessageComposer` | Composes messages with an optional `parentMessageId` |
| `ThreadedMessagesVC` | View controller that hosts the threaded conversation |
## Integration Steps
### Step 1: Show the "Reply in Thread" Option
Navigate to the thread when a message's thread icon is tapped:
```swift lines theme={null}
import UIKit
import CometChatUIKitSwift
import CometChatSDK
class MessagesViewController: UIViewController {
var messageListView: CometChatMessageList!
func setupThreadReplies() {
// Handle thread replies click
messageListView.set(onThreadRepliesClick: { [weak self] message, _ in
guard let self = self else { return }
// Create and configure thread view controller
let threadVC = ThreadedMessagesVC()
threadVC.parentMessage = message
// Navigate to thread screen
self.navigationController?.pushViewController(threadVC, animated: true)
})
}
}
```
This captures user intent and opens a focused thread screen.
**File reference:** [`ThreadedMessagesVC.swift`](https://github.com/cometchat/cometchat-uikit-ios/blob/v5/SampleApp/View%20Controllers/CometChat%20Components/ThreadedMessagesVC.swift)
### Step 2: Navigate to the Thread Screen
Show a dedicated UI for thread replies. In `ThreadedMessagesVC.swift`:
```swift lines theme={null}
import UIKit
import CometChatUIKitSwift
import CometChatSDK
class ThreadedMessagesVC: UIViewController {
var parentMessage: BaseMessage?
var user: User?
var group: Group?
private var parentMessageContainerView: CometChatThreadedMessageHeader!
private var messageListView: CometChatMessageList!
private var composerView: CometChatMessageComposer!
override func viewDidLoad() {
super.viewDidLoad()
setupUI()
}
private func setupUI() {
// Add UI components to view hierarchy
view.addSubview(parentMessageView)
view.addSubview(messageListView)
view.addSubview(composerView)
}
}
```
Header configuration:
```swift lines theme={null}
// Create the threaded message header
let parentMessageContainerView = CometChatThreadedMessageHeader()
```
Message list configuration:
```swift lines theme={null}
// Configure message list with user and parent message
messageListView.set(user: user, parentMessage: parentMessage)
```
This provides a focused UI for thread interactions.
### Step 3: Send a Threaded Message
Ensure new replies are attached to the correct parent message:
```swift lines theme={null}
// Set the parent message ID for threaded replies
composerView.set(parentMessageId: parentMessage?.id ?? 0)
```
Set the conversation context:
```swift lines theme={null}
// Configure composer for user conversation
composerView.set(user: user)
// Or configure for group conversation
composerView.set(group: group)
```
### Step 4: Fetch and Display Thread Replies
Only messages that are part of the thread are displayed. This is handled internally by:
```swift lines theme={null}
// Configure message list to fetch thread replies
messageListView.set(user: user, parentMessage: parentMessage)
```
This ensures `CometChatMessageList` fetches replies using the `parentMessageId`.
## Customization Options
### Header Styling
Customize `CometChatThreadedMessageHeader` appearance:
```swift lines theme={null}
// Customize fonts, colors, and layout
let headerStyle = ThreadedMessageHeaderStyle()
headerStyle.titleFont = UIFont.systemFont(ofSize: 16, weight: .semibold)
headerStyle.titleColor = .label
parentMessageContainerView.set(style: headerStyle)
```
### Composer
Modify placeholder text, input styles, and icons:
```swift lines theme={null}
// Customize composer appearance
composerView.set(placeholderText: "Reply in thread...")
```
### Navigation
Add a custom back button for navigation:
```swift lines theme={null}
// Add custom back button
navigationItem.leftBarButtonItem = UIBarButtonItem(
image: UIImage(systemName: "chevron.left"),
style: .plain,
target: self,
action: #selector(goBack)
)
```
## Edge Cases
| Scenario | Handling |
| ---------------------- | ------------------------------------------------ |
| Parent message deleted | Display a fallback UI or disable the composer |
| No replies | Show an empty state (e.g., "No replies yet") |
| Offline mode | Disable the composer and queue thread operations |
## Error Handling
| Error Type | Solution |
| -------------- | --------------------------------------------------------------------- |
| Fetch failures | Show an error UI or retry mechanism when loading thread messages |
| Send failures | Handle send errors via delegate callbacks or show an alert with retry |
| Loading states | Display a `UIActivityIndicatorView` during fetch/send operations |
| Blocked users | Remove the composer and display a blocked status label |
## Feature Matrix
| Feature | Implementation |
| ------------------------- | ------------------------------------------------ |
| Show thread option | `CometChatMessageList.onThreadRepliesClick` |
| Thread view screen | `ThreadedMessagesVC.swift` |
| Display threaded messages | `CometChatMessageList.set(parentMessage:)` |
| Send threaded message | `CometChatMessageComposer.set(parentMessageId:)` |
| Thread header | `CometChatThreadedMessageHeader` |
| Handle blocked user | Remove composer and show a blocked user label |
## Related Components
* [Message List](/ui-kit/ios/message-list) - Display messages in conversations
* [Message Composer](/ui-kit/ios/message-composer) - Compose and send messages
* [Threaded Messages Header](/ui-kit/ios/threaded-messages-header) - Thread header component
Explore a complete sample application demonstrating threaded messaging
Browse the CometChat UIKit for iOS source code
## Related Guides
Customize the thread header component
Display and customize chat messages
Overview of messaging features