- Replaced multiple App-level state fields with unified GameState
- Added INITIAL_GAME_STATE and migrated App.tsx to use single game state
- Introduced GameProps as shared base props for all turn-based board games
- Created TicTacToeGameProps and BattleshipGameProps extending GameProps
- Updated TicTacToe and Battleship components to use new props
- Replaced verbose prop passing with spread {...commonProps}
- Updated renderGameBoard to use game.metadata consistently
- Renamed TicTacToeBoard -> TicTacToeGame for clarity
- Renamed BattleShipBoard -> BattleShipGame for naming consistency
- Updated all import paths to reflect new component names
- Replaced MatchDataMessage with MatchDataModel
- Moved GameState definition from models.ts to interfaces/states.ts
- Removed old board-specific prop structures and per-field state management
- Increased type safety and reduced duplication across the codebase
This commit consolidates game state flow, introduces a clean component props
architecture, and standardizes naming convention
- Extracted context contract to `contexts.ts` (NakamaContextType)
- Added strongly typed internal provider refs in `refs.ts`
- socketRef: React.RefObject<Socket | null>
- gameMetadataRef: React.RefObject<GameMetadata | null>
- Added `NakamaProviderState` in `states.ts` for React-managed provider state
- session, socket, matchId, matchmakerTicket
- Refactored NakamaProvider to use new modular structure
- Replaced scattered useState/useRef with structured internal state + refs
- Updated onMatchData to use MatchDataMessage model
- Replaced deprecated MutableRefObject typing with RefObject
- Cleaned update patterns using `updateState` helper
- Updated imports to use new models and context structure
- Improved separation of responsibilities:
- models = pure domain types
- context = exposed provider API
- refs = internal mutable runtime refs
- state = provider-managed reactive state
- Ensured all Nakama provider functions fully typed and consistent with TS
This refactor improves clarity, type safety, and maintainability for the
Nakama real-time multiplayer provider.
Added renderGameBoard() resolver for dynamic board rendering
Board now hidden before match join
Game auto-selected based on metadata.game from Player matchmaking
Updated header to use dynamic game name
Removed hardcoded Battleship board
- Added metadata state to App and wired incoming match metadata.
- Added Fleet + FLEET_ORDER in BattleShipBoard to drive ship placement order.
- Added nextShip + nextShipSize calculation for guided placement.
- Updated handlePlace and handleShoot to send structured payloads (action + data).
- Added lobby/placement/battle status messages.
- Updated grids to use shipBoard + shipName/shipSize props instead of generic grid.
- Fixed metadata access (state.Metadata vs state.metadata).
- Consolidated PlacementGrid usage and disabled it during battle phase.
- Added logging for debugging incoming battleship boards.
- Replaced single `board` state with `boards` map in App.tsx
- Updated state parsing to use `state.boards` instead of `state.board.grid`
- Updated TicTacToeBoard props to accept `boards` instead of `board`
- Safely extracted TicTacToe board using `boards['tictactoe']?.grid ?? null`
- Added loading fallback when board is not yet available
- Updated rendering guards to prevent undefined map errors
This change fully aligns the frontend with the new multi-board MatchState
introduced on the server (supports TicTacToe, Battleship, and future games).
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.
Add PlayerModel interface and switch board/player logic to full player objects
Update matchmaking to require { game, mode } metadata
Replace lastModeRef with unified gameMetadataRef
Fix sendMatchData to send wrapped {data:{row,col}} payload
Update TicTacToe state handling (winner logic, board.grid)
Adjust UI to read symbols from player.metadata.symbol
Update matching logic to find player index via player.user_id
Improve safety checks for missing game/mode in matchmaking
- Added haiku display block under board with Framer Motion animations
- Implement sequential line-by-line fade-in (staggered 2.4s per line)
- Implement full-haiku fade-out using AnimatePresence keyed by haikuIndex
- Added timed rotation logic using total animation duration (~14.4s)
- Integrated getHaiku() random selector for new haiku each cycle
- Ensured smooth transitions by updating haikuIndex on cycle end
- Added no-winner condition wrapper to show haikus during gameplay
- Locked page scroll via body overflow hidden to prevent outer page scrolling.
- Moved game content into scrollable middle pane.
- Removed global top padding from styles.css to match new fixed-header layout.
- Simplified layout structure and removed unused commented code.
- Updated match start header in Player to match new UI theme.
- Reworked TicTacToe layout with dark theme, centered layout, and Framer Motion transitions.
- Added animated header bar and unified styling across Player, Board, and main screen.
- Improved opacity/transition behavior for the board based on session state.
- Cleaned up unused code and reorganized match data callback handling.
- Added hover scale, tap animations, and cell pop-in effects for moves.
- Implemented animated status transitions and winner pulse effect.
- Highlighted winning symbols with glow styling.
- Improved game feel with responsive and modern interaction feedback.
- Implemented animated "Finding opponent…" UI with pulsing dots using Framer Motion.
- Added cancelQueue() to allow players to cancel matchmaking mid-search.
- Updated startQueue() to set queueing state immediately for instant feedback.
- Improved player experience by clearly showing matchmaking progress instead of silent waiting.
- Added animated transitions between login, lobby, and match states.
- Improved layout, spacing, and visual styling for modern game feel.
- Added smooth auto-connect flow and integrated username lock-in behavior.
- Updated matchmaking and logout buttons with animated interactions.
- Integrated Leaderboard cleanly inside lobby panel.
- Moved all login, session UI, mode selection, and matchmaking logic from TicTacToe.tsx into Player.tsx.
- Added onMatchDataCallback prop support for Player component.
- Cleaned up TicTacToe.tsx by removing duplicated login/matchmaking UI and connect logic.
- Improved auto-connect on mount via Player.tsx.
- Added automatic connect() invocation on page load.
- Implemented robust login flow: register or auto-login based on local flags.
- Added logout support with clean WebSocket disconnect + state reset.
- Updated NakamaProvider with getSession(), autoLogin(), registerWithUsername().
- Connected logout button and integrated updated login behavior into UI.
