feat : init game eval

src/sections/index/index.state.ts

@@ -0,0 +1,4 @@
+import { GameEval } from "@/types/eval";
+import { atom } from "jotai";
+
+export const gameReviewAtom = atom<GameEval | undefined>(undefined);

src/sections/index/reviewPanelBody.tsx

@@ -1,8 +1,34 @@
+import { useEffect, useState } from "react";
 import ReviewResult from "./reviewResult";
 import SelectDepth from "./selectDepth";
 import SelectGameOrigin from "./selectGame/selectGameOrigin";
+import { Stockfish } from "@/lib/engine/stockfish";
+import { useAtomValue } from "jotai";
+import { gameFensAtom } from "./selectGame/gameOrigin.state";
 
 export default function ReviewPanelBody() {
+  const [engine, setEngine] = useState<Stockfish | null>(null);
+  const gameFens = useAtomValue(gameFensAtom);
+
+  useEffect(() => {
+    const engine = new Stockfish();
+    engine.init().then(() => {
+      console.log("Engine initialized");
+    });
+    setEngine(engine);
+
+    return () => {
+      engine.shutdown();
+      console.log("Engine shutdown");
+    };
+  }, []);
+
+  const handleAnalyse = () => {
+    if (engine?.isReady() && gameFens) {
+      engine.evaluateGame(gameFens);
+    }
+  };
+
   return (
     <div id="review-panel-main">
       <h1 id="review-panel-title" className="white">
@@ -13,7 +39,7 @@ export default function ReviewPanelBody() {
 
       <button id="review-button" className="std-btn success-btn white">
         <img src="analysis_icon.png" height="25" />
-        <b>Analyse</b>
+        <b onClick={handleAnalyse}>Analyse</b>
       </button>
 
       <SelectDepth />

src/sections/index/selectGame/gameOrigin.state.ts

@@ -0,0 +1,3 @@
+import { atom } from "jotai";
+
+export const gameFensAtom = atom<string[]>([]);

src/sections/index/selectGame/inputGame.tsx

@@ -1,8 +1,27 @@
+import { GameOrigin } from "@/types/enums";
+import { useSetAtom } from "jotai";
+import { gameFensAtom } from "./gameOrigin.state";
+import { useEffect, useState } from "react";
+import { Chess } from "chess.js";
+
 interface Props {
+  gameOrigin: GameOrigin;
   placeholder?: string;
 }
 
 export default function InputGame({ placeholder }: Props) {
+  const [gamePgn, setGamePgn] = useState("");
+  const setGameFens = useSetAtom(gameFensAtom);
+
+  useEffect(() => {
+    const chess = new Chess();
+    chess.loadPgn(gamePgn);
+    const fens = chess.history({ verbose: true }).map((move) => {
+      return move.after;
+    });
+    setGameFens(fens);
+  }, [gamePgn]);
+
   return (
     <textarea
       id="pgn"
@@ -11,6 +30,8 @@ export default function InputGame({ placeholder }: Props) {
       rows={10}
       spellCheck="false"
       placeholder={placeholder}
+      value={gamePgn}
+      onChange={(e) => setGamePgn(e.target.value)}
     />
   );
 }

src/sections/index/selectGame/selectGameOrigin.tsx

@@ -5,6 +5,7 @@ import { GameOrigin } from "@/types/enums";
 
 export default function SelectGameOrigin() {
   const [gameOrigin, setGameOrigin] = useState(GameOrigin.Pgn);
+
   return (
     <>
       <div id="load-type-dropdown-container" className="white">
@@ -37,9 +38,13 @@ const gameOriginLabel: Record<GameOrigin, string> = {
 const renderSelectGameInfo = (gameOrigin: GameOrigin) => {
   switch (gameOrigin) {
     case GameOrigin.Pgn:
-      return <InputGame placeholder="Enter PGN here..." />;
+      return (
+        <InputGame gameOrigin={gameOrigin} placeholder="Enter PGN here..." />
+      );
     case GameOrigin.Json:
-      return <InputGame placeholder="Enter JSON here..." />;
+      return (
+        <InputGame gameOrigin={gameOrigin} placeholder="Enter JSON here..." />
+      );
     default:
       return <SelectGameAccount gameOrigin={gameOrigin} />;
   }