Room reactions

Open in

Users can send reactions to the entire chat room to show their sentiment as to what is happening. For example, agreeing with the content in a livestream using a thumbs up, or sending a heart when their team scores in a sports game.

Room reactions are ephemeral and not stored or aggregated by Ably. The intention being that they show the overall sentiment of a room at a point in time.

Subscribe to room reactions by registering a listener. Use the reactions.subscribe() method in a room to receive reactions:

JavaScript

const {unsubscribe} = room.reactions.subscribe((event) => {
  const reaction = event.reaction;
  console.log(`Received a reaction from ${reaction.clientId} with name ${reaction.name}, and metadata ${reaction.metadata}`);
});

Room reaction event structure

The following are the properties of a room reaction event:

Property	Description	Type
`type`	The type of reaction event.	`String`
`reaction`	The reaction data.	`Object`
`reaction.name`	The name of the reaction, for example a 'like' or a heart emoji.	`String`
`reaction.headers`	Optional headers for adding additional information to a reaction.	`Object`
`reaction.metadata`	Optional metadata about the reaction, such as an animation or effect. This information is not read by Ably.	`Object`
`reaction.createdAt`	The time the reaction was sent.	`Date`
`reaction.clientId`	The client identifier of the user that sent the reaction.	`String`
`reaction.isSelf`	Will be `true` for the user that sent the reaction.	`Boolean`

Unsubscribe from room reactions

Use the unsubscribe() function returned in the subscribe() response to remove a room reaction listener:

JavaScript

// Initial subscription
const {unsubscribe} = room.reactions.subscribe((event) => {
  console.log(`Received a reaction of type ${event.reaction.name}, and metadata ${event.reaction.metadata}`);
});

// To remove the listener
unsubscribe();

Send a room reaction

Use the reactions.send() method to send a room-level reaction. The most common way of using this method is to trigger it whenever a user clicks an emoji button in a room:

JavaScript

await room.reactions.send({name: "like"});

await room.reactions.send({name: "heart", metadata: {"effect": "fireworks"}});