Fix headless search with custom emojis [Fix #118]

src/data/index.js

@@ -21,8 +21,6 @@ function uncompress (list) {
       keywords: datum.keywords,
       emoticons: datum.emoticons
     })
-
-    datum.search = datum.search.join(',')
   }
 }
 

src/utils/build-search.js

@@ -22,5 +22,5 @@ module.exports = data => {
   addToSearch(data.keywords, false)
   addToSearch(data.emoticons, false)
 
-  return search
+  return search.join(',')
 }

src/utils/emoji-index.js

@@ -1,11 +1,10 @@
 import data from '../data'
 import { getData, getSanitizedData, uniq } from '.'
 
+var originalPool = {}
 var index = {}
 var emojisList = {}
 var emoticonsList = {}
-var previousInclude = []
-var previousExclude = []
 
 for (let emoji in data.emojis) {
   let emojiData = data.emojis[emoji],
@@ -23,27 +22,29 @@ for (let emoji in data.emojis) {
   }
 
   emojisList[id] = getSanitizedData(id)
+  originalPool[id] = emojiData
+}
+
+function addCustomToPool(custom, pool) {
+  custom.forEach((emoji) => {
+    let emojiId = emoji.id || emoji.short_names[0]
+
+    if (emojiId && !pool[emojiId]) {
+      pool[emojiId] = getData(emoji)
+      emojisList[emojiId] = getSanitizedData(emoji)
+    }
+  })
 }
 
 function search(value, { emojisToShowFilter, maxResults, include, exclude, custom = [] } = {}) {
+  addCustomToPool(custom, originalPool)
+
   maxResults || (maxResults = 75)
   include || (include = [])
   exclude || (exclude = [])
 
-  custom.forEach(emoji => {
-    data.emojis[emoji.id] = getData(emoji)
-    emojisList[emoji.id] = getSanitizedData(emoji)
-  })
-
-  if (custom.length) {
-    data.categories.push({
-      name: 'Custom',
-      emojis: custom.map(emoji => emoji.id)
-    })
-  }
-
   var results = null,
-      pool = data.emojis
+      pool = originalPool
 
   if (value.length) {
     if (value == '-' || value == '-1') {
@@ -60,12 +61,6 @@ function search(value, { emojisToShowFilter, maxResults, include, exclude, custo
     if (include.length || exclude.length) {
       pool = {}
 
-      if (previousInclude != include.sort().join(',') || previousExclude != exclude.sort().join(',')) {
-        previousInclude = include.sort().join(',')
-        previousExclude = exclude.sort().join(',')
-        index = {}
-      }
-
       data.categories.forEach(category => {
         let isIncluded = include && include.length ? include.indexOf(category.name.toLowerCase()) > -1 : true
         let isExcluded = exclude && exclude.length ? exclude.indexOf(category.name.toLowerCase()) > -1 : false
@@ -75,8 +70,14 @@ function search(value, { emojisToShowFilter, maxResults, include, exclude, custo
 
         category.emojis.forEach(emojiId => pool[emojiId] = data.emojis[emojiId])
       })
-    } else if (previousInclude.length || previousExclude.length) {
-      index = {}
+
+      if (custom.length) {
+        let customIsIncluded = include && include.length ? include.indexOf('custom') > -1 : true
+        let customIsExcluded = exclude && exclude.length ? exclude.indexOf('custom') > -1 : false
+        if (customIsIncluded && !customIsExcluded) {
+          addCustomToPool(custom, pool)
+        }
+      }
     }
 
     allResults = values.map((value) => {

src/utils/index.js

@@ -73,17 +73,6 @@ function getData(emoji, skin, set) {
     if (data.emojis.hasOwnProperty(emoji)) {
       emojiData = data.emojis[emoji]
     }
-  } else if (emoji.custom) {
-    emojiData = emoji
-
-    emojiData.search = buildSearch({
-      short_names: emoji.short_names,
-      name: emoji.name,
-      keywords: emoji.keywords,
-      emoticons: emoji.emoticons
-    })
-
-    emojiData.search = emojiData.search.join(',')
   } else if (emoji.id) {
     if (data.short_names.hasOwnProperty(emoji.id)) {
       emoji.id = data.short_names[emoji.id]
@@ -95,6 +84,15 @@ function getData(emoji, skin, set) {
     }
   }
 
+  if (!Object.keys(emojiData).length) {
+    emojiData = emoji
+    emojiData.custom = true
+
+    if (!emojiData.search) {
+      emojiData.search = buildSearch(emoji)
+    }
+  }
+
   emojiData.emoticons || (emojiData.emoticons = [])
   emojiData.variations || (emojiData.variations = [])
 

stories/index.js

@@ -55,10 +55,15 @@ storiesOf('Emoji', module)
 
 storiesOf('Headless Search', module)
   .addDecorator(withKnobs)
-  .add('default', () => (
-    <div>
-      {emojiIndex.search(text('Search', 'christmas')).map((o) => {
-        return <span key={o.id} style={{ fontSize: '2em', marginLeft: '.2em' }}>{o.native}</span>
+  .add('default', () => {
+    let results = emojiIndex.search(text('Search', 'christmas'), { custom: CUSTOM_EMOJIS })
+    if (!results) { return null }
+
+    return <div>
+      {results.map((emoji) => {
+        return <span key={emoji.id} style={{ marginLeft: '1.4em' }}>
+          <Emoji native={true} emoji={emoji} size={48} />
+        </span>
       })}
     </div>
-  ));
+  });