feat(auth): clarify breach-row label and polish the password strip #272

Merged

YousifShkara merged 1 commit from feat/BUNYIP-240-inline-password-feedback into main

2026-06-30 03:23:28 +02:00

YousifShkara commented

2026-06-30 03:11:40 +02:00

Owner

BUNYIP-250 (BUNYIP-240 follow-up): the live breach row showed ✗ next to a static "Not found in a known data breach" label whenever HIBP reported the password as leaked, which read as "the validator is broken" instead of "your password is compromised". Pair the indicator with a dynamic label and a one-line follow-up so the user has a path forward.

Each <li> now carries data-label-{pass,fail,pending}; the inline setState runs a syncRowLabel step that flips the visible .pw-label text per state. The breach row reads "Found in a known data breach. Pick a different password." on fail and keeps the existing copy on pass / pending. The other rows omit the dataset attributes so their labels stay static (length / case / digit do not change meaning per state).

A #pw-breach-help paragraph rendered hidden under the strip is revealed only when the breach row enters fail, explaining the constraint in one sentence so the user knows the right action is "pick a fresh password", not "type a stronger one".

Visual rhythm: glyphs now use Font Awesome (fa-regular fa-circle, fa-solid fa-circle-check, fa-solid fa-circle-xmark) via the kit already loaded under the bunyip-web CSP; each <li> is flex items-center gap-2; the strip lifts from text-xs to text-sm with space-y-1.5 so it reads as form copy instead of fine print. Same treatment for #pw-confirm-msg. No new CSP origins.

The server-side password_ok() backstop is untouched; this is presentation only.

#BUNYIP-250

BUNYIP-250 (BUNYIP-240 follow-up): the live breach row showed `✗` next to a static "Not found in a known data breach" label whenever HIBP reported the password as leaked, which read as "the validator is broken" instead of "your password is compromised". Pair the indicator with a dynamic label and a one-line follow-up so the user has a path forward. Each `<li>` now carries `data-label-{pass,fail,pending}`; the inline `setState` runs a `syncRowLabel` step that flips the visible `.pw-label` text per state. The breach row reads "Found in a known data breach. Pick a different password." on fail and keeps the existing copy on pass / pending. The other rows omit the dataset attributes so their labels stay static (length / case / digit do not change meaning per state). A `#pw-breach-help` paragraph rendered hidden under the strip is revealed only when the breach row enters `fail`, explaining the constraint in one sentence so the user knows the right action is "pick a fresh password", not "type a stronger one". Visual rhythm: glyphs now use Font Awesome (`fa-regular fa-circle`, `fa-solid fa-circle-check`, `fa-solid fa-circle-xmark`) via the kit already loaded under the bunyip-web CSP; each `<li>` is `flex items-center gap-2`; the strip lifts from `text-xs` to `text-sm` with `space-y-1.5` so it reads as form copy instead of fine print. Same treatment for `#pw-confirm-msg`. No new CSP origins. The server-side `password_ok()` backstop is untouched; this is presentation only. #BUNYIP-250

YousifShkara self-assigned this

2026-06-30 03:11:40 +02:00

YousifShkara added 1 commit

2026-06-30 03:11:40 +02:00

feat(auth): clarify breach-row label and polish the password strip

E2E / Playwright against deployment (pull_request) Successful in 21s

Details

Check / fmt + clippy + build + tests (pull_request) Successful in 9m56s

Details

Create release / Create release from merged PR (pull_request) Has been skipped

Details

1652907d4e

BUNYIP-250 (BUNYIP-240 follow-up): the live breach row showed `✗` next to a static "Not found in a known data breach" label whenever HIBP reported the password as leaked, which read as "the validator is broken" instead of "your password is compromised". Pair the indicator with a dynamic label and a one-line follow-up so the user has a path forward.

Each `<li>` now carries `data-label-{pass,fail,pending}`; the inline `setState` runs a `syncRowLabel` step that flips the visible `.pw-label` text per state. The breach row reads "Found in a known data breach. Pick a different password." on fail and keeps the existing copy on pass / pending. The other rows omit the dataset attributes so their labels stay static (length / case / digit do not change meaning per state).

A `#pw-breach-help` paragraph rendered hidden under the strip is revealed only when the breach row enters `fail`, explaining the constraint in one sentence so the user knows the right action is "pick a fresh password", not "type a stronger one".

Visual rhythm: glyphs now use Font Awesome (`fa-regular fa-circle`, `fa-solid fa-circle-check`, `fa-solid fa-circle-xmark`) via the kit already loaded under the bunyip-web CSP; each `<li>` is `flex items-center gap-2`; the strip lifts from `text-xs` to `text-sm` with `space-y-1.5` so it reads as form copy instead of fine print. Same treatment for `#pw-confirm-msg`. No new CSP origins.

The server-side `password_ok()` backstop is untouched; this is presentation only.

#BUNYIP-250

YousifShkara merged commit d82cf99b7f into main

2026-06-30 03:23:28 +02:00

YousifShkara deleted branch feat/BUNYIP-240-inline-password-feedback

2026-06-30 03:23:28 +02:00

YousifShkara referenced this pull request from a commit

2026-06-30 03:23:29 +02:00

Merge pull request 'feat(auth): clarify breach-row label and polish the password strip' (#272) from feat/BUNYIP-240-inline-password-feedback into main