Add some spacing for +10 reactions

This commit is contained in:
Josh Perez 2021-10-05 14:27:55 -04:00 committed by Fedor Indutnyy
parent 6fb38b940a
commit f974490ff0
2 changed files with 17 additions and 30 deletions

View File

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

View File

@ -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({