Senko-san ceee9b9d12 feat(offline): make the web UI usable without a reachable backend
Three tiers of offline support, all scoped to the active backend's
localStorage namespace (mirroring the auth slice):

Tier 1 — persist client state. queue + player slices are saved (queue
entries/index/source; player track/position/volume/repeat/shuffle) and
rehydrated on load, so a reload with no backend restores where the user
left off. Playback never auto-resumes (browsers block autoplay). Retires
the DEMO_QUEUE and isQueueOpen:true stubs.

Tier 2 — persist the RTK Query cache. Last-seen library/albums/artists
are snapshotted (fulfilled queries only) and replayed via RTKQ's
extractRehydrationInfo at startup, so the library renders read-only when
the backend is down. ConnectionStatus tooltip flags cached data offline.
No server data is copied into a slice — the cache feeds itself back.

Tier 3 — service worker audio + cover cache (PWA). Audio streams are
cached keyed by content id (token stripped), range-aware (synthetic 206
slicing), with a 500MB LRU cap, so already-played tracks play fully
offline. Cover art uses stale-while-revalidate in its own bounded cache.
Module worker (ESM); pure helpers split into sw-core.js and unit-tested.
Web app manifest enables "Install app". Player source badge now reflects
real cached state.

tsc clean, lint clean, 19 new tests pass, production build verified.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
2026-06-07 19:59:31 +03:00
2026-06-03 10:41:53 +03:00
2026-06-06 13:00:27 +03:00
2026-06-06 13:00:27 +03:00
2026-06-02 01:13:22 +03:00
2026-06-02 01:13:22 +03:00
2026-06-06 14:07:17 +03:00
2026-06-02 01:13:22 +03:00
2026-06-02 01:13:22 +03:00
2026-06-02 01:13:22 +03:00
2026-06-02 01:13:22 +03:00
2026-06-06 15:23:07 +03:00
2026-06-06 15:23:07 +03:00
2026-06-02 01:13:22 +03:00
2026-06-02 01:13:22 +03:00
2026-06-02 01:13:22 +03:00
2026-06-02 01:13:22 +03:00
2026-06-02 01:13:22 +03:00
2026-06-02 01:13:22 +03:00

Rsbuild project

Setup

Install the dependencies:

npm install

Get started

Start the dev server, and the app will be available at http://localhost:3000.

npm run dev

Build the app for production:

npm run build

Preview the production build locally:

npm run preview

Learn more

To learn more about Rsbuild, check out the following resources:

S
Description
🌐 MCMA Web UI - a web client for MCMA-backend
Readme 1.2 MiB
Languages
TypeScript 90.3%
CSS 6.1%
JavaScript 3.3%
Shell 0.3%