regression: Legacy emoji in composer popup

apps/meteor/app/emoji/client/helpers.ts

@@ -172,7 +172,12 @@ export const getEmojisBySearchTerm = (
 			continue;
 		}
 
-		const { emojiPackage, shortnames = [], name } = emojiObject;
+		const { emojiPackage, shortnames = [], name, legacy } = emojiObject;
+
+		if (legacy) {
+			continue;
+		}
+
 		let tone = '';
 		current = current.replace(/:/g, '');
 

apps/meteor/app/emoji/lib/rocketchat.ts

@@ -34,6 +34,7 @@ export type EmojiPackages = {
 					extension?: string;
 					etag?: string;
 					unicode?: string;
+					legacy?: boolean;
 			  }
 			| {
 					name?: undefined;
@@ -43,6 +44,7 @@ export type EmojiPackages = {
 					aliases?: undefined;
 					shortnames?: undefined;
 					etag?: string;
+					legacy?: boolean;
 			  };
 	};
 };

apps/meteor/client/views/room/providers/ComposerPopupProvider.tsx

@@ -249,7 +249,9 @@ const ComposerPopupProvider = ({ children, room }: ComposerPopupProviderProps) =
 							})
 							.filter(
 								({ _id }) =>
-									filterRegex.test(_id) && (exactFinalTone.test(_id.substring(key.length)) || seeColor.test(key) || !colorBlind.test(_id)),
+									!collection[_id]?.legacy &&
+									filterRegex.test(_id) &&
+									(exactFinalTone.test(_id.substring(key.length)) || seeColor.test(key) || !colorBlind.test(_id)),
 							)
 							.sort(emojiSort(recents))
 							.slice(0, 10);
@@ -307,7 +309,9 @@ const ComposerPopupProvider = ({ children, room }: ComposerPopupProviderProps) =
 						})
 						.filter(
 							({ _id }) =>
-								filterRegex.test(_id) && (exactFinalTone.test(_id.substring(key.length)) || seeColor.test(key) || !colorBlind.test(_id)),
+								!collection[_id]?.legacy &&
+								filterRegex.test(_id) &&
+								(exactFinalTone.test(_id.substring(key.length)) || seeColor.test(key) || !colorBlind.test(_id)),
 						)
 						.sort(emojiSort(recents))
 						.slice(0, 10);

apps/meteor/client/views/root/hooks/useNativeEmoji.ts

@@ -45,6 +45,7 @@ export const useNativeEmoji = () => {
 				category: '',
 				emojiPackage: 'native',
 				unicode,
+				legacy: true,
 			};
 		}
 

apps/meteor/tests/unit/app/emoji/helpers.spec.ts

@@ -4,6 +4,7 @@ import { describe, it, beforeEach, before } from 'mocha';
 import { getEmojisBySearchTerm, updateRecent, removeFromRecent, replaceEmojiInRecent } from '../../../../app/emoji/client/helpers';
 import { emoji } from '../../../../app/emoji/client/lib';
 import { getEmojiConfig } from '../../../../app/emoji-native/lib/getEmojiConfig';
+import { legacyEmojioneMap } from '../../../../app/emoji-native/lib/legacyEmojioneMap';
 
 const registerNativeEmojis = () => {
 	const config = getEmojiConfig(emoji);
@@ -27,6 +28,27 @@ const registerNativeEmojis = () => {
 			});
 		}
 	}
+
+	//Add legacy emojis to mimic how client currently works.
+	for (const [shortcode, unicode] of Object.entries(legacyEmojioneMap)) {
+		const key = `:${shortcode}:`;
+
+		if (emoji.list[key]) {
+			continue; // already registered by emojibase
+		}
+
+		emoji.list[key] = {
+			uc_base: '',
+			uc_output: '',
+			uc_match: '',
+			uc_greedy: '',
+			shortnames: [],
+			category: '',
+			legacy: true,
+			emojiPackage: 'native',
+			unicode,
+		};
+	}
 };
 
 describe('Emoji Client Helpers', () => {
@@ -66,6 +88,23 @@ describe('Emoji Client Helpers', () => {
 			expect(names('+1').some((name) => /_tone[1-5]/.test(name))).to.be.false;
 		});
 
+		it('excludes legacy-only names from the results', () => {
+			expect(names('dog2')).to.be.empty;
+		});
+
+		it('excludes legacy-only names from partial matches', () => {
+			expect(names('dog')).to.not.include('dog2');
+		});
+
+		it('keeps the emojibase name for the same emoji searchable', () => {
+			expect(names('dog')).to.include('dog');
+			expect(names('dog')).to.include('dog_face');
+		});
+
+		it('still renders a legacy shortcode entered manually', () => {
+			expect(emoji.packages.native.render(':dog2:')).to.include(legacyEmojioneMap.dog2);
+		});
+
 		it('applies the selected skin tone when searching by an alias', () => {
 			const result = getEmojisBySearchTerm('thumbsup', 2, [], () => undefined).find(({ image }) => image?.includes('👍'));