Re-use existing types for Selected

src/App.tsx

@@ -38,10 +38,8 @@ type PieceState = {
 }
 
 type Selected = {
-  kind: PIECE,
-  rank: RANK,
-  file: FILE,
-  color: COLOR,
+  piece: PieceState,
+  location: Coordinates,
 }
 
 type FileState = {
@@ -178,10 +176,11 @@ const Cell = ({ boardState, playerColor, rank, file, selected, onSelectDestinati
 
   const onClick = async () => {
     const selected: Selected = {
-      kind: piece.kind,
-      color: piece.color,
-      file,
-      rank,
+      piece: { ...piece },
+      location: {
+        file,
+        rank,
+      },
     };
 
     return await onSelectPiece(selected);
@@ -190,10 +189,10 @@ const Cell = ({ boardState, playerColor, rank, file, selected, onSelectDestinati
   const maybeOnClick = piece.color === playerColor ? onClick : undefined;
 
   const classNames = selected !== null
-    && selected.kind === piece.kind
-    && selected.color === piece.color
-    && selected.file === file
-    && selected.rank === rank
+    && selected.piece.kind === piece.kind
+    && selected.piece.color === piece.color
+    && selected.location.file === file
+    && selected.location.rank === rank
     ? ["icon-cell", "selected"]
     : ["icon-cell"];