From 6ba5dc1187cca0e4a609d72dfa0f0aead2d3dc11 Mon Sep 17 00:00:00 2001
From: "shakespeare.diy" <assistant@shakespeare.diy>
Date: Tue, 16 Jun 2026 16:17:56 +0700
Subject: [PATCH] Fix QRCodeCanvas: guard against empty value and null context

Co-authored-by: shakespeare.diy <assistant@shakespeare.diy>
---
 src/components/ui/qrcode.tsx | 23 ++++++++---------------
 1 file changed, 8 insertions(+), 15 deletions(-)

diff --git a/src/components/ui/qrcode.tsx b/src/components/ui/qrcode.tsx
index 8cc0011..81df85c 100644
--- a/src/components/ui/qrcode.tsx
+++ b/src/components/ui/qrcode.tsx
@@ -12,21 +12,14 @@ export function QRCodeCanvas({ value, size = 256, level = 'M', className }: QRCo
   const canvasRef = useRef<HTMLCanvasElement>(null);
 
   useEffect(() => {
-    if (!canvasRef.current) return;
-
-    QRCode.toCanvas(
-      canvasRef.current,
-      value,
-      {
-        width: size,
-        margin: 1,
-        errorCorrectionLevel: level,
-      },
-      (error) => {
-        if (error) console.error('QR Code generation error:', error);
-      }
-    );
+    if (!canvasRef.current || !value || value.length < 4) return;
+    const el = canvasRef.current;
+    try {
+      QRCode.toCanvas(el, value, { width: size, margin: 1, errorCorrectionLevel: level });
+    } catch {
+      // silently skip on invalid input
+    }
   }, [value, size, level]);
 
-  return <canvas ref={canvasRef} className={className} />;
+  return <canvas ref={canvasRef} width={size} height={size} className={className} />;
 }