post/nas
1
0
Fork 0
forked from gitea/nas
Code Pull requests Activity

Merge branch 'kb_development' into kb_migration

Browse source
This commit is contained in:
KMY 2023-03-12 20:34:06 +09:00
commit 3fdf9e570a
2 changed files with 23 additions and 3 deletions
Download patch file Download diff file Expand all files Collapse all files

3
app/javascript/mastodon/components/status_action_bar.jsx
View file

@ -28,6 +28,7 @@ const messages = defineMessages({
cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' }, cancel_reblog_private: { id: 'status.cancel_reblog_private', defaultMessage: 'Unboost' },
cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' }, cannot_reblog: { id: 'status.cannot_reblog', defaultMessage: 'This post cannot be boosted' },
favourite: { id: 'status.favourite', defaultMessage: 'Favourite' }, favourite: { id: 'status.favourite', defaultMessage: 'Favourite' },
emojiReaction: { id: 'status.emoji_reaction', defaultMessage: 'Emoji Reaction' },
bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' }, bookmark: { id: 'status.bookmark', defaultMessage: 'Bookmark' },
removeBookmark: { id: 'status.remove_bookmark', defaultMessage: 'Remove bookmark' }, removeBookmark: { id: 'status.remove_bookmark', defaultMessage: 'Remove bookmark' },
open: { id: 'status.open', defaultMessage: 'Expand this status' }, open: { id: 'status.open', defaultMessage: 'Expand this status' },
@ -370,7 +371,7 @@ class StatusActionBar extends ImmutablePureComponent {
); );
const emojiPickerButton = ( const emojiPickerButton = (
<IconButton className='status__action-bar__button' icon='smile-o' /> <IconButton className='status__action-bar__button' title={intl.formatMessage(messages.emojiReaction)} icon='smile-o' />
); );
return ( return (

23
app/javascript/mastodon/features/compose/components/emoji_picker_dropdown.jsx
View file

@ -321,6 +321,7 @@ class EmojiPickerDropdown extends React.PureComponent {
state = { state = {
active: false, active: false,
loading: false, loading: false,
bottom: true,
}; };
setRef = (c) => { setRef = (c) => {
@ -328,6 +329,7 @@ class EmojiPickerDropdown extends React.PureComponent {
}; };
onShowDropdown = () => { onShowDropdown = () => {
this.updateDropdownPosition();
this.setState({ active: true }); this.setState({ active: true });
if (!EmojiPicker) { if (!EmojiPicker) {
@ -348,6 +350,23 @@ class EmojiPickerDropdown extends React.PureComponent {
this.setState({ active: false }); this.setState({ active: false });
}; };
updateDropdownPosition = () => {
let bottom = true;
if (this.target) {
const height = window.innerHeight;
const rect = this.target.getBoundingClientRect();
if (height && rect) {
bottom = height / 2 > rect.top;
}
}
if (this.state.bottom !== bottom) {
this.setState({ bottom });
}
};
onToggle = (e) => { onToggle = (e) => {
if (!this.state.loading && (!e.key || e.key === 'Enter')) { if (!this.state.loading && (!e.key || e.key === 'Enter')) {
if (this.state.active) { if (this.state.active) {
@ -375,7 +394,7 @@ class EmojiPickerDropdown extends React.PureComponent {
render () { render () {
const { intl, onPickEmoji, onSkinTone, skinTone, frequentlyUsedEmojis, button } = this.props; const { intl, onPickEmoji, onSkinTone, skinTone, frequentlyUsedEmojis, button } = this.props;
const title = intl.formatMessage(messages.emoji); const title = intl.formatMessage(messages.emoji);
const { active, loading } = this.state; const { active, loading, bottom } = this.state;
return ( return (
<div className='emoji-picker-dropdown' onKeyDown={this.handleKeyDown}> <div className='emoji-picker-dropdown' onKeyDown={this.handleKeyDown}>
@ -387,7 +406,7 @@ class EmojiPickerDropdown extends React.PureComponent {
/>} />}
</div> </div>
<Overlay show={active} placement={'bottom'} target={this.findTarget} popperConfig={{ strategy: 'fixed' }}> <Overlay show={active} placement={ bottom ? 'bottom' : 'top' } target={this.findTarget} popperConfig={{ strategy: 'fixed' }}>
{({ props, placement })=> ( {({ props, placement })=> (
<div {...props} style={{ ...props.style, width: 299 }}> <div {...props} style={{ ...props.style, width: 299 }}>
<div className={`dropdown-animation ${placement}`}> <div className={`dropdown-animation ${placement}`}>