yiekheng
272fbcfa8a
The web app is now installable on a phone home screen with offline fallback for static assets and the navigation shell. Pieces ------ - `src/app/manifest.webmanifest/route.ts` — dynamic manifest route. Standalone display mode, portrait orientation, dark theme matching the app, "any maskable" icons so the same PNG works for both regular launchers and Android adaptive icons. - `src/pwa/sw.ts` — service worker entry. Uses serwist's stock recipe: skipWaiting + clientsClaim so a new worker takes over on the next navigation, navigationPreload to race the network with the worker boot, and `defaultCache` for HTML-network-first / static-cache-first / image+font cache TTLs. - `next.config.ts` — wraps the existing config with `withSerwistInit`. Disabled in development (`NODE_ENV !== "production"`) because a service worker on every dev reload makes hot-reload extremely flaky. - `package.json` build script switched to `next build --webpack`. `@serwist/next` doesn't yet support Turbopack (it logs a warning and silently skips emitting `sw.js`), and Next 16 defaults the build to Turbopack. The dev server still uses Turbopack — only production builds switch to webpack. - `src/app/layout.tsx` metadata gains `manifest`, `icons.icon` (192 + 512 PNG), and `icons.apple` (180 PNG). The existing `appleWebApp.capable` already opts iOS into standalone mode. Icons ----- Generated by a tiny one-shot script (`scripts/gen-pwa-icons.ts`) that uses the workspace's already-installed sharp to render an SVG wordmark at 512 / 192 / 180 px. Placeholder branding (dark square with "cm" wordmark) — swap in real artwork later by editing the SVG in the script and re-running `pnpm --filter @cmbot/web run gen:icons`. Build artefacts --------------- - `apps/web/public/icon-512.png`, `icon-192.png`, `apple-touch-icon.png` ARE committed (stable input). - `apps/web/public/sw.js` and `swe-worker-*.js` are NOT — they're regenerated on every production build. Added to `.gitignore`. Verification ------------ - Production build emits `[serwist] Bundling the service worker script with the URL '/sw.js' and the scope '/'...` and `sw.js` shows up in `public/`. - `/manifest.webmanifest` is in the build's static-route table. - 249 web tests still passing. Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
30 lines
1.0 KiB
TypeScript
30 lines
1.0 KiB
TypeScript
import { NextResponse } from "next/server";
|
|
|
|
/**
|
|
* PWA manifest. Served from `/manifest.webmanifest` so the document
|
|
* `<link rel="manifest" href="/manifest.webmanifest">` (set up via
|
|
* Next's metadata API in layout.tsx) can find it.
|
|
*
|
|
* `purpose: "any maskable"` lets the same icon work for both regular
|
|
* launch icons and Android maskable icons (where the OS crops the
|
|
* icon to a system-defined shape). `display: "standalone"` removes
|
|
* the browser chrome when launched from the home screen.
|
|
*/
|
|
export function GET() {
|
|
return NextResponse.json({
|
|
name: "cm WhatsApp Bot",
|
|
short_name: "cm WA Bot",
|
|
description: "Self-hosted WhatsApp reminder bot",
|
|
start_url: "/",
|
|
scope: "/",
|
|
display: "standalone",
|
|
orientation: "portrait",
|
|
background_color: "#0a0a0a",
|
|
theme_color: "#0a0a0a",
|
|
icons: [
|
|
{ src: "/icon-192.png", sizes: "192x192", type: "image/png", purpose: "any maskable" },
|
|
{ src: "/icon-512.png", sizes: "512x512", type: "image/png", purpose: "any maskable" },
|
|
],
|
|
});
|
|
}
|