fix: hide recipe variations button when locked instead of disabled+lock-badge (v0.78.1)

Was the one gated feature still shown as a clickable disabled button with a small lock icon overlay, opening an upgrade dialog on click. Every other gated feature (pairings, nutrition estimate, markdown export) hides entirely instead — brought this one in line and removed the now-dead locked/UpgradeDialog code from VariationsButton.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>

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

@@ -232,26 +232,27 @@ export default async function RecipePage({ params }: Params) {
                 ingredients={recipe.ingredients.map((ing) => ({ rawName: ing.rawName }))}
               />
             )}
-            <VariationsButton
-              recipeId={id}
-              baseServings={recipe.baseServings}
-              difficulty={recipe.difficulty}
-              prepMins={recipe.prepMins}
-              cookMins={recipe.cookMins}
-              ingredients={recipe.ingredients.map((ing) => ({
-                rawName: ing.rawName,
-                quantity: ing.quantity,
-                unit: ing.unit,
-                note: ing.note,
-                order: ing.order,
-              }))}
-              steps={recipe.steps.map((s) => ({
-                instruction: s.instruction,
-                timerSeconds: s.timerSeconds,
-                order: s.order,
-              }))}
-              locked={locked.variations}
-            />
+            {!locked.variations && (
+              <VariationsButton
+                recipeId={id}
+                baseServings={recipe.baseServings}
+                difficulty={recipe.difficulty}
+                prepMins={recipe.prepMins}
+                cookMins={recipe.cookMins}
+                ingredients={recipe.ingredients.map((ing) => ({
+                  rawName: ing.rawName,
+                  quantity: ing.quantity,
+                  unit: ing.unit,
+                  note: ing.note,
+                  order: ing.order,
+                }))}
+                steps={recipe.steps.map((s) => ({
+                  instruction: s.instruction,
+                  timerSeconds: s.timerSeconds,
+                  order: s.order,
+                }))}
+              />
+            )}
             <ForkRecipeButton recipeId={id} variant={isOwner ? "duplicate" : "fork"} />
             <ShareRecipeButton recipeId={id} visibility={recipe.visibility} />
             <SaveOfflineButton recipeId={id} recipeTitle={recipe.title} />

apps/web/components/admin/feature-flags-form.tsx

@@ -48,7 +48,7 @@ export function FeatureFlagsForm({
       <div>
         <h2 className="font-semibold text-lg">Feature Toggles</h2>
         <p className="text-sm text-muted-foreground mt-1">
-          Disable a feature for a tier to hide it for that tier&apos;s users (most features hide entirely; a few show a locked/upgrade state instead — see each feature&apos;s actual behavior in the app).
+          Disable a feature for a tier to hide it entirely for that tier&apos;s users.
         </p>
       </div>
 

apps/web/components/recipe/variations-button.tsx

@@ -2,11 +2,10 @@
 
 import { useState } from "react";
 import { useTranslations } from "next-intl";
-import { GitBranch, Lock } from "lucide-react";
+import { GitBranch } from "lucide-react";
 import { Button } from "@/components/ui/button";
 import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from "@/components/ui/tooltip";
 import { VariationsDialog } from "./variations-dialog";
-import { UpgradeDialog } from "@/components/premium/upgrade-dialog";
 
 export function VariationsButton({
   recipeId,
@@ -16,7 +15,6 @@ export function VariationsButton({
   cookMins,
   ingredients,
   steps,
-  locked = false,
 }: {
   recipeId: string;
   baseServings: number;
@@ -25,26 +23,17 @@ export function VariationsButton({
   cookMins?: number | null;
   ingredients: Array<{ rawName: string; quantity?: string | number | null; unit?: string | null; note?: string | null; order: number }>;
   steps: Array<{ instruction: string; timerSeconds?: number | null; order: number }>;
-  locked?: boolean;
 }) {
   const t = useTranslations("recipe");
   const [open, setOpen] = useState(false);
-  const [upgradeOpen, setUpgradeOpen] = useState(false);
 
   return (
     <>
       <TooltipProvider>
         <Tooltip>
           <TooltipTrigger render={
-            <Button
-              variant="ghost"
-              size="icon"
-              onClick={() => (locked ? setUpgradeOpen(true) : setOpen(true))}
-              aria-label={t("variationsTooltip")}
-              className="relative"
-            >
+            <Button variant="ghost" size="icon" onClick={() => setOpen(true)} aria-label={t("variationsTooltip")}>
               <GitBranch className="h-4 w-4" />
-              {locked && <Lock className="h-2.5 w-2.5 absolute bottom-1 right-1 text-muted-foreground" />}
             </Button>
           } />
           <TooltipContent>{t("variationsTooltip")}</TooltipContent>
@@ -61,12 +50,6 @@ export function VariationsButton({
         open={open}
         onOpenChange={setOpen}
       />
-      <UpgradeDialog
-        open={upgradeOpen}
-        onOpenChange={setUpgradeOpen}
-        featureKey="recipe_variations"
-        featureLabel="Recipe variations"
-      />
     </>
   );
 }

apps/web/lib/changelog.ts

@@ -1,5 +1,5 @@
 // Mirrors CHANGELOG.md at the repo root — update both together.
-export const APP_VERSION = "0.78.0";
+export const APP_VERSION = "0.78.1";
 
 export type ChangelogEntry = {
   version: string;
@@ -11,6 +11,13 @@ export type ChangelogEntry = {
 };
 
 export const CHANGELOG: ChangelogEntry[] = [
+  {
+    version: "0.78.1",
+    date: "2026-07-24 14:10",
+    fixed: [
+      "Recipe variations button was the one leftover spot still shown disabled with a small lock badge for tiers without the feature, instead of hidden entirely like every other gated feature. Now hidden, matching meal/drink pairings, nutrition estimation, and Markdown export.",
+    ],
+  },
   {
     version: "0.78.0",
     date: "2026-07-24 13:40",

apps/web/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@epicure/web",
-  "version": "0.78.0",
+  "version": "0.78.1",
   "private": true,
   "scripts": {
     "dev": "next dev",