Skip to content

Added in the errors from the documentation#143

Open
jenbreese wants to merge 1 commit into
devfrom
error-doc-mortgage-calc
Open

Added in the errors from the documentation#143
jenbreese wants to merge 1 commit into
devfrom
error-doc-mortgage-calc

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.

Mortgage Calculator -- validation, error states, and conversion fixes

Validation -- shared fields

  • Interest rate: empty error ("Please enter an interest rate.") and range error for values outside 0-20% ("Please enter an interest rate between 0 and 20%.")
  • Down payment %: range error for values outside 0-99.9% ("Enter a percentage between 0 - 99.9%.")
  • Property tax %: range error for values outside 0-10% ("Enter a property tax rate between 0 and 10%. Rates beyond this are unusual.")
  • Property tax $: relative range error when amount exceeds 10% of home price
  • Homeowners insurance %: range error for values outside 0-10%
  • Homeowners insurance $: relative range error when amount exceeds 10% of home price
  • HOA dues: range error for values outside $0-$20,000 (cap lowered from $100,000)
  • Property tax and insurance % defaults fixed from locale-formatted 1,25 / 0,35 to US decimal 1.25 / 0.35

Validation -- Tab 1 (Home you can afford)

  • Monthly payment: empty error and hard range cap of $1-$1,000,000
  • Down payment $: absolute range cap of $0-$1,000,000,000
  • Output backstop: if back-calculated home price exceeds display bounds, shows "That payment is too high to calculate. Try a lower amount to see your estimate."

Validation -- Tab 2 (Monthly payment)

  • Home price: empty error and range error for values outside $1-$1,000,000,000
  • Down payment $: negative error and exceeds-home-price error ("Your down payment can't exceed the home price. Try lowering it.")

Math fixes

  • Added loanAmount <= 0 guard in Tab 2 to prevent a $0 monthly payment flash when down payment equals or exceeds home price before the error state has propagated
  • Removed state-setting side effects from calculateMortgage -- the function is now purely computational with no display updates

Dollar/percent conversion fixes

  • Tab 1 dollar mode: the percent display is now a derived value computed from downPaymentAmount / calculatedHomePrice and passed as read-only display only -- it no longer feeds back into the calculation, eliminating the circular dependency
  • Tab 2 dollar mode: percent syncs correctly in handleDownPaymentAmountChange and in the home price onChange handler where the price is immediately available
  • Mode switch (percent to dollar): converts using (downPaymentPercent / 100) * price
  • Mode switch (dollar to percent): converts using downPaymentAmount / price
  • Tab 1 with no calculated price yet: dollar input shows blank on mode switch rather than a stale or incorrect value
  • Property tax and insurance conversions use .toFixed(4) to avoid rounding drift through repeated mode switches

Architecture

  • Page-level validation banner removed; all errors are inline next to their fields per spec cross-tab note Adding .github templates. #3
  • All field components (InterestRateField, LoanTermField, DownPaymentField, PropertyTaxField, HomeInsuranceField, HoaField, ResultsPanel, ResultRow, FieldMessage) lifted to module level with explicit TypeScript prop interfaces, fixing a focus-loss bug where inner components were remounting on every render
  • All state and handlers live in MortgageCalculator and are passed as props
  • FieldMessage always renders (hidden with sr-only when inactive) so aria-describedby always resolves to a valid element

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