yiekheng
8f2ee5df9e
In-tab notification bridge so the operator gets a system notification
when a reminder fires successfully (or partly / fails) and when a
send-test message lands. Foundation for true background push later
(VAPID + service-worker subscription); this lands the wiring so
behaviour is testable today.
Pieces
------
- `lib/notifications.ts` — pure helper module:
* notificationSupport / getPermission — feature detection that
treats the SSR / unsupported-browser case as "denied" so callers
don't have to handle a third state.
* isOptedIn / setOptedIn — localStorage-backed opt-in flag
(key `cmbot.notifications.optedIn`). Survives gracefully when
window is missing or storage throws (private mode / quota).
* showNotification(opts) — gated dispatch returning a discriminated
result ({ ok: true, tag } | { ok: false, reason }) so callers
can fall back to a UI toast on opt-out / unsupported / error.
* reminderFiredToNotification + sendTestDoneToNotification —
pure mappers from the bot's SSE events into notification args.
Skips bookkeeping noise (status === "skipped") and failures
that the in-page toast already shows verbatim.
- `components/notification-manager.tsx` — client component mounted
once at the app shell. Subscribes to `reminder.fired` and
`send_test.done` via useEvents and forwards each through the pure
mappers. Renders no DOM.
- `components/notifications-toggle.tsx` — settings-page card with
three states (unsupported / not-granted / granted+opted-in).
"Send test" button fires a sample notification so the operator
can verify the wiring without waiting for a real reminder. The
blocked-by-browser path points them at site settings instead of
silently doing nothing.
- `app/settings/page.tsx` — new "Notifications" card sits above
the Appearance card.
- `app/layout.tsx` — `<NotificationManager />` rendered alongside
`<Toaster />` inside ThemeProvider so the SSE subscription is
active across all routes.
Bot side
--------
- `apps/bot/src/scheduler/fire-reminder.ts` — emits
`pgNotifyWeb({ type: "reminder.fired", reminderId, runId, status })`
after every run regardless of success/partial/failed. The web
side decides whether to surface it as a notification (skipped is
filtered out client-side).
- send_test.done was already emitted by `ipc/send-test-handler.ts`.
PWA service-worker tests (the original ask before this thread)
--------------------------------------------------------------
- Extracted the Serwist config into `pwa/config.ts` so the choices
(skipWaiting, clientsClaim, navigationPreload, runtimeCaching,
precacheEntries) are pinnable without booting a worker scope.
- 6 tests in `pwa/config.test.ts` lock the surface (no extra keys
appear silently, the manifest passes through unchanged, the
pinned booleans stay where production expects them).
- 6 tests in `app/manifest.webmanifest/route.test.ts` cover the
manifest contract (display=standalone, start_url=/, dark theme
colors match the OS, both icons are PNG + maskable, paths
match committed PNGs in public/).
Test counts
-----------
281 web + 31 shared + 26 bot = 338 total (was 306).
- +6 pwa/config (service-worker config pinning)
- +6 app/manifest.webmanifest (PWA manifest contract)
- +20 lib/notifications (full coverage of mappers + dispatch
gates + SSR / unsupported / blocked / opted-out paths)
Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
58 lines
1.8 KiB
TypeScript
58 lines
1.8 KiB
TypeScript
/**
|
|
* Service-worker configuration for `@serwist/next`. Extracted from
|
|
* `sw.ts` so unit tests can pin the choices without booting up a
|
|
* service-worker scope.
|
|
*
|
|
* The choices we care about — and why they're the way they are:
|
|
*
|
|
* skipWaiting + clientsClaim
|
|
* A new worker takes over open tabs on the next navigation
|
|
* instead of waiting for every tab to close. Operators tend to
|
|
* live in one tab; faster updates win.
|
|
*
|
|
* navigationPreload
|
|
* Tells the browser it can race the network fetch for navigations
|
|
* alongside the worker boot, cutting first-paint when the worker
|
|
* is cold.
|
|
*
|
|
* runtimeCaching
|
|
* Serwist's stock recipe — HTML network-first with offline
|
|
* fallback, static assets cache-first, image / font caches with
|
|
* sensible TTLs. Easy to swap if we want bespoke strategies later.
|
|
*
|
|
* precacheEntries
|
|
* Whatever `__SW_MANIFEST` the build pipeline injected. We pass
|
|
* it through unchanged.
|
|
*/
|
|
|
|
type PrecacheEntry = string | { url: string; revision: string | null };
|
|
|
|
/**
|
|
* The runtime-caching shape is generic on purpose. Serwist's own
|
|
* `RuntimeCaching` type pulls in WebWorker DOM lib refs that
|
|
* vitest's plain Node env doesn't ship; using a generic preserves
|
|
* the type at the call site (sw.ts passes Serwist's
|
|
* `RuntimeCaching[]` and gets it back unchanged) without forcing
|
|
* the lib import here.
|
|
*/
|
|
export interface ServiceWorkerConfig<R> {
|
|
precacheEntries: PrecacheEntry[];
|
|
skipWaiting: boolean;
|
|
clientsClaim: boolean;
|
|
navigationPreload: boolean;
|
|
runtimeCaching: R;
|
|
}
|
|
|
|
export function serviceWorkerConfig<R>(
|
|
precacheEntries: PrecacheEntry[],
|
|
runtimeCaching: R,
|
|
): ServiceWorkerConfig<R> {
|
|
return {
|
|
precacheEntries,
|
|
skipWaiting: true,
|
|
clientsClaim: true,
|
|
navigationPreload: true,
|
|
runtimeCaching,
|
|
};
|
|
}
|