Skip to content

Commit

Permalink
Set RECENT_CATEGORY, CUSTOM_CATEGORY and SEARCH_CATEGORY on Picker in…
Browse files Browse the repository at this point in the history 
…stances [Fix #166]
  • Loading branch information
@EtienneLem
EtienneLem committed Mar 2, 2018
1 parent 90ce594 commit fed9a89
Showing 1 changed file with 26 additions and 28 deletions.
54 changes: 26 additions & 28 deletions src/components/picker.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -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',
Expand All @@ -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,
Expand All @@ -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`.
Expand All @@ -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
Expand Down Expand Up @@ -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)
Expand Down Expand Up @@ -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)
Expand All @@ -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) {
Expand Down Expand Up @@ -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')
}
})
Expand All @@ -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,
Expand Down Expand Up @@ -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}`]
Expand Down Expand Up @@ -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()

Expand Down Expand Up @@ -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}
/>

Expand All @@ -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={{
Expand Down

0 comments on commit fed9a89

Please sign in to comment.