Martin Dvorak
26e36bc0c0
- New InstallSheet mounted in the root layout: appears ~1s after load on iOS/Android phones and tablets, over any screen including the key gate, with a dimmed backdrop. Never on desktop, never in standalone mode, and at most once per 7 days after a dismissal (localStorage). - Platform/browser detection (lib/install.ts): iPhone/iPad incl. iPadOS reporting as Mac with touch, Android, Safari vs Chrome vs other vs in-app browsers, with step 1 adapted accordingly. - iOS: numbered steps with chips (Safari, Share, ... , More, Add to Home Screen) and the accent Add pill. Android: captured beforeinstallprompt turns into a native Install button; fallback steps use Install app / Add to Home screen chips and an accent Install pill. - Close via X, backdrop, Escape or swipe-down on the handle; the site is untouched afterwards. Anchored to 100dvh so browser toolbars never hide the last step; pb-safe respects the home indicator. - Dark sheet by default; light only when the app theme was explicitly set to light. Settings gains a mobile-only Install app row that reopens it. - The inline head script captures beforeinstallprompt before hydration and records appinstalled. Old InstallHint banner removed. - Tests: new install-sheet suite (45 checks across iPhone Safari/Chrome/ in-app, Android Chrome/Samsung, desktop, prompt path, dismissal, 7-day expiry, standalone, Settings row, both themes); pwa suite updated.
24 lines
758 B
TypeScript
24 lines
758 B
TypeScript
import { ApiKeyGate } from "@/components/ApiKeyGate";
|
|
import { AppHeader } from "@/components/AppHeader";
|
|
import { LibraryScreen } from "@/components/LibraryScreen";
|
|
import { MobileSidebar, Sidebar, SidebarOffset } from "@/components/Sidebar";
|
|
import { TabBar } from "@/components/TabBar";
|
|
|
|
export default function HomePage() {
|
|
return (
|
|
<ApiKeyGate>
|
|
<div className="flex min-h-dvh bg-[var(--page)]">
|
|
<Sidebar />
|
|
<SidebarOffset />
|
|
<MobileSidebar />
|
|
<main className="min-w-0 flex-1">
|
|
<AppHeader />
|
|
<div className="mx-auto w-full max-w-6xl px-4 pb-tabbar lg:px-10 lg:pb-16">
|
|
<LibraryScreen />
|
|
</div>
|
|
<TabBar />
|
|
</main>
|
|
</div>
|
|
</ApiKeyGate>
|
|
);
|
|
}
|