From c9eae136fbd4e4021d8bf1a014bf682d80eaad9e Mon Sep 17 00:00:00 2001
From: nessi <sascha@nesterovic.cc>
Date: Sun, 2 Aug 2026 10:55:42 +0200
Subject: [PATCH] Allow QR code generation for both created games and joined
 games using current code

Extended QR code functionality to work with `currentCode` (joined games) in addition to `created.code` (created games). Updated QR generation effect to use fallback value and added dependencies. Moved QR toggle button and display from created-game-only section to shared code display area, enabling QR codes for all game participants.
---
 frontend/src/components/NewGameModal.jsx | 14 +++++++++++---
 1 file changed, 11 insertions(+), 3 deletions(-)

diff --git a/frontend/src/components/NewGameModal.jsx b/frontend/src/components/NewGameModal.jsx
index 912b783..ad1e1fb 100644
--- a/frontend/src/components/NewGameModal.jsx
+++ b/frontend/src/components/NewGameModal.jsx
@@ -51,10 +51,11 @@ export default function NewGameModal({
   }, [open, hasGame, gameFinished]);
 
   useEffect(() => {
-    if (!qrOpen || !created?.code) return;
-    QRCode.toDataURL(created.code, { width: 280, margin: 2, errorCorrectionLevel: "M", color: { dark: "#17161b", light: "#f5efdc" } })
+    const qrValue = created?.code || currentCode;
+    if (!qrOpen || !qrValue) return;
+    QRCode.toDataURL(qrValue, { width: 280, margin: 2, errorCorrectionLevel: "M", color: { dark: "#17161b", light: "#f5efdc" } })
       .then(setQrDataUrl).catch(() => setQrDataUrl(""));
-  }, [qrOpen, created?.code]);
+  }, [qrOpen, created?.code, currentCode]);
 
   useEffect(() => {
     if (!scannerOpen) return undefined;
@@ -215,6 +216,13 @@ export default function NewGameModal({
                 >
                   ⧉ {t("copy")} {language === "en" ? "code" : "Code"}
                 </button>
+                <button onClick={() => setQrOpen((value) => !value)} style={styles.secondaryBtn} disabled={!codeToShow}>
+                  ▣ {qrOpen ? (language === "en" ? "Hide QR code" : "QR-Code ausblenden") : (language === "en" ? "Create QR code" : "QR-Code erstellen")}
+                </button>
+                {qrOpen && qrDataUrl && <div style={{ marginTop: 4, display: "grid", justifyItems: "center", gap: 7 }}>
+                  <img src={qrDataUrl} alt={language === "en" ? "Game QR code" : "Spiel-QR-Code"} style={{ width: 220, height: 220, borderRadius: 10, padding: 8, background: "#f5efdc" }} />
+                  <div style={{ color: stylesTokens.textDim, fontSize: 12 }}>{language === "en" ? "Scan this code to join the game." : "Scanne diesen Code, um dem Spiel beizutreten."}</div>
+                </div>}
               </div>
 
               <div style={{ fontSize: 12, opacity: 0.75, color: stylesTokens.textDim }}>