Phase 7: PWA (service worker and manifest)

[devin-ai-integration]

Summary

Phase 7 of the Angular → React migration (stacked on #684). vite-plugin-pwa (Workbox generateSW) replaces ServiceWorkerModule + ngsw-worker.js, and ngsw-config.json is deleted.

vite.config.ts becomes a function config so the plugin can be switched off outside builds, matching Angular's enabled: environment.production:

export default defineConfig(({ command }) => ({ plugins: [react(), VitePWA({
  disable: command !== 'build',          // dev server stays SW-free
  registerType: 'autoUpdate',            // ngsw checked for updates on load
  manifest: { /* src/manifest.json verbatim: name, theme_color #b92b27, standalone, portrait, start_url ./?utm_source=web_app_manifest, 144/192/256/512 icons */ },
  workbox: { navigateFallback: 'index.html', runtimeCaching: [{ urlPattern: /node-hnapi\.herokuapp\.com/, handler: 'NetworkFirst', ... }] },
})]}));

Two deliberate differences from the ngsw config:

• navigateFallback: 'index.html' is what makes deep links like /item/123 work offline; ngsw got this from its index option.
• HN API responses are now cached NetworkFirst (10s timeout, 100 entries, 1 day) — ngsw had no dataGroups, so feeds were dead offline. The app shell renders and falls back to its loader/error state when nothing is cached.

The manifest and icons need no move: icons already live in public/assets/icons/ from Phase 1, and the plugin emits manifest.webmanifest plus the <link rel="manifest"> tag that index.html was missing. src/manifest.json is now unused and gets deleted with the rest of the Angular tree in Phase 8.

Verification

npm run build emits dist/sw.js + dist/workbox-*.js with 43 precached entries. Offline checked against vite preview: registered the SW, killed the server, then reloaded — the shell still renders (screenshot below is /item/1 with the server down, showing the cached chrome and the loader since the API is unreachable). Note this VM's interactive Chrome leaves service workers stuck in STARTING, so the offline run was driven through a headless Chromium instead; navigator.serviceWorker.controller was non-null before the server was killed.

Remaining

Phase 8: delete the Angular sources (src/app/, src/main.ts, src/environments/, src/manifest.json, src/index.html), README/CI updates, and the final end-to-end pass.

Devin-Org: engineering

Link to Devin session: https://app.devin.ai/sessions/f5e6c49cc7f344bf80df57ffee2e7939
Requested by: @abboudp

---

Note

Devin errored when opening this Pull Request as abboudp.
As a fallback, Devin opened this PR as itself.

---

Devin Review

Status	Commit
⚪ Not started	—

Run Devin Review

[devin-ai-integration]

🤖 Devin AI Engineer

I'll be helping with this pull request! Here's what you should know:

✅ I will automatically:

• Address comments on this PR. Add '(aside)' to your comment to have me ignore it.
• Look at CI failures and help fix them

Note: I can only respond to comments from users who have write access to this repository.

⚙️ Control Options:

• Disable automatic comment, CI, and merge conflict monitoring