From 9bc22b633f171b876e8ff3e3172821cc80947710 Mon Sep 17 00:00:00 2001
From: Christopher Poile <cpoile@gmail.com>
Date: Fri, 23 Jun 2023 08:22:39 -0400
Subject: [PATCH] MM-53222 - Fix: Calls Ringing sometimes controllable with
 media keys (#23775)

* prevent media keys from controlling calls ring sounds

* stop ring on pause

---------

Co-authored-by: Mattermost Build <build@mattermost.com>
---
 .../channels/src/utils/notification_sounds.ts | 23 +++++++++++++++----
 1 file changed, 19 insertions(+), 4 deletions(-)

diff --git a/webapp/channels/src/utils/notification_sounds.ts b/webapp/channels/src/utils/notification_sounds.ts
index 5611076c1b..5fb65a0377 100644
--- a/webapp/channels/src/utils/notification_sounds.ts
+++ b/webapp/channels/src/utils/notification_sounds.ts
@@ -54,11 +54,18 @@ export function ring(name: string) {
     stopRing();
 
     currentRing = loopNotificationRing(name);
+    currentRing.addEventListener('pause', () => {
+        stopRing();
+    });
 }
 
 export function stopRing() {
-    currentRing?.pause();
-    currentRing = null;
+    if (currentRing) {
+        currentRing.pause();
+        currentRing.src = '';
+        currentRing.remove();
+        currentRing = null;
+    }
 }
 
 let currentTryRing: HTMLAudioElement | null = null;
@@ -71,14 +78,22 @@ export function tryNotificationRing(name: string) {
     clearTimeout(currentTimer);
 
     currentTryRing = loopNotificationRing(name);
+    currentTryRing.addEventListener('pause', () => {
+        stopTryNotificationRing();
+    });
+
     currentTimer = setTimeout(() => {
         stopTryNotificationRing();
     }, 5000);
 }
 
 export function stopTryNotificationRing() {
-    currentTryRing?.pause();
-    currentTryRing = null;
+    if (currentTryRing) {
+        currentTryRing.pause();
+        currentTryRing.src = '';
+        currentTryRing.remove();
+        currentTryRing = null;
+    }
 }
 
 export function loopNotificationRing(name: string) {