Emoji reactions give users a lightweight way to express themselves in chat. This update make them even more powerful by letting you see exactly who reacted to any message.
Real-time reaction data with the JavaScript Data API
You can now subscribe to live updates of adding and removing emoji reactions using the JavaScript Data API (@talkjs/core) 1.9.0.
With the new ReactionsRef.subscribe() method, you can now watch the list of users who've added a specific reaction to a message. This opens up new possibilities for building engaging chat experiences: display reaction details in a popover, highlight the most active reactors, or build custom emoji analytics.
How to use it:
const msgRef = await session.conversation("meetup").send("hi");
const reactionsRef = msg.reactions(":grinning:");
const sub = reactionsRef.subscribe(reactions => console.log(reactions.map(r => r.user.name)))
await sub.connected;
await reactionRef.add();Every time someone adds or removes a reaction, your callback receives the updated list of users. The loadedAll parameter tells you whether you're viewing all reactions or just the first batch.
This way you get updated in real-time as reactions change.
Fetch reaction data on-demand
If you only need a quick snapshot without subscribing to updates, use ReactionsRef.getFirstReactions() to fetch the first 10 users who reacted with a specific emoji:
const users = await reactionsRef.getFirstReactions();This is perfect for displaying a quick preview without having to set up real-time subscriptions. For full lists and live updates, subscribe instead.
Built-in emoji reaction viewer
Don't want to build a custom reactions UI? Components 0.1.9 introduces a new useReactions() hook so you can easily display who reacted to a message.
Just hover over a reaction count, and a tooltip appears showing the first 10 users who added that emoji reaction. It's designed to let you display reaction information just-in-time, such as in a tooltip or popover.
Users get instant visibility into who engaged with their message.
Get started
Update to the JavaScript Data API (@talkjs/core) 1.9.0 and Components 0.1.9 to enable real-time reactions and built-in tooltips.
Explore the full Emoji Reactions documentation to learn more about subscribing to reactions, fetching reaction data, and managing reactions programmatically.
