Skip to main content

Mentions

Nexconn Chat UI can attach SDK MentionedInfo metadata to text, reference, and media messages. Mention support is available for group channels through the standard input widget.

The UI package does not fetch group members by itself. Mention candidates must be supplied by your app through mentionResolver or mentionPicker.

Enable Mention Picking​

Mention picking is enabled by default, but it only opens when all of these conditions are true:

  • MessageInputConfig.enableMention is true.
  • The current BaseChannel.channelType is ChannelType.group.
  • Your app provides mentionResolver or mentionPicker.
  • The user inserts the @ character into the input field.

Provide Candidates with mentionResolver​

Use mentionResolver when a simple built-in bottom sheet is enough. The resolver returns candidates, and Nexconn Chat UI renders them with mentionCandidateBuilder or a default list tile.

Dart
ChatPageConfig(
  inputConfig: MessageInputConfig(
    mentionResolver: (context, channel) async {
      final members = await loadGroupMembers(channel.channelId);
      return members.map((member) {
        return MessageInputMentionCandidate(
          userId: member.userId,
          displayName: member.displayName,
        );
      }).toList();
    },
  ),
)

Provide a Custom Picker with mentionPicker​

Use mentionPicker when your app needs its own member page, search, paging, role filtering, or all-member entry.

Dart
ChatPageConfig(
  inputConfig: MessageInputConfig(
    mentionPicker: (context, channel) async {
      return Navigator.of(context).push<MessageInputMentionCandidate>(
        MaterialPageRoute(
          builder: (_) => GroupMemberPickerPage(channel: channel),
        ),
      );
    },
  ),
)

Sending Mentioned Messages​

After a candidate is selected, the input widget inserts the candidate display name and stores the user ID in MessageInputProvider. When the user sends the text, ChatProvider.sendText builds either TextMessageParams or ReferenceMessageParams with MentionedInfoParams.

You can also call the send helpers directly.

Dart
await chatProvider.sendText(
  '@Ada please review this',
  mentionUserIds: ['ada_user_id'],
);
Dart
await chatProvider.sendImageMessage(
  '/local/path/photo.jpg',
  mentionUserIds: ['ada_user_id'],
);

To mention everyone, pass the reserved Chat UI all-member mention ID. Chat UI maps this value to SDK MentionedType.all before sending.

Dart
await chatProvider.sendText(
  '@all release is ready',
  mentionUserIds: ['All'],
);

When you mention selected users manually, pass real user IDs in mentionUserIds. The input widget handles this for candidates selected from mentionResolver or mentionPicker. If your app offers an all-member row in a custom picker, return a candidate whose userId is All. Do not use All as a real user ID in your app account system.

For large groups, return a filtered or paged candidate list from your own picker instead of loading every member into the default bottom sheet. When the resolver returns an empty list, the input keeps the typed text and sends it as normal text without mention metadata.

Forwarded messages are sent as new messages. Mention display text may remain in the body, but mention notification metadata is only preserved when the forwarded message type and source metadata can be rebuilt by the forwarding helper.

Last updated on