Update to emojimart 2.6.1 (#7746)

* Update to emojimart 2.6.1
WIP using local updated version. Sheet comes from emoji-data@4.0.4,
file sheet_twitter_32_indexed_256.png.

* Update to 2.6.1 and uncompress data if needed

* Remove changes that were not needed

* Fix yarn lock file

* Match emojiToShowFilter behavior to new version of emoji-mart

* Fix codeclimate issue

* Match custom emoji behavior to new version of emoji-mart

* Replace emoji without shortcode in tests

* Fix code climate issues

app/javascript/mastodon/features/emoji/__tests__/emoji-test.js

@@ -51,7 +51,7 @@ describe('emoji', () => {
     });
 
     it('does an emoji that has no shortcode', () => {
-      expect(emojify('🕉️')).toEqual('<img draggable="false" class="emojione" alt="🕉️" title="" src="/emoji/1f549.svg" />');
+      expect(emojify('👁‍🗨')).toEqual('<img draggable="false" class="emojione" alt="👁‍🗨" title="" src="/emoji/1f441-200d-1f5e8.svg" />');
     });
 
     it('does an emoji whose filename is irregular', () => {

app/javascript/mastodon/features/emoji/__tests__/emoji_index-test.js

@@ -44,6 +44,26 @@ describe('emoji_index', () => {
     expect(emojiIndex.search('apple').map(trimEmojis)).toEqual(expected);
   });
 
+  it('erases custom emoji if not passed again', () => {
+    const custom = [
+      {
+        id: 'mastodon',
+        name: 'mastodon',
+        short_names: ['mastodon'],
+        text: '',
+        emoticons: [],
+        keywords: ['mastodon'],
+        imageUrl: 'http://example.com',
+        custom: true,
+      },
+    ];
+    search('', { custom });
+    emojiIndex.search('', { custom });
+    const expected = [];
+    expect(search('masto').map(trimEmojis)).toEqual(expected);
+    expect(emojiIndex.search('masto').map(trimEmojis)).toEqual(expected);
+  });
+
   it('handles custom emoji', () => {
     const custom = [
       {
@@ -65,12 +85,12 @@ describe('emoji_index', () => {
         custom: true,
       },
     ];
-    expect(search('masto').map(trimEmojis)).toEqual(expected);
-    expect(emojiIndex.search('masto').map(trimEmojis)).toEqual(expected);
+    expect(search('masto', { custom }).map(trimEmojis)).toEqual(expected);
+    expect(emojiIndex.search('masto', { custom }).map(trimEmojis)).toEqual(expected);
   });
 
   it('should filter only emojis we care about, exclude pineapple', () => {
-    const emojisToShowFilter = unified => unified !== '1F34D';
+    const emojisToShowFilter = emoji => emoji.unified !== '1F34D';
     expect(search('apple', { emojisToShowFilter }).map((obj) => obj.id))
       .not.toContain('pineapple');
     expect(emojiIndex.search('apple', { emojisToShowFilter }).map((obj) => obj.id))

app/javascript/mastodon/features/emoji/emoji_compressed.js

@@ -9,7 +9,13 @@ const { unicodeToFilename } = require('./unicode_to_filename');
 const { unicodeToUnifiedName } = require('./unicode_to_unified_name');
 const emojiMap         = require('./emoji_map.json');
 const { emojiIndex } = require('emoji-mart');
-const { default: emojiMartData } = require('emoji-mart/dist/data');
+const { uncompress: emojiMartUncompress } = require('emoji-mart/dist/utils/data');
+let data = require('emoji-mart/data/all.json');
+
+if(data.compressed) {
+  data = emojiMartUncompress(data);
+}
+const emojiMartData = data;
 
 const excluded       = ['®', '©', '™'];
 const skins          = ['🏻', '🏼', '🏽', '🏾', '🏿'];
@@ -88,6 +94,6 @@ module.exports = JSON.parse(JSON.stringify([
   shortCodesToEmojiData,
   emojiMartData.skins,
   emojiMartData.categories,
-  emojiMartData.short_names,
+  emojiMartData.aliases,
   emojisWithoutShortCodes,
 ]));

app/javascript/mastodon/features/emoji/emoji_mart_search_light.js

@@ -8,6 +8,7 @@ let originalPool = {};
 let index = {};
 let emojisList = {};
 let emoticonsList = {};
+let customEmojisList = [];
 
 for (let emoji in data.emojis) {
   let emojiData = data.emojis[emoji];
@@ -28,7 +29,18 @@ for (let emoji in data.emojis) {
   originalPool[id] = emojiData;
 }
 
+function clearCustomEmojis(pool) {
+  customEmojisList.forEach((emoji) => {
+    let emojiId = emoji.id || emoji.short_names[0];
+
+    delete pool[emojiId];
+    delete emojisList[emojiId];
+  });
+}
+
 function addCustomToPool(custom, pool) {
+  if (customEmojisList.length) clearCustomEmojis(pool);
+
   custom.forEach((emoji) => {
     let emojiId = emoji.id || emoji.short_names[0];
 
@@ -37,10 +49,14 @@ function addCustomToPool(custom, pool) {
       emojisList[emojiId] = getSanitizedData(emoji);
     }
   });
+
+  customEmojisList = custom;
+  index = {};
 }
 
 function search(value, { emojisToShowFilter, maxResults, include, exclude, custom = [] } = {}) {
-  addCustomToPool(custom, originalPool);
+  if (customEmojisList !== custom)
+    addCustomToPool(custom, originalPool);
 
   maxResults = maxResults || 75;
   include = include || [];
@@ -143,7 +159,7 @@ function search(value, { emojisToShowFilter, maxResults, include, exclude, custo
 
   if (results) {
     if (emojisToShowFilter) {
-      results = results.filter((result) => emojisToShowFilter(data.emojis[result.id].unified));
+      results = results.filter((result) => emojisToShowFilter(data.emojis[result.id]));
     }
 
     if (results && results.length > maxResults) {

app/javascript/mastodon/features/emoji/emoji_picker.js

@@ -1,5 +1,5 @@
-import Picker from 'emoji-mart/dist-es/components/picker';
-import Emoji from 'emoji-mart/dist-es/components/emoji';
+import Picker from 'emoji-mart/dist-es/components/picker/picker';
+import Emoji from 'emoji-mart/dist-es/components/emoji/emoji';
 
 export {
   Picker,

yarn.lock

@@ -2304,8 +2304,8 @@ elliptic@^6.0.0:
     minimalistic-crypto-utils "^1.0.0"
 
 emoji-mart@Gargron/emoji-mart#build:
-  version "2.1.4"
-  resolved "https://codeload.github.com/Gargron/emoji-mart/tar.gz/a5e1afe5ebcf2841e611d20d261b029581cbe051"
+  version "2.6.1"
+  resolved "https://codeload.github.com/Gargron/emoji-mart/tar.gz/227c56c8a1cd89a475d4cf8d9605096555e12484"
 
 emoji-regex@^6.1.0:
   version "6.5.1"