use shared IPosition interface for diagrams and current move state

src/components/PgnViewer.tsx

@@ -1,9 +1,10 @@
 import LichessPgnViewer from "lichess-pgn-viewer";
 import { useEffect, useRef } from "react";
+import type { IPosition } from "#/interfaces.ts";
 
 interface IProps {
 	gamePgn: string;
-	handlePlyChange: ({ ply, fen }: { ply: number; fen: string }) => void;
+	handlePlyChange: ({ ply, fen }: IPosition) => void;
 }
 
 const PgnViewer = ({ gamePgn, handlePlyChange }: IProps) => {

src/hooks/useChessGame.ts

@@ -1,14 +1,10 @@
 import { type ChangeEvent, useReducer, useRef, useState } from "react";
+import type { IPosition } from "#/interfaces.ts";
 import { gameReducer, initialGameState } from "#/reducers/gameReducer.ts";
 import { downloadPDF } from "#/utils/pdfUtils.ts";
 import { buildPgnString, getHeaders } from "#/utils/pgnUtils.ts";
 import { downloadString } from "#/utils/stringUtils.ts";
 
-interface IPosition {
-	ply: number;
-	fen: string;
-}
-
 export const useChessGame = () => {
 	const [gameState, gameDispatch] = useReducer(gameReducer, initialGameState);
 
@@ -21,7 +17,7 @@ export const useChessGame = () => {
 
 	const fileInputRef = useRef<HTMLInputElement | null>(null);
 
-	const handlePlyChange = ({ ply, fen }: { ply: number; fen: string }) => {
+	const handlePlyChange = ({ ply, fen }: IPosition) => {
 		setCurrentPosition({ ply, fen });
 	};
 

src/interfaces.ts

@@ -0,0 +1,4 @@
+export interface IPosition {
+	ply: number;
+	fen: string;
+}

src/reducers/gameReducer.ts

@@ -1,7 +1,4 @@
-interface IDiagrams {
+import type { IPosition } from "#/interfaces.ts";
-	ply: number;
-	fen: string;
-}
 
 export interface IHeader {
 	event: string;
@@ -23,7 +20,7 @@ export interface IHeader {
 export interface IGameState {
 	pgn: string;
 	headers: IHeader;
-	diagrams: IDiagrams[];
+	diagrams: IPosition[];
 	diagramClock: boolean;
 }
 
@@ -31,7 +28,7 @@ type GameAction =
 	| { type: "SET_GAME"; payload: { pgn: string; headers: IHeader } }
 	| { type: "CLEAR_GAME" }
 	| { type: "SET_HEADERS"; payload: IHeader }
-	| { type: "ADD_DIAGRAM"; payload: IDiagrams }
+	| { type: "ADD_DIAGRAM"; payload: IPosition }
 	| { type: "DELETE_DIAGRAM"; payload: { ply: number } }
 	| { type: "TOGGLE_DIAGRAM_CLOCK" };
 
@@ -86,7 +83,7 @@ export const gameReducer = (state: IGameState, action: GameAction) => {
 			return {
 				...state,
 				diagrams: state.diagrams.filter(
-					(diagram: IDiagrams) => diagram.ply !== action.payload.ply,
+					(diagram: IPosition) => diagram.ply !== action.payload.ply,
 				),
 			};
 		case "TOGGLE_DIAGRAM_CLOCK":