Threaded Messages

​

Overview

• Reply to specific messages to start focused sub-conversations.
• View all replies grouped under the parent message.
• Seamlessly switch back to the main conversation.

​

Prerequisites

• A Flutter project with CometChat UIKit Flutter v5 installed.
• Initialized CometChat credentials (appID, region, authKey).

​

Components

​

Integration Steps

​

Show the “Reply in Thread” Option

CometChatMessageList(
  onThreadRepliesClick: (BaseMessage message) {
    Navigator.push(
      context,
      MaterialPageRoute(
        builder: (_) => CometChatThread(parentMessage: message),
      ),
    );
  },
  // …other props
);

​

Navigate to the Thread Screen

class CometChatThread extends StatelessWidget {
  final BaseMessage parentMessage;

  CometChatThread({required this.parentMessage});

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(title: Text("Thread")),
      body: Column(
        children: [
          CometChatThreadedHeader(message: parentMessage),
          Expanded(
            child: CometChatThreadedMessageList(
              parentMessageId: parentMessage.id,
            ),
          ),
          CometChatMessageComposer(
            parentMessageId: parentMessage.id,
          ),
        ],
      ),
    );
  }
}

​

Send a Threaded Message

CometChatMessageComposer(
  parentMessageId: parentMessage.id,
  // …other composer props
);

​

Fetch & Display Thread Replies

MessagesRequest request = MessagesRequestBuilder()
  .setParentMessageId(parentMessageId)
  .build();

request.fetchPrevious().then((replies) {
  // Render these replies in the list
});

​

Customization Options

• Header Styling: Customize CometChatThreadedHeader appearance (colors, fonts).
• List Pagination: Adjust limit in MessagesRequestBuilder.
• Composer Placeholder: Change placeholder text based on thread context.

​

Filtering / Edge Cases

• Parent Deleted: Show a fallback message or disable composer if parent is deleted.
• No Replies: Display an empty state (e.g., “No replies yet”).
• Offline Mode: Queue thread operations or show connectivity indicators.

​

Error Handling & Edge Cases

• Fetch Failures: Show error UI with retry option on fetchPrevious errors.
• Send Failures: Display SnackBar on composer send errors; allow retry.
• Loading States: Show loading indicators during fetch/send operations.

​

Optional Context-Specific Notes

• Group vs. Direct Threads: Threads work the same for groups and 1:1 chats.
• Blocked Users: Threading respects block state; blocked users cannot send replies.

​

Summary / Feature Matrix

​

Next Steps & Further Reading