PLT-6823 Removes option to set notification sound in Edge (#6883)

* Remove sound notification support for Edge

* Move the sound test to utils and also stop the dings for Edge along with firefox

* Fix some styling issues

* Remove sound notification support for Edge

Move the sound test to utils and also stop the dings for Edge along with firefox

Fix some styling issues

* Reversing soundOptions util method. Fixing some string IDs for clarity

* Fixing a syntax error

* Restructure HasSoundOptions blocks to not begin with negative statement

* Fixing paranthesis

3 files changed, 51 insertions, 48 deletions

diff --git a/webapp/components/user_settings/desktop_notification_settings.jsx b/webapp/components/user_settings/desktop_notification_settings.jsx
index 79d500c88..abdbff512 100644
--- a/webapp/components/user_settings/desktop_notification_settings.jsx
+++ b/webapp/components/user_settings/desktop_notification_settings.jsx
@@ -5,7 +5,6 @@ import SettingItemMin from 'components/setting_item_min.jsx';
 import SettingItemMax from 'components/setting_item_max.jsx';
 
 import * as Utils from 'utils/utils.jsx';
-import * as UserAgent from 'utils/user_agent.jsx';
 
 import PropTypes from 'prop-types';
 
@@ -45,24 +44,7 @@ export default class DesktopNotificationSettings extends React.Component {
                 soundRadio[0] = true;
             }
 
-            if (UserAgent.isFirefox()) {
-                soundSection = (
-                    <div>
-                        <hr/>
-                        <label>
-                            <FormattedMessage
-                                id='user.settings.notifications.desktop.sound'
-                                defaultMessage='Notification sound'
-                            />
-                        </label>
-                        <br/>
-                        <FormattedMessage
-                            id='user.settings.notifications.soundConfig'
-                            defaultMessage='Please configure notification sounds in your browser settings'
-                        />
-                    </div>
-                );
-            } else {
+            if (Utils.hasSoundOptions()) {
                 soundSection = (
                     <div>
                         <hr/>
@@ -109,11 +91,28 @@ export default class DesktopNotificationSettings extends React.Component {
                         <span>
                             <FormattedMessage
                                 id='user.settings.notifications.sounds_info'
-                                defaultMessage='Notification sounds are available on IE11, Edge, Safari, Chrome and Mattermost Desktop Apps.'
+                                defaultMessage='Notification sounds are available on IE11, Safari, Chrome and Mattermost Desktop Apps.'
                             />
                         </span>
                     </div>
                 );
+            } else {
+                soundSection = (
+                    <div>
+                        <hr/>
+                        <label>
+                            <FormattedMessage
+                                id='user.settings.notifications.desktop.sound'
+                                defaultMessage='Notification sound'
+                            />
+                        </label>
+                        <br/>
+                        <FormattedMessage
+                            id='user.settings.notifications.soundConfig'
+                            defaultMessage='Please configure notification sounds in your browser settings'
+                        />
+                    </div>
+                );
             }
 
             const durationRadio = [false, false, false, false];
@@ -304,26 +303,26 @@ export default class DesktopNotificationSettings extends React.Component {
     buildMinimizedSetting() {
         let describe = '';
         if (this.props.activity === 'mention') {
-            if (UserAgent.isFirefox()) {
-                if (this.props.duration === '0') {
+            if (Utils.hasSoundOptions() && this.props.sound !== 'false') {
+                if (this.props.duration === '0') { //eslint-disable-line no-lonely-if
                     describe = (
                         <FormattedMessage
-                            id='user.settings.notifications.desktop.mentionsFirefoxForever'
-                            defaultMessage='For mentions and direct messages, shown indefinitely'
+                            id='user.settings.notifications.desktop.mentionsSoundForever'
+                            defaultMessage='For mentions and direct messages, with sound, shown indefinitely'
                         />
                     );
                 } else {
                     describe = (
                         <FormattedMessage
-                            id='user.settings.notifications.desktop.mentionsFirefoxTimed'
-                            defaultMessage='For mentions and direct messages, shown for {seconds} seconds'
+                            id='user.settings.notifications.desktop.mentionsSoundTimed'
+                            defaultMessage='For mentions and direct messages, with sound, shown for {seconds} seconds'
                             values={{
                                 seconds: this.props.duration
                             }}
                         />
                     );
                 }
-            } else if (this.props.sound === 'false') {
+            } else if (Utils.hasSoundOptions() && this.props.sound === 'false') {
                 if (this.props.duration === '0') {
                     describe = (
                         <FormattedMessage
@@ -346,15 +345,15 @@ export default class DesktopNotificationSettings extends React.Component {
                 if (this.props.duration === '0') { //eslint-disable-line no-lonely-if
                     describe = (
                         <FormattedMessage
-                            id='user.settings.notifications.desktop.mentionsSoundForever'
-                            defaultMessage='For mentions and direct messages, with sound, shown indefinitely'
+                            id='user.settings.notifications.desktop.mentionsSoundHiddenForever'
+                            defaultMessage='For mentions and direct messages, shown indefinitely'
                         />
                     );
                 } else {
                     describe = (
                         <FormattedMessage
-                            id='user.settings.notifications.desktop.mentionsSoundTimed'
-                            defaultMessage='For mentions and direct messages, with sound, shown for {seconds} seconds'
+                            id='user.settings.notifications.desktop.mentionsSoundHiddenTimed'
+                            defaultMessage='For mentions and direct messages, shown for {seconds} seconds'
                             values={{
                                 seconds: this.props.duration
                             }}
@@ -370,26 +369,26 @@ export default class DesktopNotificationSettings extends React.Component {
                 />
             );
         } else {
-            if (UserAgent.isFirefox()) {  //eslint-disable-line no-lonely-if
-                if (this.props.duration === '0') {
+            if (Utils.hasSoundOptions() && this.props.sound !== 'false') {  //eslint-disable-line no-lonely-if
+                if (this.props.duration === '0') { //eslint-disable-line no-lonely-if
                     describe = (
                         <FormattedMessage
-                            id='user.settings.notifications.desktop.allFirefoxForever'
-                            defaultMessage='For all activity, shown indefinitely'
+                            id='user.settings.notifications.desktop.allSoundForever'
+                            defaultMessage='For all activity, with sound, shown indefinitely'
                         />
                     );
                 } else {
                     describe = (
                         <FormattedMessage
-                            id='user.settings.notifications.desktop.allFirefoxTimed'
-                            defaultMessage='For all activity, shown for {seconds} seconds'
+                            id='user.settings.notifications.desktop.allSoundTimed'
+                            defaultMessage='For all activity, with sound, shown for {seconds} seconds'
                             values={{
                                 seconds: this.props.duration
                             }}
                         />
                     );
                 }
-            } else if (this.props.sound === 'false') {
+            } else if (Utils.hasSoundOptions() && this.props.sound === 'false') {
                 if (this.props.duration === '0') {
                     describe = (
                         <FormattedMessage
@@ -412,15 +411,15 @@ export default class DesktopNotificationSettings extends React.Component {
                 if (this.props.duration === '0') { //eslint-disable-line no-lonely-if
                     describe = (
                         <FormattedMessage
-                            id='user.settings.notifications.desktop.allSoundForever'
-                            defaultMessage='For all activity, with sound, shown indefinitely'
+                            id='user.settings.notifications.desktop.allSoundHiddenForever'
+                            defaultMessage='For all activity, shown indefinitely'
                         />
                     );
                 } else {
                     describe = (
                         <FormattedMessage
-                            id='user.settings.notifications.desktop.allSoundTimed'
-                            defaultMessage='For all activity, with sound, shown for {seconds} seconds'
+                            id='user.settings.notifications.desktop.allSoundHiddenTimed'
+                            defaultMessage='For all activity, shown for {seconds} seconds'
                             values={{
                                 seconds: this.props.duration
                             }}
diff --git a/webapp/i18n/en.json b/webapp/i18n/en.json
index a761793be..02e0964ce 100755
--- a/webapp/i18n/en.json
+++ b/webapp/i18n/en.json
@@ -2411,16 +2411,16 @@
   "user.settings.notifications.commentsNever": "Do not trigger notifications on messages in reply threads unless I'm mentioned",
   "user.settings.notifications.commentsRoot": "Trigger notifications on messages in threads that I start",
   "user.settings.notifications.desktop": "Send desktop notifications",
-  "user.settings.notifications.desktop.allFirefoxForever": "For all activity, shown indefinitely",
-  "user.settings.notifications.desktop.allFirefoxTimed": "For all activity, shown for {seconds} seconds",
+  "user.settings.notifications.desktop.allSoundHiddenForever": "For all activity, shown indefinitely",
+  "user.settings.notifications.desktop.allSoundHiddenTimed": "For all activity, shown for {seconds} seconds",
   "user.settings.notifications.desktop.allNoSoundForever": "For all activity, without sound, shown indefinitely",
   "user.settings.notifications.desktop.allNoSoundTimed": "For all activity, without sound, shown for {seconds} seconds",
   "user.settings.notifications.desktop.allSoundForever": "For all activity, with sound, shown indefinitely",
   "user.settings.notifications.desktop.allSoundTimed": "For all activity, with sound, shown for {seconds} seconds",
   "user.settings.notifications.desktop.duration": "Notification duration",
   "user.settings.notifications.desktop.durationInfo": "Sets how long desktop notifications will remain on screen when using Firefox or Chrome. Desktop notifications in Edge and Safari can only stay on screen for a maximum of 5 seconds.",
-  "user.settings.notifications.desktop.mentionsFirefoxForever": "For mentions and direct messages, shown indefinitely",
-  "user.settings.notifications.desktop.mentionsFirefoxTimed": "For mentions and direct messages, shown for {seconds} seconds",
+  "user.settings.notifications.desktop.mentionsSoundHiddenForever": "For mentions and direct messages, shown indefinitely",
+  "user.settings.notifications.desktop.mentionsSoundHiddenTimed": "For mentions and direct messages, shown for {seconds} seconds",
   "user.settings.notifications.desktop.mentionsNoSoundForever": "For mentions and direct messages, without sound, shown indefinitely",
   "user.settings.notifications.desktop.mentionsNoSoundTimed": "For mentions and direct messages, without sound, shown for {seconds} seconds",
   "user.settings.notifications.desktop.mentionsSoundForever": "For mentions and direct messages, with sound, shown indefinitely",
@@ -2454,7 +2454,7 @@
   "user.settings.notifications.sensitiveUsername": "Your non-case sensitive username \"{username}\"",
   "user.settings.notifications.sensitiveWords": "Other non-case sensitive words, separated by commas:",
   "user.settings.notifications.soundConfig": "Please configure notification sounds in your browser settings",
-  "user.settings.notifications.sounds_info": "Notification sounds are available on IE11, Edge, Safari, Chrome and Mattermost Desktop Apps.",
+  "user.settings.notifications.sounds_info": "Notification sounds are available on IE11, Safari, Chrome and Mattermost Desktop Apps.",
   "user.settings.notifications.teamWide": "Team-wide mentions \"@all\"",
   "user.settings.notifications.title": "Notification Settings",
   "user.settings.notifications.wordsTrigger": "Words that trigger mentions",
diff --git a/webapp/utils/utils.jsx b/webapp/utils/utils.jsx
index 94f6ca91f..f12fcefba 100644
--- a/webapp/utils/utils.jsx
+++ b/webapp/utils/utils.jsx
@@ -155,7 +155,7 @@ export function notifyMe(title, body, channel, teamId, duration, silent) {
 var canDing = true;
 
 export function ding() {
-    if (!UserAgent.isFirefox() && canDing) {
+    if (hasSoundOptions() && canDing) {
         var audio = new Audio(bing);
         audio.play();
         canDing = false;
@@ -165,6 +165,10 @@ export function ding() {
     }
 }
 
+export function hasSoundOptions() {
+    return (!(UserAgent.isFirefox()) && !(UserAgent.isEdge()));
+}
+
 export function getDateForUnixTicks(ticks) {
     return new Date(ticks);
 }