|
|
|
@ -48,6 +48,7 @@ const messages = defineMessages({
|
|
|
|
|
reactionOpenMouth: { id: 'status.reactions.open_mouth', defaultMessage: 'Wow' },
|
|
|
|
|
reactionCry: { id: 'status.reactions.cry', defaultMessage: 'Sad' },
|
|
|
|
|
reactionWeary: { id: 'status.reactions.weary', defaultMessage: 'Weary' },
|
|
|
|
|
emojiPickerExpand: { id: 'status.reactions_expand', defaultMessage: 'Select emoji' },
|
|
|
|
|
});
|
|
|
|
|
|
|
|
|
|
const mapStateToProps = state => {
|
|
|
|
@ -99,6 +100,9 @@ class ActionBar extends React.PureComponent {
|
|
|
|
|
isStaff: PropTypes.bool.isRequired,
|
|
|
|
|
isAdmin: PropTypes.bool.isRequired,
|
|
|
|
|
allowedEmoji: ImmutablePropTypes.list,
|
|
|
|
|
emojiSelectorFocused: PropTypes.bool,
|
|
|
|
|
handleEmojiSelectorExpand: PropTypes.func.isRequired,
|
|
|
|
|
handleEmojiSelectorUnfocus: PropTypes.func.isRequired,
|
|
|
|
|
};
|
|
|
|
|
|
|
|
|
|
static defaultProps = {
|
|
|
|
@ -107,6 +111,7 @@ class ActionBar extends React.PureComponent {
|
|
|
|
|
|
|
|
|
|
state = {
|
|
|
|
|
emojiSelectorVisible: false,
|
|
|
|
|
emojiSelectorFocused: false,
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
handleReplyClick = () => {
|
|
|
|
@ -169,10 +174,16 @@ class ActionBar extends React.PureComponent {
|
|
|
|
|
} else {
|
|
|
|
|
this.props.onOpenUnauthorizedModal();
|
|
|
|
|
}
|
|
|
|
|
this.setState({ emojiSelectorVisible: false });
|
|
|
|
|
this.setState({ emojiSelectorVisible: false, emojiSelectorFocused: false });
|
|
|
|
|
};
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
handleHotkeyEmoji = () => {
|
|
|
|
|
const { emojiSelectorVisible } = this.state;
|
|
|
|
|
|
|
|
|
|
this.setState({ emojiSelectorVisible: !emojiSelectorVisible });
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
handleDeleteClick = () => {
|
|
|
|
|
this.props.onDelete(this.props.status, this.context.router.history);
|
|
|
|
|
}
|
|
|
|
@ -262,12 +273,12 @@ class ActionBar extends React.PureComponent {
|
|
|
|
|
componentDidMount() {
|
|
|
|
|
document.addEventListener('click', e => {
|
|
|
|
|
if (this.node && !this.node.contains(e.target))
|
|
|
|
|
this.setState({ emojiSelectorVisible: false });
|
|
|
|
|
this.setState({ emojiSelectorVisible: false, emojiSelectorFocused: false });
|
|
|
|
|
});
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
render() {
|
|
|
|
|
const { status, intl, me, isStaff, isAdmin, allowedEmoji } = this.props;
|
|
|
|
|
const { status, intl, me, isStaff, isAdmin, allowedEmoji, emojiSelectorFocused, handleEmojiSelectorExpand, handleEmojiSelectorUnfocus } = this.props;
|
|
|
|
|
const { emojiSelectorVisible } = this.state;
|
|
|
|
|
const ownAccount = status.getIn(['account', 'id']) === me;
|
|
|
|
|
|
|
|
|
@ -351,6 +362,7 @@ class ActionBar extends React.PureComponent {
|
|
|
|
|
|
|
|
|
|
let reblog_disabled = (status.get('visibility') === 'direct' || status.get('visibility') === 'private');
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
return (
|
|
|
|
|
<div className='detailed-status__action-bar'>
|
|
|
|
|
<div className='detailed-status__button'>
|
|
|
|
@ -377,7 +389,12 @@ class ActionBar extends React.PureComponent {
|
|
|
|
|
onMouseLeave={this.handleLikeButtonLeave}
|
|
|
|
|
ref={this.setRef}
|
|
|
|
|
>
|
|
|
|
|
<EmojiSelector onReact={this.handleReactClick} visible={emojiSelectorVisible} />
|
|
|
|
|
<EmojiSelector
|
|
|
|
|
onReact={this.handleReactClick}
|
|
|
|
|
visible={emojiSelectorVisible}
|
|
|
|
|
focused={emojiSelectorFocused}
|
|
|
|
|
onUnfocus={handleEmojiSelectorUnfocus}
|
|
|
|
|
/>
|
|
|
|
|
<IconButton
|
|
|
|
|
className='star-icon'
|
|
|
|
|
animate
|
|
|
|
@ -388,6 +405,14 @@ class ActionBar extends React.PureComponent {
|
|
|
|
|
text={meEmojiTitle}
|
|
|
|
|
onClick={this.handleLikeButtonClick}
|
|
|
|
|
/>
|
|
|
|
|
<IconButton
|
|
|
|
|
className='emoji-picker-expand'
|
|
|
|
|
animate
|
|
|
|
|
title={intl.formatMessage(messages.emojiPickerExpand)}
|
|
|
|
|
icon='caret-down'
|
|
|
|
|
onKeyUp={handleEmojiSelectorExpand}
|
|
|
|
|
onHover
|
|
|
|
|
/>
|
|
|
|
|
</div>
|
|
|
|
|
{shareButton}
|
|
|
|
|
|
|
|
|
@ -400,4 +425,5 @@ class ActionBar extends React.PureComponent {
|
|
|
|
|
|
|
|
|
|
}
|
|
|
|
|
|
|
|
|
|
export default injectIntl(connect(mapStateToProps, mapDispatchToProps)(ActionBar));
|
|
|
|
|
export default injectIntl(
|
|
|
|
|
connect(mapStateToProps, mapDispatchToProps)(ActionBar));
|
|
|
|
|