Build a React naval board

Build a simplified naval-grid game board in React. Requirements: - Render an `N x N` grid, for example `10 x 10`. - Ignore multiplayer, turn-taking, and networking. - You are given a fixed list of ships, where each ship occupies a set of coordinates on the board. - Each cell can be clicked to cycle through three visual states: `empty`, `white`, and `red`. - Treat `red` as a hit on a ship segment and `white` as a miss. - Show a status panel listing all ships as `sunk` or `not sunk`. - A ship is considered `sunk` only if every coordinate occupied by that ship is currently marked `red`. Discuss and implement: 1. The React component structure for the grid and status panel. 2. State management for cell states and ship definitions. 3. The click handler that updates a cell's state. 4. The logic for computing whether each ship is sunk. 5. Edge cases such as repeated clicks, reset behavior, and keeping rendering logic separate from game logic.