fix: substitute lookup, zero-quantity display, chatbot close button + markdown

- Substitute finder never applied the user's BYOK/admin AI key (only fell
  back to raw process.env), so it silently failed whenever the key was
  stored via settings rather than a literal env var. Now resolves via
  getDefaultProviderWithKey like every other AI route. Popover also
  surfaces real error messages instead of swallowing failures.
- Ingredients with quantity 0 (salt, pepper, "to taste") rendered the
  literal digit "0" in cooking mode, print view, public recipe page,
  shopping lists, and serving scaler — several sites relied on generic
  truthiness/filter(Boolean), which doesn't catch a stored "0" string.
  Added a shared hasQuantity() helper and applied it everywhere quantity
  is rendered, plus in the AI recipe-chat context sent to the model.
- Recipe chat panel rendered a duplicate close button on top of shadcn
  Sheet's own built-in close X, producing a garbled overlapping glyph.
  Removed the duplicate.
- Recipe chat assistant replies are markdown from the model but were
  rendered as raw text; added react-markdown so formatting actually
  renders.

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

apps/web/app/api/v1/ai/recipe-chat/route.ts

@@ -7,6 +7,7 @@ import { getModelConfigForUseCase } from "@/lib/ai/resolve-user-key";
 import { resolveModel } from "@/lib/ai/factory";
 import { db, recipes, eq, and } from "@epicure/db";
 import { getUserPrivateBio, buildUserBioContext } from "@/lib/ai/user-bio";
+import { hasQuantity } from "@/lib/fractions";
 
 const Schema = z.object({
   recipeId: z.string().uuid(),
@@ -39,7 +40,7 @@ export async function POST(req: NextRequest) {
   }
 
   const ingredientList = recipe.ingredients
-    .map((ing) => [ing.quantity, ing.unit, ing.rawName, ing.note ? `(${ing.note})` : ""].filter(Boolean).join(" "))
+    .map((ing) => [hasQuantity(ing.quantity) ? ing.quantity : null, ing.unit, ing.rawName, ing.note ? `(${ing.note})` : ""].filter(Boolean).join(" "))
     .join("\n");
 
   const stepList = recipe.steps

apps/web/app/api/v1/ai/substitute/route.ts

@@ -3,6 +3,7 @@ import { z } from "zod";
 import { requireSession } from "@/lib/api-auth";
 import { checkAndIncrementTierLimit, TierLimitError } from "@/lib/tiers";
 import { applyRateLimit } from "@/lib/rate-limit";
+import { getDefaultProviderWithKey } from "@/lib/ai/resolve-user-key";
 import { substituteIngredient } from "@/lib/ai/features/substitute-ingredient";
 
 const Schema = z.object({
@@ -36,10 +37,14 @@ export async function POST(req: NextRequest) {
     ? `recipe "${parsed.data.recipeTitle}"`
     : "a general recipe";
 
+  const aiConfig = parsed.data.provider
+    ? { provider: parsed.data.provider, model: parsed.data.model }
+    : await getDefaultProviderWithKey(session!.user.id);
+
   const substitutions = await substituteIngredient(
     parsed.data.ingredient,
     context,
-    { provider: parsed.data.provider, model: parsed.data.model }
+    aiConfig
   );
 
   return NextResponse.json({ substitutions });

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

@@ -3,6 +3,7 @@ import { headers } from "next/headers";
 import { auth } from "@/lib/auth/server";
 import { db, recipes, eq, and } from "@epicure/db";
 import { PrintTrigger } from "@/components/recipe/print-trigger";
+import { hasQuantity } from "@/lib/fractions";
 
 type Params = { params: Promise<{ id: string }> };
 
@@ -109,7 +110,7 @@ export default async function RecipePrintPage({ params }: Params) {
               {recipe.ingredients.map((ing) => (
                 <li key={ing.id}>
                   <span className="qty">
-                    {[ing.quantity, ing.unit].filter(Boolean).join(" ")}
+                    {[hasQuantity(ing.quantity) ? ing.quantity : null, ing.unit].filter(Boolean).join(" ")}
                   </span>
                   {ing.rawName}
                   {ing.note && <span style={{ color: "#888" }}> ({ing.note})</span>}

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

@@ -11,6 +11,7 @@ import { buttonVariants } from "@/components/ui/button";
 import { Separator } from "@/components/ui/separator";
 import { ServingScaler } from "@/components/recipe/serving-scaler";
 import { getPublicUrl } from "@/lib/storage";
+import { hasQuantity } from "@/lib/fractions";
 import { cn } from "@/lib/utils";
 
 type Params = { params: Promise<{ id: string }> };
@@ -68,7 +69,7 @@ export default async function PublicRecipePage({ params }: Params) {
     prepTime: recipe.prepMins ? `PT${recipe.prepMins}M` : undefined,
     cookTime: recipe.cookMins ? `PT${recipe.cookMins}M` : undefined,
     recipeIngredient: recipe.ingredients.map((i) =>
-      [i.quantity, i.unit, i.rawName].filter(Boolean).join(" ")
+      [hasQuantity(i.quantity) ? i.quantity : null, i.unit, i.rawName].filter(Boolean).join(" ")
     ),
     recipeInstructions: recipe.steps.map((s) => ({
       "@type": "HowToStep",