2017-09-23 03:40:28 +00:00
|
|
|
import { connect } from 'react-redux';
|
|
|
|
import EmojiPickerDropdown from '../components/emoji_picker_dropdown';
|
2017-10-07 17:02:30 +00:00
|
|
|
import { changeSetting } from '../../../actions/settings';
|
2017-10-08 19:47:15 +00:00
|
|
|
import { createSelector } from 'reselect';
|
|
|
|
import { Map as ImmutableMap } from 'immutable';
|
|
|
|
import { useEmoji } from '../../../actions/emojis';
|
|
|
|
|
|
|
|
const perLine = 8;
|
|
|
|
const lines = 2;
|
|
|
|
|
|
|
|
const getFrequentlyUsedEmojis = createSelector([
|
|
|
|
state => state.getIn(['settings', 'frequentlyUsedEmojis'], ImmutableMap()),
|
|
|
|
], emojiCounters => emojiCounters
|
|
|
|
.keySeq()
|
|
|
|
.sort((a, b) => emojiCounters.get(a) - emojiCounters.get(b))
|
|
|
|
.reverse()
|
|
|
|
.slice(0, perLine * lines)
|
|
|
|
.toArray()
|
|
|
|
);
|
2017-09-23 03:40:28 +00:00
|
|
|
|
2017-10-10 13:18:12 +00:00
|
|
|
const getCustomEmojis = createSelector([
|
|
|
|
state => state.get('custom_emojis'),
|
|
|
|
], emojis => emojis.sort((a, b) => {
|
|
|
|
const aShort = a.get('shortcode').toLowerCase();
|
|
|
|
const bShort = b.get('shortcode').toLowerCase();
|
|
|
|
|
|
|
|
if (aShort < bShort) {
|
|
|
|
return -1;
|
|
|
|
} else if (aShort > bShort ) {
|
|
|
|
return 1;
|
|
|
|
} else {
|
|
|
|
return 0;
|
|
|
|
}
|
|
|
|
}));
|
|
|
|
|
2017-09-23 03:40:28 +00:00
|
|
|
const mapStateToProps = state => ({
|
2017-10-10 13:18:12 +00:00
|
|
|
custom_emojis: getCustomEmojis(state),
|
2017-10-07 00:38:52 +00:00
|
|
|
autoPlay: state.getIn(['meta', 'auto_play_gif']),
|
2017-10-07 17:02:30 +00:00
|
|
|
skinTone: state.getIn(['settings', 'skinTone']),
|
2017-10-08 19:47:15 +00:00
|
|
|
frequentlyUsedEmojis: getFrequentlyUsedEmojis(state),
|
2017-09-23 03:40:28 +00:00
|
|
|
});
|
|
|
|
|
2017-10-08 19:47:15 +00:00
|
|
|
const mapDispatchToProps = (dispatch, { onPickEmoji }) => ({
|
2017-10-07 17:02:30 +00:00
|
|
|
onSkinTone: skinTone => {
|
|
|
|
dispatch(changeSetting(['skinTone'], skinTone));
|
|
|
|
},
|
2017-10-08 19:47:15 +00:00
|
|
|
|
|
|
|
onPickEmoji: emoji => {
|
|
|
|
dispatch(useEmoji(emoji));
|
|
|
|
|
|
|
|
if (onPickEmoji) {
|
|
|
|
onPickEmoji(emoji);
|
|
|
|
}
|
|
|
|
},
|
2017-10-07 17:02:30 +00:00
|
|
|
});
|
|
|
|
|
|
|
|
export default connect(mapStateToProps, mapDispatchToProps)(EmojiPickerDropdown);
|