From d3e849fca4dd8290bdeca8544d2e32f17954671b Mon Sep 17 00:00:00 2001
From: Nick Mowen <nickmowen213@gmail.com>
Date: Fri, 20 Oct 2023 16:06:35 -0600
Subject: [PATCH] fix dangling webrtc connections

---
 web/src/components/WebRtcPlayer.jsx | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/web/src/components/WebRtcPlayer.jsx b/web/src/components/WebRtcPlayer.jsx
index a454c67d3..fd3b5021f 100644
--- a/web/src/components/WebRtcPlayer.jsx
+++ b/web/src/components/WebRtcPlayer.jsx
@@ -4,6 +4,7 @@ import { useCallback, useEffect } from 'preact/hooks';
 
 export default function WebRtcPlayer({ camera, width, height }) {
   const url = `${baseUrl.replace(/^http/, 'ws')}live/webrtc/api/ws?src=${camera}`;
+  const ws = new WebSocket(url);
 
   const PeerConnection = useCallback(async (media) => {
     const pc = new RTCPeerConnection({
@@ -60,7 +61,6 @@ export default function WebRtcPlayer({ camera, width, height }) {
 
   const connect = useCallback(async () => {
     const pc = await PeerConnection('video+audio');
-    const ws = new WebSocket(url);
 
     ws.addEventListener('open', () => {
       pc.addEventListener('icecandidate', (ev) => {
@@ -85,11 +85,15 @@ export default function WebRtcPlayer({ camera, width, height }) {
         pc.setRemoteDescription({ type: 'answer', sdp: msg.value });
       }
     });
-  }, [PeerConnection, url]);
+  }, [PeerConnection, ws]);
 
   useEffect(() => {
     connect();
-  }, [connect]);
+
+    return () => {
+      ws.close();
+    }
+  }, [connect, ws]);
 
   return (
     <div>