GOG Login: Nahtloser Auth-Flow wie Steam (kein Code-Paste noetig)

- Electron: Fängt GOG Redirect automatisch ab (will-redirect Interceptor)
- Code-Exchange passiert im Hintergrund, User sieht nur Erfolgs-Popup
- GOG Auth-URLs (auth.gog.com, login.gog.com, embed.gog.com) in Popup erlaubt
- Server: GET /gog/login Redirect + POST /gog/exchange Endpoint
- Browser-Fallback: Code-Paste Dialog falls nicht in Electron
- gog.ts: Feste redirect_uri (embed.gog.com/on_login_success)

Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>

web/src/plugins/game-library/GameLibraryTab.tsx

@@ -137,17 +137,73 @@ export default function GameLibraryTab({ data }: { data: any }) {
   }, [fetchProfiles]);
 
   // ── GOG login ──
+  const isElectron = navigator.userAgent.includes('GamingHubDesktop');
+
+  // Code-paste dialog state (browser fallback only)
+  const [gogDialogOpen, setGogDialogOpen] = useState(false);
+  const [gogCode, setGogCode] = useState('');
+  const [gogStatus, setGogStatus] = useState<'idle' | 'loading' | 'success' | 'error'>('idle');
+  const [gogStatusMsg, setGogStatusMsg] = useState('');
+
   const connectGog = useCallback(() => {
-    // If viewing a profile, pass linkTo param so GOG gets linked to it
     const linkParam = selectedProfile ? `?linkTo=${selectedProfile}` : '';
-    const w = window.open(`/api/game-library/gog/login${linkParam}`, '_blank', 'width=800,height=600');
-    const interval = setInterval(() => {
-      if (w && w.closed) {
-        clearInterval(interval);
-        setTimeout(fetchProfiles, 1500);
+
+    if (isElectron) {
+      // Electron: Popup opens → GOG auth → Electron intercepts redirect → done
+      const w = window.open(`/api/game-library/gog/login${linkParam}`, '_blank', 'width=800,height=700');
+      const interval = setInterval(() => {
+        if (w && w.closed) {
+          clearInterval(interval);
+          setTimeout(fetchProfiles, 1000);
+        }
+      }, 500);
+    } else {
+      // Browser: Open GOG auth in popup, show code-paste dialog
+      window.open(`/api/game-library/gog/login${linkParam}`, '_blank', 'width=800,height=700');
+      setGogCode('');
+      setGogStatus('idle');
+      setGogStatusMsg('');
+      setGogDialogOpen(true);
+    }
+  }, [fetchProfiles, selectedProfile, isElectron]);
+
+  const submitGogCode = useCallback(async () => {
+    let code = gogCode.trim();
+    // Accept full URL or just the code
+    const codeMatch = code.match(/[?&]code=([^&]+)/);
+    if (codeMatch) code = codeMatch[1];
+    if (!code) return;
+
+    setGogStatus('loading');
+    setGogStatusMsg('Verbinde mit GOG...');
+    try {
+      const resp = await fetch('/api/game-library/gog/exchange', {
+        method: 'POST',
+        headers: { 'Content-Type': 'application/json' },
+        body: JSON.stringify({ code, linkTo: selectedProfile || '' }),
+      });
+      const result = await resp.json();
+      if (resp.ok && result.ok) {
+        setGogStatus('success');
+        setGogStatusMsg(`${result.profileName}: ${result.gameCount} Spiele geladen!`);
+        fetchProfiles();
+        setTimeout(() => setGogDialogOpen(false), 2000);
+      } else {
+        setGogStatus('error');
+        setGogStatusMsg(result.error || 'Unbekannter Fehler');
       }
-    }, 500);
-  }, [fetchProfiles, selectedProfile]);
+    } catch {
+      setGogStatus('error');
+      setGogStatusMsg('Verbindung fehlgeschlagen.');
+    }
+  }, [gogCode, selectedProfile, fetchProfiles]);
+
+  // ── Listen for GOG-connected event from Electron main process ──
+  useEffect(() => {
+    const onGogConnected = () => fetchProfiles();
+    window.addEventListener('gog-connected', onGogConnected);
+    return () => window.removeEventListener('gog-connected', onGogConnected);
+  }, [fetchProfiles]);
 
   // ── Refetch on window focus (after login redirect) ──
   useEffect(() => {
@@ -797,6 +853,42 @@ export default function GameLibraryTab({ data }: { data: any }) {
           </>
         );
       })()}
+
+      {/* ── GOG Code Dialog (browser fallback only) ── */}
+      {gogDialogOpen && (
+        <div className="gl-dialog-overlay" onClick={() => setGogDialogOpen(false)}>
+          <div className="gl-dialog" onClick={e => e.stopPropagation()}>
+            <h3>🟣 GOG verbinden</h3>
+            <p className="gl-dialog-hint">
+              Nach dem GOG-Login wirst du auf eine Seite weitergeleitet.
+              Kopiere die <strong>komplette URL</strong> aus der Adressleiste und füge sie hier ein:
+            </p>
+            <input
+              className="gl-dialog-input"
+              type="text"
+              placeholder="https://embed.gog.com/on_login_success?code=..."
+              value={gogCode}
+              onChange={e => setGogCode(e.target.value)}
+              onKeyDown={e => { if (e.key === 'Enter') submitGogCode(); }}
+              disabled={gogStatus === 'loading' || gogStatus === 'success'}
+              autoFocus
+            />
+            {gogStatusMsg && (
+              <p className={`gl-dialog-status ${gogStatus}`}>{gogStatusMsg}</p>
+            )}
+            <div className="gl-dialog-actions">
+              <button onClick={() => setGogDialogOpen(false)} className="gl-dialog-cancel">Abbrechen</button>
+              <button
+                onClick={submitGogCode}
+                className="gl-dialog-submit"
+                disabled={!gogCode.trim() || gogStatus === 'loading' || gogStatus === 'success'}
+              >
+                {gogStatus === 'loading' ? 'Verbinde...' : 'Verbinden'}
+              </button>
+            </div>
+          </div>
+        </div>
+      )}
     </div>
   );
 }