diff --git a/lib/selectors/chat-selectors.js b/lib/selectors/chat-selectors.js
--- a/lib/selectors/chat-selectors.js
+++ b/lib/selectors/chat-selectors.js
@@ -40,7 +40,11 @@
   maxUnreadSidebars,
   threadTypes,
 } from '../types/thread-types';
-import type { UserInfo, AccountUserInfo } from '../types/user-types';
+import type {
+  UserInfo,
+  AccountUserInfo,
+  RelativeUserInfo,
+} from '../types/user-types';
 import { threeDays } from '../utils/date-utils';
 import memoize2 from '../utils/memoize';
 import {
@@ -289,7 +293,7 @@
 export type ChatMessageItem = { itemType: 'loader' } | ChatMessageInfoItem;
 export type MessageReactionInfo = {
   +viewerReacted: boolean,
-  +users: $ReadOnlySet<string>,
+  +users: $ReadOnlyArray<RelativeUserInfo>,
 };
 
 const msInFiveMinutes = 5 * 60 * 1000;
@@ -313,6 +317,7 @@
       : threadMessageInfos;
 
   const targetMessageReactionsMap = new Map<string, Map<string, Set<string>>>();
+  const reactionsUserInfoMap = new Map<string, RelativeUserInfo>();
 
   // We need to iterate backwards to put the order of messages in chronological
   // order, starting with the oldest. This avoids the scenario where the most
@@ -347,6 +352,10 @@
     } else {
       messageReactionUsersSet.delete(messageInfo.creator.id);
     }
+
+    if (!reactionsUserInfoMap.has(messageInfo.creator.id)) {
+      reactionsUserInfoMap.set(messageInfo.creator.id, messageInfo.creator);
+    }
   }
 
   const chatMessageItems = [];
@@ -417,8 +426,17 @@
           continue;
         }
 
+        const reactionUserInfos = [];
+
+        reactionUsersSet.forEach(userID => {
+          const userInfo = reactionsUserInfoMap.get(userID);
+          if (userInfo) {
+            reactionUserInfos.push(userInfo);
+          }
+        });
+
         const messageReactionInfo = {
-          users: reactionUsersSet,
+          users: reactionUserInfos,
           viewerReacted: reactionUsersSet.has(viewerID),
         };
 
diff --git a/lib/shared/reaction-utils.js b/lib/shared/reaction-utils.js
--- a/lib/shared/reaction-utils.js
+++ b/lib/shared/reaction-utils.js
@@ -22,7 +22,7 @@
     invariant(reactionInfo, 'reactionInfo should be set');
 
     reactionText.push(reaction);
-    const { size: numberOfReacts } = reactionInfo.users;
+    const { length: numberOfReacts } = reactionInfo.users;
     if (numberOfReacts <= 1) {
       continue;
     }
