// Copyright (c) 2015 Mattermost, Inc. All Rights Reserved. // See License.txt for license information. import $ from 'jquery'; import SettingItemMin from 'components/setting_item_min.jsx'; import SettingItemMax from 'components/setting_item_max.jsx'; import DesktopNotificationSettings from './desktop_notification_settings.jsx'; import UserStore from 'stores/user_store.jsx'; import * as Utils from 'utils/utils.jsx'; import Constants from 'utils/constants.jsx'; import {updateUserNotifyProps} from 'actions/user_actions.jsx'; import EmailNotificationSetting from './email_notification_setting.jsx'; import {FormattedMessage} from 'react-intl'; function getNotificationsStateFromStores() { const user = UserStore.getCurrentUser(); let desktop = 'default'; let sound = 'true'; let desktopDuration = '5'; let comments = 'never'; let enableEmail = 'true'; let pushActivity = 'mention'; let pushStatus = Constants.UserStatuses.ONLINE; if (user.notify_props) { if (user.notify_props.desktop) { desktop = user.notify_props.desktop; } if (user.notify_props.desktop_sound) { sound = user.notify_props.desktop_sound; } if (user.notify_props.desktop_duration) { desktopDuration = user.notify_props.desktop_duration; } if (user.notify_props.comments) { comments = user.notify_props.comments; } if (user.notify_props.email) { enableEmail = user.notify_props.email; } if (user.notify_props.push) { pushActivity = user.notify_props.push; } if (user.notify_props.push_status) { pushStatus = user.notify_props.push_status; } } let usernameKey = false; let customKeys = ''; let firstNameKey = false; let channelKey = false; if (user.notify_props) { if (user.notify_props.mention_keys) { const keys = user.notify_props.mention_keys.split(','); if (keys.indexOf(user.username) === -1) { usernameKey = false; } else { usernameKey = true; keys.splice(keys.indexOf(user.username), 1); } customKeys = keys.join(','); } if (user.notify_props.first_name) { firstNameKey = user.notify_props.first_name === 'true'; } if (user.notify_props.channel) { channelKey = user.notify_props.channel === 'true'; } } return { desktopActivity: desktop, desktopDuration, enableEmail, pushActivity, pushStatus, desktopSound: sound, usernameKey, customKeys, customKeysChecked: customKeys.length > 0, firstNameKey, channelKey, notifyCommentsLevel: comments }; } import React from 'react'; export default class NotificationsTab extends React.Component { constructor(props) { super(props); this.handleSubmit = this.handleSubmit.bind(this); this.handleCancel = this.handleCancel.bind(this); this.updateSection = this.updateSection.bind(this); this.setStateValue = this.setStateValue.bind(this); this.onListenerChange = this.onListenerChange.bind(this); this.handleEmailRadio = this.handleEmailRadio.bind(this); this.updateUsernameKey = this.updateUsernameKey.bind(this); this.updateFirstNameKey = this.updateFirstNameKey.bind(this); this.updateChannelKey = this.updateChannelKey.bind(this); this.updateCustomMentionKeys = this.updateCustomMentionKeys.bind(this); this.updateState = this.updateState.bind(this); this.onCustomChange = this.onCustomChange.bind(this); this.createPushNotificationSection = this.createPushNotificationSection.bind(this); this.state = getNotificationsStateFromStores(); } handleSubmit() { const data = {}; data.user_id = this.props.user.id; data.email = this.state.enableEmail; data.desktop_sound = this.state.desktopSound; data.desktop = this.state.desktopActivity; data.desktop_duration = this.state.desktopDuration; data.push = this.state.pushActivity; data.push_status = this.state.pushStatus; data.comments = this.state.notifyCommentsLevel; const mentionKeys = []; if (this.state.usernameKey) { mentionKeys.push(this.props.user.username); } let stringKeys = mentionKeys.join(','); if (this.state.customKeys.length > 0 && this.state.customKeysChecked) { stringKeys += ',' + this.state.customKeys; } data.mention_keys = stringKeys; data.first_name = this.state.firstNameKey.toString(); data.channel = this.state.channelKey.toString(); updateUserNotifyProps( data, () => { this.props.updateSection(''); $('.settings-modal .modal-body').scrollTop(0).perfectScrollbar('update'); }, (err) => { this.setState({serverError: err.message}); } ); } handleCancel(e) { e.preventDefault(); this.updateState(); this.props.updateSection(''); $('.settings-modal .modal-body').scrollTop(0).perfectScrollbar('update'); } setStateValue(key, value) { const data = {}; data[key] = value; this.setState(data); } updateSection(section) { this.updateState(); this.props.updateSection(section); } updateState() { const newState = getNotificationsStateFromStores(); if (!Utils.areObjectsEqual(newState, this.state)) { this.setState(newState); } } componentDidMount() { UserStore.addChangeListener(this.onListenerChange); } componentWillUnmount() { UserStore.removeChangeListener(this.onListenerChange); } onListenerChange() { this.updateState(); } handleNotifyCommentsRadio(notifyCommentsLevel) { this.setState({notifyCommentsLevel}); this.refs.wrapper.focus(); } handlePushRadio(pushActivity) { this.setState({pushActivity}); this.refs.wrapper.focus(); } handlePushStatusRadio(pushStatus) { this.setState({pushStatus}); this.refs.wrapper.focus(); } handleEmailRadio(enableEmail) { this.setState({enableEmail}); this.refs.wrapper.focus(); } updateUsernameKey(val) { this.setState({usernameKey: val}); } updateFirstNameKey(val) { this.setState({firstNameKey: val}); } updateChannelKey(val) { this.setState({channelKey: val}); } updateCustomMentionKeys() { const checked = this.refs.customcheck.checked; if (checked) { const text = this.refs.custommentions.value; // remove all spaces and split string into individual keys this.setState({customKeys: text.replace(/ /g, ''), customKeysChecked: true}); } else { this.setState({customKeys: '', customKeysChecked: false}); } } onCustomChange() { this.refs.customcheck.checked = true; this.updateCustomMentionKeys(); } createPushNotificationSection() { if (this.props.activeSection === 'push') { const inputs = []; let extraInfo = null; let submit = null; if (global.window.mm_config.SendPushNotifications === 'true') { const pushActivityRadio = [false, false, false]; if (this.state.pushActivity === 'all') { pushActivityRadio[0] = true; } else if (this.state.pushActivity === 'none') { pushActivityRadio[2] = true; } else { pushActivityRadio[1] = true; } const pushStatusRadio = [false, false, false]; if (this.state.pushStatus === Constants.UserStatuses.ONLINE) { pushStatusRadio[0] = true; } else if (this.state.pushStatus === Constants.UserStatuses.AWAY) { pushStatusRadio[1] = true; } else { pushStatusRadio[2] = true; } let pushStatusSettings; if (this.state.pushActivity !== 'none') { pushStatusSettings = (