Merge pull request #3251 from thelounge/xpaw/emojis-v12

Use github's emoji data (support unicode 12)

client/js/libs/handlebars/parse.js

@@ -9,6 +9,7 @@ const merge = require("./ircmessageparser/merge");
 const colorClass = require("./colorClass");
 const emojiMap = require("../fullnamemap.json");
 const LinkPreviewToggle = require("../../../components/LinkPreviewToggle.vue").default;
+const emojiModifiersRegex = /[\u{1f3fb}-\u{1f3ff}]/ug;
 
 // Create an HTML `span` with styling information for a given fragment
 function createFragment(fragment, createElement) {
@@ -124,7 +125,8 @@ module.exports = function parse(createElement, text, message = undefined, networ
 				},
 			}, fragments);
 		} else if (textPart.emoji) {
-			const title = emojiMap[textPart.emoji] ? `Emoji: ${emojiMap[textPart.emoji]}` : null;
+			const emojiWithoutModifiers = textPart.emoji.replace(emojiModifiersRegex, "");
+			const title = emojiMap[emojiWithoutModifiers] ? `Emoji: ${emojiMap[emojiWithoutModifiers]}` : null;
 
 			return createElement("span", {
 				class: [

scripts/generate-emoji.js

@@ -3,36 +3,18 @@
 const got = require("got");
 const path = require("path");
 const fs = require("fs");
-const fuzzy = require("fuzzy");
 
 (async () => {
-	const response = await got("https://raw.githubusercontent.com/emojione/emojione/master/extras/alpha-codes/eac.json");
+	const response = await got("https://raw.githubusercontent.com/github/gemoji/master/db/emoji.json");
 	const emojiStrategy = JSON.parse(response.body);
 	const emojiMap = {};
 	const fullNameEmojiMap = {};
 
-	for (const key in emojiStrategy) {
-		if (emojiStrategy.hasOwnProperty(key)) {
-			const shortname = prepareShortName(emojiStrategy[key].alpha_code);
-			const unicode = stringToUnicode(emojiStrategy[key].output);
-			fullNameEmojiMap[unicode] = emojiStrategy[key].name;
+	for (const emoji of emojiStrategy) {
+		fullNameEmojiMap[emoji.emoji] = emoji.description;
 
-			// Skip tones, at least for now
-			if (shortname.includes("tone")) {
-				continue;
-			}
-
-			emojiMap[shortname] = unicode;
-
-			for (let alternative of emojiStrategy[key].aliases.split("|")) {
-				alternative = prepareShortName(alternative);
-
-				if (fuzzy.test(shortname, alternative) || fuzzy.test(alternative, shortname)) {
-					continue;
-				}
-
-				emojiMap[alternative] = unicode;
-			}
+		for (const alias of emoji.aliases) {
+			emojiMap[alias] = emoji.emoji;
 		}
 	}
 
@@ -57,24 +39,3 @@ const fuzzy = require("fuzzy");
 		"fullnamemap.json"
 	)), fullNameEmojiMapOutput);
 })();
-
-function stringToUnicode(key) {
-	return key
-		.split("-")
-		.map((c) => String.fromCodePoint(`0x${c}`))
-		.join("");
-}
-
-function prepareShortName(shortname) {
-	if (shortname === ":-1:") {
-		// We replace dashes, but should keep :-1: working
-		return "-1";
-	} else if (shortname === ":e-mail:") {
-		// :email: exists as an alternative, should figure out how to use it instead
-		return "email";
-	}
-
-	return shortname
-		.slice(1, -1)
-		.replace("-", "_");
-}

test/client/js/libs/handlebars/parse.js

@@ -380,7 +380,15 @@ describe("parse Handlebars helper", () => {
 	}, {
 		name: "complicated zero-join-width emoji",
 		input: "🤦🏿‍♀️",
-		expected: '<span role="img" aria-label="Emoji: woman facepalming: dark skin tone" title="Emoji: woman facepalming: dark skin tone" class="emoji">🤦🏿‍♀️</span>',
+		expected: '<span role="img" aria-label="Emoji: woman facepalming" title="Emoji: woman facepalming" class="emoji">🤦🏿‍♀️</span>',
+	}, {
+		name: "unicode 12 emojis",
+		input: "🧘🏿👨‍👨‍👧‍👧",
+		expected: '<span role="img" aria-label="Emoji: person in lotus position" title="Emoji: person in lotus position" class="emoji">🧘🏿</span><span role="img" aria-label="Emoji: family: man, man, girl, girl" title="Emoji: family: man, man, girl, girl" class="emoji">👨‍👨‍👧‍👧</span>',
+	}, {
+		name: "unicode 12 emojis with multiple modifiers",
+		input: "👩🏾‍🤝‍👨🏽",
+		expected: '<span role="img" class="emoji">👩🏾‍🤝‍👨🏽</span>',
 	}, {
 		name: "with modifiers",
 		input: "🤷‍♀️",