Skip to content

Use inputMode="decimal" instead of "numeric" on SettlementForm's and QuoteForm's amount inputs #234

Description

@Jagadeeshftw

📌 Description

SettlementForm (src/components/SettlementForm.tsx) and QuoteForm (src/components/QuoteForm.tsx) both set inputMode="numeric" on their amount <input>. On iOS and many Android keyboards, inputMode="numeric" shows a digit-only keypad with no decimal point key, while inputMode="decimal" shows the same digit keypad plus a decimal separator. Since both forms accept and validate fractional amounts (validate() in SettlementForm.tsx uses Number(amount) with no integer-only constraint, and Stellar amounts routinely carry decimal precision), mobile users currently have no easy way to type a fractional amount like 12.5 without switching keyboards or pasting.

🧩 Requirements and context

  • Change inputMode="numeric" to inputMode="decimal" on the amount input in SettlementForm.tsx and on the amount input in QuoteForm.tsx.
  • No change to the fields' existing validate()/parsing logic, which already accepts decimal strings via Number(amount).
  • No visual/layout change beyond the mobile keyboard variant shown.

🛠️ Suggested execution

  • Update the amount <input>'s inputMode attribute in src/components/SettlementForm.tsx and src/components/QuoteForm.tsx.
  • Extend SettlementForm.test.tsx/QuoteForm.test.tsx with an assertion on the input's inputMode attribute, and confirm the existing decimal-amount test cases (if any) still pass.

✅ Acceptance criteria

  • Both amount inputs use inputMode="decimal".
  • Decimal amounts continue to validate and submit exactly as before.
  • Test coverage asserts the corrected inputMode attribute.

🔒 Security notes

No new attack surface; a mobile input-affordance fix with no change to validation logic.

📋 Guidelines

  • Minimum 95% test coverage
  • Clear documentation
  • Timeframe: 96 hours

Metadata

Metadata

Assignees

No one assigned

    Labels

    GrantFox OSSIssue tracked in GrantFox OSSMaybe RewardedIssue may be eligible for a GrantFox rewardOfficial Campaign | FWC26Campaign: Official Campaign | FWC26bugSomething isn't workingfrontendFrontend / UI workui-uxUI/UX design task

    Type

    Projects

    No projects

    Milestone

    No milestone

    Relationships

    None yet

    Development

    No branches or pull requests

    Issue actions