Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

Make emojis larger when multiple are sent at the same time #8896

Merged
merged 13 commits into from
May 16, 2022
Merged

Make emojis larger when multiple are sent at the same time #8896

Show file tree
Hide file tree
Changes from 5 commits
Commits
Show all changes
13 commits
Select commit Hold shift + click to select a range
7b8b7d9
Make emojis larger when multiple are sent at the same time
eVoloshchak May 6, 2022
10fc82e
Update comment
eVoloshchak May 9, 2022
316d030
Memoize getEmojiUnicode function
eVoloshchak May 9, 2022
f89d249
Return early in containsOnlyEmojis function
eVoloshchak May 9, 2022
d3ac462
Update styles name
eVoloshchak May 10, 2022
e9945b3
Rename onlyEmojis style variables
eVoloshchak May 10, 2022
4a78266
Ignore spaces in containsOnlyEmojis function
eVoloshchak May 10, 2022
d736225
Add support for multiple emojis with line breaks between them
eVoloshchak May 10, 2022
5b29f4f
Add comment about spread operator in containsOnlyEmojis
eVoloshchak May 10, 2022
e493a51
Add comment in ReportActionItemFragment
eVoloshchak May 11, 2022
cdef131
Merge branch 'main' into eVoloshchak_largeEmojis
eVoloshchak May 11, 2022
7933540
Fix linter error
eVoloshchak May 11, 2022
9c86b32
Trim message only once
eVoloshchak May 12, 2022
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
2 changes: 2 additions & 0 deletions src/CONST.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -387,6 +387,8 @@ const CONST = {

EMOJI_FREQUENT_ROW_COUNT: 3,

EMOJI_INVISIBLE_CODEPOINT: 'fe0f',

LOGIN_TYPE: {
PHONE: 'phone',
EMAIL: 'email',
Expand Down
30 changes: 28 additions & 2 deletions src/libs/EmojiUtils.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -9,7 +9,7 @@ import * as User from './actions/User';
* @param {String} input
* @returns {String}
*/
function getEmojiUnicode(input) {
const getEmojiUnicode = _.memoize((input) => {
if (input.length === 0) {
return '';
}
Expand Down Expand Up @@ -40,7 +40,7 @@ function getEmojiUnicode(input) {
}
}
return _.map(pairs, val => parseInt(val, 10).toString(16)).join(' ');
}
});

/**
* Function to remove Skin Tone and utf16 surrogates from Emoji
Expand Down Expand Up @@ -70,6 +70,31 @@ function isSingleEmoji(message) {
return matchedUnicode === currentMessageUnicode;
}

/**
* Validates that this message contains only emojis
*
* @param {String} message
* @returns {Boolean}
*/
function containsOnlyEmojis(message) {
const match = message.match(CONST.REGEX.EMOJIS);

if (!match) {
return false;
}

const codes = [];
_.map(match, emoji => _.map(getEmojiUnicode(emoji).split(' '), (code) => {
if (code !== CONST.EMOJI_INVISIBLE_CODEPOINT) {
codes.push(code);
}
return code;
}));

const messageCodes = _.filter(_.map([...message], char => getEmojiUnicode(char)), string => string.length > 0 && string !== CONST.EMOJI_INVISIBLE_CODEPOINT);
return codes.length === messageCodes.length;
}

/**
* Get the header indices based on the max emojis per row
* @param {Object[]} emojis
Expand Down Expand Up @@ -176,4 +201,5 @@ export {
getDynamicHeaderIndices,
mergeEmojisWithFrequentlyUsedEmojis,
addToFrequentlyUsedEmojis,
containsOnlyEmojis,
};
2 changes: 1 addition & 1 deletion src/pages/home/report/ReportActionItemFragment.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -106,7 +106,7 @@ const ReportActionItemFragment = (props) => {
) : (
<Text
selectable={!canUseTouchScreen() || !props.isSmallScreenWidth}
style={EmojiUtils.isSingleEmoji(props.fragment.text) ? styles.singleEmojiText : undefined}
style={EmojiUtils.containsOnlyEmojis(props.fragment.text) ? styles.onlyEmojisText : undefined}
>
{Str.htmlDecode(props.fragment.text)}
{props.fragment.isEdited && (
Expand Down
2 changes: 1 addition & 1 deletion src/styles/styles.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -1042,7 +1042,7 @@ const styles = {
textDecorationLine: 'none',
},

singleEmojiText: {
onlyEmojisText: {
fontSize: variables.fontSizeSingleEmoji,
lineHeight: variables.fontSizeSingleEmojiHeight,
Copy link
Collaborator

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

NAB! these variables could be renamed too.

},
Expand Down