Add reaction deck
This commit is contained in:
parent
db5c358f4f
commit
f1625fe101
24 changed files with 404 additions and 13 deletions
|
@ -11,6 +11,7 @@ const messages = defineMessages({
|
|||
edit_profile: { id: 'account.edit_profile', defaultMessage: 'Edit profile' },
|
||||
pins: { id: 'navigation_bar.pins', defaultMessage: 'Pinned posts' },
|
||||
preferences: { id: 'navigation_bar.preferences', defaultMessage: 'Preferences' },
|
||||
reaction_deck: { id: 'navigation_bar.reaction_deck', defaultMessage: 'Reaction deck' },
|
||||
follow_requests: { id: 'navigation_bar.follow_requests', defaultMessage: 'Follow requests' },
|
||||
favourites: { id: 'navigation_bar.favourites', defaultMessage: 'Favourites' },
|
||||
emoji_reactions: { id: 'navigation_bar.emoji_reactions', defaultMessage: 'Stamps' },
|
||||
|
@ -44,6 +45,7 @@ class ActionBar extends PureComponent {
|
|||
|
||||
menu.push({ text: intl.formatMessage(messages.edit_profile), href: '/settings/profile' });
|
||||
menu.push({ text: intl.formatMessage(messages.preferences), href: '/settings/preferences' });
|
||||
menu.push({ text: intl.formatMessage(messages.reaction_deck), to: '/reaction_deck' });
|
||||
menu.push({ text: intl.formatMessage(messages.pins), to: '/pinned' });
|
||||
menu.push(null);
|
||||
menu.push({ text: intl.formatMessage(messages.follow_requests), to: '/follow_requests' });
|
||||
|
|
|
@ -1,11 +1,16 @@
|
|||
import { Map as ImmutableMap } from 'immutable';
|
||||
import { Map as ImmutableMap, List as ImmutableList } from 'immutable';
|
||||
import { connect } from 'react-redux';
|
||||
import { createSelector } from 'reselect';
|
||||
|
||||
import { hideRecentEmojis } from 'mastodon/initial_state';
|
||||
|
||||
import { useEmoji } from '../../../actions/emojis';
|
||||
import { changeSetting } from '../../../actions/settings';
|
||||
import { shortCodes } from '../../emoji/emoji_mart_data_light';
|
||||
import EmojiPickerDropdown from '../components/emoji_picker_dropdown';
|
||||
|
||||
|
||||
|
||||
const perLine = 8;
|
||||
const lines = 2;
|
||||
|
||||
|
@ -28,21 +33,43 @@ const DEFAULTS = [
|
|||
'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();
|
||||
const RECENT_SIZE = DEFAULTS.length;
|
||||
const DECK_SIZE = 16;
|
||||
|
||||
if (emojis.length < DEFAULTS.length) {
|
||||
let uniqueDefaults = DEFAULTS.filter(emoji => !emojis.includes(emoji));
|
||||
emojis = emojis.concat(uniqueDefaults.slice(0, DEFAULTS.length - emojis.length));
|
||||
const getFrequentlyUsedEmojis = createSelector([
|
||||
state => { return {
|
||||
emojiCounters: state.getIn(['settings', 'frequentlyUsedEmojis'], ImmutableMap()),
|
||||
reactionDeck: state.get('reaction_deck', ImmutableList()),
|
||||
}; },
|
||||
], data => {
|
||||
const { emojiCounters, reactionDeck } = data;
|
||||
let deckEmojis = reactionDeck
|
||||
.toArray()
|
||||
.map((e) => e.get('emoji'))
|
||||
.filter((e) => e)
|
||||
.map((e) => shortCodes[e] || e);
|
||||
deckEmojis = [...new Set(deckEmojis)];
|
||||
|
||||
let emojis;
|
||||
if (!hideRecentEmojis) {
|
||||
emojis = emojiCounters
|
||||
.keySeq()
|
||||
.filter((ee) => deckEmojis.indexOf(ee) < 0)
|
||||
.sort((a, b) => emojiCounters.get(a) - emojiCounters.get(b))
|
||||
.reverse()
|
||||
.slice(0, perLine * lines)
|
||||
.toArray();
|
||||
|
||||
if (emojis.length < RECENT_SIZE) {
|
||||
let uniqueDefaults = DEFAULTS.filter(emoji => !emojis.includes(emoji));
|
||||
emojis = emojis.concat(uniqueDefaults.slice(0, RECENT_SIZE - emojis.length));
|
||||
}
|
||||
} else {
|
||||
emojis = [];
|
||||
}
|
||||
|
||||
emojis = deckEmojis.slice(0, DECK_SIZE).concat(emojis);
|
||||
|
||||
return emojis;
|
||||
});
|
||||
|
||||
|
|
Loading…
Add table
Add a link
Reference in a new issue