[FIX] Recent emojis not updated when adding via text

packages/rocketchat-ui-message/client/popup/messagePopupConfig.js

@@ -88,6 +88,42 @@ const getUsersFromServerDelayed = _.throttle(getUsersFromServer, 500);
 
 const getRoomsFromServerDelayed = _.throttle(getRoomsFromServer, 500);
 
+const addEmojiToRecents = (emoji) => {
+	const pickerEl = $('.emoji-picker')[0];
+	if (pickerEl) {
+		const view = Blaze.getView(pickerEl);
+		if (view) {
+			Template._withTemplateInstanceFunc(view.templateInstance, () => {
+				RocketChat.EmojiPicker.addRecent(emoji.replace(/:/g, ''));
+			});
+		}
+	}
+};
+
+const emojiSort = (recents) => {
+	return (a, b) => {
+		let idA = a._id;
+		let idB = a._id;
+
+		if (recents.includes(a._id)) {
+			idA = recents.indexOf(a._id) + idA;
+		}
+		if (recents.includes(b._id)) {
+			idB = recents.indexOf(b._id) + idB;
+		}
+
+		if (idA < idB) {
+			return -1;
+		}
+
+		if (idA > idB) {
+			return 1;
+		}
+
+		return 0;
+	};
+};
+
 Template.messagePopupConfig.helpers({
 	popupUserConfig() {
 		const self = this;
@@ -273,11 +309,12 @@ Template.messagePopupConfig.helpers({
 				getFilter(collection, filter) {
 					const key = `:${ filter }`;
 
-					if (!RocketChat.emoji.packages.emojione || RocketChat.emoji.packages.emojione.asciiList[key] || filter.length < 2) {
+					if (!RocketChat.emoji.packages.emojione || RocketChat.emoji.packages.emojione.asciiList[key]) {
 						return [];
 					}
 
 					const regExp = new RegExp(`^${ RegExp.escape(key) }`, 'i');
+					const recents = RocketChat.EmojiPicker.getRecent().map(item => `:${ item }:`);
 					return Object.keys(collection).map(key => {
 						const value = collection[key];
 						return {
@@ -286,16 +323,12 @@ Template.messagePopupConfig.helpers({
 						};
 					})
 						.filter(obj => regExp.test(obj._id))
-						.slice(0, 10)
-						.sort(function(a, b) {
-							if (a._id < b._id) {
-								return -1;
-							}
-							if (a._id > b._id) {
-								return 1;
-							}
-							return 0;
-						});
+						.sort(emojiSort(recents))
+						.slice(0, 10);
+				},
+				getValue(_id) {
+					addEmojiToRecents(_id);
+					return _id;
 				}
 			};
 		}
@@ -314,11 +347,12 @@ Template.messagePopupConfig.helpers({
 				getFilter(collection, filter) {
 					const key = `${ filter }`;
 
-					if (!RocketChat.emoji.packages.emojione || RocketChat.emoji.packages.emojione.asciiList[key] || filter.length < 2) {
+					if (!RocketChat.emoji.packages.emojione || RocketChat.emoji.packages.emojione.asciiList[key]) {
 						return [];
 					}
 
 					const regExp = new RegExp(`^${ RegExp.escape(key) }`, 'i');
+					const recents = RocketChat.EmojiPicker.getRecent().map(item => `:${ item }:`);
 					return Object.keys(collection).map(key => {
 						const value = collection[key];
 						return {
@@ -327,16 +361,12 @@ Template.messagePopupConfig.helpers({
 						};
 					})
 						.filter(obj => regExp.test(obj._id))
-						.slice(0, 10)
-						.sort(function(a, b) {
-							if (a._id < b._id) {
-								return -1;
-							}
-							if (a._id > b._id) {
-								return 1;
-							}
-							return 0;
-						});
+						.sort(emojiSort(recents))
+						.slice(0, 10);
+				},
+				getValue(_id) {
+					addEmojiToRecents(_id);
+					return _id;
 				}
 			};
 		}