From fc8e85832cd8163d84199c153b774f4b9ff96a05 Mon Sep 17 00:00:00 2001
From: =?UTF-8?q?=D0=98=D0=BB=D1=8C=D1=8F=D1=81=20=D0=A1=D1=83=D0=BB=D1=82?=
 =?UTF-8?q?=D0=B0=D0=BD=D0=BE=D0=B2?= <si@op16.ru>
Date: Tue, 7 Jul 2026 21:17:27 +0300
Subject: [PATCH] =?UTF-8?q?fix(qr):=20useState=20=D0=B4=D0=BB=D1=8F=20cont?=
 =?UTF-8?q?ainerEl,=20=D1=87=D1=82=D0=BE=D0=B1=D1=8B=20effect=20=D0=B7?=
 =?UTF-8?q?=D0=B0=D0=BF=D1=83=D1=81=D0=BA=D0=B0=D0=BB=D1=81=D1=8F=20=D0=BF?=
 =?UTF-8?q?=D0=BE=D1=81=D0=BB=D0=B5=20=D0=BC=D0=BE=D0=BD=D1=82=D0=B8=D1=80?=
 =?UTF-8?q?=D0=BE=D0=B2=D0=B0=D0=BD=D0=B8=D1=8F=20DialogContent?=
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

---
 client/src/components/QrScannerButton.tsx | 12 ++++++------
 1 file changed, 6 insertions(+), 6 deletions(-)

diff --git a/client/src/components/QrScannerButton.tsx b/client/src/components/QrScannerButton.tsx
index 69b3f08..3589708 100644
--- a/client/src/components/QrScannerButton.tsx
+++ b/client/src/components/QrScannerButton.tsx
@@ -96,7 +96,7 @@ export function QrScannerButton({ className }: QrScannerButtonProps) {
   const [open, setOpen] = useState(false);
   const [, navigate] = useLocation();
   const scannerRef = useRef<Html5Qrcode | null>(null);
-  const containerRef = useRef<HTMLDivElement | null>(null);
+  const [containerEl, setContainerEl] = useState<HTMLDivElement | null>(null);
   const [error, setError] = useState<string | null>(null);
   const [isStarting, setIsStarting] = useState(false);
   const [retryKey, setRetryKey] = useState(0);
@@ -318,14 +318,14 @@ export function QrScannerButton({ className }: QrScannerButtonProps) {
   );
 
   useEffect(() => {
-    if (!open || !containerRef.current) return;
+    if (!open || !containerEl) return;
 
     cancelledRef.current = false;
     setIsStarting(true);
     setError(null);
     setMode('library');
 
-    const container = containerRef.current;
+    const container = containerEl;
     container.innerHTML = '';
 
     // Let the dialog content finish rendering / layout before accessing camera.
@@ -374,14 +374,14 @@ export function QrScannerButton({ className }: QrScannerButtonProps) {
       clearTimeout(startTimeout);
       stopAll();
     };
-  }, [open, retryKey, startLibrary, startNative, presentError, stopAll, log]);
+  }, [open, containerEl, retryKey, startLibrary, startNative, presentError, stopAll, log]);
 
   function handleScanFromFile() {
     let scanner = scannerRef.current;
     const needsScanner = !scanner;
 
     if (needsScanner) {
-      const container = containerRef.current;
+      const container = containerEl;
       if (!container) return;
       const scannerId = 'qr-scanner-file-' + Date.now();
       container.id = scannerId;
@@ -455,7 +455,7 @@ export function QrScannerButton({ className }: QrScannerButtonProps) {
           </DialogHeader>
           <div className="relative">
             <div
-              ref={containerRef}
+              ref={setContainerEl}
               className="w-full min-h-[300px] aspect-square rounded overflow-hidden bg-black [&_video]:w-full [&_video]:h-full [&_video]:object-cover"
             />
             {isStarting && !error && (