Arnaud
1dd8abfd52
Rule, applied consistently everywhere via a new isFeatureAvailableAnyTier() helper: if a feature is enabled on at least one tier, it stays visible for locked-out viewers with a small "Pro" badge and opens an upgrade prompt on click; if a feature is disabled on every tier, it hides entirely, since there's no upgrade path to point at. Covers: recipe variations, meal/drink pairings, nutrition estimation, Markdown export (5 call sites), weekly nutrition, import from URL, import from photo, and the Instacart grocery-delivery menu item. Previously inconsistent — some hid outright, one showed a lock icon overlapping its own icon. Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
75 lines
2.2 KiB
TypeScript
75 lines
2.2 KiB
TypeScript
"use client";
|
|
|
|
import { useState } from "react";
|
|
import { useTranslations } from "next-intl";
|
|
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";
|
|
import { ProBadge } from "@/components/premium/pro-badge";
|
|
|
|
export function VariationsButton({
|
|
recipeId,
|
|
baseServings,
|
|
difficulty,
|
|
prepMins,
|
|
cookMins,
|
|
ingredients,
|
|
steps,
|
|
locked = false,
|
|
}: {
|
|
recipeId: string;
|
|
baseServings: number;
|
|
difficulty?: string | null;
|
|
prepMins?: number | null;
|
|
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")}
|
|
>
|
|
<GitBranch className="h-4 w-4" />
|
|
</Button>
|
|
} />
|
|
<TooltipContent className="flex items-center gap-1.5">
|
|
{t("variationsTooltip")}
|
|
{locked && <ProBadge />}
|
|
</TooltipContent>
|
|
</Tooltip>
|
|
</TooltipProvider>
|
|
<VariationsDialog
|
|
recipeId={recipeId}
|
|
baseServings={baseServings}
|
|
difficulty={difficulty}
|
|
prepMins={prepMins}
|
|
cookMins={cookMins}
|
|
ingredients={ingredients}
|
|
steps={steps}
|
|
open={open}
|
|
onOpenChange={setOpen}
|
|
/>
|
|
<UpgradeDialog
|
|
open={upgradeOpen}
|
|
onOpenChange={setUpgradeOpen}
|
|
featureKey="recipe_variations"
|
|
featureLabel="Recipe variations"
|
|
/>
|
|
</>
|
|
);
|
|
}
|