[cristim]

Summary

Fixes two Admin settings regression issues (#1411, #1412) in a single coordinated change on the same surface.

#1411 -- Inline range validation not shown as user types

• Root cause: wireInlineRangeValidation inserted the error <small> element via insertAdjacentElement('afterend', input), placing it as a flex item inside .setting-input { display: flex }. In the real browser the error appeared to the right of the input (not below it). Tests passed because the test DOM has bare inputs with no flex container.
• Fix A (JS): Change the insertion target to input.closest('.setting-input') ?? input.closest('label') ?? input so the error element lands outside the flex row.
• Fix B (CSS): Add flex-wrap: wrap to .setting-row and .setting-row > .field-error { flex-basis: 100% } so a direct-child error spans full width and wraps below the label+input row.
• Fix C: Wire inline validation for all four aws-savings-plans-*-coverage inputs (row 7.13 was missing entirely).

#1412 -- Multiple UX regressions

• Row 3.1 (laddering toggle label clickable): ladder.ts used <label for="setting-laddering-enabled"> making the label text toggle the checkbox. Changed to <span class="label-like" id="..."> + aria-labelledby on the input + <label class="toggle-label"> wrapper, matching the auto-collect pattern from issue ux(settings): "Auto-collect Recommendations" label is clickable; should be toggle-only #464.
• Rows 7.4/7.9 (cancel leaves stale highlight): Code already called updateDirtyMarkers() on cancel. Tests added to prevent future regression.
• Rows 6.2, 7.3/7.8, 8.4: Confirmed correct in code; existing tests pass.

Test plan

• All 2620 tests pass (npm test), 0 failures (17 new tests added)
• npm run build succeeds (webpack clean, same pre-existing bundle-size warning only)
• Admin > General Settings: type 0 into "Notification Days" field -- error appears below the input immediately (not to the right)
• Admin > Purchasing: type 101 into a Savings Plans Coverage % field -- inline error appears
• Admin > Commitment Laddering: clicking "Enable Commitment Laddering" text does NOT toggle the switch (only the switch widget responds)
• Admin > Global Defaults: change term, cancel -- "Unsaved changes" badge disappears and field highlight clears

Closes #1411
Closes #1412

[cristim]

@coderabbitai review

[coderabbitai]

✅ Action performed

Review finished.

Note: CodeRabbit is an incremental review system and does not re-review already reviewed commits. This command is applicable only when automatic reviews are paused.

[coderabbitai]

Warning

Review limit reached

You’ve reached a temporary PR review limit under our Fair Usage Limits Policy.

Your recent review volume is higher than typical usage, so adaptive limits are currently applied.

Next review available in: 41 minutes

Enable usage-based reviews in Billing to review now. Otherwise, wait until the next included review is available.
You're only billed for reviews past your plan's rate limits ($0.25/file).

How can I continue?

After more reviews become available, a review can be triggered using the @coderabbitai review command as a PR comment. Alternatively, push new commits to this PR.

To avoid repeated limits, reduce automatic review volume by pausing incremental auto-reviews earlier, using label-based review opt-in, excluding WIP or generated PR titles, or requesting reviews manually when the PR is ready. If your team needs uninterrupted high-volume reviews, an organization admin can enable usage-based reviews.

How do review limits work?

CodeRabbit enforces per-developer PR review limits for each organization. Most developers receive the normal plan review availability.

For paid Pro and Pro+ PR reviews, CodeRabbit uses adaptive limits for sustained high-volume activity. When a developer's recent PR review activity reaches the 95th percentile or higher among CodeRabbit users, additional reviews become available more gradually as earlier reviews age out of the rolling window.

Please refer docs for additional details.

Review details

⚙️ Run configuration

Configuration used: defaults

Review profile: CHILL

Plan: Pro

Run ID: a7da5dcb-00ee-4a05-9f95-bb05c3f8f982

📥 Commits

Reviewing files that changed from the base of the PR and between 473f69b and 05627d6.

📒 Files selected for processing (5)

• frontend/src/__tests__/ladder.test.ts
• frontend/src/__tests__/settings.test.ts
• frontend/src/ladder.ts
• frontend/src/settings.ts
• frontend/src/styles/settings.css

✨ Finishing Touches

🧪 Generate unit tests (beta)

• Create PR with unit tests
• Commit unit tests in branch fix/qa-admin-settings-ux

---

_{Comment @coderabbitai help to get the list of available commands.}

[cristim]

Merged to main after independent review (SHIP) + all CI green. inline range validation now renders below the input (flex-wrap) + SP-coverage inputs wired; laddering toggle label fixed; admin settings UX regressions guarded.