Tic Tac Toe

Build a simple Tic Tac Toe game using React. This game allows two players to take turns and play on a 3x3 board. The goal is to get three of the same symbol (X or O) in a row (horizontally, vertically, or diagonally).

Functional Requirements:

1. Render a 3x3 grid of squares.

2. Each player takes a turn placing "X" or "O".

3. Show a message like “Next Player: X” or “Next Player: O”.

4. Detect the winner or a draw and show the result.

5. Disable all squares after a win or draw.

6. Include a “Restart Game” button to reset the board. The restart button must have an id="restart".

7. Each cell must have an id in the format cell-0 to cell-8, corresponding to its position.

8. You must display a message showing the current status of the game. This message should appear at all times and clearly indicate one of the following:

9. Possible Status Messages:

• Next Player: X – when it's X's turn.
• Next Player: O – when it's O's turn.
• Winner: X – when player X wins.
• Winner: O – when player O wins.
• It's a Draw! – when all 9 cells are filled and there's no winner.

10. The element that displays this message must have the HTML id="status", so it can be accessed easily in automated tests.

Reference UI