diff --git a/lib/shared/reaction-utils.js b/lib/shared/reaction-utils.js index 2f6931eaa..72d8324d7 100644 --- a/lib/shared/reaction-utils.js +++ b/lib/shared/reaction-utils.js @@ -1,25 +1,27 @@ // @flow import invariant from 'invariant'; import type { MessageReactionInfo } from '../selectors/chat-selectors'; function stringForReactionList( reactions: $ReadOnlyMap, ): string { const reactionText = []; for (const reaction of reactions.keys()) { const reactionInfo = reactions.get(reaction); invariant(reactionInfo, 'reactionInfo should be set'); reactionText.push(reaction); - if (reactionInfo.users.size > 1) { - reactionText.push(reactionInfo.users.size); + const { size: numberOfReacts } = reactionInfo.users; + if (numberOfReacts <= 1) { + continue; } + reactionText.push(numberOfReacts > 9 ? '9+' : numberOfReacts.toString()); } return reactionText.join(' '); } export { stringForReactionList }; diff --git a/lib/shared/reaction-utils.test.js b/lib/shared/reaction-utils.test.js index 4b3826544..16552651f 100644 --- a/lib/shared/reaction-utils.test.js +++ b/lib/shared/reaction-utils.test.js @@ -1,114 +1,145 @@ // @flow import type { MessageReactionInfo } from '../selectors/chat-selectors'; import { stringForReactionList } from './reaction-utils'; describe( 'stringForReactionList(' + 'reactions: $ReadOnlyMap)', () => { it( 'should return (👍 3) for a message with three user likes' + ' including the viewer', () => { const messageLikesUsers = ['83810', '86622', '83889']; const messageLikesUsersSet = new Set(messageLikesUsers); const messageLikesInfo = { users: messageLikesUsersSet, viewerReacted: true, }; const reactionsMap = new Map(); reactionsMap.set('👍', messageLikesInfo); expect(stringForReactionList(reactionsMap)).toBe('👍 3'); }, ); it( '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 messageLikesInfo = { users: messageLikesUsersSet, viewerReacted: false, }; const reactionsMap = new Map(); reactionsMap.set('👍', messageLikesInfo); expect(stringForReactionList(reactionsMap)).toBe('👍 3'); }, ); it( 'should return (👍) for a message with one user like' + ' including the viewer', () => { const messageLikesUsers = ['83810']; const messageLikesUsersSet = new Set(messageLikesUsers); const messageLikesInfo = { users: messageLikesUsersSet, viewerReacted: true, }; const reactionsMap = new Map(); reactionsMap.set('👍', messageLikesInfo); expect(stringForReactionList(reactionsMap)).toBe('👍'); }, ); it( 'should return (👍) for a message with one user like' + ' not including the viewer', () => { const messageLikesUsers = ['86622']; const messageLikesUsersSet = new Set(messageLikesUsers); const messageLikesInfo = { users: messageLikesUsersSet, viewerReacted: false, }; const reactionsMap = new Map(); reactionsMap.set('👍', messageLikesInfo); expect(stringForReactionList(reactionsMap)).toBe('👍'); }, ); it('should return an empty string for a message no reactions', () => { const reactionsMap = new Map(); expect(stringForReactionList(reactionsMap)).toBe(''); }); it( '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 messageLikesInfo = { users: messageLikesUsersSet, viewerReacted: false, }; const messageLaughsUsers = ['12345', '67890', '83889']; const messageLaughsUsersSet = new Set(messageLaughsUsers); const messageLaughsInfo = { users: messageLaughsUsersSet, viewerReacted: true, }; const reactionsMap = new Map(); reactionsMap.set('👍', messageLikesInfo); reactionsMap.set('😆', messageLaughsInfo); expect(stringForReactionList(reactionsMap)).toBe('👍 😆 3'); }, ); + + it( + 'should return (👍 9+) for a message with 12 user likes' + + ' not including the viewer', + () => { + const messageLikesUsers = [ + '86622', + '12345', + '67890', + '83889', + '49203', + '12932', + '83029', + '72902', + '49022', + '48902', + '80922', + '12890', + ]; + const messageLikesUsersSet = new Set(messageLikesUsers); + const messageLikesInfo = { + users: messageLikesUsersSet, + viewerReacted: false, + }; + + const reactionsMap = new Map(); + reactionsMap.set('👍', messageLikesInfo); + + expect(stringForReactionList(reactionsMap)).toBe('👍 9+'); + }, + ); }, );