diff --git a/webapp/components/rhs_comment.jsx b/webapp/components/rhs_comment.jsx
index c7b005845e..416c0fe4bd 100644
--- a/webapp/components/rhs_comment.jsx
+++ b/webapp/components/rhs_comment.jsx
@@ -6,6 +6,7 @@ import FileAttachmentListContainer from './file_attachment_list_container.jsx';
import PendingPostOptions from 'components/post_view/components/pending_post_options.jsx';
import PostMessageContainer from 'components/post_view/components/post_message_container.jsx';
import ProfilePicture from 'components/profile_picture.jsx';
+import RhsDropdown from 'components/rhs_dropdown.jsx';
import TeamStore from 'stores/team_store.jsx';
import UserStore from 'stores/user_store.jsx';
@@ -218,24 +219,8 @@ export default class RhsComment extends React.Component {
}
return (
-
- );
+
+ );
}
render() {
diff --git a/webapp/components/rhs_dropdown.jsx b/webapp/components/rhs_dropdown.jsx
new file mode 100644
index 0000000000..c42e8c8e59
--- /dev/null
+++ b/webapp/components/rhs_dropdown.jsx
@@ -0,0 +1,61 @@
+// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import * as Agent from 'utils/user_agent.jsx';
+import RhsDropdownMenu from 'components/rhs_dropdown_menu.jsx';
+
+import {Dropdown} from 'react-bootstrap';
+import React from 'react';
+
+export default class RhsDropdown extends React.Component {
+ constructor(props) {
+ super(props);
+
+ this.toggleDropdown = this.toggleDropdown.bind(this);
+
+ this.state = {
+ showDropdown: false
+ };
+ }
+
+ toggleDropdown(e) {
+ if (e) {
+ e.preventDefault();
+ }
+
+ const showDropdown = !this.state.showDropdown;
+ if (Agent.isMobile() || Agent.isMobileApp()) {
+ const scroll = document.querySelector('.scrollbar--view');
+ if (showDropdown) {
+ scroll.style.overflow = 'hidden';
+ } else {
+ scroll.style.overflow = 'scroll';
+ }
+ }
+
+ this.setState({showDropdown});
+ }
+
+ render() {
+ return (
+
+
+
+ {this.props.dropdownContents}
+
+
+ );
+ }
+}
+
+RhsDropdown.propTypes = {
+ dropdownContents: React.PropTypes.array.isRequired
+};
diff --git a/webapp/components/rhs_dropdown_menu.jsx b/webapp/components/rhs_dropdown_menu.jsx
new file mode 100644
index 0000000000..6efaa9deaa
--- /dev/null
+++ b/webapp/components/rhs_dropdown_menu.jsx
@@ -0,0 +1,22 @@
+// Copyright (c) 2016 Mattermost, Inc. All Rights Reserved.
+// See License.txt for license information.
+
+import {Dropdown} from 'react-bootstrap';
+import React from 'react';
+
+export default class RhsDropdownMenu extends Dropdown.Menu {
+ constructor(props) { //eslint-disable-line no-useless-constructor
+ super(props);
+ }
+
+ render() {
+ return (
+
+ {super.render()}
+
+ );
+ }
+}
diff --git a/webapp/components/rhs_root_post.jsx b/webapp/components/rhs_root_post.jsx
index aa663bda79..0dae5976fa 100644
--- a/webapp/components/rhs_root_post.jsx
+++ b/webapp/components/rhs_root_post.jsx
@@ -6,6 +6,7 @@ import PostBodyAdditionalContent from 'components/post_view/components/post_body
import PostMessageContainer from 'components/post_view/components/post_message_container.jsx';
import FileAttachmentListContainer from './file_attachment_list_container.jsx';
import ProfilePicture from 'components/profile_picture.jsx';
+import RhsDropdown from 'components/rhs_dropdown.jsx';
import ChannelStore from 'stores/channel_store.jsx';
import UserStore from 'stores/user_store.jsx';
@@ -228,23 +229,7 @@ export default class RhsRootPost extends React.Component {
var rootOptions = '';
if (dropdownContents.length > 0) {
rootOptions = (
-
+
);
}