Docs Overview/
React Native/

React Native

Feature Overview

The message reaction feature refers to the interactive reaction to a specific message. A typical scenario is the emoji reaction. Emoji reactions are interactive reactions using emoticons. We can see the number of responders and the list of responders for each emoji.
Currently, there are two common styles of message response display:
Style 1



Style 2



Users can pull out all the user profiles using a particular emoji by pages.
You can implement the emoji reaction capacity based on the SDK API:
Call the addMessageReaction API to add an emoji to a message. After adding successfully, the current operating user will be stored under the emoji.
Call the removeMessageReaction API to delete the added emoji. After deleting successfully, the current operating user will no longer be stored under the emoji.
Call the getMessageReactions API to batch pull the emoji list of multiple messages, where each emoji contains the total number of current users and the first N (default 10) users profiles.
Call the getAllUserListOfMessageReaction API to paginate and pull the full list of user profiles using the message emoji.
Monitor the onRecvMessageReactionsChanged callback to perceive changes in the user profile of emojis. This callback will carry the latest user profile of the emoji, including the total number of users and the first N user profiles.
Note:
This feature is supported by v0.1.28 or later and is a part of the Ultimate edition. To use this feature, you need to purchase the Ultimate edition.

Add Message Reaction

Call the addMessageReaction API to add a message reaction.
API
import { TencentImSDKPlugin } from 'react-native-tim-js';
TencentImSDKPlugin.v2TIMManager
   .getMessageManager()
   .addMessageReaction({
      msgID: msgID,
      reactionID: 'emoji',
});
Input Parameter
Definition
Description
msgID
Message ID
The message must be in a Sent successfully status.
reactionID
Message reaction ID
In the emoji reaction scenario, the reactionID represents the emoji ID.
Note:
A single message can support up to 10 reactions, and a single reaction can supports up to 100 users.
If the number of reactions in a single message exceeds the maximum limit, he interface will report the ERR_SVR_MSG_REACTION_COUNT_LIMIT error.
If the number of users in a single reaction exceeds the maximum limit, the interface will report the ERR_SVR_MSG_REACTION_USER_COUNT_LIMIT error.
If a reaction already contains the current operating user, the interface will report the ERR_SVR_MSG_REACTION_ALREADY_CONTAIN_USER error.

Remove Message Reaction

Call the removeMessageReaction API to remove a message reaction.
API
import { TencentImSDKPlugin } from 'react-native-tim-js';
TencentImSDKPlugin.v2TIMManager
   .getMessageManager()
   .removeMessageReaction({
      msgID: msgID,
      reactionID: 'emoji',
});
Input Parameter
Definition
Description
msgID
Message ID
The message must be in a Sent successfully status.
reactionID
Message response ID
In the emoji reaction scenario, the reactionID represents the emoji ID.

Get Message Reactions

Call the getMessageReactions API to get multiple message reactions in batches.
API
import { TencentImSDKPlugin } from 'react-native-tim-js';
TencentImSDKPlugin.v2TIMManager
   .getMessageManager()
   .getMessageReactions({
      msgIDs: [msgID],
      maxUserCountPerReaction: 10,
});
Input Parameter
Definition
Description
msgIDs
List of Message IDs
The messages must belong to the same conversation, and they must have been sent successfully.
maxUserCountPerReaction
Each Reaction returns the maximum user profile quantity
The value range is [0,10]. Each reaction only returns the first 10 user profiles at most. If you need more user profile, you can call the getAllUserListOfMessageReaction interface to pull by page.
Get message reactions information object explanation is as follows:
Input Parameter
Definition
Description
resultCode
Return code
0: indicates success.
Non-zero: indicates failure.
resultInfo
Return message
Error message.
msgID
Message ID
Unique ID of the message.
reactionList
Message reaction list
List of V2TIMMessageReaction message reaction objects.
The details of the V2TIMMessageReaction object are as follows:
Input Parameter
Definition
Description
reactionID
Message reaction ID
In the emoji reaction scenario, the reactionID represents the emoji ID.
totalUserCount
Total count of users
The total count of users who have added reaction using the same reactionID.
partialUserList
Partial user list
The partial list of users who added reaction message using the same reactionID. The count of users in the list depends on the maxUserCountPerReaction value set when calling the getMessageReactions API.
reactedByMyself
Whether I have used this reaction
If this reaction is used, the return value is true.

Get All User List of Message Reaction

Call the getAllUserListOfMessageReaction API to get all messages reaction of the user list in pages.
API
import { TencentImSDKPlugin } from 'react-native-tim-js';
TencentImSDKPlugin.v2TIMManager
   .getMessageManager()
   .getAllUserListOfMessageReaction({
      msgID: msgID,
      reactionID: 'emoji',
      nextSeq: 0,
      count: 10,
});
Input Parameter
Definition
Description
message
Message ID
The message must be in a Sent successfully status.
reactionID
Message reaction ID
In the emoji reaction scenario, the reactionID represents the emoji ID.
nextSeq
The next pulling-by-page cursor
Pass 0 for the first time, and pass the nextSeq returned by succ for subsequent pages.
count
The maximum count of users fetched per page
Up to 100.

Message Reaction Information Change Notification

If you have added an advanced message event listener in advance by calling addAdvancedMsgListener, you will receive the onRecvMessageReactionsChanged callback when message reaction information is updated.
Please note that this callback only contains incremental updates to the message Reaction and only carries the changed Reaction information. When the totalUserCount field in the changed Reaction information is set to 0, it means that no users are using this Reaction, and you can remove the display of this Reaction from the UI.
import { TencentImSDKPlugin } from 'react-native-tim-js';

TencentImSDKPlugin.v2TIMManager.getMessageManager().addAdvancedMsgListener(
        {
          onRecvC2CReadReceipt: ( receiptList) {}, // C2C recipient user conversation read notification (when the recipient user calls markC2CMessageAsRead, you will receive this notification)
          onRecvMessageModified: ( message) {}, // The content of the message has been modified
          onRecvMessageReadReceipts: ( receiptList) {}, // Notification of message read receipt (if the message I sent supports read receipts, when the recipient calls sendMessageReadReceipts, I will receive this notification).
          onRecvMessageRevoked: ( messageid) {}, // Received a message recall notification
          onRecvNewMessage: ( message) {}, // Received a new message
          onSendMessageProgress: ( message,  progress) {}, // Event for upload message progress
          onRecvMessageReactionsChanged: (msgID, reactionList){}, // Message reaction updated
        }
);