Skip to content

Added errors and standards to interest cal#142

Open
jenbreese wants to merge 2 commits into
devfrom
error-doc-interest
Open

Added errors and standards to interest cal#142
jenbreese wants to merge 2 commits into
devfrom
error-doc-interest

Conversation

@jenbreese

Copy link
Copy Markdown
Collaborator

READY FOR REVIEW

Summary

Notes: I added the errors in the error doc. I also updated some of the UI to match the new styles we are doing. I brought up some of the consistency issues.

Interest Calculator -- validation, formatting, and accessibility

Validation

  • Added empty field error on Initial amount: blocks calc, "Please enter an initial amount."
  • Added range error on Initial amount (outside $0-$100,000,000): blocks calc, "Enter an amount between $0 and $100,000,000."
  • Added empty field error on Interest rate: blocks calc, "Please enter an interest rate."
  • Added range error on Interest rate (outside 0%-1,000%): blocks calc, "Enter a rate between 0% and 1,000%."
  • Added warning on Interest rate at 0%: "At 0%, no interest is earned or charged — final amount equals initial amount."
  • Added empty field error on Compounding periods: blocks calc, "Please enter the number of compounding periods."
  • Added range error on Compounding periods: dynamic message based on selected frequency, matching PV calculator pattern (e.g. "Enter a number of months between 0 and 1,200. (1,200 months = 100 years with monthly compounding).")
  • Added warning on Compounding periods at 0: "0 periods means no time passes — final amount will equal the initial amount."
  • Added info state on Compounding periods for decimals: "Rounded to the nearest whole period for calculation."
  • Compounding frequency change revalidates periods against the new frequency's max
  • Results panel shows "—" in all three output rows when any field has an error or is empty
  • "Fix the highlighted field to see results." message shown above results when errors are present

Formatting

  • Initial amount input now displays comma-formatted values using the raw/display pattern from the inflation calculator
  • Stepper buttons update both raw and display state and revalidate on click
  • Results panel uses formatCurrency via Intl.NumberFormat for consistent USD output across all three rows

Refactoring

  • frequencyMap expanded to include periodLabel per frequency, used in dynamic error messages
  • freqAdjective map added for error message copy
  • buildPeriodsRangeError helper lifted to module level, matching PV calculator pattern
  • Calculation moved from useEffect to useMemo with 300ms debounced inputs
  • All field onChange/onBlur handlers extracted to named functions

Accessibility

  • aria-pressed added to Saving/Borrowing mode toggle buttons
  • aria-invalid and aria-describedby added to all three inputs
  • Error/warning <p> elements always rendered, hidden with sr-only when inactive so aria-describedby always resolves
  • role="alert" on error messages, omitted on warnings and info states
  • Results panel wrapped in aria-live="polite" aria-atomic="true"
  • aria-label on all stepper buttons

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.

2 participants