Move flavours/glitch/features/emoji_picker back to flavours/glitch/features/compose/containers/emoji_picker_dropdown_container
parent
b728b25c10
commit
e1db6cf320
4 changed files with 90 additions and 88 deletions
@ -0,0 +1,82 @@ |
||||
import { connect } from 'react-redux'; |
||||
import EmojiPickerDropdown from '../components/emoji_picker_dropdown'; |
||||
import { changeSetting } from 'flavours/glitch/actions/settings'; |
||||
import { createSelector } from 'reselect'; |
||||
import { Map as ImmutableMap } from 'immutable'; |
||||
import { useEmoji } from 'flavours/glitch/actions/emojis'; |
||||
|
||||
const perLine = 8; |
||||
const lines = 2; |
||||
|
||||
const DEFAULTS = [ |
||||
'+1', |
||||
'grinning', |
||||
'kissing_heart', |
||||
'heart_eyes', |
||||
'laughing', |
||||
'stuck_out_tongue_winking_eye', |
||||
'sweat_smile', |
||||
'joy', |
||||
'yum', |
||||
'disappointed', |
||||
'thinking_face', |
||||
'weary', |
||||
'sob', |
||||
'sunglasses', |
||||
'heart', |
||||
'ok_hand', |
||||
]; |
||||
|
||||
const getFrequentlyUsedEmojis = createSelector([ |
||||
state => state.getIn(['settings', 'frequentlyUsedEmojis'], ImmutableMap()), |
||||
], emojiCounters => { |
||||
let emojis = emojiCounters |
||||
.keySeq() |
||||
.sort((a, b) => emojiCounters.get(a) - emojiCounters.get(b)) |
||||
.reverse() |
||||
.slice(0, perLine * lines) |
||||
.toArray(); |
||||
|
||||
if (emojis.length < DEFAULTS.length) { |
||||
emojis = emojis.concat(DEFAULTS.slice(0, DEFAULTS.length - emojis.length)); |
||||
} |
||||
|
||||
return emojis; |
||||
}); |
||||
|
||||
const getCustomEmojis = createSelector([ |
||||
state => state.get('custom_emojis'), |
||||
], emojis => emojis.filter(e => e.get('visible_in_picker')).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; |
||||
} |
||||
})); |
||||
|
||||
const mapStateToProps = state => ({ |
||||
custom_emojis: getCustomEmojis(state), |
||||
skinTone: state.getIn(['settings', 'skinTone']), |
||||
frequentlyUsedEmojis: getFrequentlyUsedEmojis(state), |
||||
}); |
||||
|
||||
const mapDispatchToProps = (dispatch, { onPickEmoji }) => ({ |
||||
onSkinTone: skinTone => { |
||||
dispatch(changeSetting(['skinTone'], skinTone)); |
||||
}, |
||||
|
||||
onPickEmoji: emoji => { |
||||
dispatch(useEmoji(emoji)); |
||||
|
||||
if (onPickEmoji) { |
||||
onPickEmoji(emoji); |
||||
} |
||||
}, |
||||
}); |
||||
|
||||
export default connect(mapStateToProps, mapDispatchToProps)(EmojiPickerDropdown); |
Loading…
Reference in new issue