Settings: a failed save can be retried, and says what is happening #275

Merged

robbertbos merged 1 commit from settings-retry into main 2026-08-09 21:05:58 +00:00

Conversation 0 Commits 1 Files changed 10 +484 -44

robbertbos commented 2026-08-09 13:56:51 +00:00

Owner

Copy link

Closes the last open item in #208, plus three things found next to it while
testing.

The item from #208

Voorkeuren and Automatisch opruimen save on change, with no submit button. So a
failed save left nothing to press: picking the same value again fires no change
event, and reloading was the only way back. The banner said "Probeer het
opnieuw" without offering the means.

Each panel now keeps the last patch it sent, and the banner offers it back
through nldd-banner's own actions slot.

Found while testing, not in #208

Automatisch opruimen showed nothing at all when a save failed - the same
silence #201 fixed for Voorkeuren. It was never passed failed. It also had no
live region, so a screen reader heard none of this either. Both fixed, with the
tests it never had.

Both panels shared one mutation, so they shared its state: changing a theme
put "Opslaan..." under Automatisch opruimen as well, and a failure would have
shown the notice in a panel the user never touched. One saver per panel now, so
the state cannot leak rather than being filtered afterwards. Settings.vue gets
the test it never had; it fails on the shared-mutation version.

Offline said "Opslaan..." forever. TanStack pauses a mutation instead of
running it (networkMode: 'online'), so nothing was being saved and no error
would ever arrive - the retry button could not appear by construction. That
state now says "Wachten op verbinding...".

The save notice

• It flashed on every change. It now waits a second - the point where a delay
  stops feeling instant, and the same hold-back nldd-activity-indicator uses.
• It sat at the foot of the card, so it belonged to whichever of the three
  fields you last touched. Each field carries its own now, and only the one
  being saved speaks.
• It kept the meta font size and secondary colour, so it whispered. It appears
  only when something is slow or stuck, so it takes the content tier - which in
  this repo means no size rule at all.
• The spinner is nldd-activity-indicator, which needs a box of its own:
  measured at 518x518 when left to fill its parent, 20x20 once given one. Its
  own 1000ms hold-back is off, since the delay is already ours.

The banner drops its full stop: "Opslaan mislukt" is a fragment, and the other
fragment-shaped notice in the app has none either.

Verification

• 764 frontend unit tests, vue-tsc, eslint 0 errors, the full e2e suite
  (67 passed, 3 skipped), uvx pre-commit run --all-files including the
  generated-API-types gate.
• Driven in a browser with a delayed PUT /api/settings: exactly one live
  region speaks, and it is the field that was changed.
• No backend change.

Closes the last open item in #208, plus three things found next to it while testing. ## The item from #208 Voorkeuren and Automatisch opruimen save on change, with no submit button. So a failed save left nothing to press: picking the same value again fires no change event, and reloading was the only way back. The banner said "Probeer het opnieuw" without offering the means. Each panel now keeps the last patch it sent, and the banner offers it back through `nldd-banner`'s own `actions` slot. ## Found while testing, not in #208 **Automatisch opruimen showed nothing at all when a save failed** - the same silence #201 fixed for Voorkeuren. It was never passed `failed`. It also had no live region, so a screen reader heard none of this either. Both fixed, with the tests it never had. **Both panels shared one mutation**, so they shared its state: changing a theme put "Opslaan..." under Automatisch opruimen as well, and a failure would have shown the notice in a panel the user never touched. One saver per panel now, so the state cannot leak rather than being filtered afterwards. `Settings.vue` gets the test it never had; it fails on the shared-mutation version. **Offline said "Opslaan..." forever.** TanStack pauses a mutation instead of running it (`networkMode: 'online'`), so nothing was being saved and no error would ever arrive - the retry button could not appear by construction. That state now says "Wachten op verbinding...". ## The save notice - It flashed on every change. It now waits a second - the point where a delay stops feeling instant, and the same hold-back `nldd-activity-indicator` uses. - It sat at the foot of the card, so it belonged to whichever of the three fields you last touched. Each field carries its own now, and only the one being saved speaks. - It kept the meta font size and secondary colour, so it whispered. It appears only when something is slow or stuck, so it takes the content tier - which in this repo means no size rule at all. - The spinner is `nldd-activity-indicator`, which needs a box of its own: measured at 518x518 when left to fill its parent, 20x20 once given one. Its own 1000ms hold-back is off, since the delay is already ours. The banner drops its full stop: "Opslaan mislukt" is a fragment, and the other fragment-shaped notice in the app has none either. ## Verification - 764 frontend unit tests, `vue-tsc`, eslint 0 errors, the full e2e suite (67 passed, 3 skipped), `uvx pre-commit run --all-files` including the generated-API-types gate. - Driven in a browser with a delayed `PUT /api/settings`: exactly one live region speaks, and it is the field that was changed. - No backend change.

