renamed BattleShipGame.tsx to BattleshipGame.tsx to match props name. using props interface for both instead of using commonProps

src/App.tsx

@@ -5,7 +5,7 @@ import { useNakama } from "./providers/NakamaProvider";
 import Player from "./Player";
 import TicTacToeGame from "./games/tictactoe/TicTacToeGame";
 import { TicTacToeGameProps } from "./games/tictactoe/props";
-import BattleShipGame from "./games/battleship/BattleShipGame";
+import BattleshipGame from "./games/battleship/BattleshipGame"
 import { BattleshipGameProps } from "./games/battleship/props";
 
 import { GameState } from "./interfaces/states";
@@ -33,6 +33,14 @@ export default function App() {
     players: game.players,
     myUserId: session?.user_id ?? null,
   };
+  const ticTacToeProps: TicTacToeGameProps = {
+    ...commonProps,
+    onCellClick: handleCellClick,
+  };
+  const battleshipProps: BattleshipGameProps = {
+    ...commonProps,
+    metadata: game.metadata,
+  };
 
   // ---------------------------------------------------
   // RENDER GAME BOARD
@@ -44,16 +52,14 @@ export default function App() {
       case "tictactoe":
         return (
           <TicTacToeGame
-            {...commonProps}
-            onCellClick={handleCellClick}
+            {...ticTacToeProps}
           />
         );
 
       case "battleship":
         return (
-          <BattleShipGame
-            {...commonProps}
-            metadata={game.metadata}
+          <BattleshipGame
+            {...battleshipProps}
           />
         );