A `webpush` alert channel, and the PWA it needs to arrive. The payload is encrypted to the subscription (RFC 8291) and the request signed with this installation's own keypair (RFC 8292), both over `http-ece` — `pywebpush` does the same in one call but brings `requests` and `aiohttp` with it, two HTTP stacks beside httpx on a machine that may be a Raspberry Pi. The manifest and the worker are hand-written rather than `vite-plugin-pwa`: there is nothing worth precaching when the page carrying the credential is `no-store`, so the worker handles `push` and `notificationclick` and nothing else. `registration.scope` is the app's root in both places it runs, which is why the payload carries no URL. A run finishing in error is the first event worth waking someone for; `ok` and `cancelled` describe to nothing, so a nightly batch that works stays quiet. The events were already on the bus — only the filter changed. `WEBPUSH_FILE` is a derived path, so the keypair lands on the data volume with the alerts beside it. Off it, a rebuild would silently stop every phone being notified: the key they subscribed against would be gone. Co-Authored-By: Claude Opus 5 (1M context) <noreply@anthropic.com> Claude-Session: https://claude.ai/code/session_014EbeFPm6WNC3YD9vrqqT3a
61 lines
2.3 KiB
HTML
61 lines
2.3 KiB
HTML
<!DOCTYPE html>
|
|
<html lang="en">
|
|
<head>
|
|
<meta charset="UTF-8" />
|
|
<link rel="icon" type="image/svg+xml" href="/favicon.svg" />
|
|
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
|
|
<meta name="theme-color" content="#59849b" />
|
|
<!-- `%BASE_URL%` is `/` on an installation of its own and `/app-shell/` in
|
|
the build the portal serves, where the hub rewrites this line to the
|
|
installation's own path so the install is scoped to one house. -->
|
|
<link rel="manifest" href="%BASE_URL%manifest.webmanifest" />
|
|
<link rel="apple-touch-icon" href="%BASE_URL%apple-touch-icon.png" />
|
|
<title>Fluksio</title>
|
|
<!-- Set the theme class before first paint so the app never flashes light. -->
|
|
<script>
|
|
(() => {
|
|
try {
|
|
const stored = localStorage.getItem('fluksio-ui-theme')
|
|
const theme = stored && stored !== 'system' ? stored
|
|
: (window.matchMedia('(prefers-color-scheme: dark)').matches ? 'dark' : 'light')
|
|
document.documentElement.classList.add(theme)
|
|
} catch (_e) { }
|
|
})()
|
|
</script>
|
|
<!-- The boot spinner, until React's first commit clears `#root`. Styled
|
|
here with the literal values of --background / --border / --primary
|
|
because the stylesheet carrying those tokens has not necessarily
|
|
arrived yet; the theme class above is already on <html>. -->
|
|
<style>
|
|
#boot {
|
|
position: fixed;
|
|
inset: 0;
|
|
display: flex;
|
|
align-items: center;
|
|
justify-content: center;
|
|
background: #ffffff;
|
|
}
|
|
#boot i {
|
|
width: 28px;
|
|
height: 28px;
|
|
border: 2px solid #e4e4e4;
|
|
border-top-color: #4a7189;
|
|
border-radius: 9999px;
|
|
animation: boot-spin 0.8s linear infinite;
|
|
}
|
|
html.dark #boot { background: #0a0a0a; }
|
|
html.dark #boot i { border-color: #2a2a2a; border-top-color: #7ba3b8; }
|
|
@keyframes boot-spin { to { transform: rotate(360deg); } }
|
|
@media (prefers-reduced-motion: reduce) {
|
|
#boot i { animation-duration: 2.4s; }
|
|
}
|
|
</style>
|
|
</head>
|
|
<body>
|
|
<div id="root">
|
|
<div id="boot" role="status" aria-label="Loading Fluksio"><i></i></div>
|
|
</div>
|
|
<script type="module" src="./src/main.tsx"></script>
|
|
</body>
|
|
</html>
|