diff --git a/backend/main.py b/backend/main.py index 578e4a6..1784b96 100644 --- a/backend/main.py +++ b/backend/main.py @@ -1,4 +1,6 @@ import logging +import os +import time from contextlib import asynccontextmanager from fastapi import FastAPI @@ -161,6 +163,7 @@ app = FastAPI( version="1.0.0", lifespan=lifespan, ) +STARTED_AT = str(int(time.time() * 1000)) # No CORS middleware — same-origin via nginx (A1) @@ -199,4 +202,4 @@ app.include_router(internal_router) @app.get("/health") async def health_check(): - return {"status": "healthy"} + return {"status": "healthy", "version": os.environ.get("BUILD_VERSION", STARTED_AT)} diff --git a/frontend/index.html b/frontend/index.html index 91fb381..d5b1446 100644 --- a/frontend/index.html +++ b/frontend/index.html @@ -3,6 +3,11 @@ + + + + + Kitchen diff --git a/frontend/src/App.tsx b/frontend/src/App.tsx index 1d7eb40..ae419ee 100644 --- a/frontend/src/App.tsx +++ b/frontend/src/App.tsx @@ -1,6 +1,9 @@ import React from 'react' import { Routes, Route, Navigate } from 'react-router-dom' import AuthGate, { useAuth } from './components/AuthGate' +import { UpdateBanner } from './components/UpdateBanner' +import IosInstallHint from './components/IosInstallHint' +import { useVersionCheck } from './hooks/useVersionCheck' import Layout from './components/Layout' import { can } from './types' @@ -51,7 +54,9 @@ import BulkAllergens from './components/BulkAllergens' import PriceImpact from './components/PriceImpact' export default function App() { + const updateAvailable = useVersionCheck('/kitchen/health') return ( + <> {/* Fullscreen PWA routes — no sidebar layout */} @@ -110,5 +115,8 @@ export default function App() { + + + ) } diff --git a/frontend/src/components/IosInstallHint.tsx b/frontend/src/components/IosInstallHint.tsx new file mode 100644 index 0000000..da58dd2 --- /dev/null +++ b/frontend/src/components/IosInstallHint.tsx @@ -0,0 +1,89 @@ +import { useEffect, useState } from 'react' +import { Share, ExternalLink, X } from 'lucide-react' + +function isIos() { + return /iPad|iPhone|iPod/.test(navigator.userAgent) || + // iPadOS 13+ reports as 'MacIntel' but has touch support, unlike a real Mac + (navigator.platform === 'MacIntel' && navigator.maxTouchPoints > 1) +} + +function isStandalone() { + return window.matchMedia('(display-mode: standalone)').matches || + (window.navigator as unknown as { standalone?: boolean }).standalone === true +} + +// Safari's UA also matches "Safari", so this checks for the other iOS +// browsers/in-app webviews that spoof it — none of them can add to the +// home screen; only Safari itself can. +function isNonSafariIosBrowser() { + return /CriOS|FxiOS|EdgiOS|OPiOS|mercury|GSA|DuckDuckGo|Instagram|FBAN|FBAV|Line\//.test(navigator.userAgent) +} + +/** + * iOS has no `beforeinstallprompt` API — Safari never fires it, so the + * portal's Install button (?install=1) does nothing there. This shows the + * manual steps instead: Share -> Add to Home Screen in Safari, or a prompt + * to switch to Safari first if the page was opened in another browser/app. + */ +export default function IosInstallHint() { + const [mode, setMode] = useState<'safari' | 'other' | null>(null) + + useEffect(() => { + if (!isIos() || isStandalone()) return + if (!new URLSearchParams(window.location.search).has('install')) return + setMode(isNonSafariIosBrowser() ? 'other' : 'safari') + }, []) + + if (!mode) return null + + return ( +
+
+ + +
+ {mode === 'safari' + ? + : } +
+ + {mode === 'safari' ? ( +

+ To install this app, tap the Share icon in Safari's + toolbar, then choose Add to Home Screen. +

+ ) : ( +

+ iOS only allows installing apps from Safari. Open this + page in Safari, then tap Share → Add to Home Screen. +

+ )} +
+
+ ) +} diff --git a/frontend/src/components/UpdateBanner.tsx b/frontend/src/components/UpdateBanner.tsx new file mode 100644 index 0000000..b492c67 --- /dev/null +++ b/frontend/src/components/UpdateBanner.tsx @@ -0,0 +1,44 @@ +import { RefreshCw } from 'lucide-react' + +export function UpdateBanner({ visible }: { visible: boolean }) { + if (!visible) return null + return ( +
+ A new version is available. + +
+ ) +} diff --git a/frontend/src/hooks/useVersionCheck.ts b/frontend/src/hooks/useVersionCheck.ts new file mode 100644 index 0000000..e4fed28 --- /dev/null +++ b/frontend/src/hooks/useVersionCheck.ts @@ -0,0 +1,43 @@ +import { useEffect, useState } from 'react' + +const POLL_MS = 2 * 60 * 1000 + +export function useVersionCheck(healthUrl: string) { + const [updateAvailable, setUpdateAvailable] = useState(false) + + useEffect(() => { + let seenVersion: string | null = null + + async function check() { + try { + const res = await fetch(healthUrl, { cache: 'no-store' }) + if (!res.ok) return + const data = await res.json() + const v: string | undefined = data.version + if (!v) return + if (seenVersion === null) { + seenVersion = v + } else if (v !== seenVersion) { + setUpdateAvailable(true) + } + } catch { + // network error — skip silently + } + } + + check() + const interval = setInterval(check, POLL_MS) + + function onVisible() { + if (document.visibilityState === 'visible') check() + } + document.addEventListener('visibilitychange', onVisible) + + return () => { + clearInterval(interval) + document.removeEventListener('visibilitychange', onVisible) + } + }, [healthUrl]) + + return updateAvailable +} diff --git a/frontend/src/main.tsx b/frontend/src/main.tsx index 285e9cc..381f106 100644 --- a/frontend/src/main.tsx +++ b/frontend/src/main.tsx @@ -9,6 +9,15 @@ const qc = new QueryClient({ defaultOptions: { queries: { staleTime: 5 * 60 * 1000, retry: 1 } }, }) +// When opened from the portal's install button (?install=1), trigger the +// PWA install prompt as soon as the browser offers it (Chrome/Edge only). +if (new URLSearchParams(window.location.search).has('install')) { + window.addEventListener('beforeinstallprompt', e => { + e.preventDefault() + ;(e as Event & { prompt: () => Promise }).prompt() + }, { once: true }) +} + ReactDOM.createRoot(document.getElementById('root')!).render(