Unfloyded/Legamunt
0
0
Fork 0
Code Activity

Track frequently used emojis in web UI (#5275)

Browse source 
* Track frequently used emojis in web UI

* Persist emoji usage, but debounce commits to the settings API

* Fix #5144 - Add tooltips to picker

* Display only 2 lines of frequently used emojis
This commit is contained in:
Eugen Rochko 2017-10-08 21:47:15 +02:00 • committed by GitHub
parent 0717d9b3e6
commit 488584bfc1
8 changed files with 90 additions and 17 deletions
Download patch file Download diff file Expand all files Collapse all files

10
app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.js
View file

@ -146,6 +146,7 @@ class EmojiPickerMenu extends React.PureComponent {
static propTypes = {
custom_emojis: ImmutablePropTypes.list,
frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),
loading: PropTypes.bool,
onClose: PropTypes.func.isRequired,
onPick: PropTypes.func.isRequired,
@ -163,6 +164,7 @@ class EmojiPickerMenu extends React.PureComponent {
style: {},
loading: true,
placement: 'bottom',
frequentlyUsedEmojis: [],
};
state = {
@ -233,7 +235,7 @@ class EmojiPickerMenu extends React.PureComponent {
}
render () {
const { loading, style, intl, custom_emojis, autoPlay, skinTone } = this.props;
const { loading, style, intl, custom_emojis, autoPlay, skinTone, frequentlyUsedEmojis } = this.props;
if (loading) {
return <div style={{ width: 299 }} />;
@ -256,9 +258,11 @@ class EmojiPickerMenu extends React.PureComponent {
i18n={this.getI18n()}
onClick={this.handleClick}
include={categoriesSort}
recent={frequentlyUsedEmojis}
skin={skinTone}
showPreview={false}
backgroundImageFn={backgroundImageFn}
emojiTooltip
/>
<ModifierPicker
@ -279,6 +283,7 @@ export default class EmojiPickerDropdown extends React.PureComponent {
static propTypes = {
custom_emojis: ImmutablePropTypes.list,
frequentlyUsedEmojis: PropTypes.arrayOf(PropTypes.string),
autoPlay: PropTypes.bool,
intl: PropTypes.object.isRequired,
onPickEmoji: PropTypes.func.isRequired,
@ -341,7 +346,7 @@ export default class EmojiPickerDropdown extends React.PureComponent {
}
render () {
const { intl, onPickEmoji, autoPlay, onSkinTone, skinTone } = this.props;
const { intl, onPickEmoji, autoPlay, onSkinTone, skinTone, frequentlyUsedEmojis } = this.props;
const title = intl.formatMessage(messages.emoji);
const { active, loading } = this.state;
@ -364,6 +369,7 @@ export default class EmojiPickerDropdown extends React.PureComponent {
autoPlay={autoPlay}
onSkinTone={onSkinTone}
skinTone={skinTone}
frequentlyUsedEmojis={frequentlyUsedEmojis}
/>
</Overlay>
</div>