robbertbos added 1 commit 2026-08-09 13:56:51 +00:00

Give a failed settings save something to press ... 8ad652f081

Voorkeuren and Automatisch opruimen both save on change, so a failure
left nothing to retry: picking the same value again fires no change
event, and reloading was the only way out. The banner said "Probeer het
opnieuw" without offering the means. Settings.vue now keeps the last
patch and the banner offers it back, through nldd-banner's own actions
slot.

Automatisch opruimen showed nothing at all when a save failed - the
silence that was fixed for Voorkeuren in #201, still here because this
panel came later. It gets the same notice.

robbertbos referenced this pull request 2026-08-09 13:57:49 +00:00

Settings/NLDD: what was evaluated and not made, and when it expires #208

robbertbos referenced this pull request 2026-08-09 13:58:25 +00:00

Settings/NLDD: what was evaluated and not made, and when it expires #208

robbertbos added 1 commit 2026-08-09 14:15:07 +00:00

Give each settings panel its own save state ... d82aa058f1

Voorkeuren and Automatisch opruimen shared one mutation, so they shared
its flags: changing a theme put "Opslaan..." under both panels, and a
failure would have shown the notice in a panel the user never touched.

One saver per panel instead of one filtered by which panel started it -
the state cannot leak rather than being sorted out afterwards. The route
gets the test it never had; it fails on the shared-mutation version.

robbertbos added 1 commit 2026-08-09 20:29:02 +00:00

Say what is actually happening while a setting saves ... 915f86c53a

Three things the status line got wrong. It flashed "Opslaan..." on every
change, where the control had already moved and the flash was noise - it
now waits 600ms, so only a slow save says anything. Offline it said
"Opslaan..." indefinitely, but TanStack pauses a mutation instead of
running it (networkMode 'online'), so nothing was being saved and no
error would ever arrive; that state now says "Wachten op verbinding...".
And because the line appears only when something is slow or stuck, it
reads in the content colour rather than the secondary one, which this
repo reserves for text that labels other text.

Automatisch opruimen also had no live region at all, so a screen reader
heard none of this. It has the same one Voorkeuren already had.

The banner drops its full stop: "Opslaan mislukt" is a fragment, and the
other fragment-shaped notice in the app has none either.

robbertbos added 1 commit 2026-08-09 20:39:06 +00:00

Let the slow-save notice reach the reading size, and wait a full second ... 13b854eb6a

Two corrections. The notice kept the meta font size, so removing only
its colour changed nothing visible; it is a sentence the reader reads,
which in this repo means no size rule at all.

And the threshold moves from 600ms to 1000ms. That is where a delay
stops feeling instant, and it is the same number nldd-activity-indicator
uses to keep brief loading states from flashing.

robbertbos added 1 commit 2026-08-09 20:48:29 +00:00

Put the save notice next to the setting it is about ... cc8261564a

It sat at the foot of the card, so it belonged to whichever of the three
fields you last touched - which the reader cannot tell, and far enough
from the control that they may not see it at all. Each field now carries
its own, and only the one being saved speaks.

The spinner is nldd-activity-indicator, which needs a box of its own:
measured at 518x518 when left to fill its parent, 20x20 once given one.
Its own 1000ms hold-back is switched off, since the delay is already
ours - otherwise the two would stack.

robbertbos changed title from Settings: a failed save can be retried to Settings: a failed save can be retried, and says what is happening 2026-08-09 20:55:39 +00:00

robbertbos force-pushed settings-retry from cc8261564a to cfa8249bd0 2026-08-09 21:01:56 +00:00 Compare

robbertbos merged commit cfa8249bd0 into main 2026-08-09 21:05:58 +00:00

robbertbos deleted branch settings-retry 2026-08-09 21:05:58 +00:00

Sign in to join this conversation.

Reviewers

No reviewers

Labels

Clear labels   

bug

Something is not working

  

duplicate

This issue or pull request already exists

  

enhancement

New feature

  

help wanted

Need some help

  

invalid

Something is wrong

  

nldd ds

  

question

More information is needed

  

wontfix

This won't be fixed

No labels

bug

duplicate

enhancement

help wanted

invalid

nldd ds

question

wontfix

Milestone

Clear milestone

No items

No milestone

Projects

Clear projects

No items

No project

Assignees

Clear assignees

No assignees

1 participant

Notifications

Subscribe

Due date

The due date is invalid or out of range. Please use the format "yyyy-mm-dd".

No due date set.

Dependencies

No dependencies set.

Reference

robbertbos/waggle!275

No description provided.