feat: copy/export as Markdown wherever print exists

Added a shared ExportMarkdownButton (copy to clipboard / download .md)
next to every existing print button: recipe, shopping list,
collection, meal plan, pantry. Each surface gets a small serializer in
lib/markdown/ built from data already in scope at that page — no new
queries except pantry, where items now thread through as a prop to
PantryPageHeader instead of being fetched only for PantryManager.

Also fixes an unrelated bug hit while verifying the collection export:
RecipeCard called the client-only useTranslations() hook without
"use client", so it rendered fine everywhere it happened to run inside
an already-client tree but 500'd — "Couldn't find next-intl config
file" — when Next tried to run it as a Server Component, which only
happens on the collection detail page (its only caller). Collections
with recipes in them were completely broken.

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

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

@@ -10,6 +10,8 @@ import { ForkCollectionButton } from "@/components/collections/fork-collection-b
 import { ShareCollectionButton } from "@/components/collections/share-collection-button";
 import { buttonVariants } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
+import { ExportMarkdownButton } from "@/components/shared/export-markdown-button";
+import { collectionToMarkdown } from "@/lib/markdown/collection";
 import { getMessages } from "@/lib/i18n/server";
 
 type Params = { params: Promise<{ id: string }> };
@@ -46,10 +48,20 @@ export default async function CollectionPage({ params }: Params) {
         </div>
         <div className="flex flex-wrap items-center gap-2">
           {col.recipes.length > 0 && (
-            <Link href={`/print/collection/${id}`} target="_blank" className={cn(buttonVariants({ variant: "outline", size: "sm" }))}>
-              <Printer className="h-4 w-4" />
-              {m.collections.exportPdf}
-            </Link>
+            <>
+              <Link href={`/print/collection/${id}`} target="_blank" className={cn(buttonVariants({ variant: "outline", size: "sm" }))}>
+                <Printer className="h-4 w-4" />
+                {m.collections.exportPdf}
+              </Link>
+              <ExportMarkdownButton
+                markdown={collectionToMarkdown({
+                  name: col.name,
+                  description: col.description,
+                  recipes: col.recipes.flatMap((r) => (r.recipe ? [r.recipe] : [])),
+                })}
+                filename={col.name}
+              />
+            </>
           )}
           {isOwner && <ShareCollectionButton collectionId={id} />}
           {!isOwner && col.isPublic && (

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

@@ -9,6 +9,8 @@ import { MealPlanner } from "@/components/meal-plan/meal-planner";
 import { ShareMealPlanButton } from "@/components/meal-plan/share-meal-plan-button";
 import { WeeklyNutritionBar } from "@/components/nutrition/weekly-nutrition-bar";
 import { cn } from "@/lib/utils";
+import { ExportMarkdownButton } from "@/components/shared/export-markdown-button";
+import { mealPlanToMarkdown } from "@/lib/markdown/meal-plan";
 import { getMessages, formatMessage } from "@/lib/i18n/server";
 
 export const metadata: Metadata = { title: "Meal Plan" };
@@ -98,6 +100,10 @@ export default async function MealPlanPage({
             <Printer className="h-4 w-4" />
             {msgs.common.print}
           </Link>
+          <ExportMarkdownButton
+            markdown={mealPlanToMarkdown({ label, entries })}
+            filename={`meal-plan-${weekStart}`}
+          />
           <Link href={`/meal-plan?week=${prevWeek}`} className={cn(buttonVariants({ variant: "outline", size: "sm" }))}>
             <ChevronLeft className="h-4 w-4" />
           </Link>

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

@@ -16,16 +16,18 @@ export default async function PantryPage() {
     orderBy: asc(pantryItems.rawName),
   });
 
+  const mappedItems = items.map((i) => ({
+    id: i.id,
+    rawName: i.rawName,
+    quantity: i.quantity,
+    unit: i.unit,
+    expiresAt: i.expiresAt?.toISOString() ?? null,
+  }));
+
   return (
     <div className="space-y-6">
-      <PantryPageHeader />
-      <PantryManager initialItems={items.map((i) => ({
-        id: i.id,
-        rawName: i.rawName,
-        quantity: i.quantity,
-        unit: i.unit,
-        expiresAt: i.expiresAt?.toISOString() ?? null,
-      }))} />
+      <PantryPageHeader items={mappedItems} />
+      <PantryManager initialItems={mappedItems} />
     </div>
   );
 }

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

@@ -31,6 +31,8 @@ import { getPublicUrl } from "@/lib/storage";
 import { cn } from "@/lib/utils";
 import { RecipeChatPanel } from "@/components/recipe/recipe-chat-panel";
 import { KeepScreenAwake } from "@/components/recipe/keep-screen-awake";
+import { ExportMarkdownButton } from "@/components/shared/export-markdown-button";
+import { recipeToMarkdown } from "@/lib/markdown/recipe";
 import { getMessages, formatMessage } from "@/lib/i18n/server";
 
 type Params = { params: Promise<{ id: string }> };
@@ -172,6 +174,20 @@ export default async function RecipePage({ params }: Params) {
             />
             <ShareRecipeButton recipeId={id} visibility={recipe.visibility} />
             <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,
+              })}
+              filename={recipe.title}
+            />
             {isOwner && (
               <>
                 <VersionHistoryButton

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

@@ -11,6 +11,8 @@ import { GroceryExportButton } from "@/components/shopping-lists/grocery-export-
 import { buttonVariants } from "@/components/ui/button";
 import { cn } from "@/lib/utils";
 import { getShoppingListAccess, canWriteShoppingList } from "@/lib/shopping-list-access";
+import { ExportMarkdownButton } from "@/components/shared/export-markdown-button";
+import { shoppingListToMarkdown } from "@/lib/markdown/shopping-list";
 import { getMessages, formatMessage } from "@/lib/i18n/server";
 
 type Params = { params: Promise<{ id: string }> };
@@ -52,6 +54,10 @@ export default async function ShoppingListPage({ params }: Params) {
             <Printer className="h-4 w-4" />
             {m.common.print}
           </Link>
+          <ExportMarkdownButton
+            markdown={shoppingListToMarkdown({ name: list.name, items: list.items })}
+            filename={list.name}
+          />
         </div>
       </div>
       <ShoppingListView