Reactions
Emoji reaction pills displayed below messages. Reactions show an emoji, a count, and visually highlight when the current user has reacted.
Basic Usage
Add a reactions array to any ChatMessageData object. Each reaction includes an emoji, the list of user IDs who reacted, and a count.
Current User Highlight
Reactions where userIds includes currentUser.id are rendered with a highlighted style (accent border and background) so the user can quickly see which reactions they have already added.
Adding Reactions
Use the onReactionAdd and onReactionRemove callbacks on ChatProvider to handle toggling reactions. These fire when the current user clicks a reaction pill or picks an emoji from the reaction picker.
Reaction Shape
Each item in the reactions array has the following shape:
| Prop | Type | Description |
|---|---|---|
emoji | string | The emoji character (e.g. "🔥", "👍") |
userIds | string[] | IDs of users who added this reaction |
count | number | Total number of users who reacted with this emoji |