feat: PWA support for the web client (#5184)
* feat: PWA support for the web client Adds Progressive Web App support so the Zellij web client can be installed as a standalone app via Chromium/Firefox/Safari/iOS. - New static asset `zellij-client/assets/manifest.webmanifest` with required W3C members (name, start_url, scope, display, icons). All path-bearing fields are relative to the manifest URL so a single static file works under any reverse-proxy base_url prefix without runtime templating. - New icon set under `zellij-client/assets/`: icon.svg (vector), icon-192.png and icon-512.png (purpose "any"), and icon-maskable-512.png (purpose "maskable") rendered at 70% of canvas height on a #080317 backdrop so Android adaptive masks honour the W3C 80%-diameter safe zone. - `scripts/render-pwa-icons.sh` pins the rendering toolchain (librsvg + ImageMagick) and the maskable safe-zone geometry so re-renders are reproducible. - `.webmanifest` -> `application/manifest+json` mapping added to `get_mime_type` in `zellij-client/src/web_client/utils.rs`. - `index.html` gains <link rel="manifest">, apple-touch-icon, and apple-mobile-web-app-* meta tags. Placed immediately after the existing favicon link and before any <script> tag so the manifest is in the browser's preload scanner early. - 5 new tests cover Content-Type, required JSON members, the relative-URL contract, index.html references, icon reachability, and base_url invariance. Closes #5094. * update changelog with pull url * feat(web): trim PWA icon set to PNGs only Drops the duplicate `zellij-client/assets/icon.svg` (verbatim copy of `assets/logo.svg`) and the maskable PNG variant from the manifest. Net result is the minimal icon set most production PWAs ship: icon-192.png and icon-512.png. - `icon.svg` was redundant with the canonical `assets/logo.svg` at the repo root and offered no install-criterion benefit on top of the 192/512 PNGs. - `icon-maskable-512.png` only benefits Android Chrome installs (desktop browsers and iOS ignore the maskable purpose). The Android win was small for the hexagonal Zellij glyph; a hand-tuned maskable can be added in a follow-up if Android installs need polish. `scripts/render-pwa-icons.sh` now reads from `assets/logo.svg` directly instead of the duplicate copy. * feat(web): use existing assets/logo.png as the PWA icon Removes the pre-rasterized 192/512 PNG variants and the render script in favour of serving the canonical `assets/logo.png` via a small dedicated handler. The repo's existing logo becomes the single source of truth; the PWA picks up logo changes automatically with no re-render step. - `LOGO_PNG` static is loaded via `include_bytes!` from the repo root, mirroring how `WEB_CLIENT_PAGE` reaches `assets/index.html`. - New `serve_logo_png` handler is registered at `/assets/logo.png` before the `get_static_asset` wildcard. axum's matchit router gives literal paths precedence, so the explicit route always wins. - Manifest declares a single icon entry at the actual file dimensions (2269x2620). Browsers letterbox onto square launcher surfaces, the same way they do for the existing favicon. - `apple-touch-icon` retargets to `assets/logo.png`. - `test_pwa_icon_assets_reachable` collapses to a single case. - `scripts/render-pwa-icons.sh` and the rendering toolchain (librsvg + ImageMagick) are no longer needed. * feat(web): drop redundant apple-mobile-web-app meta tags The three `apple-mobile-web-app-*` meta tags are backward-compat scaffolding for iOS < 16.4: - `apple-mobile-web-app-capable: yes` — iOS 16.4+ reads `display: standalone` from the manifest. - `apple-mobile-web-app-title: Zellij` — iOS 16.4+ reads `short_name` from the manifest. - `apple-mobile-web-app-status-bar-style: default` — explicitly sets iOS's default status-bar behaviour, i.e. a no-op. iOS 16.4 shipped in March 2023; the cohort still on iOS 15 is essentially devices stuck on the iPhone 6s / 7 / SE 1st gen line (2015-16 hardware), which is not the zellij audience. `<link rel="apple-touch-icon">` is kept because iOS still ignores manifest `icons` entries and reads only that tag for the home-screen icon on every iOS version. * feat(web): restore square pre-rasterized PNG icon for installability The earlier swap to serving `assets/logo.png` directly fails Chromium's PWA installability gate: the logo is 2269x2620 (not square), and Chromium specifically requires "an icon at least 144 pixels square" -- a non-square icon is rejected even though the declared `sizes` covers the dimension threshold. DevTools' Application -> Manifest panel was misleading: it parsed and displayed the icon, but installability is a separate stricter check. This walks the swap back to a single committed 192x192 square PNG (`icon-192.png`) rendered from `assets/logo.svg` with the logo composited onto a transparent square canvas. The PNG is served by the existing `get_static_asset` route via `include_dir!`. The `LOGO_PNG` static, `serve_logo_png` handler, and dedicated `/assets/logo.png` route are dropped. apple-touch-icon retargets to icon-192.png (closer to iOS's preferred 180px home-screen size). Net effect on the diff: ~13KB committed PNG + a single icon entry in the manifest, in exchange for actually meeting the installability criterion. * style: rustfmt --------- Co-authored-by: Robert Jin <robert.jin@gresearch.co.uk> Co-authored-by: Aram Drevekenin <aram@poor.dev>
R
Robert Jin committed
e9173cba163506491becbeacad162315d6e8f726
Parent: b558b31
Committed by GitHub <noreply@github.com>
on 6/1/2026, 1:35:39 PM