From 6e7b912ec61a6a791e0e8405ff6f6bd7e622a187 Mon Sep 17 00:00:00 2001 From: Joram Wilander Date: Tue, 6 Jun 2017 17:24:08 -0400 Subject: PLT-4257 Add pop-up asking if user wants to reset status (#6526) * Add pop-up asking if user wants to reset status * Update test snapshot * Update prop name for old uses of confirm modal * Updating checkbox (#6586) * Updating style for checkbox (#6596) --- .../reset_status_modal/reset_status_modal.jsx | 142 +++++++++++++++++++++ 1 file changed, 142 insertions(+) create mode 100644 webapp/components/reset_status_modal/reset_status_modal.jsx (limited to 'webapp/components/reset_status_modal/reset_status_modal.jsx') diff --git a/webapp/components/reset_status_modal/reset_status_modal.jsx b/webapp/components/reset_status_modal/reset_status_modal.jsx new file mode 100644 index 000000000..4a04d7561 --- /dev/null +++ b/webapp/components/reset_status_modal/reset_status_modal.jsx @@ -0,0 +1,142 @@ +// Copyright (c) 2017-present Mattermost, Inc. All Rights Reserved. +// See License.txt for license information. + +import ConfirmModal from 'components/confirm_modal.jsx'; + +import {toTitleCase} from 'utils/utils.jsx'; + +import React from 'react'; +import PropTypes from 'prop-types'; +import {FormattedMessage} from 'react-intl'; +import {Preferences} from 'mattermost-redux/constants'; + +export default class ResetStatusModal extends React.PureComponent { + static propTypes = { + + /* + * The user's preference for whether their status is automatically reset + */ + autoResetPref: PropTypes.string, + actions: PropTypes.shape({ + + /* + * Function to get and then reset the user's status if needed + */ + autoResetStatus: PropTypes.func.isRequired, + + /* + * Function to set the status for a user + */ + setStatus: PropTypes.func.isRequired, + + /* + * Function to save user preferences + */ + savePreferences: PropTypes.func.isRequired + }).isRequired + } + + constructor(props) { + super(props); + + this.state = { + show: false, + currentUserStatus: {} + }; + } + + componentDidMount() { + this.props.actions.autoResetStatus().then( + (status) => { + const statusIsManual = status.manual; + const autoResetPrefNotSet = this.props.autoResetPref === ''; + + this.setState({ + currentUserStatus: status, // Set in state until status refactor where we store 'manual' field in redux + show: Boolean(statusIsManual && autoResetPrefNotSet) + }); + } + ); + } + + onConfirm = (checked) => { + this.setState({show: false}); + + const newStatus = {...this.state.currentUserStatus}; + newStatus.status = 'online'; + this.props.actions.setStatus(newStatus); + + if (checked) { + const pref = {category: Preferences.CATEGORY_AUTO_RESET_MANUAL_STATUS, user_id: newStatus.user_id, name: newStatus.user_id, value: 'true'}; + this.props.actions.savePreferences(pref.user_id, [pref]); + } + } + + onCancel = (checked) => { + this.setState({show: false}); + + if (checked) { + const status = {...this.state.currentUserStatus}; + const pref = {category: Preferences.CATEGORY_AUTO_RESET_MANUAL_STATUS, user_id: status.user_id, name: status.user_id, value: 'false'}; + this.props.actions.savePreferences(pref.user_id, [pref]); + } + } + + render() { + const userStatus = toTitleCase(this.state.currentUserStatus.status || ''); + const manualStatusTitle = ( + + ); + + const manualStatusMessage = ( + + ); + + const manualStatusButton = ( + + ); + + const manualStatusCancel = ( + + ); + + const manualStatusCheckbox = ( + + ); + + return ( + + ); + } +} -- cgit v1.2.3-1-g7c22