feat: 6 new per-tier feature flags (off by default) + flag-icon locale switcher + hide BYOK when disabled (v0.74.0)

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>

apps/web/app/(app)/collections/[id]/page.tsx

@@ -18,6 +18,7 @@ import { buttonVariants } from "@/components/ui/button";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { cn } from "@/lib/utils";
 import { ExportMarkdownButton } from "@/components/shared/export-markdown-button";
+import { getFeatureFlagMatrix, type Tier } from "@/lib/feature-flags";
 import { EmptyState } from "@/components/shared/empty-state";
 import { collectionToMarkdown } from "@/lib/markdown/collection";
 import { getMessages } from "@/lib/i18n/server";
@@ -31,6 +32,8 @@ export default async function CollectionPage({ params }: Params) {
   const session = await auth.api.getSession({ headers: await headers() });
   if (!session) return null;
   const m = getMessages((session.user as { locale?: string }).locale);
+  const viewerTier = (session.user as { tier?: string }).tier as Tier | undefined ?? "free";
+  const canExportMarkdown = (await getFeatureFlagMatrix()).markdown_export[viewerTier];
 
   const col = await db.query.collections.findFirst({
     where: and(eq(collections.id, id), collectionVisibleToViewer(session.user.id)),
@@ -82,14 +85,14 @@ export default async function CollectionPage({ params }: Params) {
                   } />
                   <TooltipContent>{m.collections.exportPdf}</TooltipContent>
                 </Tooltip>
-                <ExportMarkdownButton
+                {canExportMarkdown && <ExportMarkdownButton
                   markdown={collectionToMarkdown({
                     name: col.name,
                     description: col.description,
                     recipes: recipeList,
                   })}
                   filename={col.name}
-                />
+                />}
               </>
             )}
             {isOwner && <GenerateMealDialog collectionId={id} />}

apps/web/app/(app)/meal-plan/page.tsx

@@ -12,6 +12,7 @@ import { NewShoppingListButton } from "@/components/meal-plan/new-shopping-list-
 import { WeeklyNutritionBar } from "@/components/nutrition/weekly-nutrition-bar";
 import { cn } from "@/lib/utils";
 import { ExportMarkdownButton } from "@/components/shared/export-markdown-button";
+import { getFeatureFlagMatrix, type Tier } from "@/lib/feature-flags";
 import { mealPlanToMarkdown } from "@/lib/markdown/meal-plan";
 import { getMessages, formatMessage } from "@/lib/i18n/server";
 
@@ -59,6 +60,10 @@ export default async function MealPlanPage({
   const session = await auth.api.getSession({ headers: await headers() });
   if (!session) return null;
   const msgs = getMessages((session.user as { locale?: string }).locale);
+  const viewerTier = (session.user as { tier?: string }).tier as Tier | undefined ?? "free";
+  const featureFlags = await getFeatureFlagMatrix();
+  const canExportMarkdown = featureFlags.markdown_export[viewerTier];
+  const canSeeWeeklyNutrition = featureFlags.weekly_nutrition[viewerTier];
 
   const monday = getMonday(week);
   const weekStart = toDateStr(monday);
@@ -157,10 +162,12 @@ export default async function MealPlanPage({
             } />
             <TooltipContent>{msgs.common.print}</TooltipContent>
           </Tooltip>
-          <ExportMarkdownButton
-            markdown={mealPlanToMarkdown({ label, entries })}
-            filename={`meal-plan-${weekStart}`}
-          />
+          {canExportMarkdown && (
+            <ExportMarkdownButton
+              markdown={mealPlanToMarkdown({ label, entries })}
+              filename={`meal-plan-${weekStart}`}
+            />
+          )}
           <Tooltip>
             <TooltipTrigger render={
               <a href={`/api/v1/meal-plans/${weekStart}/export/ics`} className={cn(buttonVariants({ variant: "ghost", size: "icon" }))} aria-label={msgs.mealPlan.exportCalendar}>
@@ -173,7 +180,7 @@ export default async function MealPlanPage({
       </div>
       </TooltipProvider>
 
-      <WeeklyNutritionBar weekStart={weekStart} />
+      {canSeeWeeklyNutrition && <WeeklyNutritionBar weekStart={weekStart} />}
       <MealPlanner weekStart={weekStart} initialEntries={entries} userRecipes={userRecipes} hasNutritionGoals={hasNutritionGoals} />
 
       {sharedMemberships.length > 0 && (

apps/web/app/(app)/pantry/page.tsx

@@ -10,12 +10,15 @@ import { ExpiringLeftovers } from "@/components/pantry/expiring-leftovers";
 import { scoreRecipesAgainstPantry } from "@/lib/pantry-match";
 import { dishExpiresAt, daysUntil, isLeftoverExpiringSoon } from "@/lib/leftover-match";
 import { getPublicUrl } from "@/lib/storage";
+import { getFeatureFlagMatrix, type Tier } from "@/lib/feature-flags";
 
 export const metadata: Metadata = {};
 
 export default async function PantryPage() {
   const session = await auth.api.getSession({ headers: await headers() });
   if (!session) return null;
+  const viewerTier = (session.user as { tier?: string }).tier as Tier | undefined ?? "free";
+  const canExportMarkdown = (await getFeatureFlagMatrix()).markdown_export[viewerTier];
 
   const [items, candidateRecipes, cookedDishes] = await Promise.all([
     db.query.pantryItems.findMany({
@@ -75,7 +78,7 @@ export default async function PantryPage() {
 
   return (
     <div className="space-y-6">
-      <PantryPageHeader items={mappedItems} />
+      <PantryPageHeader items={mappedItems} canExportMarkdown={canExportMarkdown} />
       <ExpiringLeftovers leftovers={leftovers} />
       <ExpiringSoonSuggestions suggestions={suggestions} />
       <PantryManager key={mappedItems.map((i) => i.id).join(",")} initialItems={mappedItems} />

apps/web/app/(app)/recipes/[id]/page.tsx

@@ -114,6 +114,8 @@ export default async function RecipePage({ params }: Params) {
     variations: !featureFlags.recipe_variations[viewerTier],
     drinkPairing: !featureFlags.drink_pairing[viewerTier],
     mealPairing: !featureFlags.meal_pairing[viewerTier],
+    nutritionEstimation: !featureFlags.nutrition_estimation[viewerTier],
+    markdownExport: !featureFlags.markdown_export[viewerTier],
   };
 
   const isOwner = recipe.authorId === session.user.id;
@@ -188,8 +190,8 @@ export default async function RecipePage({ params }: Params) {
             <FavoriteButton recipeId={id} initialFavorited={isFavorited} />
             {!recipe.isBatchCook && recipe.recipeType !== "drink" && (
               <>
-                <MealPairingButton recipeId={id} locked={locked.mealPairing} />
-                <DrinkPairingButton recipeId={id} locked={locked.drinkPairing} />
+                {!locked.mealPairing && <MealPairingButton recipeId={id} locked={false} />}
+                {!locked.drinkPairing && <DrinkPairingButton recipeId={id} locked={false} />}
               </>
             )}
             {recipe.visibility === "public" && (
@@ -247,22 +249,24 @@ export default async function RecipePage({ params }: Params) {
             <ShareRecipeButton recipeId={id} visibility={recipe.visibility} />
             <SaveOfflineButton recipeId={id} recipeTitle={recipe.title} />
             <PrintButton recipeId={id} />
-            <ExportMarkdownButton
-              markdown={recipeToMarkdown({
-                title: recipe.title,
-                description: recipe.description,
-                baseServings: recipe.baseServings,
-                prepMins: recipe.prepMins,
-                cookMins: recipe.cookMins,
-                difficulty: recipe.difficulty,
-                sourceUrl: recipe.sourceUrl,
-                ingredients: recipe.ingredients,
-                steps: recipe.steps,
-                isBatchCook: recipe.isBatchCook,
-                batchDishes: recipe.batchDishes,
-              })}
-              filename={recipe.title}
-            />
+            {!locked.markdownExport && (
+              <ExportMarkdownButton
+                markdown={recipeToMarkdown({
+                  title: recipe.title,
+                  description: recipe.description,
+                  baseServings: recipe.baseServings,
+                  prepMins: recipe.prepMins,
+                  cookMins: recipe.cookMins,
+                  difficulty: recipe.difficulty,
+                  sourceUrl: recipe.sourceUrl,
+                  ingredients: recipe.ingredients,
+                  steps: recipe.steps,
+                  isBatchCook: recipe.isBatchCook,
+                  batchDishes: recipe.batchDishes,
+                })}
+                filename={recipe.title}
+              />
+            )}
             {isOwner && (
               <>
                 <VersionHistoryButton
@@ -419,7 +423,7 @@ export default async function RecipePage({ params }: Params) {
               order: ing.order,
             }))}
           />
-          <NutritionPanel recipeId={id} initialData={recipe.nutritionData} initialManual={recipe.nutritionManual} />
+          <NutritionPanel recipeId={id} initialData={recipe.nutritionData} initialManual={recipe.nutritionManual} estimateEnabled={!locked.nutritionEstimation} />
         </div>
       )}
 

apps/web/app/(app)/recipes/new/page.tsx

@@ -1,16 +1,24 @@
 import type { Metadata } from "next";
+import { headers } from "next/headers";
+import { auth } from "@/lib/auth/server";
 import { RecipeForm } from "@/components/recipe/recipe-form";
 import { NewRecipeHeader } from "@/components/recipe/new-recipe-header";
 import { PhotoImportButton } from "@/components/recipe/photo-import-button";
+import { getFeatureFlagMatrix, type Tier } from "@/lib/feature-flags";
 
 export const metadata: Metadata = {};
 
-export default function NewRecipePage() {
+export default async function NewRecipePage() {
+  const session = await auth.api.getSession({ headers: await headers() });
+  const viewerTier = (session?.user as { tier?: string } | undefined)?.tier as Tier | undefined ?? "free";
+  const featureFlags = await getFeatureFlagMatrix();
+  const canImportPhoto = featureFlags.recipe_import_photo[viewerTier];
+
   return (
     <div className="space-y-6">
       <div className="flex items-start justify-between gap-4">
         <NewRecipeHeader />
-        <PhotoImportButton />
+        {canImportPhoto && <PhotoImportButton />}
       </div>
       <RecipeForm />
     </div>

apps/web/app/(app)/recipes/page.tsx

@@ -10,6 +10,7 @@ import { RecipesGrid } from "@/components/recipe/recipes-grid";
 import { CookingAssistantPanel } from "@/components/recipe/cooking-assistant-panel";
 import { getMessages } from "@/lib/i18n/server";
 import { getFeaturePrefs } from "@/lib/feature-prefs";
+import { getFeatureFlagMatrix, type Tier } from "@/lib/feature-flags";
 
 export const metadata: Metadata = {};
 
@@ -59,6 +60,9 @@ export default async function RecipesPage({ searchParams }: { searchParams: Sear
   if (!session) return null;
   const m = getMessages((session.user as { locale?: string }).locale);
   const featurePrefs = await getFeaturePrefs(session.user.id);
+  const viewerTier = (session.user as { tier?: string }).tier as Tier | undefined ?? "free";
+  const featureFlags = await getFeatureFlagMatrix();
+  const canImportUrl = featureFlags.recipe_import_url[viewerTier];
 
   const { q, sort, visibility, difficulty, tag, page: pageParam, batchCook, recipeType, url, text } = await searchParams;
   const sharedUrl = extractSharedUrl({ url, text });
@@ -158,7 +162,8 @@ export default async function RecipesPage({ searchParams }: { searchParams: Sear
         initialTag={tagFilter ?? ""}
         initialBatchCook={batchCookFilter ?? ""}
         initialRecipeType={recipeTypeFilter ?? ""}
-        sharedUrl={sharedUrl}
+        sharedUrl={canImportUrl ? sharedUrl : undefined}
+        showImportUrl={canImportUrl}
       />
       <RecipesEmptyState query={query} count={total} />
       <RecipesGrid key={`${query}-${sortKey}-${visibilityFilter}-${difficultyFilter}-${tagFilter}-${batchCookFilter}-${recipeTypeFilter}-${page}`} recipes={recipesWithFavorites} />

apps/web/app/(app)/settings/ai/page.tsx

@@ -6,7 +6,6 @@ import { UNLIMITED, getRecipeCount, getStorageUsedMb } from "@/lib/tiers";
 import { ByokManager } from "@/components/settings/byok-manager";
 import { ModelPrefsForm } from "@/components/settings/model-prefs-form";
 import { UsageQuotaSection } from "@/components/settings/usage-quota-section";
-import { DeveloperLockedNotice } from "@/components/settings/developer-locked-notice";
 import { getMessages, formatMessage } from "@/lib/i18n/server";
 
 export const metadata: Metadata = {};
@@ -74,19 +73,17 @@ export default async function AiSettingsPage() {
         <UsageQuotaSection metrics={usageMetrics} />
       </section>
 
-      <section className="rounded-xl border p-6 space-y-4">
-        <div>
-          <h2 className="font-semibold text-lg">{m.settings.byok.title}</h2>
-          <p className="text-sm text-muted-foreground mt-1">
-            {m.settings.byok.description}
-          </p>
-        </div>
-        {dbUser?.isByokEnabled ? (
+      {dbUser?.isByokEnabled && (
+        <section className="rounded-xl border p-6 space-y-4">
+          <div>
+            <h2 className="font-semibold text-lg">{m.settings.byok.title}</h2>
+            <p className="text-sm text-muted-foreground mt-1">
+              {m.settings.byok.description}
+            </p>
+          </div>
           <ByokManager initialKeys={aiKeys.map((k) => k.provider)} />
-        ) : (
-          <DeveloperLockedNotice message={m.settings.byokLockedNotice} />
-        )}
-      </section>
+        </section>
+      )}
 
       {dbUser?.isByokEnabled && (
         <section className="rounded-xl border p-6 space-y-4">

apps/web/app/(app)/shopping-lists/[id]/page.tsx

@@ -16,6 +16,7 @@ import { getShoppingListAccess, canWriteShoppingList } from "@/lib/shopping-list
 import { ExportMarkdownButton } from "@/components/shared/export-markdown-button";
 import { shoppingListToMarkdown } from "@/lib/markdown/shopping-list";
 import { getMessages, formatMessage } from "@/lib/i18n/server";
+import { getFeatureFlagMatrix, type Tier } from "@/lib/feature-flags";
 
 type Params = { params: Promise<{ id: string }> };
 
@@ -37,7 +38,10 @@ export default async function ShoppingListPage({ params }: Params) {
   if (!list) notFound();
 
   const canEdit = canWriteShoppingList(access.role);
-  const instacartEnabled = process.env["NEXT_PUBLIC_GROCERY_PROVIDER"] === "instacart";
+  const viewerTier = (session.user as { tier?: string }).tier as Tier | undefined ?? "free";
+  const featureFlags = await getFeatureFlagMatrix();
+  const canExportMarkdown = featureFlags.markdown_export[viewerTier];
+  const instacartEnabled = process.env["NEXT_PUBLIC_GROCERY_PROVIDER"] === "instacart" && featureFlags.grocery_delivery[viewerTier];
 
   return (
     <div className="space-y-6 max-w-2xl">
@@ -63,10 +67,12 @@ export default async function ShoppingListPage({ params }: Params) {
             } />
             <TooltipContent>{m.common.print}</TooltipContent>
           </Tooltip>
-          <ExportMarkdownButton
-            markdown={shoppingListToMarkdown({ name: list.name, items: list.items })}
-            filename={list.name}
-          />
+          {canExportMarkdown && (
+            <ExportMarkdownButton
+              markdown={shoppingListToMarkdown({ name: list.name, items: list.items })}
+              filename={list.name}
+            />
+          )}
           {access.role === "owner" && (
             <ShoppingListActionsMenu listId={id} name={list.name} redirectAfterDeleteTo="/shopping-lists" />
           )}

apps/web/app/api/v1/ai/import-photo/route.ts

@@ -7,6 +7,7 @@ import { withAiQuota, resolveAiConfigOrError } from "@/lib/ai/ai-error";
 import { importFromPhoto } from "@/lib/ai/features/import-photo";
 import { getModelConfigForUseCase } from "@/lib/ai/resolve-user-key";
 import { checkTierLimitInTransaction, TierLimitError } from "@/lib/tiers";
+import { requireFeatureEnabledResponse } from "@/lib/feature-flags";
 
 const Schema = z.object({
   imageBase64: z.string().max(14_000_000),
@@ -17,6 +18,9 @@ export async function POST(req: NextRequest) {
   const { session, response } = await requireSessionOrApiKey(req);
   if (response) return response;
 
+  const featureDenied = await requireFeatureEnabledResponse(session!.user.id, "recipe_import_photo");
+  if (featureDenied) return featureDenied;
+
   const body = await req.json() as unknown;
   const parsed = Schema.safeParse(body);
   if (!parsed.success) {

apps/web/app/api/v1/ai/import-url/route.ts

@@ -6,6 +6,7 @@ import { withAiQuota, resolveAiConfigOrError } from "@/lib/ai/ai-error";
 import { importFromUrl } from "@/lib/ai/features/import-url";
 import { validateWebhookUrl } from "@/lib/validate-webhook-url";
 import { withUserKey } from "@/lib/ai/resolve-user-key";
+import { requireFeatureEnabledResponse } from "@/lib/feature-flags";
 
 const Schema = z.object({
   url: z.string().url(),
@@ -17,6 +18,9 @@ export async function POST(req: NextRequest) {
   const { session, response } = await requireSessionOrApiKey(req);
   if (response) return response;
 
+  const featureDenied = await requireFeatureEnabledResponse(session!.user.id, "recipe_import_url");
+  if (featureDenied) return featureDenied;
+
   const body = await req.json() as unknown;
   const parsed = Schema.safeParse(body);
   if (!parsed.success) {

apps/web/app/api/v1/meal-plans/[weekStart]/nutrition/route.ts

@@ -1,6 +1,7 @@
 import { NextRequest, NextResponse } from "next/server";
 import { db, mealPlans, mealPlanEntries, userNutritionGoals, eq, and } from "@epicure/db";
 import { requireSessionOrApiKey } from "@/lib/api-auth";
+import { requireFeatureEnabledResponse } from "@/lib/feature-flags";
 
 type Params = { params: Promise<{ weekStart: string }> };
 
@@ -16,6 +17,9 @@ export async function GET(req: NextRequest, { params }: Params) {
   const { session, response } = await requireSessionOrApiKey(req);
   if (response) return response;
 
+  const featureDenied = await requireFeatureEnabledResponse(session!.user.id, "weekly_nutrition");
+  if (featureDenied) return featureDenied;
+
   const { weekStart } = await params;
   const userId = session!.user.id;
 

apps/web/app/api/v1/recipes/[id]/nutrition/route.ts

@@ -5,6 +5,7 @@ import { requireSessionOrApiKey } from "@/lib/api-auth";
 import { applyRateLimit } from "@/lib/rate-limit";
 import { withAiQuota } from "@/lib/ai/ai-error";
 import { estimateNutrition } from "@/lib/ai/features/estimate-nutrition";
+import { requireFeatureEnabledResponse } from "@/lib/feature-flags";
 
 type Params = { params: Promise<{ id: string }> };
 
@@ -33,6 +34,9 @@ export async function POST(req: NextRequest, { params }: Params) {
   if (response) return response;
   const { id } = await params;
 
+  const featureDenied = await requireFeatureEnabledResponse(session!.user.id, "nutrition_estimation");
+  if (featureDenied) return featureDenied;
+
   const limited = await applyRateLimit(`rl:ai:${session!.user.id}`, 10, 60);
   if (limited) return limited;
 

apps/web/app/api/v1/recipes/bulk/export/route.ts

@@ -3,6 +3,7 @@ import { z } from "zod";
 import { requireSessionOrApiKey } from "@/lib/api-auth";
 import { db, recipes, eq, and, inArray } from "@epicure/db";
 import { recipeToMarkdown } from "@/lib/markdown/recipe";
+import { requireFeatureEnabledResponse } from "@/lib/feature-flags";
 
 const ExportSchema = z.object({
   ids: z.array(z.string()).min(1).max(100),
@@ -12,6 +13,9 @@ export async function POST(req: NextRequest) {
   const { session, response } = await requireSessionOrApiKey(req);
   if (response) return response;
 
+  const featureDenied = await requireFeatureEnabledResponse(session!.user.id, "markdown_export");
+  if (featureDenied) return featureDenied;
+
   const body = ExportSchema.safeParse(await req.json());
   if (!body.success) return NextResponse.json({ error: "Invalid request" }, { status: 400 });
 

apps/web/app/api/v1/shopping-lists/[id]/export/instacart/route.ts

@@ -4,6 +4,7 @@ import { requireSessionOrApiKey } from "@/lib/api-auth";
 import { getShoppingListAccess } from "@/lib/shopping-list-access";
 import { buildGroceryExportPayload } from "@/lib/grocery-export";
 import { createInstacartShoppingListLink } from "@/lib/grocery-providers/instacart";
+import { requireFeatureEnabledResponse } from "@/lib/feature-flags";
 
 type Params = { params: Promise<{ id: string }> };
 
@@ -12,6 +13,9 @@ export async function POST(req: NextRequest, { params }: Params) {
   if (response) return response;
   const { id } = await params;
 
+  const featureDenied = await requireFeatureEnabledResponse(session!.user.id, "grocery_delivery");
+  if (featureDenied) return featureDenied;
+
   const access = await getShoppingListAccess(id, session!.user.id);
   if (!access) return NextResponse.json({ error: "Not found" }, { status: 404 });