Files
initiative/specs/014-inline-hp-delta/tasks.md

6.6 KiB

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.

  • 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

  • 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

  • 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.
  • 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

  • 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.
  • 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.
  • 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

  • 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.

  • 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).