Commit Graph

2 Commits

Author SHA1 Message Date
Thomas Hallock bda5bc6c0e fix: prevent database imports from being bundled into client code
**Problem:**
- player-ownership.ts imported drizzle-orm and @/db at top level
- When RoomMemoryPairsProvider imported client-safe utilities, Webpack bundled ALL imports including database code
- This caused hydration error: "The 'original' argument must be of type Function"
- Node.js util.promisify was being called in browser context

**Solution:**
1. Created player-ownership.client.ts with ONLY client-safe utilities
   - No database imports
   - Safe to import from 'use client' components
   - Contains: buildPlayerOwnershipFromRoomData(), buildPlayerMetadata(), helper functions

2. Updated player-ownership.ts to re-export client utilities and add server-only functions
   - Re-exports everything from .client.ts
   - Adds buildPlayerOwnershipMap() (async, database-backed)
   - Safe to import from server components/API routes

3. Updated RoomMemoryPairsProvider to import from .client.ts

**Result:**
- No more hydration errors on /arcade/room
- Client bundle doesn't include database code
- Server code can still use both client and server utilities

🤖 Generated with [Claude Code](https://claude.com/claude-code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-10-10 11:40:46 -05:00
Thomas Hallock b92a867677 feat: redesign memory game with invisible input and penalty scoring
## Input Interface Improvements
- Remove field borders and cursor for natural typing experience
- Hide input field completely off-screen, display numbers in clean text area
- Add click-to-focus on display area to maintain keyboard interaction
- Use monospace font with letter spacing for clear number display

## Memory Card Sizing Improvements
- Make cards viewport-aware using min(85vw, 700px) and min(50vh, 400px)
- Add responsive breakpoints for small screens to prevent scrolling
- Ensure entire game fits in viewport without requiring scroll
- Scale SVG content to fill available card space

## Penalty Scoring System
- Track incorrect guesses and apply 5-point penalty per wrong guess
- Display score breakdown showing base score, penalties, and final score
- Update results display to clearly show wrong guesses with point deduction
- Encourage careful thinking rather than random guessing

## User Experience
- Numbers appear naturally as user types without form-like interface
- Large but viewport-constrained cards for optimal memorization
- Fair scoring that rewards accuracy and penalizes careless guessing
- Responsive design works across all screen sizes

🤖 Generated with [Claude Code](https://claude.ai/code)

Co-Authored-By: Claude <noreply@anthropic.com>
2025-09-10 14:21:36 -05:00