feat: shopping list rename/delete, item reorder+categories+search, ingredient-quantity parsing fix

- Fixed a real i18n bug: the checked-count line called the wrong
  translation namespace and rendered the literal key on screen
- Shopping lists can now be renamed and deleted from both the list index
  and detail pages (API already supported delete; rename was net new)
- Root-caused "long list UI is off": meal-plan-generated lists never set
  an aisle, so every item fell into one undifferentiated "Other" bucket
  despite the grouping UI existing. Added a keyword-based aisle guesser
  wired into list generation (fallback only, never overrides an explicit
  aisle) plus a one-click "auto-categorize" for existing lists
- Items can now be reordered by drag-and-drop within a category (dnd-kit),
  recategorized via a dropdown, deleted, searched, and sorted (category /
  alphabetical / unchecked-first); searching flattens the grouped view
- Fixed a separate bug: AI-generated ingredients sometimes embedded the
  quantity/unit in the name itself (e.g. "2 cups flour" as one string).
  Added extractIngredientQuantity() as a Zod transform at both recipe
  create/update routes (the choke point every creation path funnels
  through) to split it back out, plus schema descriptions on the AI
  ingredient schemas as a prevention layer

New migration 0028 (shopping_list_items.sort_order), left unapplied like
the others. Verified with typecheck, lint, and a clean --no-cache docker
build.

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

apps/web/components/shopping-lists/shopping-lists-page-content.tsx

@@ -1,8 +1,10 @@
 "use client";
+import { useState } from "react";
 import { useTranslations } from "next-intl";
 import Link from "next/link";
 import { ShoppingCart } from "lucide-react";
 import { NewShoppingListButton } from "@/components/meal-plan/new-shopping-list-button";
+import { ShoppingListActionsMenu } from "@/components/shopping-lists/shopping-list-actions-menu";
 
 type ShoppingListItem = {
   id: string;
@@ -24,9 +26,10 @@ type Props = {
   sharedLists?: SharedListItem[];
 };
 
-export function ShoppingListsPageContent({ lists, sharedLists = [] }: Props) {
+export function ShoppingListsPageContent({ lists: initialLists, sharedLists = [] }: Props) {
   const t = useTranslations("shoppingLists");
   const ts = useTranslations("shareDialog");
+  const [lists, setLists] = useState(initialLists);
 
   return (
     <div className="space-y-6">
@@ -49,10 +52,10 @@ export function ShoppingListsPageContent({ lists, sharedLists = [] }: Props) {
             <Link
               key={list.id}
               href={`/shopping-lists/${list.id}`}
-              className="flex items-center justify-between rounded-xl border p-4 hover:shadow-sm transition-shadow"
+              className="flex items-center justify-between gap-2 rounded-xl border p-4 hover:shadow-sm transition-shadow"
             >
-              <div className="space-y-1">
-                <h2 className="font-semibold">{list.name}</h2>
+              <div className="space-y-1 min-w-0">
+                <h2 className="font-semibold truncate">{list.name}</h2>
                 <p className="text-sm text-muted-foreground">
                   {list.totalItems === 0
                     ? t("listEmpty")
@@ -60,8 +63,18 @@ export function ShoppingListsPageContent({ lists, sharedLists = [] }: Props) {
                   {list.generatedAt && ` · ${t("generated")}`}
                 </p>
               </div>
-              <div className="h-8 w-8 rounded-full bg-muted flex items-center justify-center text-xs font-bold">
-                {list.totalItems === 0 ? "—" : `${Math.round((list.checkedItems / list.totalItems) * 100)}%`}
+              <div className="flex items-center gap-1 shrink-0">
+                <div className="h-8 w-8 rounded-full bg-muted flex items-center justify-center text-xs font-bold">
+                  {list.totalItems === 0 ? "—" : `${Math.round((list.checkedItems / list.totalItems) * 100)}%`}
+                </div>
+                <ShoppingListActionsMenu
+                  listId={list.id}
+                  name={list.name}
+                  onRenamed={(name) =>
+                    setLists((prev) => prev.map((l) => (l.id === list.id ? { ...l, name } : l)))
+                  }
+                  onDeleted={() => setLists((prev) => prev.filter((l) => l.id !== list.id))}
+                />
               </div>
             </Link>
           ))}