Merge pull request #1154 from matrix-org/luke/fix-rte-emoji-suggestions

Order emojis by standard ordering, add alternate shortnames

package.json

@@ -33,8 +33,9 @@
   "scripts": {
     "reskindex": "node scripts/reskindex.js -h header",
     "reskindex:watch": "node scripts/reskindex.js -h header -w",
-    "build": "npm run reskindex && babel src -d lib --source-maps",
-    "build:watch": "babel src -w -d lib --source-maps",
+    "build": "npm run reskindex && babel src -d lib --source-maps --copy-files",
+    "build:watch": "babel src -w -d lib --source-maps --copy-files",
+    "emoji-data-strip": "node scripts/emoji-data-strip.js",
     "start": "parallelshell \"npm run build:watch\" \"npm run reskindex:watch\"",
     "lint": "eslint src/",
     "lintall": "eslint src/ test/",

scripts/emoji-data-strip.js

@@ -0,0 +1,19 @@
+#!/usr/bin/env node
+const EMOJI_DATA = require('emojione/emoji.json');
+const fs = require('fs');
+
+const output = Object.keys(EMOJI_DATA).map(
+    (key) => {
+        const datum = EMOJI_DATA[key];
+        return {
+            name: datum.name,
+            shortname: datum.shortname,
+            category: datum.category,
+            emoji_order: datum.emoji_order,
+        };
+    },
+);
+
+// Write to a file in src. Changes should be checked into git. This file is copied by
+// babel using --copy-files
+fs.writeFileSync('./src/stripped-emoji.json', JSON.stringify(output));

src/autocomplete/EmojiProvider.js

@@ -24,10 +24,34 @@ import sdk from '../index';
 import {PillCompletion} from './Components';
 import type {SelectionRange, Completion} from './Autocompleter';
 
+import EmojiData from '../stripped-emoji.json';
+
+const LIMIT = 20;
+const CATEGORY_ORDER = [
+    'people',
+    'food',
+    'objects',
+    'activity',
+    'nature',
+    'travel',
+    'flags',
+    'symbols',
+    'unicode9',
+    'modifier',
+];
+
 const EMOJI_REGEX = /:\w*:?/g;
-const EMOJI_SHORTNAMES = Object.keys(emojioneList).map(shortname => {
+const EMOJI_SHORTNAMES = Object.keys(EmojiData).map((key) => EmojiData[key]).sort(
+    (a, b) => {
+        if (a.category === b.category) {
+            return a.emoji_order - b.emoji_order;
+        }
+        return CATEGORY_ORDER.indexOf(a.category) - CATEGORY_ORDER.indexOf(b.category);
+    },
+).map((a) => {
     return {
-        shortname,
+        name: a.name,
+        shortname: a.shortname,
     };
 });
 
@@ -37,7 +61,7 @@ export default class EmojiProvider extends AutocompleteProvider {
     constructor() {
         super(EMOJI_REGEX);
         this.matcher = new FuzzyMatcher(EMOJI_SHORTNAMES, {
-            keys: 'shortname',
+            keys: ['shortname', 'name'],
         });
     }
 
@@ -57,7 +81,7 @@ export default class EmojiProvider extends AutocompleteProvider {
                     ),
                     range,
                 };
-            }).slice(0, 8);
+            }).slice(0, LIMIT);
         }
         return completions;
     }