Commit 940ba9c7 authored by Kacper Kula's avatar Kacper Kula Committed by Joram Wilander

[PLT-6394] [...] menu no longer hides when not hovered. (#6353)

* [PLT-6394] [...] menu no longer hides when not hovered.

* Fixed dropdown visibility to use same method as main window.
parent f62e5991
......@@ -46,6 +46,7 @@ export default class RhsComment extends React.Component {
this.unpinPost = this.unpinPost.bind(this);
this.reactEmojiClick = this.reactEmojiClick.bind(this);
this.emojiPickerClick = this.emojiPickerClick.bind(this);
this.handleDropdownOpened = this.handleDropdownOpened.bind(this);
this.canEdit = false;
this.canDelete = false;
......@@ -56,7 +57,8 @@ export default class RhsComment extends React.Component {
width: '',
height: '',
showReactEmojiPicker: false,
reactPickerOffset: 15
reactPickerOffset: 15,
dropdownOpened: false
};
}
......@@ -135,6 +137,10 @@ export default class RhsComment extends React.Component {
return true;
}
if (this.state.dropdownOpened !== nextState.dropdownOpened) {
return true;
}
return false;
}
......@@ -318,7 +324,10 @@ export default class RhsComment extends React.Component {
}
return (
<RhsDropdown dropdownContents={dropdownContents}/>
<RhsDropdown
dropdownContents={dropdownContents}
handleDropdownOpened={this.handleDropdownOpened}
/>
);
}
......@@ -386,9 +395,19 @@ export default class RhsComment extends React.Component {
className += ' post--pinned';
}
if (this.state.dropdownOpened) {
className += ' post--hovered';
}
return className;
}
handleDropdownOpened(isOpened) {
this.setState({
dropdownOpened: isOpened
});
}
render() {
const post = this.props.post;
const mattermostLogo = Constants.MATTERMOST_ICON_SVG;
......
......@@ -13,7 +13,8 @@ import * as Agent from 'utils/user_agent.jsx';
export default class RhsDropdown extends Component {
static propTypes = {
dropdownContents: PropTypes.array.isRequired
dropdownContents: PropTypes.array.isRequired,
handleDropdownOpened: PropTypes.func
}
constructor(props) {
......@@ -26,6 +27,9 @@ export default class RhsDropdown extends Component {
toggleDropdown = () => {
const showDropdown = !this.state.showDropdown;
if (this.props.handleDropdownOpened) {
this.props.handleDropdownOpened(showDropdown);
}
if (Agent.isMobile() || Agent.isMobileApp()) {
const scroll = document.querySelector('.scrollbar--view');
if (showDropdown) {
......@@ -56,4 +60,3 @@ export default class RhsDropdown extends Component {
);
}
}
......@@ -45,6 +45,7 @@ export default class RhsRootPost extends React.Component {
this.unpinPost = this.unpinPost.bind(this);
this.reactEmojiClick = this.reactEmojiClick.bind(this);
this.emojiPickerClick = this.emojiPickerClick.bind(this);
this.handleDropdownOpened = this.handleDropdownOpened.bind(this);
this.canEdit = false;
this.canDelete = false;
......@@ -55,7 +56,8 @@ export default class RhsRootPost extends React.Component {
width: '',
height: '',
showRHSEmojiPicker: false,
testStateObj: true
testStateObj: true,
dropdownOpened: false
};
}
......@@ -121,6 +123,10 @@ export default class RhsRootPost extends React.Component {
return true;
}
if (this.state.dropdownOpened !== nextState.dropdownOpened) {
return true;
}
return false;
}
......@@ -197,9 +203,19 @@ export default class RhsRootPost extends React.Component {
className += ' post--pinned';
}
if (this.state.dropdownOpened) {
className += ' post--hovered';
}
return className;
}
handleDropdownOpened(isOpened) {
this.setState({
dropdownOpened: isOpened
});
}
render() {
const post = this.props.post;
const user = this.props.user;
......@@ -413,7 +429,10 @@ export default class RhsRootPost extends React.Component {
var rootOptions = '';
if (dropdownContents.length > 0) {
rootOptions = (
<RhsDropdown dropdownContents={dropdownContents}/>
<RhsDropdown
dropdownContents={dropdownContents}
handleDropdownOpened={this.handleDropdownOpened}
/>
);
}
......
Markdown is supported
0% or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment