feat(frontend): finish PWA reset reload and pre-cache the HTML shell

The service worker and web manifest were already in place; close the remaining
gaps against the PWA spec:

- pwa.ts: resetPwa() cleared caches and unregistered the service worker but
  never reloaded, despite its docstring. Add the hard reload so the page
  re-fetches everything from the network after a clear.
- service-worker.ts: pre-cache the SPA entry HTML ('/') alongside build/files
  so the shell — and the offline navigation fallback — works from the very
  first visit, not just after a navigation has been seen by the runtime cache.
- settings: resetPwa now reloads, so the post-clear success toast (which told
  the user to reload manually) is unreachable and misleading. Drop the dead
  pwaSuccess state and toast; keep the disabled "Clearing…" button state.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
2026-06-11 10:36:20 +03:00
parent e8479ee4fb
commit 7a0c57a79c
3 changed files with 12 additions and 10 deletions
+4 -8
View File
@@ -85,16 +85,15 @@
});
// ---- PWA reset ----
// doPwaReset() clears the caches/SW and then hard-reloads the page, so there's
// no post-success state to surface here — just keep the button disabled while it
// runs until the reload takes over.
let pwaResetting = $state(false);
let pwaSuccess = $state(false);
async function resetPwa() {
pwaResetting = true;
pwaSuccess = false;
try {
await doPwaReset();
pwaSuccess = true;
setTimeout(() => (pwaSuccess = false), 3000);
} finally {
pwaResetting = false;
}
@@ -226,10 +225,7 @@
<!-- ====== PWA ====== -->
<section class="card">
<h2 class="section-title">App cache</h2>
<p class="hint-text">Clear service worker and cached assets. Useful if the app feels stale after an update.</p>
{#if pwaSuccess}
<p class="msg success" role="status">Cache cleared. Reload the page to fetch fresh assets.</p>
{/if}
<p class="hint-text">Clear service worker and cached assets, then reload. Useful if the app feels stale after an update.</p>
<div class="row-actions">
<button class="btn danger-outline" onclick={resetPwa} disabled={pwaResetting}>
{pwaResetting ? 'Clearing…' : 'Clear PWA cache'}