Set RECENT_CATEGORY, CUSTOM_CATEGORY and SEARCH_CATEGORY on Picker instances [Fix #166]

release
Etienne Lemay 2018-03-02 13:25:39 -05:00
parent 90ce594b11
commit fed9a89c78
No known key found for this signature in database
GPG Key ID: EE7CF89146BB28E9
1 changed files with 26 additions and 28 deletions

View File

@ -10,15 +10,6 @@ import { deepMerge, measureScrollbar } from '../utils'
import { Anchors, Category, Emoji, Preview, Search } from '.'
const RECENT_CATEGORY = { id: 'recent', name: 'Recent', emojis: null }
const SEARCH_CATEGORY = {
id: 'search',
name: 'Search',
emojis: null,
anchor: false,
}
const CUSTOM_CATEGORY = { id: 'custom', name: 'Custom', emojis: [] }
const I18N = {
search: 'Search',
notfound: 'No Emoji Found',
@ -41,6 +32,15 @@ export default class Picker extends React.PureComponent {
constructor(props) {
super(props)
this.RECENT_CATEGORY = { id: 'recent', name: 'Recent', emojis: null }
this.CUSTOM_CATEGORY = { id: 'custom', name: 'Custom', emojis: [] }
this.SEARCH_CATEGORY = {
id: 'search',
name: 'Search',
emojis: null,
anchor: false,
}
this.i18n = deepMerge(I18N, props.i18n)
this.state = {
skin: store.get('skin') || props.skin,
@ -51,7 +51,7 @@ export default class Picker extends React.PureComponent {
let allCategories = [].concat(data.categories)
if (props.custom.length > 0) {
CUSTOM_CATEGORY.emojis = props.custom.map(emoji => {
this.CUSTOM_CATEGORY.emojis = props.custom.map(emoji => {
return {
...emoji,
// `<Category />` expects emoji to have an `id`.
@ -60,9 +60,7 @@ export default class Picker extends React.PureComponent {
}
})
allCategories.push(CUSTOM_CATEGORY)
} else if (CUSTOM_CATEGORY.emojis.length > 0) {
CUSTOM_CATEGORY.emojis = [];
allCategories.push(this.CUSTOM_CATEGORY)
}
this.hideRecent = true
@ -122,22 +120,22 @@ export default class Picker extends React.PureComponent {
let includeRecent =
props.include && props.include.length
? props.include.indexOf(RECENT_CATEGORY.id) > -1
? props.include.indexOf(this.RECENT_CATEGORY.id) > -1
: true
let excludeRecent =
props.exclude && props.exclude.length
? props.exclude.indexOf(RECENT_CATEGORY.id) > -1
? props.exclude.indexOf(this.RECENT_CATEGORY.id) > -1
: false
if (includeRecent && !excludeRecent) {
this.hideRecent = false
this.categories.unshift(RECENT_CATEGORY)
this.categories.unshift(this.RECENT_CATEGORY)
}
if (this.categories[0]) {
this.categories[0].first = true
}
this.categories.unshift(SEARCH_CATEGORY)
this.categories.unshift(this.SEARCH_CATEGORY)
this.setAnchorsRef = this.setAnchorsRef.bind(this)
this.handleAnchorClick = this.handleAnchorClick.bind(this)
@ -174,7 +172,7 @@ export default class Picker extends React.PureComponent {
}
componentWillUnmount() {
SEARCH_CATEGORY.emojis = null
this.SEARCH_CATEGORY.emojis = null
clearTimeout(this.leaveTimeout)
clearTimeout(this.firstRenderTimeout)
@ -199,7 +197,7 @@ export default class Picker extends React.PureComponent {
}
// Use Array.prototype.find() when it is more widely supported.
const emojiData = CUSTOM_CATEGORY.emojis.filter(
const emojiData = this.CUSTOM_CATEGORY.emojis.filter(
customEmoji => customEmoji.id === emoji.id
)[0]
for (let key in emojiData) {
@ -240,7 +238,7 @@ export default class Picker extends React.PureComponent {
this.updateCategoriesSize()
this.handleScrollPaint()
if (SEARCH_CATEGORY.emojis) {
if (this.SEARCH_CATEGORY.emojis) {
component.updateDisplay('none')
}
})
@ -263,8 +261,8 @@ export default class Picker extends React.PureComponent {
let activeCategory = null
if (SEARCH_CATEGORY.emojis) {
activeCategory = SEARCH_CATEGORY
if (this.SEARCH_CATEGORY.emojis) {
activeCategory = this.SEARCH_CATEGORY
} else {
var target = this.scroll,
scrollTop = target.scrollTop,
@ -313,7 +311,7 @@ export default class Picker extends React.PureComponent {
}
handleSearch(emojis) {
SEARCH_CATEGORY.emojis = emojis
this.SEARCH_CATEGORY.emojis = emojis
for (let i = 0, l = this.categories.length; i < l; i++) {
let component = this.categoryRefs[`category-${i}`]
@ -348,7 +346,7 @@ export default class Picker extends React.PureComponent {
}
}
if (SEARCH_CATEGORY.emojis) {
if (this.SEARCH_CATEGORY.emojis) {
this.handleSearch(null)
this.search.clear()
@ -450,7 +448,7 @@ export default class Picker extends React.PureComponent {
emojisToShowFilter={emojisToShowFilter}
include={include}
exclude={exclude}
custom={CUSTOM_CATEGORY.emojis}
custom={this.CUSTOM_CATEGORY.emojis}
autoFocus={autoFocus}
/>
@ -471,10 +469,10 @@ export default class Picker extends React.PureComponent {
native={native}
hasStickyPosition={this.hasStickyPosition}
i18n={this.i18n}
recent={category.id == RECENT_CATEGORY.id ? recent : undefined}
recent={category.id == this.RECENT_CATEGORY.id ? recent : undefined}
custom={
category.id == RECENT_CATEGORY.id
? CUSTOM_CATEGORY.emojis
category.id == this.RECENT_CATEGORY.id
? this.CUSTOM_CATEGORY.emojis
: undefined
}
emojiProps={{