From a13388c50757d28811b5d7e8fac3b5406f8b5d6a Mon Sep 17 00:00:00 2001
From: Nicolas Mowen <nickmowen213@gmail.com>
Date: Tue, 2 Apr 2024 08:15:34 -0600
Subject: [PATCH] Cleanup visibility listener

---
 web/src/components/player/MsePlayer.tsx | 26 ++++++++++++++++---------
 1 file changed, 17 insertions(+), 9 deletions(-)

diff --git a/web/src/components/player/MsePlayer.tsx b/web/src/components/player/MsePlayer.tsx
index ecc4a7762..f25557d16 100644
--- a/web/src/components/player/MsePlayer.tsx
+++ b/web/src/components/player/MsePlayer.tsx
@@ -246,19 +246,27 @@ function MSEPlayer({
   // check visibility
 
   useEffect(() => {
-    if (!playbackEnabled) {
+    if (!playbackEnabled || !visibilityCheck) {
       return;
     }
 
-    if ("hidden" in document && visibilityCheck) {
-      document.addEventListener("visibilitychange", () => {
-        if (document.hidden) {
-          onDisconnect();
-        } else if (videoRef.current?.isConnected) {
-          onConnect();
-        }
-      });
+    if (!("hidden" in document)) {
+      return;
     }
+
+    const listener = () => {
+      if (document.hidden) {
+        onDisconnect();
+      } else if (videoRef.current?.isConnected) {
+        onConnect();
+      }
+    };
+
+    document.addEventListener("visibilitychange", listener);
+
+    return () => {
+      document.removeEventListener("visibilitychange", listener);
+    };
   }, [playbackEnabled, visibilityCheck, onConnect, onDisconnect]);
 
   // control pip