freezmo/public/sw.js
Martin Dvorak 33c3f11bb7 Match the deck-creation CTA to the homework CTA layout
- "Freeze my deck" is now a full-width (w-full) button in its sticky bar,
  like "Make my homework", instead of a compact left-aligned button in a
  flex row.
- The status/validation line ("Add a photo or a document (or some text) to
  start.") moved from above the button to centred directly underneath it,
  with the same 12px muted styling the homework flow uses.
- Both flows now share the Button size="lg" shape (44px tall, 14px radius,
  same muted disabled chip, centred text); hover/disabled behaviour comes
  from the same .btn-primary/.btn-disabled classes.

Service worker: freezmo-v12.

Verified: CTA-parity suite 32/32 (full-width ratio ~1.0 at 390px and 1280px,
44px height, centred helper under the button on both pages, identical radius
and disabled chip, enabled ice gradient), mobile 51/51, i18n 27/27, desktop
regression 74/74. Lint + build clean.
2026-10-09 06:12:48 +00:00

97 lines
2.8 KiB
JavaScript

/**
* Freezmo service worker (production only).
*
* Strategy, deliberately conservative:
* - API routes are never cached and never intercepted.
* - Navigations: network first, falling back to the cached shell, then /offline.
* - /_next/static + icons: stale-while-revalidate (fast, self-healing).
* - Everything else: straight to the network.
*
* Bumping CACHE_VERSION is how a new deploy invalidates old assets.
*/
const CACHE_VERSION = "freezmo-v12";
const SHELL_CACHE = `${CACHE_VERSION}-shell`;
const ASSET_CACHE = `${CACHE_VERSION}-assets`;
const SHELL_ASSETS = [
"/",
"/offline",
"/manifest.webmanifest",
"/icons/icon-192.png",
"/icons/icon-512.png",
"/icons/apple-touch-icon.png",
];
self.addEventListener("install", (event) => {
event.waitUntil(
(async () => {
const cache = await caches.open(SHELL_CACHE);
await Promise.allSettled(SHELL_ASSETS.map((url) => cache.add(new Request(url, { cache: "reload" }))));
await self.skipWaiting();
})(),
);
});
self.addEventListener("activate", (event) => {
event.waitUntil(
(async () => {
const names = await caches.keys();
await Promise.all(
names.filter((name) => !name.startsWith(CACHE_VERSION)).map((name) => caches.delete(name)),
);
await self.clients.claim();
})(),
);
});
function isCacheableAsset(url) {
return (
url.pathname.startsWith("/_next/static/") ||
url.pathname.startsWith("/icons/") ||
url.pathname === "/manifest.webmanifest" ||
/\.(?:css|js|png|jpg|jpeg|svg|webp|woff2?)$/.test(url.pathname)
);
}
self.addEventListener("fetch", (event) => {
const request = event.request;
if (request.method !== "GET") return;
const url = new URL(request.url);
if (url.origin !== self.location.origin) return;
// Never touch the API: keys, notes and generated decks must always be live.
if (url.pathname.startsWith("/api/")) return;
if (request.mode === "navigate") {
event.respondWith(
(async () => {
try {
const response = await fetch(request);
const cache = await caches.open(SHELL_CACHE);
cache.put("/", response.clone()).catch(() => {});
return response;
} catch {
const cache = await caches.open(SHELL_CACHE);
return (await cache.match("/")) ?? (await cache.match("/offline")) ?? Response.error();
}
})(),
);
return;
}
if (isCacheableAsset(url)) {
event.respondWith(
(async () => {
const cache = await caches.open(ASSET_CACHE);
const cached = await cache.match(request);
const network = fetch(request)
.then((response) => {
if (response.ok) cache.put(request, response.clone()).catch(() => {});
return response;
})
.catch(() => cached);
return cached ?? network;
})(),
);
}
});