OverlayReactionList

OverlayReactionList component is used to display reaction selector within message overlay.

This is the default component provided to the prop OverlayReactionList on the OverlayProvider component.

Props

data

This is an object with following keys:

• alignment

Sets if the message should be aligned to right or left side of list.

• clientId

Id of the current user connected to the chat.

• files

Array of file type attachments to be shown in the grouped UI component.

const files = message.attachments.filter((a) => a.type === "file");

• groupStyles

Position of message in the group. A message group is a group of consecutive messages from the same user. groupStyles can be used to style the message as per their position in message group.

For example, user avatar (to which message belongs to) is only showed for last (bottom) message in group.

• handleReaction

Function called when a reaction is selected in the message overlay, this is called on both the add and remove action. This function does not override the default behavior of the reaction being selected. Please refer to the guide on customizing message actions for details.

• images

Array of image type attachments on message.

const images = message.attachments.filter((a) => a.type === "image");

• message

Message object.

• messageActions

An array of, or function that returns and array of, actions that can be performed on a message shown in the message overlay. Please refer to the guide on customizing message actions for details.

• messageReactionTitle

Title for MessageReactions component.

• messagesContext

Entire value object of MessagesContext

• onlyEmojis

True if the message text only contains emojis and nothing else.

• otherAttachments

All the attachments on the message except for types file and image.

• OverlayReactionList

Reaction selector component displayed within the message overlay when user long presses a message.

• supportedReactions

List of reactions which can be added on message. Please refer to the guide on customizing reactions for details.

• threadList

True if current message is part of a message thread.

setOverlay

Setter for overlay. You can use this setter to show the overlay.

supportedReactions

List of reactions which can be added on message. Please refer to the guide on customizing reactions for details.