feat : arrow up/down to go to end/start position

src/sections/analysis/reviewPanelToolbar/goToLastPositionButton.tsx

@@ -3,6 +3,7 @@ import { Grid, IconButton, Tooltip } from "@mui/material";
 import { useAtomValue } from "jotai";
 import { boardAtom, gameAtom } from "../states";
 import { useChessActions } from "@/hooks/useChessActions";
+import { useEffect } from "react";
 
 export default function GoToLastPositionButton() {
   const { setPgn: setBoardPgn } = useChessActions(boardAtom);
@@ -14,6 +15,21 @@ export default function GoToLastPositionButton() {
 
   const isButtonDisabled = boardHistory >= gameHistory;
 
+  useEffect(() => {
+    const onKeyDown = (e: KeyboardEvent) => {
+      if (e.key === "ArrowUp") {
+        if (isButtonDisabled) return;
+        setBoardPgn(game.pgn());
+      }
+    };
+
+    window.addEventListener("keydown", onKeyDown);
+
+    return () => {
+      window.removeEventListener("keydown", onKeyDown);
+    };
+  }, [isButtonDisabled, setBoardPgn, game]);
+
   return (
     <Tooltip title="Go to final position">
       <Grid>

src/sections/analysis/reviewPanelToolbar/index.tsx

@@ -22,6 +22,8 @@ export default function ReviewPanelToolBar() {
       if (boardHistory.length === 0) return;
       if (e.key === "ArrowLeft") {
         undoBoardMove();
+      } else if (e.key === "ArrowDown") {
+        resetBoard({ fen: getStartingFen({ game: board }) });
       }
     };
 
@@ -30,7 +32,7 @@ export default function ReviewPanelToolBar() {
     return () => {
       window.removeEventListener("keydown", onKeyDown);
     };
-  }, [undoBoardMove, boardHistory]);
+  }, [undoBoardMove, boardHistory, resetBoard, board]);
 
   return (
     <Grid container item justifyContent="center" alignItems="center" xs={12}>