feat(web): register service worker + link manifest — installable PWA (#86 frontend) (#219)

The PWA backend (manifest + hand-rolled SW serving) shipped in #200,
but nothing linked the manifest or registered the SW, so the browser
never offered "Install" and the SW never activated. This wires the
frontend half.

- `index.html` template: `<link rel="manifest" href="{{ mount_point }}web.manifest">`
  + `theme-color` / `apple-mobile-web-app-*` meta so the browser's
  install heuristics fire.
- `main.tsx`: register `<mount>sw.js` scoped to the mount on `load`.
  Best-effort (offline/install is progressive enhancement); the SW
  itself honors `no-store` so authenticated reads are never cached, and
  the mount scope is permitted by the backend's
  `Service-Worker-Allowed: <mount>` header.

Install-prompt affordance + logout cache-purge (`dar:purge`) are the
remaining follow-ups on #86.

Test: `test_shell_links_pwa_manifest` asserts the shell links the
manifest + theme-color. Typecheck green (7 pkgs); build ok; prettier +
ruff + black clean; 15 spa-index tests pass.

Tier 4 (web) + the template (Tier 3-ish, no logic). Self-merging under
the repo-owner's full-tier authorization.

Co-authored-by: Martin Castro Laminrs <mcastro@laminr.ai>
Co-authored-by: Claude Opus 4.7 (1M context) <noreply@anthropic.com>

Author: 3 people

django_admin_react/templates/admin_react/index.html

@@ -12,6 +12,13 @@
     {% else %}
       <link rel="icon" href="data:," />
     {% endif %}
+    {# PWA (#86): the manifest + SW are served by the package at the
+       mount (pwa.py); link the manifest + PWA meta so the browser
+       offers "Install". The SW is registered from main.tsx. #}
+    <link rel="manifest" href="{{ mount_point }}web.manifest" />
+    <meta name="theme-color" content="#ffffff" />
+    <meta name="apple-mobile-web-app-capable" content="yes" />
+    <meta name="apple-mobile-web-app-title" content="{{ brand_title }}" />
     {% csrf_token %}
     {% if bundle %}
       {% for css_path in bundle.css %}

frontend/apps/web/src/main.tsx

@@ -34,6 +34,23 @@ function detectMount(): string {
 const mount = detectMount();
 const client = new ApiClient({ mount });
 
+// PWA (#86): register the hand-rolled service worker the package serves
+// at `<mount>sw.js`, scoped to the mount so it never claims sibling
+// Django views. Best-effort — the app works fully without it, and the
+// SW itself honors `Cache-Control: no-store` so authenticated reads are
+// never cached. The `Service-Worker-Allowed: <mount>` header (set by
+// the backend ServiceWorkerView) is what permits the mount scope.
+function registerServiceWorker(mountPath: string): void {
+  if (typeof navigator === 'undefined' || !('serviceWorker' in navigator)) return;
+  window.addEventListener('load', () => {
+    void navigator.serviceWorker.register(`${mountPath}sw.js`, { scope: mountPath }).catch(() => {
+      /* registration is best-effort; offline/install is a progressive
+         enhancement, not a requirement. */
+    });
+  });
+}
+registerServiceWorker(mount);
+
 const rootEl = document.getElementById('root');
 if (!rootEl) throw new Error('#root element not found');
 

tests/test_spa_index.py

@@ -103,9 +103,9 @@ def test_spa_shell_is_not_cacheable(superuser_client: Client) -> None:
     """
     response = superuser_client.get(ROOT_URL)
     cache_control = response.headers.get("Cache-Control", "")
-    assert "no-cache" in cache_control or "no-store" in cache_control, (
-        f"SPA shell must send no-cache/no-store; got {cache_control!r}"
-    )
+    assert (
+        "no-cache" in cache_control or "no-store" in cache_control
+    ), f"SPA shell must send no-cache/no-store; got {cache_control!r}"
 
 
 # --------------------------------------------------------------------------- #
@@ -270,3 +270,13 @@ def test_react_login_on_does_not_change_staff_path(superuser_client: Client) ->
             assert response.status_code == 200
         finally:
             _reload_conf()
+
+
+@pytest.mark.django_db
+def test_shell_links_pwa_manifest(superuser_client: Client) -> None:
+    """The SPA shell links the package-served manifest so the browser
+    offers "Install" (#86 frontend). Mount-relative href."""
+    body = superuser_client.get(ROOT_URL).content.decode("utf-8")
+    assert 'rel="manifest"' in body
+    assert 'href="/admin-react/web.manifest"' in body
+    assert 'name="theme-color"' in body