ceee9b9d12
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>
31 lines
998 B
TypeScript
31 lines
998 B
TypeScript
import { createApi } from '@reduxjs/toolkit/query/react';
|
|
import { baseQueryWithReauth } from './baseQuery';
|
|
import { REHYDRATE_API, type RehydrateApiPayload } from './rehydrate';
|
|
|
|
export const api = createApi({
|
|
reducerPath: 'api',
|
|
baseQuery: baseQueryWithReauth,
|
|
tagTypes: [
|
|
'Track',
|
|
'Album',
|
|
'Artist',
|
|
'Playlist',
|
|
'Download',
|
|
'Like',
|
|
'User',
|
|
'Storage',
|
|
],
|
|
// Tier 2 offline: seed the cache from the persisted snapshot dispatched at
|
|
// startup (see `store/rtkqPersist.ts`). Returning the saved queries/mutations
|
|
// lets the last-seen library render before — or instead of — any network call.
|
|
extractRehydrationInfo(action) {
|
|
if (action.type === REHYDRATE_API) {
|
|
// The api reducer reads `queries`/`mutations` off this and restores any
|
|
// fulfilled entries; pending/rejected ones are ignored automatically.
|
|
return action.payload as RehydrateApiPayload as never;
|
|
}
|
|
return undefined;
|
|
},
|
|
endpoints: () => ({}),
|
|
});
|