1 files changed, 26 insertions, 15 deletions

diff --git a/web/react/components/user_settings.jsx b/web/react/components/user_settings.jsx
index 1a0c313d3..8f29bbe57 100644
--- a/web/react/components/user_settings.jsx
+++ b/web/react/components/user_settings.jsx
@@ -13,6 +13,7 @@ var assign = require('object-assign');
 
 function getNotificationsStateFromStores() {
     var user = UserStore.getCurrentUser();
+    var soundNeeded = !utils.isBrowserFirefox();
     var sound = (!user.notify_props || user.notify_props.desktop_sound == undefined) ? "true" : user.notify_props.desktop_sound;
     var desktop = (!user.notify_props || user.notify_props.desktop == undefined) ? "all" : user.notify_props.desktop;
     var email = (!user.notify_props || user.notify_props.email == undefined) ? "true" : user.notify_props.email;
@@ -58,7 +59,7 @@ function getNotificationsStateFromStores() {
         }
     }
 
-    return { notify_level: desktop, enable_email: email, enable_sound: sound, username_key: username_key, mention_key: mention_key, custom_keys: custom_keys, custom_keys_checked: custom_keys.length > 0, first_name_key: first_name_key, all_key: all_key, channel_key: channel_key };
+    return { notify_level: desktop, enable_email: email, soundNeeded: soundNeeded, enable_sound: sound, username_key: username_key, mention_key: mention_key, custom_keys: custom_keys, custom_keys_checked: custom_keys.length > 0, first_name_key: first_name_key, all_key: all_key, channel_key: channel_key };
 }
 
 
@@ -105,11 +106,11 @@ var NotificationsTab = React.createClass({
     },
     componentDidMount: function() {
         UserStore.addChangeListener(this._onChange);
-        $('#user_settings1').on('hidden.bs.modal', this.handleClose);
+        $('#user_settings').on('hidden.bs.modal', this.handleClose);
     },
     componentWillUnmount: function() {
         UserStore.removeChangeListener(this._onChange);
-        $('#user_settings1').off('hidden.bs.modal', this.handleClose);
+        $('#user_settings').off('hidden.bs.modal', this.handleClose);
         this.props.updateSection('');
     },
     _onChange: function() {
@@ -235,7 +236,7 @@ var NotificationsTab = React.createClass({
         }
 
         var soundSection;
-        if (this.props.activeSection === 'sound') {
+        if (this.props.activeSection === 'sound' && this.state.soundNeeded) {
             var soundActive = ["",""];
             if (this.state.enable_sound === "false") {
                 soundActive[1] = "active";
@@ -265,7 +266,9 @@ var NotificationsTab = React.createClass({
             );
         } else {
             var describe = "";
-            if (this.state.enable_sound === "false") {
+            if (!this.state.soundNeeded) {
+                describe = "Please configure notification sounds in your browser settings"
+            } else if (this.state.enable_sound === "false") {
                 describe = "Off";
             } else {
                 describe = "On";
@@ -276,6 +279,7 @@ var NotificationsTab = React.createClass({
                     title="Desktop notification sounds"
                     describe={describe}
                     updateSection={function(){self.props.updateSection("sound");}}
+                    disableOpen = {!this.state.soundNeeded}
                 />
             );
         }
@@ -513,27 +517,34 @@ var SecurityTab = React.createClass({
         this.setState({confirmPassword: e.target.value});
     },
     handleHistoryOpen: function() {
-        $('#user_settings1').modal('hide');
+        this.setState({willReturn: true});
+        $("#user_settings").modal('hide');
     },
     handleDevicesOpen: function() {
-        $('#user_settings1').modal('hide');
+        this.setState({willReturn: true});
+        $("#user_settings").modal('hide');
     },
     handleClose: function() {
         $(this.getDOMNode()).find('.form-control').each(function() {
             this.value = '';
         });
         this.setState({currentPassword: '', newPassword: '', confirmPassword: '', serverError: null, passwordError: null});
-        this.props.updateTab('general');
+
+        if (!this.state.willReturn) {
+            this.props.updateTab('general');
+        } else {
+            this.setState({willReturn: false});
+        }
     },
     componentDidMount: function() {
-        $('#user_settings1').on('hidden.bs.modal', this.handleClose);
+        $('#user_settings').on('hidden.bs.modal', this.handleClose);
     },
     componentWillUnmount: function() {
-        $('#user_settings1').off('hidden.bs.modal', this.handleClose);
+        $('#user_settings').off('hidden.bs.modal', this.handleClose);
         this.props.updateSection('');
     },
     getInitialState: function() {
-        return {currentPassword: '', newPassword: '', confirmPassword: ''};
+        return {currentPassword: '', newPassword: '', confirmPassword: '', willReturn: false};
     },
     render: function() {
         var serverError = this.state.serverError ? this.state.serverError : null;
@@ -811,10 +822,10 @@ var GeneralTab = React.createClass({
         this.props.updateSection('');
     },
     componentDidMount: function() {
-        $('#user_settings1').on('hidden.bs.modal', this.handleClose);
+        $('#user_settings').on('hidden.bs.modal', this.handleClose);
     },
     componentWillUnmount: function() {
-        $('#user_settings1').off('hidden.bs.modal', this.handleClose);
+        $('#user_settings').off('hidden.bs.modal', this.handleClose);
     },
     getInitialState: function() {
         var user = this.props.user;
@@ -1093,7 +1104,7 @@ var AppearanceTab = React.createClass({
         if (this.props.activeSection === "theme") {
             $(this.refs[this.state.theme].getDOMNode()).addClass('active-border');
         }
-        $('#user_settings1').on('hidden.bs.modal', this.handleClose);
+        $('#user_settings').on('hidden.bs.modal', this.handleClose);
     },
     componentDidUpdate: function() {
         if (this.props.activeSection === "theme") {
@@ -1102,7 +1113,7 @@ var AppearanceTab = React.createClass({
         }
     },
     componentWillUnmount: function() {
-        $('#user_settings1').off('hidden.bs.modal', this.handleClose);
+        $('#user_settings').off('hidden.bs.modal', this.handleClose);
         this.props.updateSection('');
     },
     getInitialState: function() {