Skip to content

Add Snake Game to Mentat Party#8

Open
mentatai[bot] wants to merge 4 commits intomainfrom
mentat-8
Open

Add Snake Game to Mentat Party#8
mentatai[bot] wants to merge 4 commits intomainfrom
mentat-8

Conversation

@mentatai
Copy link
Copy Markdown
Contributor

@mentatai mentatai bot commented Oct 6, 2025

This PR adds a playable Snake game to the Mentat Party application, making it more engaging and interactive for users.

Changes

New Features

  • Snake Game Component (client/src/components/Snake.tsx)

    • Canvas-based rendering with grid visualization
    • Arrow key controls for snake movement
    • Spacebar to pause/resume gameplay
    • Score tracking (10 points per food item)
    • Game over detection and restart functionality
    • Proper collision detection (walls and self-collision)
  • Routing System

    • Added react-router-dom for navigation
    • Home page (client/src/pages/Home.tsx) with game links and server status
    • Snake game page (client/src/pages/SnakePage.tsx) with back navigation
    • Updated App.tsx to use React Router

Bug Fixes & Improvements

  • Fixed snake tail collision bug (snake no longer collides with tail position that will be vacated)
  • Added preventDefault() on arrow keys to prevent page scrolling during gameplay
  • Restored server status display on home page (maintains original functionality)
  • Fixed Game Over overlay positioning to be relative to canvas

Technical Details

  • Game runs at 150ms tick rate for smooth gameplay
  • 20x20 grid with 20px cells (400x400px canvas)
  • Hot-reloaded development with Vite
  • Maintains existing test infrastructure and build process

The Snake game is now accessible at /snake and provides a fun, interactive experience for users visiting Mentat Party!


🤖 This PR was created with Mentat. See my steps and cost here

  • Wake on any new activity.

mentatai bot and others added 3 commits October 6, 2025 17:35
- Installed react-router-dom for navigation
- Created Snake game component with:
  - Canvas-based rendering
  - Arrow key controls
  - Collision detection
  - Score tracking
  - Pause functionality (spacebar)
  - Game over and restart
- Added Home page with navigation
- Added SnakePage wrapper
- Updated App.tsx to use React Router

Mentat precommit script passed. Log: https://qa.mentat.ai/gh/AbanteAI/qa-party/log/50eefdc6-2cdd-4895-8044-7285be06429c

Co-authored-by: jakethekoenig <385534+jakethekoenig@users.noreply.github.com>
- Fixed bug where snake would incorrectly collide with its own tail
- Added preventDefault() to arrow keys to prevent page scrolling while playing

Mentat precommit script passed. Log: https://qa.mentat.ai/gh/AbanteAI/qa-party/log/184fc840-37c5-453e-8c23-39fe339ce381

Co-authored-by: jakethekoenig <385534+jakethekoenig@users.noreply.github.com>
- Added server status check back to Home page (was removed in routing refactor)
- Fixed Game Over overlay to be positioned relative to canvas instead of viewport
- Maintains "add, don't remove" principle from repo guidelines

Mentat precommit script passed. Log: https://qa.mentat.ai/gh/AbanteAI/qa-party/log/58dd8733-d0e1-4216-a1b2-f54e67a6231f

Co-authored-by: jakethekoenig <385534+jakethekoenig@users.noreply.github.com>
@mentatai mentatai bot requested a review from jakethekoenig October 6, 2025 17:40
- Added explicit undefined type to gameLoopRef to satisfy TypeScript strict mode
- useRef requires an initial value argument in strict TypeScript

Mentat precommit script passed. Log: https://qa.mentat.ai/gh/AbanteAI/qa-party/log/1dfd6533-5e2c-49f7-bf82-a41b5dfea8b4

Co-authored-by: jakethekoenig <385534+jakethekoenig@users.noreply.github.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

0 participants