Arnaud
55c6fc5ab7
Extends the existing feature-flags system (previously 3 keys, all default-enabled) with 6 more: recipe_import_url, recipe_import_photo, nutrition_estimation, markdown_export, weekly_nutrition, grocery_delivery. Each FEATURE_DEFINITIONS entry now carries its own defaultEnabled -- the new 6 default to false, the original 3 stay true -- so no migration/seed was needed for the "off by default" requirement, just a per-key fallback instead of a blanket true. Gated server-side (requireFeatureEnabledResponse, a new shared helper avoiding six copies of the same try/catch) on: import-url, import-photo, nutrition POST estimate, bulk markdown export, weekly meal-plan nutrition GET, Instacart export. Gated client-side by hiding the trigger entirely (not just disabling) on every page that renders one: recipe detail (meal/drink pairing buttons, nutrition panel's estimate button, markdown export), recipes list (import-URL button, including the OS Share Target auto-import path), new-recipe page (photo import), meal-plan page (markdown export, weekly nutrition bar), shopping-list/collection/pantry pages (markdown export), shopping-list page (Instacart button, now gated by both the existing env-var check AND the tier flag). Also: BYOK section on Settings -> AI now hidden entirely for non-BYOK users (previously showed a locked-and-teased notice, same inconsistency the Model Prefs fix closed yesterday). Language switcher shows a flag icon (FlagGB/FlagFR, moved from components/marketing to components/shared so both the logged-in settings switcher and the logged-out marketing one can use it) instead of plain "English"/"Français" text-only options. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
65 lines
2.4 KiB
TypeScript
65 lines
2.4 KiB
TypeScript
"use client";
|
|
|
|
import { useRouter } from "next/navigation";
|
|
import { Check, Globe } from "lucide-react";
|
|
import {
|
|
DropdownMenu,
|
|
DropdownMenuContent,
|
|
DropdownMenuItem,
|
|
DropdownMenuTrigger,
|
|
} from "@/components/ui/dropdown-menu";
|
|
import { MARKETING_LOCALE_COOKIE } from "@/lib/marketing-locale-cookie";
|
|
import type { Locale } from "@/lib/i18n/provider";
|
|
import { FlagGB, FlagFR } from "@/components/shared/flag-icons";
|
|
|
|
const OPTIONS: { code: Locale; Flag: typeof FlagGB; label: string }[] = [
|
|
{ code: "en", Flag: FlagGB, label: "English" },
|
|
{ code: "fr", Flag: FlagFR, label: "Français" },
|
|
];
|
|
|
|
// Plain module-level function, not part of the component body — setting a
|
|
// cookie is a real side effect (fine inside an event handler), but the
|
|
// React Compiler's purity lint flags any direct `document.cookie =`
|
|
// assignment written inline in a component/hook.
|
|
function setMarketingLocaleCookie(code: Locale) {
|
|
document.cookie = `${MARKETING_LOCALE_COOKIE}=${code}; path=/; max-age=31536000; samesite=lax`;
|
|
}
|
|
|
|
/**
|
|
* Cookie-based language switcher for the public marketing pages — sets
|
|
* `marketing_locale` (read server-side by `getMarketingLocale`) and
|
|
* refreshes, rather than reusing the authenticated app's `useLocale`/
|
|
* `setLocale` (that persists to `users.locale` via a PATCH that would just
|
|
* 401 for a logged-out visitor and revert the change).
|
|
*/
|
|
export function LanguageSwitcher({ current }: { current: Locale }) {
|
|
const router = useRouter();
|
|
const CurrentFlag = OPTIONS.find((o) => o.code === current)?.Flag ?? Globe;
|
|
|
|
function select(code: Locale) {
|
|
if (code === current) return;
|
|
setMarketingLocaleCookie(code);
|
|
router.refresh();
|
|
}
|
|
|
|
return (
|
|
<DropdownMenu>
|
|
<DropdownMenuTrigger
|
|
className="p-1.5 rounded-md text-muted-foreground hover:text-foreground hover:bg-accent transition-colors"
|
|
aria-label="Change language"
|
|
>
|
|
<CurrentFlag className="h-4 w-5 rounded-[2px]" />
|
|
</DropdownMenuTrigger>
|
|
<DropdownMenuContent align="end">
|
|
{OPTIONS.map(({ code, Flag, label }) => (
|
|
<DropdownMenuItem key={code} onClick={() => select(code)} className="gap-2">
|
|
<Flag className="h-3.5 w-[1.15rem] rounded-[2px] shrink-0" />
|
|
<span className="flex-1">{label}</span>
|
|
{current === code && <Check className="h-3.5 w-3.5" />}
|
|
</DropdownMenuItem>
|
|
))}
|
|
</DropdownMenuContent>
|
|
</DropdownMenu>
|
|
);
|
|
}
|