From 7c0b2f68f02247cb9afa1638538eaffe941c443c Mon Sep 17 00:00:00 2001
From: thisconnect <this@shiftcrypto.ch>
Date: Tue, 22 Oct 2024 16:08:21 +0200
Subject: [PATCH] frontend: make qrscanner more resilient to re-render

I.e. when resizing the window or rotating the screen it sometimes
crashed.
---
 CHANGELOG.md                             |  1 +
 frontends/web/src/hooks/qrcodescanner.ts | 24 ++++++++++++------------
 2 files changed, 13 insertions(+), 12 deletions(-)

diff --git a/CHANGELOG.md b/CHANGELOG.md
index 635a421fb1..b28abbf3be 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -5,6 +5,7 @@
 - Label UTXOs that were created as change, as such, in coin control
 - Remove support for deprecated the Ethereum Goerli network
 - Revamp transaction history in account overview to improve legibility
+- Fix qrscanner when rotating the device or resizing the window
 
 # 4.45.0
 - Bundle BitBox02 firmware version v9.21.0
diff --git a/frontends/web/src/hooks/qrcodescanner.ts b/frontends/web/src/hooks/qrcodescanner.ts
index 4c06d35502..0a1ad98fdd 100644
--- a/frontends/web/src/hooks/qrcodescanner.ts
+++ b/frontends/web/src/hooks/qrcodescanner.ts
@@ -66,14 +66,22 @@ export const useQRScanner = (
         }
       );
     }
-  });
+    return () => {
+      scanner.current?.stop();
+      scanner.current?.destroy();
+      scanner.current = null;
+    };
+  }, [onError, onResult, videoRef]);
 
   useEffect(() => {
     (async () => {
       try {
-        await scanner.current?.start();
-        if (onStart) {
-          onStart();
+        await new Promise(r => setTimeout(r, 300));
+        if (scanner.current) {
+          await scanner.current.start();
+          if (onStart) {
+            onStart();
+          }
         }
       } catch (error: any) {
         const stringifiedError = error.toString();
@@ -83,13 +91,5 @@ export const useQRScanner = (
     })();
   }, [videoRef, onStart, onResult, onError, t]);
 
-  useEffect(() => {
-    return () => {
-      scanner.current?.stop();
-      scanner.current?.destroy();
-      scanner.current = null;
-    };
-  });
-
   return { initErrorMessage };
 };