# Next Session - Game Creation Implementation

## Quick Start

```bash
# Backend
cd backend && uv run python -m app.main

# Frontend
cd frontend-sba && bun run dev

# Redis (if not running)
cd backend && docker compose up -d redis
```

Services will be at:
- Backend: http://localhost:8000
- Frontend: http://localhost:3001
- API Docs: http://localhost:8000/docs

## Current State

✅ **Complete:**
- Discord OAuth authentication (full flow)
- SBA API integration (teams endpoint)
- User can sign in and stay authenticated

## Immediate Next Steps

### 1. Update Frontend Create Game Page (~15 min)

**File:** `frontend-sba/pages/games/create.vue`

**Changes needed:**
- Add `onMounted` hook to fetch teams from `/api/teams/?season=3`
- Populate team dropdowns with real data
- Remove placeholder message
- Add loading states

**Reference:** See existing auth store pattern in `store/auth.ts`

### 2. Implement Game Creation Endpoint (~20 min)

**File:** `backend/app/api/routes/games.py`

**Implement:** `POST /api/games`
```python
class CreateGameRequest(BaseModel):
    name: str
    home_team_id: int
    away_team_id: int
    is_ai_opponent: bool
    season: int = 3
    league_id: str = "sba"

@router.post("/")
async def create_game(request: CreateGameRequest):
    # Use existing game engine to create game
    # Return game_id
```

**Reference:** See `backend/terminal_client/` for game creation examples

### 3. Test Game Creation Flow (~10 min)

1. Sign in at http://localhost:3001/auth/login
2. Navigate to /games/create
3. Select two teams
4. Create game
5. Verify game appears in backend

### 4. Implement Game View Page (~30 min)

Once games can be created, implement:
- `frontend-sba/pages/games/[id].vue` - Display live game
- WebSocket connection to game
- Use existing components from Phase F2

## Technical Context

### SBA Teams Endpoint

```bash
curl "http://localhost:8000/api/teams/?season=3"
```

Returns ~16 active teams with:
- id, abbrev, sname, lname
- color (hex), gmid, gmid2
- division info

### Game Engine

Backend has complete game engine ready:
- `app/core/game_engine.py` - Main engine
- `app/core/state_manager.py` - State management
- `app/websocket/handlers.py` - 15 event handlers
- All tested with 730/731 tests passing

### Frontend Components

Phase F2 components ready to use:
- `components/Game/ScoreBoard.vue`
- `components/Game/GameBoard.vue`
- `components/Game/CurrentSituation.vue`
- `components/Game/PlayByPlay.vue`

See `frontend-sba/components/CLAUDE.md` for usage.

## Known Issues

- None currently

## Environment

**Backend .env configured:**
- Discord OAuth credentials
- SBA API URL and token
- Database connection working

**Frontend .env configured:**
- Discord Client ID
- API URL pointing to localhost:8000

## Resources

- **PRD:** `../prd-web-scorecard-1.1.md`
- **Backend Impl:** `../.claude/implementation/`
- **WebSocket Protocol:** See backend WebSocket handlers
- **Component Examples:** `frontend-sba/pages/demo.vue`