Freeze scroll position when a dropdown menu is open in the TL (#14271)

* Freeze scroll position when a dropdown menu is open in the TL

* Apply this to direct TL as well

* Fix case when mouse leaves the menu
This commit is contained in:
ThibG 2020-07-09 15:09:19 +02:00 committed by GitHub
parent 61c07c3731
commit 6fda3cbbeb
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
9 changed files with 49 additions and 17 deletions

View file

@ -36,6 +36,7 @@ class Conversation extends ImmutablePureComponent {
accounts: ImmutablePropTypes.list.isRequired,
lastStatus: ImmutablePropTypes.map,
unread:PropTypes.bool.isRequired,
scrollKey: PropTypes.string,
onMoveUp: PropTypes.func,
onMoveDown: PropTypes.func,
markRead: PropTypes.func.isRequired,
@ -127,7 +128,7 @@ class Conversation extends ImmutablePureComponent {
}
render () {
const { accounts, lastStatus, unread, intl } = this.props;
const { accounts, lastStatus, unread, scrollKey, intl } = this.props;
if (lastStatus === null) {
return null;
@ -194,7 +195,15 @@ class Conversation extends ImmutablePureComponent {
<IconButton className='status__action-bar-button' title={intl.formatMessage(messages.reply)} icon='reply' onClick={this.handleReply} />
<div className='status__action-bar-dropdown'>
<DropdownMenuContainer status={lastStatus} items={menu} icon='ellipsis-h' size={18} direction='right' title={intl.formatMessage(messages.more)} />
<DropdownMenuContainer
scrollKey={scrollKey}
status={lastStatus}
items={menu}
icon='ellipsis-h'
size={18}
direction='right'
title={intl.formatMessage(messages.more)}
/>
</div>
</div>
</div>