diff --git a/src/libs/EmojiUtils.js b/src/libs/EmojiUtils.js index 1236e3df9ff6..f9abdf8f87b3 100644 --- a/src/libs/EmojiUtils.js +++ b/src/libs/EmojiUtils.js @@ -2,11 +2,19 @@ import _ from 'underscore'; import lodashOrderBy from 'lodash/orderBy'; import moment from 'moment'; import Str from 'expensify-common/lib/str'; +import Onyx from 'react-native-onyx'; +import ONYXKEYS from '../ONYXKEYS'; import CONST from '../CONST'; import * as User from './actions/User'; import emojisTrie from './EmojiTrie'; import FrequentlyUsed from '../../assets/images/history.svg'; +let frequentlyUsedEmojis = []; +Onyx.connect({ + key: ONYXKEYS.FREQUENTLY_USED_EMOJIS, + callback: val => frequentlyUsedEmojis = val, +}); + /** * Get the unicode code of an emoji in base 16. * @param {String} input @@ -139,10 +147,9 @@ function addSpacesToEmojiCategories(emojis) { /** * Get a merged array with frequently used emojis * @param {Object[]} emojis - * @param {Object[]} frequentlyUsedEmojis * @returns {Object[]} */ -function mergeEmojisWithFrequentlyUsedEmojis(emojis, frequentlyUsedEmojis = []) { +function mergeEmojisWithFrequentlyUsedEmojis(emojis) { if (frequentlyUsedEmojis.length === 0) { return addSpacesToEmojiCategories(emojis); } @@ -159,29 +166,28 @@ function mergeEmojisWithFrequentlyUsedEmojis(emojis, frequentlyUsedEmojis = []) /** * Update the frequently used emojis list by usage and sync with API - * @param {Object[]} frequentlyUsedEmojis - * @param {Object} newEmoji + * @param {Object|Object[]} newEmoji */ -function addToFrequentlyUsedEmojis(frequentlyUsedEmojis, newEmoji) { - let frequentEmojiList = frequentlyUsedEmojis; - let currentEmojiCount = 1; +function addToFrequentlyUsedEmojis(newEmoji) { + let frequentEmojiList = [...frequentlyUsedEmojis]; + const currentTimestamp = moment().unix(); - const emojiIndex = _.findIndex(frequentEmojiList, e => e.code === newEmoji.code); - if (emojiIndex >= 0) { - currentEmojiCount = frequentEmojiList[emojiIndex].count + 1; - frequentEmojiList.splice(emojiIndex, 1); - } - const updatedEmoji = {...newEmoji, ...{count: currentEmojiCount, lastUpdatedAt: currentTimestamp}}; - const maxFrequentEmojiCount = (CONST.EMOJI_FREQUENT_ROW_COUNT * CONST.EMOJI_NUM_PER_ROW) - 1; + _.each(newEmoji, (emoji) => { + let currentEmojiCount = 1; + const emojiIndex = _.findIndex(frequentEmojiList, e => e.code === emoji.code); + if (emojiIndex >= 0) { + currentEmojiCount = frequentEmojiList[emojiIndex].count + 1; + frequentEmojiList.splice(emojiIndex, 1); + } + const updatedEmoji = {...emoji, ...{count: currentEmojiCount, lastUpdatedAt: currentTimestamp}}; + frequentEmojiList.push(updatedEmoji); + }); - // We want to make sure the current emoji is added to the list - // Hence, we take one less than the current high frequent used emojis and if same then sorted by lastUpdatedAt - frequentEmojiList = lodashOrderBy(frequentEmojiList, ['count', 'lastUpdatedAt'], ['desc', 'desc']); - frequentEmojiList = frequentEmojiList.slice(0, maxFrequentEmojiCount); - frequentEmojiList.push(updatedEmoji); + const maxFrequentEmojiCount = (CONST.EMOJI_FREQUENT_ROW_COUNT * CONST.EMOJI_NUM_PER_ROW); - // Second sorting is required so that new emoji is properly placed at sort-ordered location + // Sort the list and take the first maxFrequentEmojiCount items frequentEmojiList = lodashOrderBy(frequentEmojiList, ['count', 'lastUpdatedAt'], ['desc', 'desc']); + frequentEmojiList = frequentEmojiList.slice(0, maxFrequentEmojiCount); User.updateFrequentlyUsedEmojis(frequentEmojiList); } @@ -215,10 +221,12 @@ function replaceEmojis(text, isSmallScreenWidth = false, preferredSkinTone = CON if (!emojiData || emojiData.length === 0) { return text; } + const emojis = []; for (let i = 0; i < emojiData.length; i++) { const checkEmoji = emojisTrie.search(emojiData[i].slice(1, -1)); if (checkEmoji && checkEmoji.metaData.code) { let emojiReplacement = getEmojiCodeWithSkinColor(checkEmoji.metaData, preferredSkinTone); + emojis.push({code: emojiReplacement}); // If this is the last emoji in the message and it's the end of the message so far, // add a space after it so the user can keep typing easily. @@ -228,6 +236,9 @@ function replaceEmojis(text, isSmallScreenWidth = false, preferredSkinTone = CON newText = newText.replace(emojiData[i], emojiReplacement); } } + + // Add all replaced emojis to the frequently used emojis list + addToFrequentlyUsedEmojis(emojis); return newText; }