diff --git a/src/pages/home/report/EmojiPickerMenu/index.js b/src/pages/home/report/EmojiPickerMenu/index.js index 9ac5b2b2a253..51d0307a21f6 100755 --- a/src/pages/home/report/EmojiPickerMenu/index.js +++ b/src/pages/home/report/EmojiPickerMenu/index.js @@ -298,7 +298,9 @@ class EmojiPickerMenu extends Component { /** * Given an emoji item object, render a component based on its type. * Items with the code "SPACER" return nothing and are used to fill rows up to 8 - * so that the sticky headers function properly + * so that the sticky headers function properly. + * We add '\uFE0F' to our unicode to force the correct emoji presentation (VS16) + * on emojis that also have a text style presentation (VS15). * * @param {Object} item * @param {Number} index @@ -313,7 +315,7 @@ class EmojiPickerMenu extends Component { if (header) { return ( - {code} + {`${code}\uFE0F`} ); } @@ -322,7 +324,7 @@ class EmojiPickerMenu extends Component { this.setState({highlightedIndex: index})} - emoji={code} + emoji={`${code}\uFE0F`} isHighlighted={index === this.state.highlightedIndex} emojiSize={this.emojiSize} /> diff --git a/src/pages/home/report/EmojiPickerMenu/index.native.js b/src/pages/home/report/EmojiPickerMenu/index.native.js index b1a4d1302506..6708330dffca 100644 --- a/src/pages/home/report/EmojiPickerMenu/index.native.js +++ b/src/pages/home/report/EmojiPickerMenu/index.native.js @@ -58,7 +58,7 @@ class EmojiPickerMenu extends Component { if (item.header) { return ( - {item.code} + {`${item.code}\uFE0F`} ); } @@ -66,7 +66,7 @@ class EmojiPickerMenu extends Component { return ( );