Reaction

Emojis are widely used in real-time chats because they allow users to express their feelings in a direct and vivid way. In Chat, "reactions" allow users to quickly react to a message using emojis in one-to-one chats and chat groups. In group chats, reactions can also be used to cast a vote, for example, by calculating the number of different emojis attached to the message.

The following illustration shows the implementation of adding a reaction to a message, how a conversation looks with reactions, and what retrieving a list of reactions (with related information) looks like.

This page shows how to use the Chat SDK to implement reactions in your project.

The SDK provides the following APIs to implement reaction functionalities:

• asyncAddReaction: Adds a reaction to the specified message.
• asyncRemoveReaction: Removes the reaction from the specified message.
• asyncGetReactionList: Retrieves a list of reactions from the server.
• asyncGetReactionDetail: Retrieves the details of the reaction from the server.
• ChatMessage.getMessageReaction: Retrieves a list of reactions from the ChatMessage objects in the local database.

Before proceeding, ensure that your environment meets the following requirements:

• The project integrates a version of the Chat SDK later than v1.0.3 and has implemented the basic real-time chat functionalities.
• You understand the API call frequency limit as described in Limitations.

The reaction feature is supported by all types of Pricing Plans and is enabled by default once you have enabled Chat in Agora Console.

This section introduces how to implement reaction functionalities in your project.

Call asyncAddReaction to add a reaction to the specified message. You can use onReactionChanged to listen for the state of adding the reaction.

// Add a reaction

ChatClient.getInstance().chatManager().asyncAddReaction(message.getMsgId(), reaction, new CallBack() {

@Override

public void onSuccess() {

}

@Override

public void onError(int error, String errorMsg) {

}

@Override

public void onProgress(int i, String s) {

}

});

// Listen for the state of the reaction.

public class MyClass implements MessageListener {

private void init() {

ChatClient.getInstance().chatManager().addMessageListener(this);

}

@Override

public void onReactionChanged(List<MessageReactionChange> list) {

}

}

Call asyncRemoveReaction to remove the specified reaction. You can also listen for the reaction change in onReactionChanged.

// Remove the reaction.

ChatClient.getInstance().chatManager().asyncRemoveReaction(message.getMsgId(), reaction, new CallBack() {

@Override

public void onSuccess() {

}

@Override

public void onError(int error, String errorMsg) {

}

@Override

public void onProgress(int i, String s) {

}

});

// Listen for reaction state change.

public class MyClass implements MessageListener {

private void init() {

ChatClient.getInstance().chatManager().addMessageListener(this);

}

@Override

public void onReactionChanged(List<MessageReactionChange> list) {

}

}

Call asyncGetReactionList to retrieve a list of reactions from the server. This method also returns the basic information of the reactions, including the content of the reaction, the number of users that added or removed the reaction, and a list of the first three user IDs that added or removed the reaction.

ChatClient.getInstance().chatManager().asyncGetReactionList(msgIdList, ChatMessage.ChatType.Chat, groupId, new ValueCallBack<Map<String, List<MessageReaction>>>() {

@Override

public void onSuccess(Map<String, List<MessageReaction>> stringListMap) {

}

@Override

public void onError(int i, String s) {

}

});

Call asyncGetReactionDetail to get the detailed information of the reaction from the server. The detailed information includes the reaction content, the number of users that added or removed the reaction, and the complete list of user IDs that added or removed the reaction.

ChatClient.getInstance().chatManager().asyncGetReactionDetail(mMsgId, emojiconId, pageCurosr, 30, new ValueCallBack<CursorResult<MessageReaction>>() {

@Override

public void onSuccess(CursorResult<MessageReaction> messageReactionCursorResult) {

}

@Override

public void onError(int i, String s) {

}

});

Reactions are also supported in the Chat UI Kit, which contains a wider range of emojis. You can also use the UI Kit to implement reactions in your project.