Implement the 014-inline-hp-delta feature that replaces the damage/heal mode toggle with explicit action buttons and Enter-to-damage keyboard shortcut
Co-Authored-By: Claude Opus 4.6 <noreply@anthropic.com>
This commit is contained in:
Lukas
143
specs/014-inline-hp-delta/tasks.md
Normal file
143
specs/014-inline-hp-delta/tasks.md
Normal file
@@ -0,0 +1,143 @@
|
||||
# Tasks: Inline HP Delta Input
|
||||
|
||||
**Input**: Design documents from `/specs/014-inline-hp-delta/`
|
||||
**Prerequisites**: plan.md, spec.md, research.md, data-model.md, quickstart.md
|
||||
|
||||
**Tests**: Tests are included because domain tests already exist and the spec has testable acceptance scenarios.
|
||||
|
||||
**Organization**: Tasks are grouped by user story. US1 and US2 share the same component refactor but have distinct acceptance criteria.
|
||||
|
||||
## Format: `[ID] [P?] [Story] Description`
|
||||
|
||||
- **[P]**: Can run in parallel (different files, no dependencies)
|
||||
- **[Story]**: Which user story this task belongs to (e.g., US1, US2, US3)
|
||||
- Include exact file paths in descriptions
|
||||
|
||||
---
|
||||
|
||||
## Phase 1: Setup
|
||||
|
||||
**Purpose**: No new project setup needed. This feature modifies a single existing component.
|
||||
|
||||
- [x] T001 Verify existing `pnpm check` passes before starting work (run from repo root)
|
||||
|
||||
---
|
||||
|
||||
## Phase 2: Foundational
|
||||
|
||||
**Purpose**: No foundational changes needed. The existing `adjustHp` domain function, `adjustHpUseCase`, and `useEncounter` hook all support the new UI without modification.
|
||||
|
||||
**Checkpoint**: No blocking prerequisites -- proceed directly to user story implementation.
|
||||
|
||||
---
|
||||
|
||||
## Phase 3: User Story 1 - Apply Damage via Enter Key (Priority: P1) MVP
|
||||
|
||||
**Goal**: Users type a number and press Enter to apply damage. Input clears after applying.
|
||||
|
||||
**Independent Test**: Set a combatant to 20/20 HP, type 7, press Enter, verify HP shows 13 and input is cleared.
|
||||
|
||||
### Tests for User Story 1
|
||||
|
||||
- [x] T002 [US1] Write acceptance tests for Enter-to-damage behavior in `packages/domain/src/__tests__/adjust-hp.test.ts` -- verify existing domain tests cover: damage subtraction, clamp to 0, zero rejection. Add any missing scenarios from spec (US1 scenarios 1-4).
|
||||
|
||||
### Implementation for User Story 1
|
||||
|
||||
- [x] T003 [US1] Refactor `apps/web/src/components/quick-hp-input.tsx`: remove `Mode` type, remove `mode` state variable, remove mode toggle button, remove Tab key override for mode switching. Keep the numeric input and the `value` state variable.
|
||||
- [x] T004 [US1] Update Enter key handler in `apps/web/src/components/quick-hp-input.tsx`: when user presses Enter with a valid positive integer, call `onAdjustHp(combatantId, -n)` (always damage), then clear input. Reject zero, empty, and non-numeric values.
|
||||
**Checkpoint**: At this point, Enter-to-damage works. No heal capability yet (added in US2). (Escape key verification merged into T009.)
|
||||
|
||||
---
|
||||
|
||||
## Phase 4: User Story 2 - Apply Damage or Heal via Explicit Buttons (Priority: P1)
|
||||
|
||||
**Goal**: Small damage and heal buttons next to the input allow explicit action choice.
|
||||
|
||||
**Independent Test**: Set a combatant to 10/20 HP, type 5, click heal button, verify HP shows 15 and input clears.
|
||||
|
||||
### Implementation for User Story 2
|
||||
|
||||
- [x] T006 [US2] Add damage button (Sword icon, red styling) to `apps/web/src/components/quick-hp-input.tsx` that reads the current input value and calls `onAdjustHp(combatantId, -n)`, then clears input. Button is disabled when input is empty or invalid.
|
||||
- [x] T007 [US2] Add heal button (Heart icon, green styling) to `apps/web/src/components/quick-hp-input.tsx` that reads the current input value and calls `onAdjustHp(combatantId, +n)`, then clears input. Button is disabled when input is empty or invalid.
|
||||
- [x] T008 [US2] Ensure damage and heal buttons are visually distinct (red vs green, Sword vs Heart icons) and match existing Tailwind/shadcn styling conventions in `apps/web/src/components/quick-hp-input.tsx`.
|
||||
|
||||
**Checkpoint**: Both Enter-to-damage and explicit damage/heal buttons work. Full feature is functional.
|
||||
|
||||
---
|
||||
|
||||
## Phase 5: User Story 3 - Keyboard-Driven Workflow (Priority: P2)
|
||||
|
||||
**Goal**: Keyboard-only workflow for damage is seamless (type + Enter). Escape clears without applying.
|
||||
|
||||
**Independent Test**: Focus input, type number, press Enter -- damage applied. Focus input, type number, press Escape -- input cleared, no HP change.
|
||||
|
||||
### Implementation for User Story 3
|
||||
|
||||
- [x] T009 [US3] Verify that the refactored component in `apps/web/src/components/quick-hp-input.tsx` supports full keyboard workflow: focus input, type digits, Enter applies damage, Escape clears. Confirm Tab key is NOT overridden (default browser focus behavior). Also verify FR-008: delta input is not rendered for combatants without HP tracking (no max HP set). Fix any issues found.
|
||||
|
||||
**Checkpoint**: All user stories functional and keyboard workflow verified.
|
||||
|
||||
---
|
||||
|
||||
## Phase 6: Polish & Cross-Cutting Concerns
|
||||
|
||||
**Purpose**: Final validation across all stories.
|
||||
|
||||
- [x] T010 Run `pnpm check` (knip + format + lint + typecheck + test) and fix any issues
|
||||
- [ ] T011 Run quickstart.md manual verification steps against the dev server (`pnpm --filter web dev`). Also verify FR-010: direct editing of the current HP absolute value still works alongside the delta input.
|
||||
|
||||
---
|
||||
|
||||
## Dependencies & Execution Order
|
||||
|
||||
### Phase Dependencies
|
||||
|
||||
- **Setup (Phase 1)**: No dependencies
|
||||
- **Foundational (Phase 2)**: N/A (no foundational tasks)
|
||||
- **US1 (Phase 3)**: Depends on Phase 1 passing
|
||||
- **US2 (Phase 4)**: Depends on T003 (component refactor from US1)
|
||||
- **US3 (Phase 5)**: Depends on T004 (Enter key handler from US1)
|
||||
- **Polish (Phase 6)**: Depends on all user stories complete
|
||||
|
||||
### User Story Dependencies
|
||||
|
||||
- **User Story 1 (P1)**: No dependencies on other stories. Core refactor.
|
||||
- **User Story 2 (P1)**: Depends on US1 component refactor (T003) since buttons are added to the refactored component.
|
||||
- **User Story 3 (P2)**: Depends on US1 (T004) since it validates the keyboard workflow established there.
|
||||
|
||||
### Within Each User Story
|
||||
|
||||
- Tests/verification before or alongside implementation
|
||||
- Core logic before visual polish
|
||||
- Commit after each task or logical group
|
||||
|
||||
### Parallel Opportunities
|
||||
|
||||
- T006 and T007 (damage button and heal button) can be implemented in parallel since they are independent click handlers in the same file -- but given they're both small additions to one component, sequential is equally efficient.
|
||||
|
||||
---
|
||||
|
||||
## Implementation Strategy
|
||||
|
||||
### MVP First (User Story 1 Only)
|
||||
|
||||
1. T001: Verify clean state
|
||||
2. T002: Verify/add domain tests
|
||||
3. T003-T005: Refactor component, Enter-to-damage, verify Escape
|
||||
4. **STOP and VALIDATE**: Type number + Enter applies damage, input clears
|
||||
|
||||
### Incremental Delivery
|
||||
|
||||
1. US1: Enter-to-damage works (MVP)
|
||||
2. US2: Add damage/heal buttons (full feature)
|
||||
3. US3: Verify keyboard workflow (polish)
|
||||
4. T010-T011: Final quality gate
|
||||
|
||||
---
|
||||
|
||||
## Notes
|
||||
|
||||
- This is a single-component refactor. All implementation tasks modify `apps/web/src/components/quick-hp-input.tsx`.
|
||||
- No domain or application layer changes needed.
|
||||
- The existing `adjustHp` domain function already handles positive (heal) and negative (damage) deltas with clamping.
|
||||
- Total: 10 tasks across 6 phases (T005 merged into T009).
|
||||
Reference in New Issue
Block a user