From daed8ffbf6151f01866b9299574fdf6764c8b7bd Mon Sep 17 00:00:00 2001 From: Saturnino Abril Date: Tue, 5 Sep 2017 23:13:39 +0800 Subject: fix email notifications settings appearing save despite cancel (#7359) --- .../user_settings/email_notification_setting.jsx | 90 +++++++++------------- .../user_settings/user_settings_notifications.jsx | 10 ++- 2 files changed, 43 insertions(+), 57 deletions(-) (limited to 'webapp/components') diff --git a/webapp/components/user_settings/email_notification_setting.jsx b/webapp/components/user_settings/email_notification_setting.jsx index bbde40fa1..bfba794ca 100644 --- a/webapp/components/user_settings/email_notification_setting.jsx +++ b/webapp/components/user_settings/email_notification_setting.jsx @@ -5,7 +5,6 @@ import React from 'react'; import PropTypes from 'prop-types'; import {savePreference} from 'actions/user_actions.jsx'; -import PreferenceStore from 'stores/preference_store.jsx'; import {localizeMessage} from 'utils/utils.jsx'; import {FormattedMessage} from 'react-intl'; @@ -19,41 +18,55 @@ export default class EmailNotificationSetting extends React.Component { activeSection: PropTypes.string.isRequired, updateSection: PropTypes.func.isRequired, enableEmail: PropTypes.bool.isRequired, - onChange: PropTypes.func.isRequired, + emailInterval: PropTypes.number.isRequired, onSubmit: PropTypes.func.isRequired, + onCancel: PropTypes.func.isRequired, serverError: PropTypes.string }; constructor(props) { super(props); - this.submit = this.submit.bind(this); - this.expand = this.expand.bind(this); - this.collapse = this.collapse.bind(this); - this.state = { - emailInterval: EmailNotificationSetting.getEmailInterval(props) + enableEmail: props.enableEmail, + emailInterval: props.emailInterval }; } - handleChange(enableEmail, emailInterval) { - this.props.onChange(enableEmail); - this.setState({emailInterval}); + componentWillReceiveProps(nextProps) { + if (nextProps.enableEmail !== this.props.enableEmail || nextProps.emailInterval !== this.props.emailInterval) { + this.setState({ + enableEmail: nextProps.enableEmail, + emailInterval: nextProps.emailInterval + }); + } + } + + handleChange = (enableEmail, emailInterval) => { + this.setState({ + enableEmail, + emailInterval + }); } - submit() { + handleSubmit = () => { // until the rest of the notification settings are moved to preferences, we have to do this separately savePreference(Preferences.CATEGORY_NOTIFICATIONS, Preferences.EMAIL_INTERVAL, this.state.emailInterval.toString()); - this.props.onSubmit(); + const {enableEmail} = this.state; + this.props.onSubmit({enableEmail}); } - expand() { + handleExpand = () => { this.props.updateSection('email'); } - collapse() { - this.props.updateSection(''); + handleCancel = (e) => { + this.setState({ + enableEmail: this.props.enableEmail, + emailInterval: this.props.emailInterval + }); + this.props.onCancel(e); } render() { @@ -77,7 +90,7 @@ export default class EmailNotificationSetting extends React.Component { title={localizeMessage('user.settings.notifications.emailNotifications', 'Email notifications')} inputs={inputs} server_error={this.state.serverError} - updateSection={this.collapse} + updateSection={this.handleCancel} /> ); } @@ -132,14 +145,14 @@ export default class EmailNotificationSetting extends React.Component { ); } let batchingOptions = null; let batchingInfo = null; - if (window.mm_config.EnableEmailBatching === 'true') { + if (global.window.mm_config.EnableEmailBatching === 'true') { batchingOptions = (
@@ -149,7 +162,7 @@ export default class EmailNotificationSetting extends React.Component { type='radio' name='emailNotifications' checked={this.state.emailInterval === Preferences.INTERVAL_FIFTEEN_MINUTES} - onChange={this.handleChange.bind(this, 'true', Preferences.INTERVAL_FIFTEEN_MINUTES)} + onChange={() => this.handleChange('true', Preferences.INTERVAL_FIFTEEN_MINUTES)} /> this.handleChange('true', Preferences.INTERVAL_HOUR)} /> this.handleChange('true', Preferences.INTERVAL_IMMEDIATE)} /> this.handleChange('false', Preferences.INTERVAL_NEVER)} />
]} - submit={this.submit} + submit={this.handleSubmit} server_error={this.props.serverError} - updateSection={this.collapse} + updateSection={this.handleCancel} /> ); } - - static getEmailInterval(props) { - const validValuesWithEmailBatching = [Preferences.INTERVAL_IMMEDIATE, Preferences.INTERVAL_FIFTEEN_MINUTES, Preferences.INTERVAL_HOUR]; - const validValuesWithoutEmailBatching = [Preferences.INTERVAL_IMMEDIATE]; - - let emailInterval; - - if (global.mm_config.EnableEmailBatching === 'true') { - // when email batching is enabled, the default interval is 15 minutes - emailInterval = PreferenceStore.getInt(Preferences.CATEGORY_NOTIFICATIONS, Preferences.EMAIL_INTERVAL, Preferences.INTERVAL_FIFTEEN_MINUTES); - - if (validValuesWithEmailBatching.indexOf(emailInterval) === -1) { - emailInterval = Preferences.INTERVAL_FIFTEEN_MINUTES; - } - } else { - // otherwise, the default interval is immediately - emailInterval = PreferenceStore.getInt(Preferences.CATEGORY_NOTIFICATIONS, Preferences.EMAIL_INTERVAL, Preferences.INTERVAL_IMMEDIATE); - - if (validValuesWithoutEmailBatching.indexOf(emailInterval) === -1) { - emailInterval = Preferences.INTERVAL_IMMEDIATE; - } - } - - if (!props.enableEmail) { - emailInterval = Preferences.INTERVAL_NEVER; - } - - return emailInterval; - } } diff --git a/webapp/components/user_settings/user_settings_notifications.jsx b/webapp/components/user_settings/user_settings_notifications.jsx index 6cfceb444..5d6457527 100644 --- a/webapp/components/user_settings/user_settings_notifications.jsx +++ b/webapp/components/user_settings/user_settings_notifications.jsx @@ -122,10 +122,10 @@ export default class NotificationsTab extends React.Component { this.state = getNotificationsStateFromStores(); } - handleSubmit() { + handleSubmit({enableEmail = this.state.enableEmail}) { const data = {}; data.user_id = this.props.user.id; - data.email = this.state.enableEmail; + data.email = enableEmail; data.desktop_sound = this.state.desktopSound; data.desktop = this.state.desktopActivity; data.desktop_duration = this.state.desktopDuration; @@ -819,6 +819,7 @@ export default class NotificationsTab extends React.Component { } const pushNotificationSection = this.createPushNotificationSection(); + const enableEmail = this.state.enableEmail === 'true'; return (
@@ -874,9 +875,10 @@ export default class NotificationsTab extends React.Component {
-- cgit v1.2.3-1-g7c22