Files
Epicure/apps/web/app/layout.tsx
T
Arnaud 9ba2996022 feat: offline save-for-later + background sync for mark-cooked (v0.65.0)
Adds a "Save offline" button on the recipe page that force-refetches
the current page so the service worker's cache picks up a fresh copy
right now, plus a small IndexedDB-backed list (lib/offline-db.ts) of
what's been saved. The /offline fallback page now reads that list and
renders it instead of being a dead end with just a "go back" link.

Also fixes the service worker's network-first fetch handler, which
never wrote successful responses into its cache -- meaning the
existing offline page's claim that "recently visited recipes are
available" was never actually true. It populates the cache on every
successful GET now.

Background sync: marking a batch-cook dish as cooked while offline
(the only existing mark-cooked call site in the app) now queues the
request in IndexedDB instead of just failing, and registers a
Background Sync (public/sw.js's "sync" listener replays the queue)
for Chromium; lib/offline-queue.ts's online-event fallback covers
Safari/Firefox, which never fire that event at all. Both replay paths
read/write the same IndexedDB store so either one drains it.

Also removes apps/web/public/manifest.json, a stale static manifest
that layout.tsx used to link to before the previous commit pointed it
at the real generated route (app/manifest.ts) -- it had gone
unnoticed and unused since.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
2026-07-21 00:04:17 +02:00

68 lines
2.0 KiB
TypeScript

import type { Metadata, Viewport } from "next";
import { Lora, Geist_Mono } from "next/font/google";
import { headers } from "next/headers";
import { Providers } from "@/components/providers";
import { auth } from "@/lib/auth/server";
import type { Locale } from "@/lib/i18n/provider";
import { SwRegister } from "@/components/pwa/sw-register";
import { InstallPrompt } from "@/components/pwa/install-prompt";
import { OfflineSyncManager } from "@/components/pwa/offline-sync-manager";
import { getMarketingLocale } from "@/lib/marketing-locale";
import "./globals.css";
const lora = Lora({
variable: "--font-lora",
subsets: ["latin"],
display: "swap",
});
const geistMono = Geist_Mono({
variable: "--font-geist-mono",
subsets: ["latin"],
});
export const metadata: Metadata = {
title: "Epicure",
description: "Your personal AI-powered recipe book.",
manifest: "/manifest.webmanifest",
icons: {
icon: "/icon.svg",
apple: "/icon.svg",
},
appleWebApp: {
capable: true,
statusBarStyle: "default",
title: "Epicure",
},
};
export const viewport: Viewport = {
themeColor: "#18181b",
viewportFit: "cover",
};
export default async function RootLayout({
children,
}: Readonly<{ children: React.ReactNode }>) {
const session = await auth.api.getSession({ headers: await headers() }).catch(() => null);
// Signed-in users: their saved preference. Anonymous visitors (marketing
// pages): the marketing-locale cookie instead, since there's no account to
// read a preference from.
const initialLocale = ((session?.user as { locale?: string })?.locale ?? await getMarketingLocale()) as Locale;
return (
<html
lang={initialLocale}
suppressHydrationWarning
className={`${lora.variable} ${geistMono.variable} h-full antialiased`}
>
<body className="min-h-full flex flex-col">
<Providers initialLocale={initialLocale}>{children}</Providers>
<SwRegister />
<InstallPrompt />
<OfflineSyncManager />
</body>
</html>
);
}