Skip to content

fix(ContractorPayments): restore hours input typing + live hint updates#2262

Open
aaronlee777 wants to merge 1 commit into
mainfrom
al/fix/contractor-hourly-input
Open

fix(ContractorPayments): restore hours input typing + live hint updates#2262
aaronlee777 wants to merge 1 commit into
mainfrom
al/fix/contractor-hourly-input

Conversation

@aaronlee777

Copy link
Copy Markdown
Contributor

Summary

  • Follow-up to refactor(ContractorPayments): replace total tally with live hourly pay hint #2241. The hours input in the edit-contractor-payment modal was dropping typed characters and the live pay hint wasn't updating on arrow-key commits.
  • Root cause: refactor(ContractorPayments): replace total tally with live hourly pay hint #2241 attached an onChange handler directly to the <Input> slot inside react-aria's <NumberField>, which replaced react-aria's context-injected handler that controls the displayed text and value commits.
  • Fix: move the onChange callback up onto <Group> so React's synthetic-event bubbling observes the same events without overriding react-aria's handler. Drive the hint from a useState<number> fed by onInputChange (per-keystroke) + onChange (arrow keys / step buttons).
  • Hint stays live; the inner <Input> is back under react-aria's control.

Test plan

  • Open the edit-payment modal for an hourly contractor — typing into Hours updates the field and the hint live, character-by-character.
  • Press ↑ / ↓ — Hours steps and the hint updates with each step.
  • Open the modal for a fixed-wage contractor — no hint, no Hours field.
  • Hint hides when no hourly rate is set on the contractor.
  • Submit — hours reaches the payload unchanged.
  • Regression sanity in Storybook: type into any other NumberInput story — no dropped characters.

🤖 Generated with Claude Code

The previous refactor attached an onChange handler directly to the <Input>
slot inside react-aria's <NumberField>, which replaced react-aria's own
context-injected handler. Typed characters never reached the field's
displayed state and the cached hint stayed stale on arrow-key commits.

Move the onChange callback up onto <Group> so React's synthetic-event
bubbling observes the same change events without overriding react-aria's
handler, and drive the hint from a useState<number> fed by onInputChange
(live typing) + onChange (arrow keys / step buttons).

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@aaronlee777 aaronlee777 requested a review from a team as a code owner June 24, 2026 20:41
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

1 participant