DEV: discourse-emojis gem (#31408)

This commit moves most of emoji logic into the discourse-emojis gem:
https://github.com/discourse/discourse-emojis/

Most notably:
- images are now symlinked from the gem
- the gem provides path to the json files

Search aliases have also been made asynchronous and memoized. When you
will search for an emoji we will now load the aliases and store the list
for future use.

---------

Co-authored-by: David Taylor <david@taylorhq.com>

.gitignore

@@ -23,6 +23,7 @@
 /public/plugins
 /public/tombstone
 /public/uploads
+/public/images/emoji
 
 # Ignore the default SQLite database and db dumps
 *.sql

Gemfile

@@ -52,6 +52,7 @@ gem "active_model_serializers", "~> 0.8.3"
 gem "http_accept_language", require: false
 
 gem "discourse-fonts", require: "discourse_fonts"
+gem "discourse-emojis", require: "discourse_emojis"
 
 gem "message_bus"
 

Gemfile.lock

@@ -126,6 +126,7 @@ GEM
     diffy (3.4.3)
     digest (3.2.0)
     digest-xxhash (0.2.9)
+    discourse-emojis (1.0.25)
     discourse-fonts (0.0.18)
     discourse-seed-fu (2.3.12)
       activerecord (>= 3.1)
@@ -669,6 +670,7 @@ DEPENDENCIES
   diffy
   digest
   digest-xxhash
+  discourse-emojis
   discourse-fonts
   discourse-seed-fu
   discourse_dev_assets

app/assets/javascripts/discourse/app/components/d-editor.js

@@ -22,6 +22,7 @@ import { getRegister } from "discourse/lib/get-owner";
 import { hashtagAutocompleteOptions } from "discourse/lib/hashtag-autocomplete";
 import { wantsNewWindow } from "discourse/lib/intercept-click";
 import { PLATFORM_KEY_MODIFIER } from "discourse/lib/keyboard-shortcuts";
+import loadEmojiSearchAliases from "discourse/lib/load-emoji-search-aliases";
 import loadRichEditor from "discourse/lib/load-rich-editor";
 import { findRawTemplate } from "discourse/lib/raw-templates";
 import { emojiUrlFor, generateCookFunction } from "discourse/lib/text";
@@ -383,13 +384,16 @@ export default class DEditor extends Component {
             }
           }
 
