feat(i18n): translate hardcoded strings across print, public recipe, and recipe management UI

Wires dozens of components and server pages to next-intl instead of hardcoded
English text, and adds a lightweight getMessages/formatMessage helper for
server components (print pages, public recipe page, cook metadata) since
next-intl/server isn't wired into this app's routing. Backfills missing
en/fr message keys that existing code already referenced but fr.json lacked.

apps/web/app/r/[id]/page.tsx

@@ -13,6 +13,7 @@ import { ServingScaler } from "@/components/recipe/serving-scaler";
 import { getPublicUrl } from "@/lib/storage";
 import { hasQuantity } from "@/lib/fractions";
 import { cn } from "@/lib/utils";
+import { getMessages, formatMessage } from "@/lib/i18n/server";
 
 type Params = { params: Promise<{ id: string }> };
 
@@ -33,15 +34,12 @@ export async function generateMetadata({ params }: Params): Promise<Metadata> {
   };
 }
 
-const DIETARY_LABELS: Record<string, string> = {
-  vegan: "Vegan", vegetarian: "Vegetarian", glutenFree: "Gluten-free",
-  dairyFree: "Dairy-free", nutFree: "Nut-free", halal: "Halal", kosher: "Kosher",
-};
-
 export default async function PublicRecipePage({ params }: Params) {
   const { id } = await params;
   const session = await auth.api.getSession({ headers: await headers() }).catch(() => null);
 
+  const m = getMessages((session?.user as { locale?: string } | undefined)?.locale);
+
   const recipe = await db.query.recipes.findFirst({
     where: (r, { and, eq, ne }) => and(eq(r.id, id), ne(r.visibility, "private")),
     with: {
@@ -57,7 +55,9 @@ export default async function PublicRecipePage({ params }: Params) {
   const cover = recipe.photos.find((p) => p.isCover) ?? recipe.photos[0];
   const totalMins = (recipe.prepMins ?? 0) + (recipe.cookMins ?? 0);
   const activeTags = Object.entries(recipe.dietaryTags ?? {})
-    .filter(([, v]) => v).map(([k]) => DIETARY_LABELS[k]).filter(Boolean);
+    .filter(([, v]) => v)
+    .map(([k]) => m.recipe.dietary[k as keyof typeof m.recipe.dietary])
+    .filter(Boolean);
 
   const jsonLd = {
     "@context": "https://schema.org",
@@ -85,21 +85,21 @@ export default async function PublicRecipePage({ params }: Params) {
         {/* Breadcrumb-style nav */}
         <div className="flex items-center gap-2 text-sm text-muted-foreground">
           <Globe className="h-3.5 w-3.5" />
-          <span>Public recipe by</span>
+          <span>{m.publicRecipe.publicRecipeBy}</span>
           <Link href={`/u/${recipe.author.username ?? recipe.author.id}`} className="hover:text-foreground font-medium">
             {recipe.author.name}
           </Link>
           {session && (
             <div className="ml-auto">
               <Link href={`/recipes/${id}`} className={cn(buttonVariants({ variant: "outline", size: "sm" }))}>
-                View in your library
+                {m.publicRecipe.viewInLibrary}
               </Link>
             </div>
           )}
           {!session && (
             <div className="ml-auto flex items-center gap-2">
-              <Link href="/signup" className={cn(buttonVariants({ size: "sm" }))}>Sign up free</Link>
-              <Link href="/login" className={cn(buttonVariants({ variant: "outline", size: "sm" }))}>Log in</Link>
+              <Link href="/signup" className={cn(buttonVariants({ size: "sm" }))}>{m.publicRecipe.signUpFree}</Link>
+              <Link href="/login" className={cn(buttonVariants({ variant: "outline", size: "sm" }))}>{m.publicRecipe.logIn}</Link>
             </div>
           )}
         </div>
@@ -111,10 +111,10 @@ export default async function PublicRecipePage({ params }: Params) {
           )}
           <div className="flex flex-wrap items-center gap-3 text-sm text-muted-foreground">
             {recipe.difficulty && <Badge>{recipe.difficulty}</Badge>}
-            <span className="flex items-center gap-1"><Users className="h-4 w-4" />{recipe.baseServings} servings</span>
-            {recipe.prepMins && <span className="flex items-center gap-1"><Clock className="h-4 w-4" />{recipe.prepMins}m prep</span>}
-            {recipe.cookMins && <span className="flex items-center gap-1"><ChefHat className="h-4 w-4" />{recipe.cookMins}m cook</span>}
-            {totalMins > 0 && recipe.prepMins && recipe.cookMins && <span>({totalMins}m total)</span>}
+            <span className="flex items-center gap-1"><Users className="h-4 w-4" />{formatMessage(m.recipe.servings, { count: recipe.baseServings })}</span>
+            {recipe.prepMins && <span className="flex items-center gap-1"><Clock className="h-4 w-4" />{formatMessage(m.recipe.prep, { mins: recipe.prepMins })}</span>}
+            {recipe.cookMins && <span className="flex items-center gap-1"><ChefHat className="h-4 w-4" />{formatMessage(m.recipe.cook, { mins: recipe.cookMins })}</span>}
+            {totalMins > 0 && recipe.prepMins && recipe.cookMins && <span>({formatMessage(m.recipe.total, { mins: totalMins })})</span>}
           </div>
           {activeTags.length > 0 && (
             <div className="flex flex-wrap gap-1.5">
@@ -133,7 +133,7 @@ export default async function PublicRecipePage({ params }: Params) {
 
         {recipe.ingredients.length > 0 && (
           <div className="space-y-4">
-            <h2 className="text-xl font-semibold">Ingredients</h2>
+            <h2 className="text-xl font-semibold">{m.recipe.ingredients}</h2>
             <ServingScaler
               baseServings={recipe.baseServings}
               ingredients={recipe.ingredients.map((ing) => ({
@@ -147,7 +147,7 @@ export default async function PublicRecipePage({ params }: Params) {
           <>
             <Separator />
             <div className="space-y-6">
-              <h2 className="text-xl font-semibold">Instructions</h2>
+              <h2 className="text-xl font-semibold">{m.recipe.instructions}</h2>
               <ol className="space-y-6">
                 {recipe.steps.map((step, i) => (
                   <li key={step.id} className="flex gap-4">
@@ -162,9 +162,9 @@ export default async function PublicRecipePage({ params }: Params) {
 
         {!session && (
           <div className="rounded-xl border bg-muted/40 p-6 text-center space-y-3">
-            <p className="font-semibold">Want to save this recipe?</p>
-            <p className="text-sm text-muted-foreground">Create a free account to save recipes, scale servings, and build your own library.</p>
-            <Link href="/signup" className={cn(buttonVariants())}>Get started free</Link>
+            <p className="font-semibold">{m.publicRecipe.wantToSave}</p>
+            <p className="text-sm text-muted-foreground">{m.publicRecipe.wantToSaveDescription}</p>
+            <Link href="/signup" className={cn(buttonVariants())}>{m.publicRecipe.getStartedFree}</Link>
           </div>
         )}
       </div>