arnaudne/Epicure
1
0
Fork 0
Code Issues 2 Pull Requests Actions Packages Projects Releases Wiki Activity

feat: vitrine language/theme switching, missing features, disabled-signups handling

Browse Source 
Language switcher (flag toggle) and dark-mode toggle in the marketing
header, both usable by logged-out visitors -- the marketing pages
previously hardcoded English (getMessages(undefined)) regardless of
any preference, and had no theme control since the authenticated
Nav's toggle isn't rendered there. New cookie-based locale resolution
(lib/marketing-locale.ts) separate from the authenticated app's
useLocale/setLocale, which persists via an authenticated PATCH that
would just 401 and revert for an anonymous visitor. Root layout now
falls back to that cookie for <html lang> when there's no session.

Features/Home now cover cook mode, recipe variations, personalized
recommendations, and ingredient substitution -- all real, shipped
features that were missing from the page copy.

Signup CTAs check isSignupsDisabled() and swap to "Signups closed"
instead of "Get started free" -- still linking to /signup, since that
page already handles the invite-token exception correctly.

Fixed along the way: importing the cookie-name constant from
marketing-locale.ts in the client-side LanguageSwitcher pulled that
file's server-only imports (lib/auth/server -> the DB client ->
`postgres`) into the client bundle, breaking the build on Node
built-ins. Split the constant into its own client-safe file
(marketing-locale-cookie.ts). Caught by `pnpm build`, not typecheck.

Verified with typecheck, lint, and a full production build (clean
compile) -- no DB in this sandbox to click through a real dev server.

v0.48.1
This commit is contained in:
Arnaud
2026-07-18 10:55:06 +02:00
parent e71c978e52
commit 8dccd8898b
17 changed files with 191 additions and 26 deletions
Download Patch File Download Diff File Expand all files Collapse all files
apps/web/components/marketing/marketing-nav.tsx
+13 -3
View File
@@ -5,6 +5,10 @@ import { auth } from "@/lib/auth/server";
import { buttonVariants } from "@/components/ui/button";
import { cn } from "@/lib/utils";
import { getMessages } from "@/lib/i18n/server";
import { getEffectiveMarketingLocale } from "@/lib/marketing-locale";
import { isSignupsDisabled } from "@/lib/site-settings";
import { LanguageSwitcher } from "./language-switcher";
import { ThemeToggle } from "./theme-toggle";
const LINKS = [
{ href: "/features", key: "features" },
@@ -12,8 +16,12 @@ const LINKS = [
] as const;
export async function MarketingNav() {
const session = await auth.api.getSession({ headers: await headers() }).catch(() => null);
const m = getMessages((session?.user as { locale?: string } | undefined)?.locale);
const [session, locale, signupsDisabled] = await Promise.all([
auth.api.getSession({ headers: await headers() }).catch(() => null),
getEffectiveMarketingLocale(),
isSignupsDisabled(),
]);
const m = getMessages(locale);
return (
<header className="sticky top-0 z-50 border-b bg-background/95 backdrop-blur supports-[backdrop-filter]:bg-background/60">
@@ -30,6 +38,8 @@ export async function MarketingNav() {
))}
</nav>
<div className="ml-auto flex items-center gap-2">
<LanguageSwitcher current={locale} />
<ThemeToggle />
{session ? (
<Link href="/recipes" className={cn(buttonVariants({ size: "sm" }))}>
{m.marketing.nav.openApp}
@@ -40,7 +50,7 @@ export async function MarketingNav() {
{m.marketing.nav.login}
</Link>
<Link href="/signup" className={cn(buttonVariants({ size: "sm" }))}>
{m.marketing.nav.signup}
{signupsDisabled ? m.marketing.nav.signupClosed : m.marketing.nav.signup}
</Link>
</>
)}