From 7671e9b2cc280d2b3d6c42a73444e0ef56414cd5 Mon Sep 17 00:00:00 2001
From: Vishesh 'ironeagle' Bangotra <aetoskia@gmail.com>
Date: Mon, 1 Dec 2025 18:16:46 +0530
Subject: [PATCH] feat: add draw-state support using game_over flag and update
 UI handling
MIME-Version: 1.0
Content-Type: text/plain; charset=UTF-8
Content-Transfer-Encoding: 8bit

Updated match data callback to interpret { game_over: true, winner: -1 } as a draw.

Added winner = "draw" UI state for display and disabling board interactions.

Updated status text in Board component to show “Draw!” when applicable.

Adjusted winner highlighting logic to avoid highlighting any symbol during draw.

Ensured ongoing games always set winner = null for consistent behavior.
---
 src/tictactoe/Board.tsx     | 4 ++++
 src/tictactoe/TicTacToe.tsx | 3 +++
 2 files changed, 7 insertions(+)

diff --git a/src/tictactoe/Board.tsx b/src/tictactoe/Board.tsx
index 04b4b42..8b184b5 100644
--- a/src/tictactoe/Board.tsx
+++ b/src/tictactoe/Board.tsx
@@ -14,6 +14,7 @@ interface BoardProps {
   board: string[][];
   turn: number;
   winner: string | null;
+  gameOver: boolean | null;
   players: PlayerModel[];
   myUserId: string | null;
   onCellClick: (row: number, col: number) => void;
@@ -23,6 +24,7 @@ export default function Board({
   board,
   turn,
   winner,
+  gameOver,
   players,
   myUserId,
   onCellClick,
@@ -53,6 +55,8 @@ export default function Board({
     status = "Waiting for opponent...";
   } else if (winner) {
     status = `Winner: ${winner}`;
+  } else if (gameOver) {
+    status = `Draw!!!`;
   } else if (myIndex === -1) {
     status = "Spectating";
   } else {
diff --git a/src/tictactoe/TicTacToe.tsx b/src/tictactoe/TicTacToe.tsx
index 19453f0..ddae137 100644
--- a/src/tictactoe/TicTacToe.tsx
+++ b/src/tictactoe/TicTacToe.tsx
@@ -13,6 +13,7 @@ export default function TicTacToe() {
   ]);
   const [turn, setTurn] = useState<number>(0);
   const [winner, setWinner] = useState<string | null>(null);
+  const [gameOver, setGameOver] = useState<boolean | null>(null);
   const [players, setPlayers] = useState<PlayerModel[]>([]);
 
   const { sendMatchData, onMatchData, matchId, session } = useNakama();
@@ -29,6 +30,7 @@ export default function TicTacToe() {
 
       setBoard(state.board.grid);
       setTurn(state.turn);
+      setGameOver(state.game_over);
       if (state.winner >= 0) {
         // Somebody actually won (0 or 1)
         setWinner(state.winner);
@@ -118,6 +120,7 @@ export default function TicTacToe() {
             board={board}
             turn={turn}
             winner={winner}
+            gameOver={gameOver}
             players={players}
             myUserId={session?.user_id ?? null}
             onCellClick={handleCellClick}