mirror of https://github.com/mastodon/mastodon.git
pull/7325/head
parent
a5293fdf61
commit
ad5d3134e4
|
@ -162,12 +162,12 @@ class EmojiPickerMenu extends React.PureComponent {
|
|||
static defaultProps = {
|
||||
style: {},
|
||||
loading: true,
|
||||
placement: 'bottom',
|
||||
frequentlyUsedEmojis: [],
|
||||
};
|
||||
|
||||
state = {
|
||||
modifierOpen: false,
|
||||
placement: null,
|
||||
};
|
||||
|
||||
handleDocumentClick = e => {
|
||||
|
@ -298,7 +298,7 @@ export default class EmojiPickerDropdown extends React.PureComponent {
|
|||
this.dropdown = c;
|
||||
}
|
||||
|
||||
onShowDropdown = () => {
|
||||
onShowDropdown = ({ target }) => {
|
||||
this.setState({ active: true });
|
||||
|
||||
if (!EmojiPicker) {
|
||||
|
@ -313,6 +313,9 @@ export default class EmojiPickerDropdown extends React.PureComponent {
|
|||
this.setState({ loading: false });
|
||||
});
|
||||
}
|
||||
|
||||
const { top } = target.getBoundingClientRect();
|
||||
this.setState({ placement: top * 2 < innerHeight ? 'bottom' : 'top' });
|
||||
}
|
||||
|
||||
onHideDropdown = () => {
|
||||
|
@ -324,7 +327,7 @@ export default class EmojiPickerDropdown extends React.PureComponent {
|
|||
if (this.state.active) {
|
||||
this.onHideDropdown();
|
||||
} else {
|
||||
this.onShowDropdown();
|
||||
this.onShowDropdown(e);
|
||||
}
|
||||
}
|
||||
}
|
||||
|
@ -346,7 +349,7 @@ export default class EmojiPickerDropdown extends React.PureComponent {
|
|||
render () {
|
||||
const { intl, onPickEmoji, onSkinTone, skinTone, frequentlyUsedEmojis } = this.props;
|
||||
const title = intl.formatMessage(messages.emoji);
|
||||
const { active, loading } = this.state;
|
||||
const { active, loading, placement } = this.state;
|
||||
|
||||
return (
|
||||
<div className='emoji-picker-dropdown' onKeyDown={this.handleKeyDown}>
|
||||
|
@ -358,7 +361,7 @@ export default class EmojiPickerDropdown extends React.PureComponent {
|
|||
/>
|
||||
</div>
|
||||
|
||||
<Overlay show={active} placement='bottom' target={this.findTarget}>
|
||||
<Overlay show={active} placement={placement} target={this.findTarget}>
|
||||
<EmojiPickerMenu
|
||||
custom_emojis={this.props.custom_emojis}
|
||||
loading={loading}
|
||||
|
|
Loading…
Reference in New Issue