Mark messages as read

To keep the most up-to-date and accurate read status of messages for all group channel members, the markAsRead() method should be called every time one of the members reads messages by entering the channel from a channel list or bringing the chat view to the foreground.

For the member who sent the message to the channel, the Sendbird server updates the member's read receipt to the time when the message was sent. The read receipts of other channel members are updated when the markAsRead() method is called.

If a member opens a channel and markAsReadAll() is called, the Sendbird server updates both the unread message count of the individual channel and the total unread message count of all the group channels joined by the member. The server then triggers the onUnreadMemberStatusUpdated() method in the channel event handler to notify the change of read status to all other members' devices.

If a new member joins the channel, the method works differently based on the value of the display_past_message property of your Sendbird application. If the property is set to true, the new member’s read receipt is updated to the sent time of the last message in the channel. If set to false, the property's value is 0.

// const sb = SendbirdChat.init(...); // For Sendbird Chat SDK initialization details, refer to:
// https://sendbird.com/docs/chat/sdk/v4/javascript/getting-started/send-first-message#2-get-started-3-step-2-initialize-sendbird-chat-sdk

await groupChannel.markAsRead();
// ...

const channelHandler = new GroupChannelHandler({
    onUnreadMemberStatusUpdated: (channel) => {
        // ...
    },
});
sb.groupChannel.addGroupChannelHandler(UNIQUE_HANDLER_ID, channelHandler);

Note: The display_past_message property determines whether to display past messages to newly joined members when they enter the channel. This property is also linked to the Chat history option, which can be managed on Sendbird Dashboard under Settings > Chat > Channels > Group channels.

Call the markAsUnread() method to return a message's read status back to unread in a group channel. This is useful when users need to flag messages for later review or when they want to keep track of messages that they haven't read yet. This status change is only visible to the user who marked the message as unread, and it doesn't affect other users in the channel.

To mark messages as unread, call the markAsUnread() method on the GroupChannel object. You must specify a message that you want to mark as unread. This will be the starting point for the unread status. Messages after this are also treated as unread. Once marked, the SDK updates the unread message count of the group channel and triggers the onChannelChanged() methods in the GroupChannelHandler and onTotalUnreadMessageCountChanged() methods in the UserEventHandler.

await channel.markAsUnread(message);

//...

const channelHandler = new GroupChannelHandler({
    onChannelChanged: (channel) => {
        // ...
    },

    // To listen to a read status update by other channel members,
    // define onUnreadMemberStatusUpdated() with actions to perform when notified.
    onUnreadMemberStatusUpdated: (channel) => {

    },
});
sb.groupChannel.addGroupChannelHandler(UNIQUE_HANDLER_ID, channelHandler);

const userEventHandler = new UserEventHandler({
    onTotalUnreadMessageCountChanged: (unreadMessageCount) => {
        // ...
    },
})
sb.addUserEventHandler(UNIQUE_HANDLER_ID, userEventHandler);

To get the read status of messages in a group channel, use the getReadStatus() method. The method returns a dictionary object with the user ID as the key and the read status as the value. The read status object contains the timestamp of the last read message.

// If includeAllMembers is set to false, the results won't include the current user.
const result = channel.getReadStatus(includeAllMembers = false);

if (result) {
    Object.keys(result).forEach(userId => {
        const readStatus = result[userId];
        const readTime = readStatus.ts;
        ...
    })
}