refs #564 Suggest native emoji in New Toot modal

package-lock.json

@@ -5309,6 +5309,11 @@
         "minimalistic-crypto-utils": "1.0.1"
       }
     },
+    "emojilib": {
+      "version": "2.3.0",
+      "resolved": "https://registry.npmjs.org/emojilib/-/emojilib-2.3.0.tgz",
+      "integrity": "sha512-gDrDiITC7W5lvXTtUmk0k9soizsjfY9Wqr2GWsEMX7+cKChoxLt3RnT8zW32BvN1SFDQbi7+D5/+HNu/R+qvKA=="
+    },
     "emojis-list": {
       "version": "2.1.0",
       "resolved": "https://registry.npmjs.org/emojis-list/-/emojis-list-2.1.0.tgz",

package.json

@@ -103,6 +103,7 @@
     "electron-log": "^2.2.14",
     "electron-window-state": "^4.1.1",
     "element-ui": "^2.3.4",
+    "emojilib": "^2.3.0",
     "hawk": "^7.0.7",
     "hoek": "^5.0.3",
     "i18next": "^11.5.0",

src/renderer/components/TimelineSpace/Modals/NewToot/Status.vue

@@ -26,6 +26,9 @@
         <span v-if="item.image">
           <img :src="item.image" class="icon" />
         </span>
+        <span v-if="item.code">
+          {{ item.code }}
+        </span>
         {{ item.name }}
       </li>
     </ul>
@@ -35,6 +38,7 @@
 
 <script>
 import { mapState } from 'vuex'
+import emojilib from 'emojilib'
 import suggestText from '../../../../utils/suggestText'
 
 export default {
@@ -60,7 +64,7 @@ export default {
   computed: {
     ...mapState({
       filteredAccounts: state => state.TimelineSpace.Modals.NewToot.Status.filteredAccounts,
-      emojis: state => state.TimelineSpace.emojis
+      customEmojis: state => state.TimelineSpace.emojis
     }),
     status: {
       get: function () {
@@ -131,7 +135,18 @@ export default {
         this.closeSuggest()
         return false
       }
-      const filtered = this.emojis.filter(emoji => emoji.name.includes(word))
+      // Find native emojis
+      const filteredEmojiName = emojilib.ordered.filter(emoji => `:${emoji}`.includes(word))
+      const filteredNativeEmoji = filteredEmojiName.map((name) => {
+        return {
+          name: `:${name}:`,
+          code: emojilib.lib[name].char
+        }
+      })
+      // Find custom emojis
+      const filteredCustomEmoji = this.customEmojis.filter(emoji => emoji.name.includes(word))
+      const filtered = filteredNativeEmoji.concat(filteredCustomEmoji)
+      console.log(filtered)
       if (filtered.length > 0) {
         this.openSuggest = true
         this.startIndex = start
@@ -160,8 +175,13 @@ export default {
       }
     },
     insertItem (item) {
-      const str = `${this.status.slice(0, this.startIndex - 1)}${item.name} ${this.status.slice(this.startIndex + this.matchWord.length)}`
-      this.status = str
+      if (item.code) {
+        const str = `${this.status.slice(0, this.startIndex - 1)}${item.code} ${this.status.slice(this.startIndex + this.matchWord.length)}`
+        this.status = str
+      } else {
+        const str = `${this.status.slice(0, this.startIndex - 1)}${item.name} ${this.status.slice(this.startIndex + this.matchWord.length)}`
+        this.status = str
+      }
       this.closeSuggest()
     },
     selectCurrentItem () {