From d237edc268c4ad4f2c7f7f66b1d2063ec22e74b7 Mon Sep 17 00:00:00 2001
From: Jakob Krigovsky <jakob@krigovsky.com>
Date: Fri, 26 May 2017 09:48:26 +0200
Subject: [PATCH] Add support for custom emojis to <Picker />

---
 src/components/picker.js | 25 +++++++++++++++++++++++++
 1 file changed, 25 insertions(+)

diff --git a/src/components/picker.js b/src/components/picker.js
index df50e89..84c008b 100644
--- a/src/components/picker.js
+++ b/src/components/picker.js
@@ -12,6 +12,7 @@ import { Anchors, Category, Emoji, Preview, Search } from '.'
 
 const RECENT_CATEGORY = { name: 'Recent', emojis: null }
 const SEARCH_CATEGORY = { name: 'Search', emojis: null, anchor: false }
+const CUSTOM_CATEGORY = { name: 'Custom', emojis: null }
 
 const I18N = {
   search: 'Search',
@@ -27,6 +28,7 @@ const I18N = {
     objects: 'Objects',
     symbols: 'Symbols',
     flags: 'Flags',
+    custom: 'Custom',
   },
 }
 
@@ -95,6 +97,21 @@ export default class Picker extends React.Component {
     }
 
     this.categories.unshift(SEARCH_CATEGORY)
+
+    if (props.custom.length > 0) {
+      CUSTOM_CATEGORY.emojis = props.custom
+
+      CUSTOM_CATEGORY.emojis = CUSTOM_CATEGORY.emojis.map(emoji => {
+        return {
+          ...emoji,
+          // `<Category />` expects emoji to have an `id`.
+          id: emoji.short_names[0],
+          custom: true
+        }
+      })
+
+      this.categories.push(CUSTOM_CATEGORY)
+    }
   }
 
   componentWillReceiveProps(props) {
@@ -386,6 +403,13 @@ Picker.propTypes = {
   include: PropTypes.arrayOf(PropTypes.string),
   exclude: PropTypes.arrayOf(PropTypes.string),
   autoFocus: PropTypes.bool,
+  custom: PropTypes.arrayOf(PropTypes.shape({
+    name: PropTypes.string.isRequired,
+    short_names: PropTypes.arrayOf(PropTypes.string).isRequired,
+    emoticons: PropTypes.arrayOf(PropTypes.string),
+    keywords: PropTypes.arrayOf(PropTypes.string),
+    imageUrl: PropTypes.string.isRequired,
+  })),
 }
 
 Picker.defaultProps = {
@@ -404,4 +428,5 @@ Picker.defaultProps = {
   backgroundImageFn: Emoji.defaultProps.backgroundImageFn,
   emojisToShowFilter: null,
   autoFocus: false,
+  custom: [],
 }