From eab579cf930c3076a62d9b551568ffadbaa4167f Mon Sep 17 00:00:00 2001
From: GuillaumeSD <gsd.lfny@gmail.com>
Date: Sat, 3 May 2025 17:29:42 +0200
Subject: [PATCH] fix : load game

---
 sentry.client.config.ts                  |  1 +
 src/sections/loadGame/chessComInput.tsx  | 16 ++------
 src/sections/loadGame/gamePgnInput.tsx   |  2 +-
 src/sections/loadGame/lichessInput.tsx   | 17 ++------
 src/sections/loadGame/loadGameDialog.tsx | 49 +++++++++++++-----------
 5 files changed, 35 insertions(+), 50 deletions(-)

diff --git a/sentry.client.config.ts b/sentry.client.config.ts
index 4b2de13..c9c04cf 100644
--- a/sentry.client.config.ts
+++ b/sentry.client.config.ts
@@ -21,6 +21,7 @@ if (
     ignoreErrors: [
       "AbortError: The user aborted a request.",
       "Failed to fetch",
+      "Fetch is aborted",
     ],
   });
 }
diff --git a/src/sections/loadGame/chessComInput.tsx b/src/sections/loadGame/chessComInput.tsx
index ad4ccc1..4a3b69e 100644
--- a/src/sections/loadGame/chessComInput.tsx
+++ b/src/sections/loadGame/chessComInput.tsx
@@ -13,13 +13,10 @@ import {
 import { useEffect, useState } from "react";
 
 interface Props {
-  pgn: string;
-  setPgn: (pgn: string) => void;
-  /** Called when a game is selected; if provided, bypasses manual 'Add' */
-  onSelect?: (pgn: string) => void;
+  onSelect: (pgn: string) => void;
 }
 
-export default function ChessComInput({ pgn, setPgn, onSelect }: Props) {
+export default function ChessComInput({ onSelect }: Props) {
   const [requestCount, setRequestCount] = useState(0);
   const [chessComUsername, setChessComUsername] = useLocalStorage(
     "chesscom-username",
@@ -70,14 +67,7 @@ export default function ChessComInput({ pgn, setPgn, onSelect }: Props) {
         >
           {games.map((game) => (
             <ListItemButton
-              onClick={() => {
-                if (onSelect) {
-                  onSelect(game.pgn);
-                } else {
-                  setPgn(game.pgn);
-                }
-              }}
-              selected={pgn === game.pgn}
+              onClick={() => onSelect(game.pgn)}
               style={{ width: 350, maxWidth: 350 }}
               key={game.uuid}
             >
diff --git a/src/sections/loadGame/gamePgnInput.tsx b/src/sections/loadGame/gamePgnInput.tsx
index 04e253b..97b7391 100644
--- a/src/sections/loadGame/gamePgnInput.tsx
+++ b/src/sections/loadGame/gamePgnInput.tsx
@@ -7,7 +7,7 @@ interface Props {
 
 export default function GamePgnInput({ pgn, setPgn }: Props) {
   return (
-    <FormControl sx={{ m: 1, width: 600 }}>
+    <FormControl fullWidth>
       <TextField
         label="Enter PGN here..."
         variant="outlined"
diff --git a/src/sections/loadGame/lichessInput.tsx b/src/sections/loadGame/lichessInput.tsx
index 87957d5..a5bac2f 100644
--- a/src/sections/loadGame/lichessInput.tsx
+++ b/src/sections/loadGame/lichessInput.tsx
@@ -13,13 +13,10 @@ import {
 import { useEffect, useState } from "react";
 
 interface Props {
-  pgn: string;
-  setPgn: (pgn: string) => void;
-  /** Called when a game is selected; if provided, bypasses manual 'Add' */
-  onSelect?: (pgn: string) => void;
+  onSelect: (pgn: string) => void;
 }
 
-export default function LichessInput({ pgn, setPgn, onSelect }: Props) {
+export default function LichessInput({ onSelect }: Props) {
   const [requestCount, setRequestCount] = useState(0);
   const [lichessUsername, setLichessUsername] = useLocalStorage(
     "lichess-username",
@@ -70,15 +67,7 @@ export default function LichessInput({ pgn, setPgn, onSelect }: Props) {
         >
           {games.map((game) => (
             <ListItemButton
-              onClick={() => {
-                const selectedPgn: string = game.pgn;
-                if (onSelect) {
-                  onSelect(selectedPgn);
-                } else {
-                  setPgn(selectedPgn);
-                }
-              }}
-              selected={pgn === game.pgn}
+              onClick={() => onSelect(game.pgn)}
               style={{ width: 350, maxWidth: 350 }}
               key={game.id}
             >
diff --git a/src/sections/loadGame/loadGameDialog.tsx b/src/sections/loadGame/loadGameDialog.tsx
index c94d80e..6031a51 100644
--- a/src/sections/loadGame/loadGameDialog.tsx
+++ b/src/sections/loadGame/loadGameDialog.tsx
@@ -38,14 +38,13 @@ export default function NewGameDialog({ open, onClose, setGame }: Props) {
   const [parsingError, setParsingError] = useState("");
   const { addGame } = useGameDatabase();
 
-  const handleAddGame = (overridePgn?: string) => {
-    const usedPgn = overridePgn ?? pgn;
-    if (!usedPgn) return;
+  const handleAddGame = (pgn: string) => {
+    if (!pgn) return;
     setParsingError("");
 
     try {
-      const gameToAdd = getGameFromPgn(usedPgn);
-      setSentryContext("loadedGame", { pgn: usedPgn });
+      const gameToAdd = getGameFromPgn(pgn);
+      setSentryContext("loadedGame", { pgn });
 
       if (setGame) {
         setGame(gameToAdd);
@@ -71,7 +70,18 @@ export default function NewGameDialog({ open, onClose, setGame }: Props) {
   };
 
   return (
-    <Dialog open={open} onClose={handleClose} maxWidth="md" fullWidth>
+    <Dialog
+      open={open}
+      onClose={handleClose}
+      maxWidth="md"
+      fullWidth
+      PaperProps={{
+        sx: {
+          position: "fixed",
+          top: 0,
+        },
+      }}
+    >
       <DialogTitle marginY={1} variant="h5">
         {setGame ? "Load a game" : "Add a game to your database"}
       </DialogTitle>
@@ -106,25 +116,11 @@ export default function NewGameDialog({ open, onClose, setGame }: Props) {
           )}
 
           {gameOrigin === GameOrigin.ChessCom && (
-            <ChessComInput
-              pgn={pgn}
-              setPgn={setPgn}
-              onSelect={(selectedPgn: string) => {
-                setPgn(selectedPgn);
-                handleAddGame(selectedPgn);
-              }}
-            />
+            <ChessComInput onSelect={handleAddGame} />
           )}
 
           {gameOrigin === GameOrigin.Lichess && (
-            <LichessInput
-              pgn={pgn}
-              setPgn={setPgn}
-              onSelect={(selectedPgn: string) => {
-                setPgn(selectedPgn);
-                handleAddGame(selectedPgn);
-              }}
-            />
+            <LichessInput onSelect={handleAddGame} />
           )}
 
           {parsingError && (
@@ -140,6 +136,15 @@ export default function NewGameDialog({ open, onClose, setGame }: Props) {
         <Button variant="outlined" onClick={handleClose}>
           Cancel
         </Button>
+        {gameOrigin === GameOrigin.Pgn && (
+          <Button
+            variant="contained"
+            sx={{ marginLeft: 2 }}
+            onClick={() => handleAddGame(pgn)}
+          >
+            Add
+          </Button>
+        )}
       </DialogActions>
     </Dialog>
   );