Frontend: Uncapped hit decision UI #7

New Issue

cal · 2026-02-11T21:04:04Z

cal commented

2026-02-11 21:04:04 +00:00

Summary

Add frontend UI for the uncapped hit interactive decision workflow implemented in #6. The backend emits decision_required events with 5 new phases that need corresponding UI prompts.

Backend WebSocket Events

The backend already emits and handles these events:

Events the frontend receives (`decision_required`)

The decision_required event includes a phase field and a data payload:

Phase	Deciding Team	Data Payload
`awaiting_uncapped_lead_advance`	Offensive	`hit_type`, `hit_location`, `lead_runner_base`, `lead_target_base`, `lead_runner_lineup_id`, `auto_runners`
`awaiting_uncapped_defensive_throw`	Defensive	`lead_runner_base`, `lead_target_base`, `lead_runner_lineup_id`, `hit_location`
`awaiting_uncapped_trail_advance`	Offensive	`trail_runner_base`, `trail_target_base`, `trail_runner_lineup_id`, `hit_location`
`awaiting_uncapped_throw_target`	Defensive	`lead_runner_`, `trail_runner_`, `hit_location`
`awaiting_uncapped_safe_out`	Offensive	`d20_roll`, `runner` (lead/trail), `runner_base`, `target_base`, `runner_lineup_id`, `hit_location`

Events the frontend emits

Event	Payload	Notes
`submit_uncapped_lead_advance`	`{ game_id, advance: bool }`
`submit_uncapped_defensive_throw`	`{ game_id, will_throw: bool }`
`submit_uncapped_trail_advance`	`{ game_id, advance: bool }`
`submit_uncapped_throw_target`	`{ game_id, target: "lead" \| "trail" }`
`submit_uncapped_safe_out`	`{ game_id, result: "safe" \| "out" }`

UI Requirements

1. Lead Runner Advance Prompt (Offensive)

Show: "Single/Double (uncapped) to [LF/CF/RF]"
Show: which runner is the lead runner and what base they're attempting
Show: auto-scoring runners (e.g. "R3 scores automatically")
Buttons: Attempt Advance / Hold

2. Defensive Throw Prompt (Defensive)

Show: which runner is attempting which base
Show: hit location (relevant for safe range modifiers)
Buttons: Throw / Let it go

3. Trail Runner Advance Prompt (Offensive)

Show: trail runner info and target base
Buttons: Attempt Advance / Hold

4. Throw Target Prompt (Defensive)

Show: both runners and their target bases
Buttons: Throw at Lead / Throw at Trail

5. Safe/Out Declaration (Offensive)

Show: d20 roll result
Show: which runner is being checked, hit location
Info text: "Check your card: Runner Running - OF Arm (min 1, max 19). +2 if RF throws to 3rd, -2 if LF throws to 3rd."
Buttons: Safe / Out

Design Notes

Follow existing decision prompt patterns (defensive/offensive setup panels)
Mobile-first layout
Clear indication of which team needs to act
The game_state_update broadcast fires after each step, so the state includes pending_uncapped_hit with all accumulated decisions for display context

Relates to

Backend implementation: #6 (closed)
Existing decision UI patterns in frontend-sba/components/

## Summary Add frontend UI for the uncapped hit interactive decision workflow implemented in #6. The backend emits `decision_required` events with 5 new phases that need corresponding UI prompts. ## Backend WebSocket Events The backend already emits and handles these events: ### Events the frontend receives (`decision_required`) The `decision_required` event includes a `phase` field and a `data` payload: | Phase | Deciding Team | Data Payload | |-------|--------------|-------------| | `awaiting_uncapped_lead_advance` | Offensive | `hit_type`, `hit_location`, `lead_runner_base`, `lead_target_base`, `lead_runner_lineup_id`, `auto_runners` | | `awaiting_uncapped_defensive_throw` | Defensive | `lead_runner_base`, `lead_target_base`, `lead_runner_lineup_id`, `hit_location` | | `awaiting_uncapped_trail_advance` | Offensive | `trail_runner_base`, `trail_target_base`, `trail_runner_lineup_id`, `hit_location` | | `awaiting_uncapped_throw_target` | Defensive | `lead_runner_*`, `trail_runner_*`, `hit_location` | | `awaiting_uncapped_safe_out` | Offensive | `d20_roll`, `runner` (lead/trail), `runner_base`, `target_base`, `runner_lineup_id`, `hit_location` | ### Events the frontend emits | Event | Payload | Notes | |-------|---------|-------| | `submit_uncapped_lead_advance` | `{ game_id, advance: bool }` | | | `submit_uncapped_defensive_throw` | `{ game_id, will_throw: bool }` | | | `submit_uncapped_trail_advance` | `{ game_id, advance: bool }` | | | `submit_uncapped_throw_target` | `{ game_id, target: "lead" \| "trail" }` | | | `submit_uncapped_safe_out` | `{ game_id, result: "safe" \| "out" }` | | ## UI Requirements ### 1. Lead Runner Advance Prompt (Offensive) - Show: "Single/Double (uncapped) to [LF/CF/RF]" - Show: which runner is the lead runner and what base they're attempting - Show: auto-scoring runners (e.g. "R3 scores automatically") - Buttons: **Attempt Advance** / **Hold** ### 2. Defensive Throw Prompt (Defensive) - Show: which runner is attempting which base - Show: hit location (relevant for safe range modifiers) - Buttons: **Throw** / **Let it go** ### 3. Trail Runner Advance Prompt (Offensive) - Show: trail runner info and target base - Buttons: **Attempt Advance** / **Hold** ### 4. Throw Target Prompt (Defensive) - Show: both runners and their target bases - Buttons: **Throw at Lead** / **Throw at Trail** ### 5. Safe/Out Declaration (Offensive) - Show: d20 roll result - Show: which runner is being checked, hit location - Info text: "Check your card: Runner Running - OF Arm (min 1, max 19). +2 if RF throws to 3rd, -2 if LF throws to 3rd." - Buttons: **Safe** / **Out** ## Design Notes - Follow existing decision prompt patterns (defensive/offensive setup panels) - Mobile-first layout - Clear indication of which team needs to act - The `game_state_update` broadcast fires after each step, so the state includes `pending_uncapped_hit` with all accumulated decisions for display context ## Relates to - Backend implementation: #6 (closed) - Existing decision UI patterns in `frontend-sba/components/`

cal referenced this issue from a commit

2026-02-12 20:05:29 +00:00

CLAUDE: Implement uncapped hit decision UI + backend bugfixes (Issue #7)

cal referenced this issue

2026-02-12 20:13:29 +00:00

CLAUDE: Implement uncapped hit decision UI + backend bugfixes (Issue #7) #9

cal referenced this issue from a commit

2026-02-12 20:13:38 +00:00

Merge pull request 'CLAUDE: Implement uncapped hit decision UI + backend bugfixes (Issue #7)' (#9) from feature/uncapped-hit-decision-ui into main

Sign in to join this conversation.