summaryrefslogtreecommitdiffstats
path: root/webapp/components
diff options
context:
space:
mode:
Diffstat (limited to 'webapp/components')
-rw-r--r--webapp/components/needs_team/needs_team.jsx2
-rw-r--r--webapp/components/sidebar_header_dropdown.jsx28
-rw-r--r--webapp/components/sidebar_right_menu.jsx8
-rw-r--r--webapp/components/user_settings/user_settings_modal.jsx37
4 files changed, 38 insertions, 37 deletions
diff --git a/webapp/components/needs_team/needs_team.jsx b/webapp/components/needs_team/needs_team.jsx
index 6fd2d3208..e86e4fb11 100644
--- a/webapp/components/needs_team/needs_team.jsx
+++ b/webapp/components/needs_team/needs_team.jsx
@@ -33,6 +33,7 @@ import store from 'stores/redux_store.jsx';
import {getPost} from 'mattermost-redux/selectors/entities/posts';
// Modals
+import UserSettingsModal from 'components/user_settings/user_settings_modal.jsx';
import GetPostLinkModal from 'components/get_post_link_modal.jsx';
import GetPublicLinkModal from 'components/get_public_link_modal.jsx';
import GetTeamInviteLinkModal from 'components/get_team_invite_link_modal.jsx';
@@ -218,6 +219,7 @@ export default class NeedsTeam extends React.Component {
<WebrtcSidebar/>
{content}
+ <UserSettingsModal/>
<GetPostLinkModal/>
<GetPublicLinkModal/>
<GetTeamInviteLinkModal/>
diff --git a/webapp/components/sidebar_header_dropdown.jsx b/webapp/components/sidebar_header_dropdown.jsx
index 5a7784733..54f8c3a2d 100644
--- a/webapp/components/sidebar_header_dropdown.jsx
+++ b/webapp/components/sidebar_header_dropdown.jsx
@@ -13,7 +13,6 @@ import WebrtcStore from 'stores/webrtc_store.jsx';
import AboutBuildModal from './about_build_modal.jsx';
import SidebarHeaderDropdownButton from './sidebar_header_dropdown_button.jsx';
import TeamMembersModal from './team_members_modal.jsx';
-import UserSettingsModal from './user_settings/user_settings_modal.jsx';
import AddUsersToTeam from 'components/add_users_to_team';
import {Constants, WebrtcActionTypes} from 'utils/constants.jsx';
@@ -45,7 +44,7 @@ export default class SidebarHeaderDropdown extends React.Component {
this.handleAboutModal = this.handleAboutModal.bind(this);
this.aboutModalDismissed = this.aboutModalDismissed.bind(this);
- this.toggleAccountSettingsModal = this.toggleAccountSettingsModal.bind(this);
+ this.showAccountSettingsModal = this.showAccountSettingsModal.bind(this);
this.showAddUsersToTeamModal = this.showAddUsersToTeamModal.bind(this);
this.hideAddUsersToTeamModal = this.hideAddUsersToTeamModal.bind(this);
this.showInviteMemberModal = this.showInviteMemberModal.bind(this);
@@ -54,7 +53,6 @@ export default class SidebarHeaderDropdown extends React.Component {
this.hideTeamMembersModal = this.hideTeamMembersModal.bind(this);
this.onTeamChange = this.onTeamChange.bind(this);
- this.openAccountSettings = this.openAccountSettings.bind(this);
this.renderCustomEmojiLink = this.renderCustomEmojiLink.bind(this);
@@ -66,7 +64,6 @@ export default class SidebarHeaderDropdown extends React.Component {
showAboutModal: false,
showDropdown: false,
showTeamMembersModal: false,
- showUserSettingsModal: false,
showAddUsersToTeamModal: false
};
}
@@ -104,13 +101,12 @@ export default class SidebarHeaderDropdown extends React.Component {
this.setState({showAboutModal: false});
}
- toggleAccountSettingsModal(e) {
+ showAccountSettingsModal(e) {
e.preventDefault();
- this.setState({
- showUserSettingsModal: !this.state.showUserSettingsModal,
- showDropdown: false
- });
+ this.setState({showDropdown: false});
+
+ GlobalActions.showAccountSettingsModal();
}
showAddUsersToTeamModal(e) {
@@ -160,7 +156,6 @@ export default class SidebarHeaderDropdown extends React.Component {
componentDidMount() {
TeamStore.addChangeListener(this.onTeamChange);
- document.addEventListener('keydown', this.openAccountSettings);
}
onTeamChange() {
@@ -174,13 +169,6 @@ export default class SidebarHeaderDropdown extends React.Component {
componentWillUnmount() {
$(ReactDOM.findDOMNode(this.refs.dropdown)).off('hide.bs.dropdown');
TeamStore.removeChangeListener(this.onTeamChange);
- document.removeEventListener('keydown', this.openAccountSettings);
- }
-
- openAccountSettings(e) {
- if (Utils.cmdOrCtrlPressed(e) && e.shiftKey && e.keyCode === Constants.KeyCodes.A) {
- this.toggleAccountSettingsModal(e);
- }
}
renderCustomEmojiLink() {
@@ -527,7 +515,7 @@ export default class SidebarHeaderDropdown extends React.Component {
<a
id='accountSettings'
href='#'
- onClick={this.toggleAccountSettingsModal}
+ onClick={this.showAccountSettingsModal}
>
<FormattedMessage
id='navbar_dropdown.accountSettings'
@@ -634,10 +622,6 @@ export default class SidebarHeaderDropdown extends React.Component {
{about}
{logoutDivider}
{logout}
- <UserSettingsModal
- show={this.state.showUserSettingsModal}
- onModalDismissed={() => this.setState({showUserSettingsModal: false})}
- />
{teamMembersModal}
<AboutBuildModal
show={this.state.showAboutModal}
diff --git a/webapp/components/sidebar_right_menu.jsx b/webapp/components/sidebar_right_menu.jsx
index 6045da5ed..d40e90279 100644
--- a/webapp/components/sidebar_right_menu.jsx
+++ b/webapp/components/sidebar_right_menu.jsx
@@ -4,7 +4,6 @@
import AppDispatcher from 'dispatcher/app_dispatcher.jsx';
import TeamMembersModal from './team_members_modal.jsx';
import ToggleModalButton from './toggle_modal_button.jsx';
-import UserSettingsModal from './user_settings/user_settings_modal.jsx';
import AboutBuildModal from './about_build_modal.jsx';
import AddUsersToTeam from 'components/add_users_to_team';
@@ -46,7 +45,6 @@ export default class SidebarRightMenu extends React.Component {
this.getFlagged = this.getFlagged.bind(this);
const state = this.getStateFromStores();
- state.showUserSettingsModal = false;
state.showAboutModal = false;
state.showAddUsersToTeamModal = false;
@@ -503,7 +501,7 @@ export default class SidebarRightMenu extends React.Component {
<li>
<a
href='#'
- onClick={() => this.setState({showUserSettingsModal: true})}
+ onClick={() => GlobalActions.showAccountSettingsModal()}
>
<i className='icon fa fa-cog'/>
<FormattedMessage
@@ -555,10 +553,6 @@ export default class SidebarRightMenu extends React.Component {
</li>
</ul>
</div>
- <UserSettingsModal
- show={this.state.showUserSettingsModal}
- onModalDismissed={() => this.setState({showUserSettingsModal: false})}
- />
<AboutBuildModal
show={this.state.showAboutModal}
onModalDismissed={this.aboutModalDismissed}
diff --git a/webapp/components/user_settings/user_settings_modal.jsx b/webapp/components/user_settings/user_settings_modal.jsx
index eee41ac10..bbb4d37f4 100644
--- a/webapp/components/user_settings/user_settings_modal.jsx
+++ b/webapp/components/user_settings/user_settings_modal.jsx
@@ -7,8 +7,10 @@ import ConfirmModal from '../confirm_modal.jsx';
import UserSettings from './user_settings.jsx';
import SettingsSidebar from '../settings_sidebar.jsx';
+import ModalStore from 'stores/modal_store.jsx';
import UserStore from 'stores/user_store.jsx';
import * as Utils from 'utils/utils.jsx';
+import Constants from 'utils/constants.jsx';
import {Modal} from 'react-bootstrap';
@@ -49,8 +51,6 @@ const holders = defineMessages({
}
});
-import PropTypes from 'prop-types';
-
import React from 'react';
class UserSettingsModal extends React.Component {
@@ -62,6 +62,8 @@ class UserSettingsModal extends React.Component {
this.handleCollapse = this.handleCollapse.bind(this);
this.handleConfirm = this.handleConfirm.bind(this);
this.handleCancelConfirmation = this.handleCancelConfirmation.bind(this);
+ this.handleToggle = this.handleToggle.bind(this);
+ this.handleKeyDown = this.handleKeyDown.bind(this);
this.closeModal = this.closeModal.bind(this);
this.collapseModal = this.collapseModal.bind(this);
@@ -75,7 +77,8 @@ class UserSettingsModal extends React.Component {
active_section: '',
showConfirmModal: false,
enforceFocus: true,
- currentUser: UserStore.getCurrentUser()
+ currentUser: UserStore.getCurrentUser(),
+ show: false
};
this.requireConfirm = false;
@@ -91,10 +94,14 @@ class UserSettingsModal extends React.Component {
componentDidMount() {
this.mounted = true;
UserStore.addChangeListener(this.onUserChanged);
+ ModalStore.addModalListener(Constants.ActionTypes.TOGGLE_ACCOUNT_SETTINGS_MODAL, this.handleToggle);
+ document.addEventListener('keydown', this.handleKeyDown);
}
componentWillUnmount() {
this.mounted = false;
+ ModalStore.removeModalListener(Constants.ActionTypes.TOGGLE_ACCOUNT_SETTINGS_MODAL, this.handleToggle);
+ document.removeEventListener('keydown', this.handleKeyDown);
}
componentDidUpdate() {
@@ -104,6 +111,20 @@ class UserSettingsModal extends React.Component {
}
}
+ handleKeyDown(e) {
+ if (Utils.cmdOrCtrlPressed(e) && e.shiftKey && e.keyCode === Constants.KeyCodes.A) {
+ this.setState({
+ show: true
+ });
+ }
+ }
+
+ handleToggle(value) {
+ this.setState({
+ show: value
+ });
+ }
+
// Called when the close button is pressed on the main modal
handleHide() {
if (this.requireConfirm) {
@@ -113,7 +134,9 @@ class UserSettingsModal extends React.Component {
return;
}
- this.props.onModalDismissed();
+ this.setState({
+ show: false
+ });
}
// called after the dialog is fully hidden and faded out
@@ -225,7 +248,7 @@ class UserSettingsModal extends React.Component {
return (
<Modal
dialogClassName='settings-modal'
- show={this.props.show}
+ show={this.state.show}
onHide={this.handleHide}
onExited={this.handleHidden}
enforceFocus={this.state.enforceFocus}
@@ -280,9 +303,7 @@ class UserSettingsModal extends React.Component {
}
UserSettingsModal.propTypes = {
- intl: intlShape.isRequired,
- show: PropTypes.bool.isRequired,
- onModalDismissed: PropTypes.func.isRequired
+ intl: intlShape.isRequired
};
export default injectIntl(UserSettingsModal);