style : analysis card UI rework adjustments

src/sections/analysis/panelBody/classificationTab/movesPanel/index.tsx

@@ -2,15 +2,19 @@ import { Grid2 as Grid } from "@mui/material";
 import MovesLine from "./movesLine";
 import { useMemo } from "react";
 import { useAtomValue } from "jotai";
-import { gameAtom, gameEvalAtom } from "../../../states";
+import { boardAtom, gameAtom, gameEvalAtom } from "../../../states";
 import { MoveClassification } from "@/types/enums";
 
 export default function MovesPanel() {
   const game = useAtomValue(gameAtom);
+  const board = useAtomValue(boardAtom);
   const gameEval = useAtomValue(gameEvalAtom);
 
   const gameMoves = useMemo(() => {
-    const history = game.history();
+    const gameHistory = game.history();
+    const boardHistory = board.history();
+    const history = gameHistory.length ? gameHistory : boardHistory;
+
     if (!history.length) return undefined;
 
     const moves: { san: string; moveClassification?: MoveClassification }[][] =
@@ -20,14 +24,18 @@ export default function MovesPanel() {
       const items = [
         {
           san: history[i],
-          moveClassification: gameEval?.positions[i + 1]?.moveClassification,
+          moveClassification: gameHistory.length
+            ? gameEval?.positions[i + 1]?.moveClassification
+            : undefined,
         },
       ];
 
       if (history[i + 1]) {
         items.push({
           san: history[i + 1],
-          moveClassification: gameEval?.positions[i + 2]?.moveClassification,
+          moveClassification: gameHistory.length
+            ? gameEval?.positions[i + 2]?.moveClassification
+            : undefined,
         });
       }
 
@@ -35,17 +43,19 @@ export default function MovesPanel() {
     }
 
     return moves;
-  }, [game, gameEval]);
+  }, [game, board, gameEval]);
+
+  if (!gameMoves?.length) return null;
 
   return (
     <Grid
       container
       justifyContent="center"
       alignItems="start"
-      gap={0.7}
+      gap={0.5}
       paddingY={1}
       sx={{ scrollbarWidth: "thin", overflowY: "auto" }}
-      height="100%"
+      maxHeight="100%"
       size={6}
       id="moves-panel"
     >