Add some spacing for +10 reactions

stylesheets/_modules.scss

@@ -1315,6 +1315,7 @@
 
   &--with-count {
     min-width: 40px;
+    padding: 0 6px;
   }
 
   &__count {

ts/components/conversation/Message.stories.tsx

@@ -30,6 +30,19 @@ import { getDefaultConversation } from '../../test-both/helpers/getDefaultConver
 
 const i18n = setupI18n('en', enMessages);
 
+function getJoyReaction() {
+  return {
+    emoji: '😂',
+    from: getDefaultConversation({
+      id: '+14155552674',
+      phoneNumber: '+14155552674',
+      name: 'Amelia Briggs',
+      title: 'Amelia',
+    }),
+    timestamp: Date.now() - 10,
+  };
+}
+
 const story = storiesOf('Components/Conversation/Message', module);
 
 const renderEmojiPicker: Props['renderEmojiPicker'] = ({
@@ -306,16 +319,6 @@ story.add('Reactions (wider message)', () => {
         }),
         timestamp: Date.now() - 10,
       },
-      {
-        emoji: '😂',
-        from: getDefaultConversation({
-          id: '+14155552676',
-          phoneNumber: '+14155552676',
-          name: 'Amelia Briggs',
-          title: 'Amelia',
-        }),
-        timestamp: Date.now() - 10,
-      },
       {
         emoji: '😡',
         from: getDefaultConversation({
@@ -352,11 +355,14 @@ story.add('Reactions (wider message)', () => {
   return renderBothDirections(props);
 });
 
+const joyReactions = Array.from({ length: 52 }, () => getJoyReaction());
+
 story.add('Reactions (short message)', () => {
   const props = createProps({
     text: 'h',
     timestamp: Date.now(),
     reactions: [
+      ...joyReactions,
       {
         emoji: '👍',
         from: getDefaultConversation({
@@ -388,26 +394,6 @@ story.add('Reactions (short message)', () => {
         }),
         timestamp: Date.now(),
       },
-      {
-        emoji: '😂',
-        from: getDefaultConversation({
-          id: '+14155552674',
-          phoneNumber: '+14155552674',
-          name: 'Amelia Briggs',
-          title: 'Amelia',
-        }),
-        timestamp: Date.now(),
-      },
-      {
-        emoji: '😂',
-        from: getDefaultConversation({
-          id: '+14155552676',
-          phoneNumber: '+14155552676',
-          name: 'Amelia Briggs',
-          title: 'Amelia',
-        }),
-        timestamp: Date.now(),
-      },
       {
         emoji: '😡',
         from: getDefaultConversation({