diff --git a/lib/shared/reaction-utils.test.js b/lib/shared/reaction-utils.test.js
--- a/lib/shared/reaction-utils.test.js
+++ b/lib/shared/reaction-utils.test.js
@@ -11,10 +11,13 @@
       'should return (👍 3) for a message with three user likes' +
         ' including the viewer',
       () => {
-        const messageLikesUsers = ['83810', '86622', '83889'];
-        const messageLikesUsersSet = new Set(messageLikesUsers);
+        const messageLikesUsers = [
+          { id: '83810', isViewer: true, username: 'ginsu' },
+          { id: '86622', isViewer: false, username: 'ashoat' },
+          { id: '83889', isViewer: false, username: 'atul' },
+        ];
         const messageLikesInfo = {
-          users: messageLikesUsersSet,
+          users: messageLikesUsers,
           viewerReacted: true,
         };
 
@@ -29,10 +32,13 @@
       'should return (👍 3) for a message with three user likes' +
         ' not including the viewer',
       () => {
-        const messageLikesUsers = ['83810', '86622', '83889'];
-        const messageLikesUsersSet = new Set(messageLikesUsers);
+        const messageLikesUsers = [
+          { id: '83810', isViewer: false, username: 'ginsu' },
+          { id: '86622', isViewer: false, username: 'ashoat' },
+          { id: '83889', isViewer: false, username: 'atul' },
+        ];
         const messageLikesInfo = {
-          users: messageLikesUsersSet,
+          users: messageLikesUsers,
           viewerReacted: false,
         };
 
@@ -47,10 +53,11 @@
       'should return (👍) for a message with one user like' +
         ' including the viewer',
       () => {
-        const messageLikesUsers = ['83810'];
-        const messageLikesUsersSet = new Set(messageLikesUsers);
+        const messageLikesUsers = [
+          { id: '83810', isViewer: false, username: 'ginsu' },
+        ];
         const messageLikesInfo = {
-          users: messageLikesUsersSet,
+          users: messageLikesUsers,
           viewerReacted: true,
         };
 
@@ -65,10 +72,11 @@
       'should return (👍) for a message with one user like' +
         ' not including the viewer',
       () => {
-        const messageLikesUsers = ['86622'];
-        const messageLikesUsersSet = new Set(messageLikesUsers);
+        const messageLikesUsers = [
+          { id: '83810', isViewer: false, username: 'ashoat' },
+        ];
         const messageLikesInfo = {
-          users: messageLikesUsersSet,
+          users: messageLikesUsers,
           viewerReacted: false,
         };
 
@@ -89,17 +97,21 @@
       'should return (👍 😆 3) for a message with one like not including' +
         ' the viewer and three laugh reactions including the viewer',
       () => {
-        const messageLikesUsers = ['86622'];
-        const messageLikesUsersSet = new Set(messageLikesUsers);
+        const messageLikesUsers = [
+          { id: '83810', isViewer: false, username: 'varun' },
+        ];
         const messageLikesInfo = {
-          users: messageLikesUsersSet,
+          users: messageLikesUsers,
           viewerReacted: false,
         };
 
-        const messageLaughsUsers = ['12345', '67890', '83889'];
-        const messageLaughsUsersSet = new Set(messageLaughsUsers);
+        const messageLaughsUsers = [
+          { id: '12345', isViewer: true, username: 'ginsu' },
+          { id: '67890', isViewer: false, username: 'ashoat' },
+          { id: '83889', isViewer: false, username: 'atul' },
+        ];
         const messageLaughsInfo = {
-          users: messageLaughsUsersSet,
+          users: messageLaughsUsers,
           viewerReacted: true,
         };
 
@@ -116,22 +128,21 @@
         ' not including the viewer',
       () => {
         const messageLikesUsers = [
-          '86622',
-          '12345',
-          '67890',
-          '83889',
-          '49203',
-          '12932',
-          '83029',
-          '72902',
-          '49022',
-          '48902',
-          '80922',
-          '12890',
+          { id: '86622', isViewer: false, username: 'ginsu' },
+          { id: '12345', isViewer: false, username: 'ashoat' },
+          { id: '67890', isViewer: false, username: 'atul' },
+          { id: '83889', isViewer: false, username: 'varun' },
+          { id: '49203', isViewer: false, username: 'tomek' },
+          { id: '83029', isViewer: false, username: 'max' },
+          { id: '72902', isViewer: false, username: 'jon' },
+          { id: '49022', isViewer: false, username: 'mark' },
+          { id: '48902', isViewer: false, username: 'kamil' },
+          { id: '80922', isViewer: false, username: 'marcin' },
+          { id: '12890', isViewer: false, username: 'inka' },
+          { id: '67891', isViewer: false, username: 'przemek' },
         ];
-        const messageLikesUsersSet = new Set(messageLikesUsers);
         const messageLikesInfo = {
-          users: messageLikesUsersSet,
+          users: messageLikesUsers,
           viewerReacted: false,
         };