Message a User Privately from a Group Chat

Learn how to initiate a private one-on-one chat with a group member directly from a group chat screen.

Overview

This feature allows users to start a private, direct chat with a member of a group without leaving the group chat context. It enables seamless, context-aware private conversations, improving collaboration and user experience. Users can tap on a group member to instantly open a private chat.

Prerequisites

A Flutter project with CometChat UIKit Flutter v5 installed
CometChat credentials (appID, region, authKey) initialized
Group chat and user info screens implemented
Navigation setup for moving between group and private chat screens

Components

Component / Class	Role
`CometChatMessageList`	Displays group messages and user avatars
`CometChatUserInfo`	Shows user details and actions (e.g., “Message” button)
`PageManager`	Handles navigation to the private chat screen
`lib/messages.dart`	Main chat screen logic
`lib/user_info/cometchat_user_info.dart`	User info and action UI

Integration Steps

Add User Info/Action in Group Chat

Allow users to view group member info and provide a “Message” action.

IconButton(
  icon: Icon(Icons.info_outline),
  onPressed: () {
    Navigator.push(
      context,
      MaterialPageRoute(
        builder: (context) => CometChatUserInfo(user: user),
      ),
    );
  },
);

File reference:
lib/group_info/cometchat_group_info.dart Start a private chat with the selected user.

ElevatedButton(
  onPressed: () {
    PageManager().navigateToMessages(
      context: context,
      user: user,
    );
  },
  child: Text('Message'),
);

File reference:
lib/user_info/cometchat_user_info.dart

Implementation Flow

User taps a group member’s avatar or info icon
CometChatUserInfo screen opens
User taps “Message”
App navigates to the private chat screen with that user

Customization Options

Styling: Customize the user info screen and action buttons using UIKit theming
APIs: Add more actions (e.g., block, view profile) in the user info screen
Configuration: Control which users can be messaged (e.g., block list, admin-only)

Filtering / Edge Cases

Exclude Blocked Users: Remove blocked users from selection
Existing Conversation: Navigate to an existing private chat if one exists
User Blocked: Disable the “Message” button if the user is blocked

Error Handling & Blocked-User-Handling

UI States: Disable the message button and show a tooltip if a user is blocked
Feedback: Use SnackBar or Toast for error messages (e.g., “Cannot message this user”)
Retry Logic: Allow retrying navigation if a network error occurs

Optional Context-Specific Notes

Group vs. User: This flow applies only to group members; use the standard new chat flow for users outside the group

Summary / Feature Matrix

Feature	Component / Method	File(s)
Show user info	`CometChatUserInfo`	`lib/group_info/cometchat_group_info.dart`
Message user	`PageManager.navigateToMessages`	`lib/user_info/cometchat_user_info.dart`
Access from group	Avatar/IconButton	`lib/messages.dart`

Next Steps & Further Reading

Flutter Sample App

Fully functional sample applications to accelerate your development.View on GitHub

UI Kit Source Code

Access the complete UI Kit source code on GitHub.View on GitHub

​Overview

​Prerequisites

​Components

​Integration Steps

​Add User Info/Action in Group Chat

​Handle Private Message Navigation

​Implementation Flow

​Customization Options

​Filtering / Edge Cases

​Error Handling & Blocked-User-Handling

​Optional Context-Specific Notes

​Summary / Feature Matrix

​Next Steps & Further Reading