feat: disable camera on unmount component

allisson · Dec 10, 2023 · 83133fc · 83133fc
1 parent 5c31d4d
commit 83133fc
Showing 1 changed file with 7 additions and 1 deletion.
diff --git a/templates/index.html b/templates/index.html
@@ -180,15 +180,17 @@
         function QRReader({ onCode }) {
           const canvasEl = React.useRef(null);
           const videoEl = React.useRef(null);
+          const streamRef = React.useRef(null);
 
-          React.useLayoutEffect(() => {
+          React.useEffect(() => {
             if (!videoEl.current || !canvasEl.current) {
               return;
             }
 
             navigator.mediaDevices
               .getUserMedia({ video: { facingMode: "environment" } })
               .then((stream) => {
+                streamRef.current = stream;
                 let video = videoEl.current;
                 video.srcObject = stream;
                 video.setAttribute("playsinline", true);
@@ -197,6 +199,10 @@
                   tick(videoEl.current, canvasEl.current, onCode)
                 );
               });
+
+            return () => {
+              streamRef.current?.getTracks().forEach((track) => track.stop());
+            };
           }, [videoEl, canvasEl]);
 
           return (