-          const options = emojiSearch(term, {
-            maxResults: 5,
-            diversity: this.emojiStore.diversity,
-            exclude: emojiDenied,
-          });
+          loadEmojiSearchAliases().then((searchAliases) => {
+            const options = emojiSearch(term, {
+              maxResults: 5,
+              diversity: this.emojiStore.diversity,
+              exclude: emojiDenied,
+              searchAliases,
+            });
 
-          return resolve(options);
+            resolve(options);
+          });
         })
           .then((list) => {
             if (list === SKIP) {

app/assets/javascripts/discourse/app/components/emoji-picker/content.gjs

@@ -26,6 +26,7 @@ import discourseDebounce from "discourse/lib/debounce";
 import { bind } from "discourse/lib/decorators";
 import { INPUT_DELAY } from "discourse/lib/environment";
 import { makeArray } from "discourse/lib/helpers";
+import loadEmojiSearchAliases from "discourse/lib/load-emoji-search-aliases";
 import { emojiUrlFor } from "discourse/lib/text";
 import { i18n } from "discourse-i18n";
 import DiversityMenu from "./diversity-menu";
@@ -119,16 +120,6 @@ export default class EmojiPicker extends Component {
     };
   }
 
-  get flatEmojis() {
-    if (!this.emojiStore.list) {
-      return [];
-    }
-
-    // eslint-disable-next-line no-unused-vars
-    let { favorites, ...rest } = this.emojiStore.list;
-    return Object.values(rest).flat();
-  }
-
   @action
   registerFilterInput(element) {
     this.filterInput = element;
@@ -180,19 +171,26 @@ export default class EmojiPicker extends Component {
   debouncedDidInputFilter(filter = "") {
     filter = filter.toLowerCase();
 
-    const results = emojiSearch(filter, {
-      exclude: this.site.denied_emojis,
-    }).slice(0, 50);
+    loadEmojiSearchAliases().then((searchAliases) => {
+      const results = emojiSearch(filter, {
+        exclude: this.site.denied_emojis,
+        searchAliases,
+      }).slice(0, 50);
 
-    this.filteredEmojis =
-      this.flatEmojis.filter((emoji) => results.includes(emoji.name)) ?? [];
+      this.filteredEmojis = results.map((emoji) => {
+        return {
+          name: emoji,
+          url: emojiUrlFor(emoji),
+        };
+      });
 
-    this.isFiltering = false;
+      this.isFiltering = false;
 
-    schedule("afterRender", () => {
-      if (this.scrollableNode) {
-        this.scrollableNode.scrollTop = 0;
-      }
+      schedule("afterRender", () => {
+        if (this.scrollableNode) {
+          this.scrollableNode.scrollTop = 0;
+        }
+      });
     });
   }
 

app/assets/javascripts/discourse/app/components/emoji-picker/diversity-menu.gjs

@@ -9,12 +9,12 @@ import replaceEmoji from "discourse/helpers/replace-emoji";
 import DMenu from "float-kit/components/d-menu";
 
 export const FITZPATRICK_MODIFIERS = [
-  { scale: 1, modifier: null },
-  { scale: 2, modifier: ":t2" },
-  { scale: 3, modifier: ":t3" },
-  { scale: 4, modifier: ":t4" },
-  { scale: 5, modifier: ":t5" },
-  { scale: 6, modifier: ":t6" },
+  { scale: null, modifier: "" },
+  { scale: 2, modifier: ":t1" },
+  { scale: 3, modifier: ":t2" },
+  { scale: 4, modifier: ":t3" },
+  { scale: 5, modifier: ":t4" },
+  { scale: 6, modifier: ":t5" },
 ];
 
 export default class EmojiPicker extends Component {
@@ -56,10 +56,10 @@ export default class EmojiPicker extends Component {
                 @action={{fn this.didRequestFitzpatrickScale fitzpatrick.scale}}
                 data-level={{fitzpatrick.scale}}
               >
-                {{#if (eq fitzpatrick.scale 1)}}
-                  {{replaceEmoji ":clap:"}}
-                {{else}}
+                {{#if fitzpatrick.scale}}
                   {{replaceEmoji (concat ":clap:t" fitzpatrick.scale ":")}}
+                {{else}}
+                  {{replaceEmoji ":clap:"}}
                 {{/if}}
               </DButton>
             </dropdown.item>

app/assets/javascripts/discourse/app/lib/load-emoji-search-aliases.js

@@ -0,0 +1,8 @@
+import { ajax } from "discourse/lib/ajax";
+
+let searchAliasesPromise;
+
+export default async function loadEmojiSearchAliases() {
+  searchAliasesPromise ??= ajax("/emojis/search-aliases");
+  return await searchAliasesPromise;
+}

app/assets/javascripts/discourse/tests/acceptance/emoji-test.js

@@ -11,11 +11,17 @@ import {
 acceptance("Emoji", function (needs) {
   needs.user();
 
+  needs.pretender((server, helper) => {
+    server.get("/emojis/search-aliases", () => {
+      return helper.response([]);
+    });
+  });
+
   test("emoji is cooked properly", async function (assert) {
     await visit("/t/internationalization-localization/280");
     await click("#topic-footer-buttons .btn.create");
 
-    await simulateKeys(".d-editor-input", "a :blonde_wo\t");
+    await simulateKeys(".d-editor-input", "a :blonde_woman\t");
 
     assert
       .dom(".d-editor-preview")
@@ -28,15 +34,16 @@ acceptance("Emoji", function (needs) {
     await visit("/t/internationalization-localization/280");
     await click("#topic-footer-buttons .btn.create");
 
-    await simulateKeys(".d-editor-input", "a :man_");
-    // the 6th item in the list is the "more..."
+    await simulateKeys(".d-editor-input", "a :man_b");
+
+    // the 5th item in the list is the "more..."
     await click(".autocomplete.ac-emoji ul li:nth-of-type(6)");
-    await emojiPicker().select("man_rowing_boat");
+    await emojiPicker().select("man_biking");
 
     assert
       .dom(".d-editor-preview")
       .hasHtml(
-        `<p>a <img src="/images/emoji/twitter/man_rowing_boat.png?v=${v}" title=":man_rowing_boat:" class="emoji" alt=":man_rowing_boat:" loading="lazy" width="20" height="20" style="aspect-ratio: 20 / 20;"></p>`
+        `<p>a <img src="/images/emoji/twitter/man_biking.png?v=${v}" title=":man_biking:" class="emoji" alt=":man_biking:" loading="lazy" width="20" height="20" style="aspect-ratio: 20 / 20;"></p>`
       );
   });
 

app/assets/javascripts/discourse/tests/acceptance/user-preferences-account-user-status-test.js

@@ -22,12 +22,18 @@ async function setStatus(status) {
 acceptance("User Profile - Account - User Status", function (needs) {
   const username = "eviltrout";
   const status = {
-    emoji: "grinning",
+    emoji: "grinning_face",
     description: "off to dentist",
   };
 
   needs.user({ username, status });
 
+  needs.pretender((server, helper) => {
+    server.get("/emojis/search-aliases", () => {
+      return helper.response([]);
+    });
+  });
+
   test("doesn't render status block if status is disabled in site settings", async function (assert) {
     this.siteSettings.enable_user_status = false;
     await visit(`/u/${username}/preferences/account`);
@@ -85,7 +91,7 @@ acceptance("User Profile - Account - User Status", function (needs) {
     this.siteSettings.enable_user_status = true;
 
     await visit(`/u/${username}/preferences/account`);
-    const newStatus = { emoji: "womans_clothes", description: "shopping" };
+    const newStatus = { emoji: "woman_genie", description: "shopping" };
     await setStatus(newStatus);
 
     assert

app/assets/javascripts/discourse/tests/acceptance/user-status-test.js

@@ -25,7 +25,7 @@ async function setDoNotDisturbMode() {
 
 acceptance("User Status", function (needs) {
   const userStatus = "off to dentist";
-  const userStatusEmoji = "grinning";
+  const userStatusEmoji = "grinning_face";
   const userId = 1;
   const userTimezone = "UTC";
 
@@ -46,6 +46,9 @@ acceptance("User Status", function (needs) {
     server.delete("/do-not-disturb.json", () =>
       helper.response({ success: true })
     );
+    server.get("/emojis/search-aliases", () => {
+      return helper.response([]);
+    });
   });
 
   test("shows user status on loaded page", async function (assert) {
@@ -257,7 +260,7 @@ acceptance("User Status", function (needs) {
     await openUserStatusModal();
     await fillIn(".user-status-description", "another status");
 
-    await pickEmoji("grinning"); // another emoji
+    await pickEmoji("heart"); // another emoji
     await click(".d-modal-cancel");
     await openUserStatusModal();
 
@@ -316,7 +319,7 @@ acceptance(
   "User Status - pause notifications (do not disturb mode)",
   function (needs) {
     const userStatus = "off to dentist";
-    const userStatusEmoji = "grinning";
+    const userStatusEmoji = "grinning_face";
     const userId = 1;
     const userTimezone = "UTC";
 
@@ -337,6 +340,7 @@ acceptance(
       server.delete("/do-not-disturb.json", () =>
         helper.response({ success: true })
       );
+      server.get("/emoji/search-aliases", () => helper.response([]));
     });
 
     test("shows the pause notifications control group", async function (assert) {
@@ -436,7 +440,7 @@ acceptance(
 
 acceptance("User Status - user menu", function (needs) {
   const userStatus = "off to dentist";
-  const userStatusEmoji = "grinning";
+  const userStatusEmoji = "grinning_face";
   const userId = 1;
   const userTimezone = "UTC";
 

app/assets/javascripts/discourse/tests/fixtures/emojis-fixtures.js

@@ -4,7 +4,7 @@ export default {
       {
         name: "grinning",
         tonable: false,
-        url: "/images/emoji/twitter/grinning.png?v=12",
+        url: "/images/emoji/twitter/grinning.png?v=13",
         group: "smileys_\u0026_emotion",
         search_aliases: ["smiley_cat", "star_struck"],
       },
@@ -13,14 +13,14 @@ export default {
       {
         name: "grinning",
         tonable: false,
-        url: "/images/emoji/twitter/grinning.png?v=12",
+        url: "/images/emoji/twitter/grinning.png?v=13",
         group: "smileys_\u0026_emotion",
         search_aliases: ["smiley_cat", "star_struck"],
       },
       {
         name: "smiley_cat",
         tonable: false,
-        url: "/images/emoji/twitter/smiley_cat.png?v=12",
+        url: "/images/emoji/twitter/smiley_cat.png?v=13",
         group: "smileys_\u0026_emotion",
       },
     ],
@@ -28,14 +28,14 @@ export default {
       {
         name: "raised_hands",
         tonable: true,
-        url: "/images/emoji/twitter/raised_hands.png?v=12",
+        url: "/images/emoji/twitter/raised_hands.png?v=13",
         group: "people_&_body",
         search_aliases: [],
       },
       {
         name: "man_rowing_boat",
         tonable: true,
-        url: "/images/emoji/twitter/man_rowing_boat.png?v=12",
+        url: "/images/emoji/twitter/man_rowing_boat.png?v=13",
         group: "people_&_body",
         search_aliases: [],
       },
@@ -44,7 +44,7 @@ export default {
       {
         name: "womans_clothes",
         tonable: false,
-        url: "/images/emoji/twitter/womans_clothes.png?v=12",
+        url: "/images/emoji/twitter/womans_clothes.png?v=13",
         group: "objects",
         search_aliases: [],
       },

app/assets/javascripts/discourse/tests/helpers/emoji-picker-helper.js

@@ -22,7 +22,14 @@ class EmojiPicker {
 
   async tone(level) {
     await click(query(".emoji-picker__diversity-trigger", this.element));
-    await click(`.emoji-picker__diversity-menu [data-level="${level}"]`);
+
+    if (level === 1) {
+      await click(
+        `.emoji-picker__diversity-menu .emoji-picker__diversity-item:not([data-level])`
+      );
+    } else {
+      await click(`.emoji-picker__diversity-menu [data-level="${level}"]`);
+    }
   }
 }
 

app/assets/javascripts/discourse/tests/integration/components/d-editor-test.js

@@ -14,6 +14,7 @@ import { module, test } from "qunit";
 import { withPluginApi } from "discourse/lib/plugin-api";
 import { setCaretPosition } from "discourse/lib/utilities";
 import { setupRenderingTest } from "discourse/tests/helpers/component-test";
+import pretender, { response } from "discourse/tests/helpers/create-pretender";
 import formatTextWithSelection from "discourse/tests/helpers/d-editor-helper";
 import emojiPicker from "discourse/tests/helpers/emoji-picker-helper";
 import { paste, queryAll } from "discourse/tests/helpers/qunit-helpers";
@@ -26,6 +27,12 @@ import { i18n } from "discourse-i18n";
 module("Integration | Component | d-editor", function (hooks) {
   setupRenderingTest(hooks);
 
+  hooks.beforeEach(function () {
+    pretender.get("/emojis/search-aliases", () => {
+      return response([]);
+    });
+  });
+
   test("preview updates with markdown", async function (assert) {
     await render(hbs`<DEditor @value={{this.value}} />`);
 
@@ -729,11 +736,11 @@ third line`
     jumpEnd("textarea.d-editor-input");
     await triggerKeyEvent(".d-editor-input", "keyup", "Backspace"); //simplest way to trigger more menu here
     await click(".ac-emoji li:last-child a");
-    await picker.select("womans_clothes");
+    await picker.select("woman_genie");
 
     assert.strictEqual(
       this.value,
-      "starting to type an emoji like :womans_clothes:",
+      "starting to type an emoji like :woman_genie:",
       "it works when there is a partial emoji"
     );
   });

app/assets/javascripts/discourse/tests/integration/components/emoji-picker-test.js

@@ -14,6 +14,10 @@ module("Integration | Component | emoji-picker-content", function (hooks) {
       response(emojisFixtures["/emojis.json"])
     );
 
+    pretender.get("/emojis/search-aliases", () => {
+      return response([]);
+    });
+
     this.emojiStore = this.container.lookup("service:emoji-store");
   });
 
@@ -70,21 +74,21 @@ module("Integration | Component | emoji-picker-content", function (hooks) {
 
     assert
       .dom(".emoji-picker__section.filtered > img")
-      .exists({ count: 2 }, "it filters the emojis list");
+      .exists({ count: 6 }, "it filters the emojis list");
     assert
-      .dom('.emoji-picker__section.filtered > img[alt="grinning"]')
+      .dom('.emoji-picker__section.filtered > img[alt="grinning_face"]')
       .exists("it filters the correct emoji");
 
     await fillIn(".filter-input", "Grinning");
 
     assert
-      .dom('.emoji-picker__section.filtered > img[alt="grinning"]')
+      .dom('.emoji-picker__section.filtered > img[alt="grinning_face"]')
       .exists("it is case insensitive");
 
     await fillIn(".filter-input", "grinning");
 
     assert
-      .dom('.emoji-picker__section.filtered > img[alt="grinning"]')
+      .dom('.emoji-picker__section.filtered > img[alt="grinning_face"]')
       .exists("it filters the correct emoji using search alias");
   });
 
@@ -199,8 +203,8 @@ module("Integration | Component | emoji-picker-content", function (hooks) {
     await emojiPicker(".emoji-picker").fill("grinning");
 
     assert
-      .dom('img.emoji[data-emoji="grinning"]')
-      .hasAttribute("title", ":grinning:", "filtered emoji have a title");
+      .dom('img.emoji[data-emoji="grinning_face"]')
+      .hasAttribute("title", ":grinning_face:", "filtered emoji have a title");
 
     await emojiPicker(".emoji-picker").tone(1);
     await render(hbs`<EmojiPicker::Content />`);

app/assets/javascripts/discourse/tests/integration/components/user-status-picker-test.gjs

@@ -3,10 +3,15 @@ import { TrackedObject } from "@ember-compat/tracked-built-ins";
 import { module, test } from "qunit";
 import UserStatusPicker from "discourse/components/user-status-picker";
 import { setupRenderingTest } from "discourse/tests/helpers/component-test";
+import pretender, { response } from "discourse/tests/helpers/create-pretender";
 
 module("Integration | Component | user-status-picker", function (hooks) {
   setupRenderingTest(hooks);
 
+  hooks.beforeEach(function () {
+    pretender.get("/emojis/search-aliases", () => response([]));
+  });
+
   test("it renders current status", async function (assert) {
     const status = new TrackedObject({
       emoji: "tooth",
@@ -42,8 +47,8 @@ module("Integration | Component | user-status-picker", function (hooks) {
     await fillIn(".emoji-picker-content .filter-input", "raised");
     await click(".emoji-picker__sections .emoji");
 
-    assert.dom(".emoji").hasAttribute("alt", "raised_hands");
-    assert.strictEqual(status.emoji, "raised_hands");
+    assert.dom(".emoji").hasAttribute("alt", "raised_back_of_hand");
+    assert.strictEqual(status.emoji, "raised_back_of_hand");
   });
 
   test("it sets default emoji when user starts typing a description", async function (assert) {

app/assets/javascripts/discourse/tests/unit/lib/emoji-test.js

@@ -142,7 +142,10 @@ module("Unit | Utility | emoji", function (hooks) {
 
   test("Emoji search", function (assert) {
     // able to find an alias
-    assert.strictEqual(emojiSearch("+1").length, 1);
+    assert.strictEqual(
+      emojiSearch("+1", { searchAliases: { thumbs_up: ["+1"] } }).length,
+      1
+    );
 
     // able to find middle of line search
     assert.strictEqual(emojiSearch("check", { maxResults: 3 }).length, 3);
@@ -162,15 +165,20 @@ module("Unit | Utility | emoji", function (hooks) {
   });
 
   test("search does not return duplicated results", function (assert) {
-    const matches = emojiSearch("bow").filter(
-      (emoji) => emoji === "bowing_man"
-    );
+    const matches = emojiSearch("bow", {
+      searchAliases: { bowing_man: ["bow"] },
+    }).filter((emoji) => emoji === "man_bowing");
 
-    assert.deepEqual(matches, ["bowing_man"]);
+    assert.deepEqual(matches, ["man_bowing"]);
   });
 
   test("search does partial-match on emoji aliases", function (assert) {
-    const matches = emojiSearch("instru");
+    const matches = emojiSearch("instru", {
+      searchAliases: {
+        woman_teacher: ["instructor", "lecturer", "professor"],
+        violin: ["instrument", "music"],
+      },
+    });
 
     assert.true(matches.includes("woman_teacher"));
     assert.true(matches.includes("violin"));

app/assets/javascripts/discourse/tests/unit/lib/text-test.js

@@ -1,4 +1,5 @@
 import { setupTest } from "ember-qunit";
+import { IMAGE_VERSION as v } from "pretty-text/emoji/version";
 import { module, test } from "qunit";
 import { cook, excerpt, parseAsync, parseMentions } from "discourse/lib/text";
 
@@ -19,13 +20,13 @@ module("Unit | Utility | text", function (hooks) {
     let cooked = await cook("Hello! :wave:");
     assert.strictEqual(
       await excerpt(cooked, 300),
-      'Hello! <img src="/images/emoji/twitter/wave.png?v=12" title=":wave:" class="emoji" alt=":wave:" loading="lazy" width="20" height="20">'
+      `Hello! <img src="/images/emoji/twitter/wave.png?v=${v}" title=":wave:" class="emoji" alt=":wave:" loading="lazy" width="20" height="20">`
     );
 
     cooked = await cook("[:wave:](https://example.com)");
     assert.strictEqual(
       await excerpt(cooked, 300),
-      '<a href="https://example.com"><img src="/images/emoji/twitter/wave.png?v=12" title=":wave:" class="emoji only-emoji" alt=":wave:" loading="lazy" width="20" height="20"></a>'
+      `<a href="https://example.com"><img src="/images/emoji/twitter/wave.png?v=${v}" title=":wave:" class="emoji only-emoji" alt=":wave:" loading="lazy" width="20" height="20"></a>`
     );
 
     cooked = await cook('<script>alert("hi")</script>');

app/assets/javascripts/discourse/tests/unit/lib/to-markdown-test.js

@@ -1,4 +1,5 @@
 import { setupTest } from "ember-qunit";
+import { IMAGE_VERSION as v } from "pretty-text/emoji/version";
 import { module, test } from "qunit";
 import toMarkdown, {
   addBlockDecorateCallback,
@@ -359,7 +360,7 @@ helloWorld();</code>consectetur.`;
   test("strips user status from mentions", function (assert) {
     const statusHtml = `
         <img class="emoji user-status"
-             src="/images/emoji/twitter/desert_island.png?v=12"
+             src="/images/emoji/twitter/desert_island.png?v=${v}"
              title="vacation">
     `;
     const html = `Mentioning <a class="mention" href="/u/andrei">@andrei${statusHtml}</a>`;

app/assets/javascripts/pretty-text/addon/emoji/version.js

@@ -1,4 +1,4 @@
 // DO NOT EDIT THIS FILE!!!
 // Update it by running `rake javascript:update_constants`
 
-export const IMAGE_VERSION = "12";
+export const IMAGE_VERSION = "13";

app/controllers/emojis_controller.rb

@@ -5,4 +5,8 @@ class EmojisController < ApplicationController
     emojis = Emoji.allowed.group_by(&:group)
     render json: MultiJson.dump(emojis)
   end
+
+  def search_aliases
+    render json: MultiJson.dump(Emoji.search_aliases)
+  end
 end

app/models/emoji.rb

@@ -2,7 +2,7 @@
 
 class Emoji
   # update this to clear the cache
-  EMOJI_VERSION = "12"
+  EMOJI_VERSION = "13"
 
   FITZPATRICK_SCALE = %w[1f3fb 1f3fc 1f3fd 1f3fe 1f3ff]
 
@@ -37,11 +37,11 @@ class Emoji
   end
 
   def self.aliases
-    db["aliases"]
+    aliases_db
   end
 
   def self.search_aliases
-    db["searchAliases"]
+    search_aliases_db
   end
 
   def self.translations
@@ -53,7 +53,7 @@ class Emoji
   end
 
   def self.tonable_emojis
-    db["tonableEmojis"]
+    tonable_emojis_db
   end
 
   def self.custom?(name)
@@ -130,7 +130,7 @@ class Emoji
   end
 
   def self.groups_file
-    @groups_file ||= "#{Rails.root}/lib/emoji/groups.json"
+    @groups_file ||= DiscourseEmojis.paths[:groups]
   end
 
   def self.groups
@@ -146,16 +146,48 @@ class Emoji
       end
   end
 
-  def self.db_file
-    @db_file ||= "#{Rails.root}/lib/emoji/db.json"
+  def self.emojis_db_file
+    @emojis_db_file ||= DiscourseEmojis.paths[:emojis]
   end
 
-  def self.db
-    @db ||= File.open(db_file, "r:UTF-8") { |f| JSON.parse(f.read) }
+  def self.emojis_db
+    @emojis_db ||= Emoji.parse_emoji_file(emojis_db_file)
+  end
+
+  def self.translations_db_file
+    @translations_db_file ||= DiscourseEmojis.paths[:translations]
+  end
+
+  def self.translations_db
+    @translations_db ||= Emoji.parse_emoji_file(translations_db_file)
+  end
+
+  def self.tonable_emojis_db_file
+    @tonable_emojis_db_file ||= DiscourseEmojis.paths[:tonable_emojis]
+  end
+
+  def self.tonable_emojis_db
+    @tonable_emojis_db ||= Emoji.parse_emoji_file(tonable_emojis_db_file)
+  end
+
+  def self.aliases_db_file
+    @aliases_db_file ||= DiscourseEmojis.paths[:aliases]
+  end
+
+  def self.aliases_db
+    @aliases_db ||= Emoji.parse_emoji_file(aliases_db_file)
+  end
+
+  def self.search_aliases_db_file
+    @search_aliases_db_file ||= DiscourseEmojis.paths[:search_aliases]
+  end
+
+  def self.search_aliases_db
+    @search_aliases_db ||= Emoji.parse_emoji_file(search_aliases_db_file)
   end
 
   def self.load_standard
-    db["emojis"].map { |e| Emoji.create_from_db_item(e) }.compact
+    emojis_db.map { |e| Emoji.create_from_db_item(e) }.compact
   end
 
   def self.load_allowed
@@ -210,7 +242,7 @@ class Emoji
   end
 
   def self.load_translations
-    db["translations"]
+    translations_db
   end
 
   def self.base_directory
@@ -233,7 +265,7 @@ class Emoji
         is_tonable_emojis = Emoji.tonable_emojis
         fitzpatrick_scales = FITZPATRICK_SCALE.map { |scale| scale.to_i(16) }
 
-        db["emojis"].each do |e|
+        emojis_db.each do |e|
           name = e["name"]
 
           # special cased as we prefer to keep these as symbols
@@ -279,7 +311,7 @@ class Emoji
         map = {}
         is_tonable_emojis = Emoji.tonable_emojis
 
-        db["emojis"].each do |e|
+        emojis_db.each do |e|
           next if e["name"] == "tm"
 
           code = replacement_code(e["code"])
@@ -329,4 +361,8 @@ class Emoji
   def self.sanitize_emoji_name(name)
     name.gsub(/[^a-z0-9\+\-]+/i, "_").gsub(/_{2,}/, "_").downcase
   end
+
+  def self.parse_emoji_file(file)
+    File.open(file, "r:UTF-8") { |f| JSON.parse(f.read) }
+  end
 end

app/models/emoji_set_site_setting.rb

@@ -10,11 +10,16 @@ class EmojiSetSiteSetting < EnumSiteSetting
   def self.values
     @values ||= [
       { name: "emoji_set.apple_international", value: "apple" },
-      { name: "emoji_set.google", value: "google" },
-      { name: "emoji_set.twitter", value: "twitter" },
-      { name: "emoji_set.win10", value: "win10" },
-      { name: "emoji_set.google_classic", value: "google_classic" },
       { name: "emoji_set.facebook_messenger", value: "facebook_messenger" },
+      { name: "emoji_set.fluentui", value: "fluentui" },
+      { name: "emoji_set.google", value: "google" },
+      { name: "emoji_set.google_classic", value: "google_classic" },
+      { name: "emoji_set.noto", value: "noto" },
+      { name: "emoji_set.openmoji", value: "openmoji" },
+      { name: "emoji_set.twemoji", value: "twemoji" },
+      { name: "emoji_set.twitter", value: "twitter" },
+      { name: "emoji_set.standard", value: "unicode" },
+      { name: "emoji_set.win10", value: "win10" },
     ]
   end
 

config/locales/client.en.yml

@@ -2548,12 +2548,17 @@ en:
       continue: "Continue to %{site_name}"
 
     emoji_set:
-      apple_international: "Apple/International"
-      google: "Google"
-      twitter: "Twitter"
-      win10: "Win10"
-      google_classic: "Google Classic"
-      facebook_messenger: "Facebook Messenger"
+      apple_international: "Apple/International (deprecated to Twemoji)"
+      google: "Google (deprecated to Noto Emoji)"
+      twitter: "Twitter (deprecated to Twemoji)"
+      win10: "Win10 (deprecated to Fluent Emoji)"
+      google_classic: "Google Classic (deprecated to Noto Emoji)"
+      facebook_messenger: "Facebook Messenger (deprecated to Standard)"
+      openmoji: OpenMoji
+      standard: Standard
+      fluentui: Fluent Emoji
+      noto: Noto Emoji
+      twemoji: Twemoji
 
     category_page_style:
       categories_only: "Categories Only"

config/routes.rb

@@ -1725,6 +1725,7 @@ Discourse::Application.routes.draw do
     get "/form-templates" => "form_templates#index"
 
     get "/emojis" => "emojis#index"
+    get "/emojis/search-aliases" => "emojis#search_aliases"
 
     if Rails.env.test?
       # Routes that are only used for testing

lib/tasks/emoji.rake

@@ -1,562 +0,0 @@
-# frozen_string_literal: true
-
-require "active_support/test_case"
-require "fileutils"
-require "json"
-require "nokogiri"
-require "open-uri"
-require "file_helper"
-
-EMOJI_GROUPS_PATH = "lib/emoji/groups.json"
-
-EMOJI_DB_PATH = "lib/emoji/db.json"
-
-EMOJI_IMAGES_PATH = "public/images/emoji"
-
-EMOJI_ORDERING_URL = "http://www.unicode.org/emoji/charts/emoji-ordering.html"
-
-# emoji aliases are actually created as images
-# eg: "right_anger_bubble" => [ "anger_right" ]
-# your app will physically have right_anger_bubble.png and anger_right.png
-EMOJI_ALIASES = {
-  "right_anger_bubble" => ["anger_right"],
-  "ballot_box" => ["ballot_box_with_ballot"],
-  "basketball_man" => %w[basketball_player person_with_ball],
-  "beach_umbrella" => %w[umbrella_on_ground beach beach_with_umbrella],
-  "parasol_on_ground" => ["umbrella_on_ground"],
-  "bellhop_bell" => ["bellhop"],
-  "biohazard" => ["biohazard_sign"],
-  "bow_and_arrow" => ["archery"],
-  "spiral_calendar" => %w[calendar_spiral spiral_calendar_pad],
-  "card_file_box" => ["card_box"],
-  "champagne" => ["bottle_with_popping_cork"],
-  "cheese" => ["cheese_wedge"],
-  "city_sunset" => ["city_dusk"],
-  "couch_and_lamp" => ["couch"],
-  "crayon" => ["lower_left_crayon"],
-  "cricket_bat_and_ball" => ["cricket_bat_ball"],
-  "latin_cross" => ["cross"],
-  "dagger" => ["dagger_knife"],
-  "desktop_computer" => ["desktop"],
-  "card_index_dividers" => ["dividers"],
-  "dove" => ["dove_of_peace"],
-  "footprints" => ["feet"],
-  "fire" => ["flame"],
-  "black_flag" => %w[flag_black waving_black_flag],
-  "cn" => ["flag_cn"],
-  "de" => ["flag_de"],
-  "es" => ["flag_es"],
-  "fr" => ["flag_fr"],
-  "uk" => %w[gb flag_gb],
-  "it" => ["flag_it"],
-  "jp" => ["flag_jp"],
-  "kr" => ["flag_kr"],
-  "ru" => ["flag_ru"],
-  "us" => ["flag_us"],
-  "white_flag" => %w[flag_white waving_white_flag],
-  "plate_with_cutlery" => %w[fork_knife_plate fork_and_knife_with_plate],
-  "framed_picture" => %w[frame_photo frame_with_picture],
-  "hammer_and_pick" => ["hammer_pick"],
-  "heavy_heart_exclamation" => %w[heart_exclamation heavy_heart_exclamation_mark_ornament],
-  "houses" => %w[homes house_buildings],
-  "hotdog" => ["hot_dog"],
-  "derelict_house" => %w[house_abandoned derelict_house_building],
-  "desert_island" => ["island"],
-  "old_key" => ["key2"],
-  "laughing" => ["satisfied"],
-  "business_suit_levitating" => %w[levitate man_in_business_suit_levitating],
-  "weight_lifting_man" => %w[lifter weight_lifter],
-  "medal_sports" => %w[medal sports_medal],
-  "metal" => ["sign_of_the_horns"],
-  "fu" => %w[middle_finger reversed_hand_with_middle_finger_extended],
-  "motorcycle" => ["racing_motorcycle"],
-  "mountain_snow" => ["snow_capped_mountain"],
-  "newspaper_roll" => %w[newspaper2 rolled_up_newspaper],
-  "spiral_notepad" => %w[notepad_spiral spiral_note_pad],
-  "oil_drum" => ["oil"],
-  "older_woman" => ["grandma"],
-  "paintbrush" => ["lower_left_paintbrush"],
-  "paperclips" => ["linked_paperclips"],
-  "pause_button" => ["double_vertical_bar"],
-  "peace_symbol" => ["peace"],
-  "fountain_pen" => %w[pen_fountain lower_left_fountain_pen],
-  "ping_pong" => ["table_tennis"],
-  "place_of_worship" => ["worship_symbol"],
-  "poop" => %w[shit hankey poo],
-  "radioactive" => ["radioactive_sign"],
-  "railway_track" => ["railroad_track"],
-  "robot" => ["robot_face"],
-  "skull" => ["skeleton"],
-  "skull_and_crossbones" => ["skull_crossbones"],
-  "speaking_head" => ["speaking_head_in_silhouette"],
-  "male_detective" => %w[spy sleuth_or_spy],
-  "thinking" => ["thinking_face"],
-  "-1" => ["thumbsdown"],
-  "+1" => ["thumbsup"],
-  "cloud_with_lightning_and_rain" => %w[thunder_cloud_rain thunder_cloud_and_rain],
-  "tickets" => ["admission_tickets"],
-  "next_track_button" => %w[track_next next_track],
-  "previous_track_button" => %w[track_previous previous_track],
-  "unicorn" => ["unicorn_face"],
-  "funeral_urn" => ["urn"],
-  "sun_behind_large_cloud" => %w[white_sun_cloud white_sun_behind_cloud],
-  "sun_behind_rain_cloud" => %w[white_sun_rain_cloud white_sun_behind_cloud_with_rain],
-  "partly_sunny" => %w[white_sun_small_cloud white_sun_with_small_cloud],
-  "open_umbrella" => ["umbrella2"],
-  "hammer_and_wrench" => ["tools"],
-  "face_with_thermometer" => ["thermometer_face"],
-  "timer_clock" => ["timer"],
-  "keycap_ten" => ["ten"],
-  "memo" => ["pencil"],
-  "rescue_worker_helmet" => %w[helmet_with_cross helmet_with_white_cross],
-  "slightly_smiling_face" => %w[slightly_smiling slight_smile],
-  "construction_worker_man" => ["construction_worker"],
-  "upside_down_face" => ["upside_down"],
-  "money_mouth_face" => ["money_mouth"],
-  "nerd_face" => ["nerd"],
-  "hugs" => %w[hugging hugging_face],
-  "roll_eyes" => %w[rolling_eyes face_with_rolling_eyes],
-  "slightly_frowning_face" => %w[frowning slight_frown],
-  "frowning_face" => %w[frowning2 white_frowning_face],
-  "zipper_mouth_face" => ["zipper_mouth"],
-  "face_with_head_bandage" => ["head_bandage"],
-  "raised_hand_with_fingers_splayed" => ["hand_splayed"],
-  "raised_hand" => ["hand"],
-  "vulcan_salute" => %w[vulcan raised_hand_with_part_between_middle_and_ring_fingers],
-  "policeman" => ["cop"],
-  "running_man" => ["runner"],
-  "walking_man" => ["walking"],
-  "bowing_man" => ["bow"],
-  "no_good_woman" => ["no_good"],
-  "raising_hand_woman" => ["raising_hand"],
-  "pouting_woman" => ["person_with_pouting_face"],
-  "frowning_woman" => ["person_frowning"],
-  "haircut_woman" => ["haircut"],
-  "massage_woman" => ["massage"],
-  "tshirt" => ["shirt"],
-  "biking_man" => ["bicyclist"],
-  "mountain_biking_man" => ["mountain_bicyclist"],
-  "passenger_ship" => ["cruise_ship"],
-  "motor_boat" => %w[motorboat boat],
-  "flight_arrival" => ["airplane_arriving"],
-  "flight_departure" => ["airplane_departure"],
-  "small_airplane" => ["airplane_small"],
-  "racing_car" => ["race_car"],
-  "family_man_woman_boy_boy" => ["family_man_woman_boys"],
-  "family_man_woman_girl_girl" => ["family_man_woman_girls"],
-  "family_woman_woman_boy" => ["family_women_boy"],
-  "family_woman_woman_girl" => ["family_women_girl"],
-  "family_woman_woman_girl_boy" => ["family_women_girl_boy"],
-  "family_woman_woman_boy_boy" => ["family_women_boys"],
-  "family_woman_woman_girl_girl" => ["family_women_girls"],
-  "family_man_man_boy" => ["family_men_boy"],
-  "family_man_man_girl" => ["family_men_girl"],
-  "family_man_man_girl_boy" => ["family_men_girl_boy"],
-  "family_man_man_boy_boy" => ["family_men_boys"],
-  "family_man_man_girl_girl" => ["family_men_girls"],
-  "cloud_with_lightning" => ["cloud_lightning"],
-  "tornado" => %w[cloud_tornado cloud_with_tornado],
-  "cloud_with_rain" => ["cloud_rain"],
-  "cloud_with_snow" => ["cloud_snow"],
-  "asterisk" => ["keycap_star"],
-  "studio_microphone" => ["microphone2"],
-  "medal_military" => ["military_medal"],
-  "couple_with_heart_woman_woman" => ["female_couple_with_heart"],
-  "couple_with_heart_man_man" => ["male_couple_with_heart"],
-  "couplekiss_woman_woman" => ["female_couplekiss"],
-  "couplekiss_man_man" => ["male_couplekiss"],
-  "honeybee" => ["bee"],
-  "lion" => ["lion_face"],
-  "artificial_satellite" => ["satellite_orbital"],
-  "computer_mouse" => %w[mouse_three_button three_button_mouse],
-  "hocho" => ["knife"],
-  "swimming_man" => ["swimmer"],
-  "wind_face" => ["wind_blowing_face"],
-  "golfing_man" => ["golfer"],
-  "facepunch" => ["punch"],
-  "building_construction" => ["construction_site"],
-  "family_man_woman_girl_boy" => ["family"],
-  "ice_hockey" => ["hockey"],
-  "snowman_with_snow" => ["snowman2"],
-  "play_or_pause_button" => ["play_pause"],
-  "film_projector" => ["projector"],
-  "shopping" => ["shopping_bags"],
-  "open_book" => ["book"],
-  "national_park" => ["park"],
-  "world_map" => ["map"],
-  "pen" => %w[pen_ballpoint lower_left_ballpoint_pen],
-  "email" => %w[envelope e-mail],
-  "phone" => ["telephone"],
-  "atom_symbol" => ["atom"],
-  "mantelpiece_clock" => ["clock"],
-  "camera_flash" => ["camera_with_flash"],
-  "film_strip" => ["film_frames"],
-  "balance_scale" => ["scales"],
-  "surfing_man" => ["surfer"],
-  "couplekiss_man_woman" => ["couplekiss"],
-  "couple_with_heart_woman_man" => ["couple_with_heart"],
-  "clamp" => ["compression"],
-  "dancing_women" => ["dancers"],
-  "blonde_man" => ["person_with_blond_hair"],
-  "sleeping_bed" => ["sleeping_accommodation"],
-  "om" => ["om_symbol"],
-  "tipping_hand_woman" => ["information_desk_person"],
-  "rowing_man" => ["rowboat"],
-  "new_moon" => ["moon"],
-  "oncoming_automobile" => %w[car automobile],
-  "fleur_de_lis" => ["fleur-de-lis"],
-  "face_vomiting" => ["puke"],
-  "smile" => ["grinning_face_with_smiling_eyes"],
-  "frowning_with_open_mouth" => ["frowning_face_with_open_mouth"],
-}
-
-EMOJI_GROUPS = [
-  { "name" => "smileys_&_emotion", "tabicon" => "grinning" },
-  { "name" => "people_&_body", "tabicon" => "wave" },
-  { "name" => "animals_&_nature", "tabicon" => "evergreen_tree" },
-  { "name" => "food_&_drink", "tabicon" => "hamburger" },
-  { "name" => "travel_&_places", "tabicon" => "airplane" },
-  { "name" => "activities", "tabicon" => "soccer" },
-  { "name" => "objects", "tabicon" => "eyeglasses" },
-  { "name" => "symbols", "tabicon" => "white_check_mark" },
-  { "name" => "flags", "tabicon" => "checkered_flag" },
-]
-
-FITZPATRICK_SCALE = %w[1f3fb 1f3fc 1f3fd 1f3fe 1f3ff]
-
-DEFAULT_SET = "twitter"
-
-# Replace the platform by another when downloading the image (accepts names or categories)
-EMOJI_IMAGES_PATCH = {
-  "apple" => {
-    "snowboarder" => "twitter",
-  },
-  "windows" => {
-    "country-flag" => "twitter",
-  },
-}
-
-EMOJI_SETS = {
-  "apple" => "apple",
-  "google" => "google",
-  "google_blob" => "google_classic",
-  "facebook" => "facebook_messenger",
-  "twitter" => "twitter",
-  "windows" => "win10",
-}
-
-EMOJI_DB_REPO = "git@github.com:xfalcox/emoji-db.git"
-
-EMOJI_DB_REPO_PATH = File.join("tmp", "emoji-db")
-
-GENERATED_PATH = File.join(EMOJI_DB_REPO_PATH, "generated")
-
-def search_aliases(emojis)
-  # Format is search pattern => associated emojis
-  # eg: "cry" => [ "sob" ]
-  # for a "cry" query should return: cry and sob
-  @aliases ||=
-    begin
-      aliases = {
-        "sad" => %w[frowning_face slightly_frowning_face sob crying_cat_face cry],
-        "cry" => ["sob"],
-      }
-
-      emojis.each do |_, config|
-        next if config["search_aliases"].blank?
-        config["search_aliases"].each do |name|
-          aliases[name] ||= []
-          aliases[name] << config["name"]
-        end
-      end
-
-      aliases.map { |_, names| names.uniq! }
-      aliases
-    end
-end
-
-desc "update emoji images"
-task "emoji:update" do
-  abort("This task can't be run on production.") if Rails.env.production?
-
-  copy_emoji_db
-
-  json_db = File.read(File.join(GENERATED_PATH, "db.json"))
-  db = JSON.parse(json_db)
-
-  write_db_json(db["emojis"], db["translations"], search_aliases(db["emojis"]))
-  fix_incomplete_sets(db["emojis"])
-  write_aliases
-  groups = generate_emoji_groups(db["emojis"], db["sections"])
-  write_js_groups(db["emojis"], groups)
-  optimize_images(Dir.glob(File.join(Rails.root, EMOJI_IMAGES_PATH, "/**/*.png")))
-
-  TestEmojiUpdate.run_and_summarize
-
-  FileUtils.rm_rf(EMOJI_DB_REPO_PATH)
-end
-
-desc "test the emoji generation script"
-task "emoji:test" do
-  ENV["EMOJI_TEST"] = "1"
-  Rake::Task["emoji:update"].invoke
-end
-
-def optimize_images(images)
-  images.each do |filename|
-    FileHelper.image_optim(allow_pngquant: true, strip_image_metadata: true).optimize_image!(
-      filename,
-    )
-  end
-end
-
-def copy_emoji_db
-  `rm -rf tmp/emoji-db && git clone -b unicodeorg-as-source-of-truth --depth 1 #{EMOJI_DB_REPO} tmp/emoji-db`
-
-  path = "#{EMOJI_IMAGES_PATH}/**/*"
-  confirm_overwrite(path)
-  puts "Cleaning emoji folder..."
-  emoji_assets = Dir.glob(path)
-  emoji_assets.delete_if { |x| x == "#{EMOJI_IMAGES_PATH}/emoji_one" }
-  FileUtils.rm_rf(emoji_assets)
-
-  EMOJI_SETS.each do |set_name, set_destination|
-    origin = File.join(GENERATED_PATH, set_name)
-    destination = File.join(EMOJI_IMAGES_PATH, set_destination)
-    FileUtils.mv(origin, destination)
-  end
-end
-
-def fix_incomplete_sets(emojis)
-  emojis.each do |code, config|
-    EMOJI_SETS.each do |set_name, set_destination|
-      patch_set =
-        EMOJI_SETS[EMOJI_IMAGES_PATCH.dig(set_name, config["name"])] ||
-          EMOJI_SETS[EMOJI_IMAGES_PATCH.dig(set_name, config["category"])]
-
-      if patch_set ||
-           !File.exist?(File.join(EMOJI_IMAGES_PATH, set_destination, "#{config["name"]}.png"))
-        origin = File.join(EMOJI_IMAGES_PATH, patch_set || EMOJI_SETS[DEFAULT_SET], config["name"])
-
-        FileUtils.cp(
-          "#{origin}.png",
-          File.join(EMOJI_IMAGES_PATH, set_destination, "#{config["name"]}.png"),
-        )
-        if File.directory?(origin)
-          FileUtils.cp_r(origin, File.join(EMOJI_IMAGES_PATH, set_destination, config["name"]))
-        end
-      end
-    end
-  end
-end
-
-def generate_emoji_groups(keywords, sections)
-  puts "Generating groups..."
-
-  list = URI.parse(EMOJI_ORDERING_URL).read
-  doc = Nokogiri.HTML5(list)
-  table = doc.css("table")[0]
-
-  EMOJI_GROUPS.map do |group|
-    group["icons"] ||= []
-
-    sub_sections = sections[group["name"]]["sub_sections"]
-    sub_sections.each do |section|
-      title_section = table.css("tr th a[@name='#{section}']")
-      emoji_list_section = title_section.first.parent.parent.next_element
-      emoji_list_section
-        .css("a.plain img")
-        .each do |link|
-          emoji_code =
-            link
-              .attr("title")
-              .scan(/U\+(.{4,5})\b/)
-              .flatten
-              .map { |code| code.downcase.strip }
-              .join("_")
-
-          emoji_char = code_to_emoji(emoji_code)
-
-          if emoji = keywords[emoji_char]
-            group["icons"] << { name: emoji["name"], diversity: emoji["fitzpatrick_scale"] }
-          end
-        end
-    end
-    group.delete("sections")
-    group
-  end
-end
-
-def write_aliases
-  EMOJI_ALIASES.each do |original, aliases|
-    aliases.each do |emoji_alias|
-      EMOJI_SETS.each do |set_name, set_destination|
-        origin_file = File.join(EMOJI_IMAGES_PATH, set_destination, "#{original}.png")
-        origin_dir = File.join(EMOJI_IMAGES_PATH, set_destination, original)
-        FileUtils.cp(
-          origin_file,
-          File.join(EMOJI_IMAGES_PATH, set_destination, "#{emoji_alias}.png"),
-        )
-
-        if File.directory?(origin_dir)
-          FileUtils.cp_r(origin_dir, File.join(EMOJI_IMAGES_PATH, set_destination, emoji_alias))
-        end
-      end
-    end
-  end
-end
-
-def write_db_json(emojis, translations, search_aliases)
-  puts "Writing #{EMOJI_DB_PATH}..."
-
-  confirm_overwrite(EMOJI_DB_PATH)
-
-  FileUtils.mkdir_p(File.expand_path("..", EMOJI_DB_PATH))
-
-  # skin tones variations of emojis shouldn’t appear in autocomplete
-  emojis_without_tones =
-    emojis
-      .select do |char, config|
-        !FITZPATRICK_SCALE.any? do |scale|
-          codepoints_to_code(char.codepoints, config["fitzpatrick_scale"])[scale]
-        end
-      end
-      .map do |char, config|
-        {
-          "code" => codepoints_to_code(char.codepoints, config["fitzpatrick_scale"]).tr("_", "-"),
-          "name" => config["name"],
-        }
-      end
-
-  emoji_with_tones =
-    emojis
-      .select { |code, config| config["fitzpatrick_scale"] }
-      .map { |code, config| config["name"] }
-
-  db = {
-    "emojis" => emojis_without_tones,
-    "tonableEmojis" => emoji_with_tones,
-    "aliases" => EMOJI_ALIASES,
-    "searchAliases" => search_aliases,
-    "translations" => translations,
-  }
-
-  File.write(EMOJI_DB_PATH, JSON.pretty_generate(db))
-end
-
-def write_js_groups(emojis, groups)
-  puts "Writing #{EMOJI_GROUPS_PATH}..."
-
-  confirm_overwrite(EMOJI_GROUPS_PATH)
-
-  template = JSON.pretty_generate(groups)
-  FileUtils.mkdir_p(File.expand_path("..", EMOJI_GROUPS_PATH))
-  File.write(EMOJI_GROUPS_PATH, template)
-end
-
-def code_to_emoji(code)
-  code.split("_").map { |e| e.to_i(16) }.pack "U*"
-end
-
-def codepoints_to_code(codepoints, fitzpatrick_scale)
-  codepoints = codepoints.map { |c| c.to_s(16).rjust(4, "0") }.join("_").downcase
-
-  codepoints.gsub!(/_fe0f\z/, "") if !fitzpatrick_scale
-
-  codepoints
-end
-
-def confirm_overwrite(path)
-  return if ENV["EMOJI_TEST"]
-
-  STDOUT.puts(
-    "[!] You are about to overwrite #{path}, are you sure? [CTRL+c] to cancel, [ENTER] to continue",
-  )
-  STDIN.gets.chomp
-end
-
-class TestEmojiUpdate
-  def self.run_and_summarize
-    puts "Running tests..."
-    instance = TestEmojiUpdate.new
-    instance.public_methods.each do |method|
-      next unless method.to_s.start_with? "test_"
-      print "Running #{method}..."
-      instance.public_send(method)
-      puts " ✅"
-    rescue StandardError => e
-      puts " ❌"
-      puts e.message.indent(2)
-    end
-  end
-
-  def assert_equal(a, b)
-    raise "Expected #{a.inspect} to equal #{b.inspect}" if a != b
-  end
-
-  def assert(a)
-    raise "Expected #{a.inspect} to be truthy" if !a
-  end
-
-  def image_path(style, name)
-    File.join("public", "images", "emoji", style, "#{name}.png")
-  end
-
-  def test_code_to_emoji
-    assert_equal "😎", code_to_emoji("1f60e")
-  end
-
-  def test_codepoints_to_code
-    assert_equal "1f6b5_200d_2640", codepoints_to_code([128_693, 8205, 9792, 65_039], false)
-  end
-
-  def test_codepoints_to_code_with_scale
-    assert_equal "1f6b5_200d_2640_fe0f", codepoints_to_code([128_693, 8205, 9792, 65_039], true)
-  end
-
-  def test_groups_js_es6_creation
-    assert File.exist?(EMOJI_GROUPS_PATH)
-    assert File.size?(EMOJI_GROUPS_PATH)
-  end
-
-  def test_db_json_creation
-    assert File.exist?(EMOJI_DB_PATH)
-    assert File.size?(EMOJI_DB_PATH)
-  end
-
-  def test_alias_creation
-    original_image = image_path("apple", "right_anger_bubble")
-    alias_image = image_path("apple", "anger_right")
-
-    assert_equal File.size(original_image), File.size(alias_image)
-  end
-
-  def test_cell_index_patch
-    original_image = image_path("apple", "snowboarder")
-    alias_image = image_path("twitter", "snowboarder")
-
-    assert_equal File.size(original_image), File.size(alias_image)
-  end
-
-  def test_scales
-    original_image = image_path("apple", "blonde_woman")
-    assert File.exist?(original_image)
-    assert File.size?(original_image)
-
-    (2..6).each do |scale|
-      image = image_path("apple", "blonde_woman/#{scale}")
-      assert File.exist?(image)
-      assert File.size?(image)
-    end
-  end
-
-  def test_default_set
-    original_image = image_path("twitter", "snowboarder")
-    alias_image = image_path("apple", "snowboarder")
-    assert_equal File.size(original_image), File.size(alias_image)
-
-    original_image = image_path("twitter", "macau")
-    alias_image = image_path("win10", "macau")
-    assert_equal File.size(original_image), File.size(alias_image)
-  end
-end

lib/tasks/javascript.rake

@@ -184,10 +184,9 @@ task "javascript:update_constants" => :environment do
   JS
 
   write_template("pretty-text/addon/emoji/data.js", task_name, <<~JS)
-    export const emojis = #{Emoji.standard.map(&:name).flatten.inspect};
+    export const emojis = new Set(#{Emoji.standard.map(&:name).flatten.inspect});
     export const tonableEmojis = #{Emoji.tonable_emojis.flatten.inspect};
     export const aliases = #{Emoji.aliases.inspect.gsub("=>", ":")};
-    export const searchAliases = #{Emoji.search_aliases.inspect.gsub("=>", ":")};
     export const translations = #{Emoji.translations.inspect.gsub("=>", ":")};
     export const replacements = #{Emoji.unicode_replacements_json};
   JS

plugins/chat/assets/javascripts/discourse/components/chat-composer.js

@@ -17,6 +17,7 @@ import EmojiPickerDetached from "discourse/components/emoji-picker/detached";
 import InsertHyperlink from "discourse/components/modal/insert-hyperlink";
 import { SKIP } from "discourse/lib/autocomplete";
 import { setupHashtagAutocomplete } from "discourse/lib/hashtag-autocomplete";
+import loadEmojiSearchAliases from "discourse/lib/load-emoji-search-aliases";
 import { cloneJSON } from "discourse/lib/object";
 import { findRawTemplate } from "discourse/lib/raw-templates";
 import { emojiUrlFor } from "discourse/lib/text";
@@ -622,13 +623,16 @@ export default class ChatComposer extends Component {
             }
           }
 
-          const options = emojiSearch(term, {
-            maxResults: 5,
-            diversity: this.emojiStore.diversity,
-            exclude: emojiDenied,
-          });
+          loadEmojiSearchAliases().then((searchAliases) => {
+            const options = emojiSearch(term, {
+              maxResults: 5,
+              diversity: this.emojiStore.diversity,
+              exclude: emojiDenied,
+              searchAliases,
+            });
 
-          return resolve(options);
+            resolve(options);
+          });
         })
           .then((list) => {
             if (list === SKIP) {

plugins/chat/spec/integration/post_chat_quote_spec.rb

@@ -129,9 +129,9 @@ describe "chat bbcode quoting in posts" do
       <div class="chat-transcript-messages">
       <p>This is a chat message.</p><div class="chat-transcript-reactions">
       <div class="chat-transcript-reaction">
-      <img width="20" height="20" src="/images/emoji/twitter/+1.png?v=12" title="+1" loading="lazy" alt="+1" class="emoji"> 1</div>
+      <img width="20" height="20" src="/images/emoji/twitter/+1.png?v=#{Emoji::EMOJI_VERSION}" title="+1" loading="lazy" alt="+1" class="emoji"> 1</div>
       <div class="chat-transcript-reaction">
-      <img width="20" height="20" src="/images/emoji/twitter/heart.png?v=12" title="heart" loading="lazy" alt="heart" class="emoji"> 2</div>
+      <img width="20" height="20" src="/images/emoji/twitter/heart.png?v=#{Emoji::EMOJI_VERSION}" title="heart" loading="lazy" alt="heart" class="emoji"> 2</div>
       </div>
       </div>
       </div>

plugins/chat/spec/models/chat/message_spec.rb

@@ -445,7 +445,7 @@ describe Chat::Message do
       cooked = described_class.cook(":grin:")
 
       expect(cooked).to eq(
-        "<p><img src=\"/images/emoji/twitter/grin.png?v=12\" title=\":grin:\" class=\"emoji only-emoji\" alt=\":grin:\" loading=\"lazy\" width=\"20\" height=\"20\"></p>",
+        "<p><img src=\"/images/emoji/twitter/grin.png?v=#{Emoji::EMOJI_VERSION}\" title=\":grin:\" class=\"emoji only-emoji\" alt=\":grin:\" loading=\"lazy\" width=\"20\" height=\"20\"></p>",
       )
     end
 
@@ -543,14 +543,14 @@ describe Chat::Message do
     it "supports inline emoji" do
       cooked = described_class.cook(":D")
       expect(cooked).to eq(<<~HTML.chomp)
-      <p><img src="/images/emoji/twitter/smiley.png?v=12" title=":smiley:" class="emoji only-emoji" alt=":smiley:" loading=\"lazy\" width=\"20\" height=\"20\"></p>
+      <p><img src="/images/emoji/twitter/smiley.png?v=#{Emoji::EMOJI_VERSION}" title=":smiley:" class="emoji only-emoji" alt=":smiley:" loading=\"lazy\" width=\"20\" height=\"20\"></p>
       HTML
     end
 
     it "supports emoji shortcuts" do
       cooked = described_class.cook("this is a replace test :P :|")
       expect(cooked).to eq(<<~HTML.chomp)
-        <p>this is a replace test <img src="/images/emoji/twitter/stuck_out_tongue.png?v=12" title=":stuck_out_tongue:" class="emoji" alt=":stuck_out_tongue:" loading=\"lazy\" width=\"20\" height=\"20\"> <img src="/images/emoji/twitter/expressionless.png?v=12" title=":expressionless:" class="emoji" alt=":expressionless:" loading=\"lazy\" width=\"20\" height=\"20\"></p>
+        <p>this is a replace test <img src="/images/emoji/twitter/stuck_out_tongue.png?v=#{Emoji::EMOJI_VERSION}" title=":stuck_out_tongue:" class="emoji" alt=":stuck_out_tongue:" loading=\"lazy\" width=\"20\" height=\"20\"> <img src="/images/emoji/twitter/expressionless.png?v=#{Emoji::EMOJI_VERSION}" title=":expressionless:" class="emoji" alt=":expressionless:" loading=\"lazy\" width=\"20\" height=\"20\"></p>
       HTML
     end
 

plugins/chat/spec/requests/chat_controller_spec.rb

@@ -274,7 +274,7 @@ RSpec.describe Chat::ChatController do
 
       put "/chat/#{chat_channel.id}/react/#{chat_message.id}.json",
           params: {
-            emoji: ":wave:",
+            emoji: ":waving_hand:",
             react_action: "add",
           }
       expect(response.status).to eq(403)

plugins/chat/spec/serializer/chat/channel_serializer_spec.rb

@@ -120,6 +120,6 @@ describe Chat::ChannelSerializer do
   it "has a unicode_title" do
     chat_channel.update!(name: ":cat: Cats")
 
-    expect(serializer.as_json[:unicode_title]).to eq("🐱 Cats")
+    expect(serializer.as_json[:unicode_title]).to eq("🐈 Cats")
   end
 end

plugins/chat/spec/system/chat_channel_spec.rb

@@ -185,7 +185,7 @@ RSpec.describe "Chat channel", type: :system do
     before do
       SiteSetting.enable_user_status = true
       current_user.set_status!("off to dentist", "tooth")
-      other_user.set_status!("surfing", "surfing_man")
+      other_user.set_status!("surfing", "man_surfing")
       channel_1.add(other_user)
     end
 
@@ -424,6 +424,6 @@ RSpec.describe "Chat channel", type: :system do
     channel_1.update!(name: ":dog: Dogs")
     chat_page.visit_channel(channel_1)
 
-    expect(page).to have_title("#🐶 Dogs - Chat - Discourse")
+    expect(page).to have_title("#🐕 Dogs - Chat - Discourse")
   end
 end

plugins/chat/spec/system/react_to_message_spec.rb

@@ -20,7 +20,7 @@ RSpec.describe "React to message", type: :system do
       Chat::MessageReactor.new(other_user, category_channel_1).react!(
         message_id: message_1.id,
         react_action: :add,
-        emoji: "female_detective",
+        emoji: "woman_detective",
       )
     end
 
@@ -53,7 +53,7 @@ RSpec.describe "React to message", type: :system do
       Chat::MessageReactor.new(other_user, category_channel_1).react!(
         message_id: message_1.id,
         react_action: :add,
-        emoji: "female_detective",
+        emoji: "woman_detective",
       )
     end
 
@@ -154,7 +154,7 @@ RSpec.describe "React to message", type: :system do
       Chat::MessageReactor.new(current_user, category_channel_1).react!(
         message_id: message_1.id,
         react_action: :add,
-        emoji: "female_detective",
+        emoji: "woman_detective",
       )
     end
 
@@ -162,7 +162,7 @@ RSpec.describe "React to message", type: :system do
       Chat::MessageReactor.new(other_user, category_channel_1).react!(
         message_id: message_1.id,
         react_action: :add,
-        emoji: "female_detective",
+        emoji: "woman_detective",
       )
     end
 
@@ -171,11 +171,11 @@ RSpec.describe "React to message", type: :system do
         sign_in(current_user)
         chat.visit_channel(category_channel_1)
 
-        expect(channel).to have_reaction(message_1, "female_detective", "2")
+        expect(channel).to have_reaction(message_1, "woman_detective", "2")
 
-        channel.click_reaction(message_1, "female_detective")
+        channel.click_reaction(message_1, "woman_detective")
 
-        expect(channel).to have_reaction(message_1, "female_detective", "1")
+        expect(channel).to have_reaction(message_1, "woman_detective", "1")
       end
     end
   end
@@ -185,7 +185,7 @@ RSpec.describe "React to message", type: :system do
       Chat::MessageReactor.new(current_user, category_channel_1).react!(
         message_id: message_1.id,
         react_action: :add,
-        emoji: "female_detective",
+        emoji: "woman_detective",
       )
     end