feat: collections overhaul — reorder, search, edit/delete, tags (v0.53.0)

Seven related improvements to collections:

- Drag-and-drop reorder (dnd-kit, same pattern as the shopping list) — new
  collection_recipes.position column (migration 0049, backfilled from
  existing added_at order so nothing jumps around on upgrade).
- Search collections by name/description (server-side, list page) and
  search recipes within a collection (client-side filter, already loaded).
- Edit collection: name/description/tags/private notes via a new dialog;
  new collections.notes + collections.tags columns.
- Delete collection with a choice to also delete its recipes — only ones
  the deleting user actually owns, never recipes shared in by others.
- Collection detail (both owner and public view) now renders the same
  RecipeGridCard used on /recipes, instead of the older, plainer RecipeCard.
- Collection list cards redesigned — photo-collage preview (first 4 recipe
  covers/placeholders), tag badges, cleaner layout.
- Fixed the recipe count shown on a collection card: the query capped the
  `recipes` relation at 1 for thumbnail purposes and then read `.length`
  off that same capped array, so it never showed more than 1. Now a
  proper grouped count query, separate from the thumbnail fetch.

New/changed endpoints documented in OpenAPI: PATCH /collections/{id}/reorder,
DELETE /collections/{id}?deleteRecipes, PUT /collections/{id}'s new
notes/tags fields.

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

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

@@ -1,29 +1,73 @@
 import type { Metadata } from "next";
 import { headers } from "next/headers";
 import { auth } from "@/lib/auth/server";
-import { db, collections, eq, desc } from "@epicure/db";
+import { db, collections, collectionRecipes, eq, and, or, ilike, sql } from "@epicure/db";
 import { CollectionsPageContent } from "@/components/collections/collections-page-content";
+import { getPublicUrl } from "@/lib/storage";
 
 export const metadata: Metadata = {};
 
-export default async function CollectionsPage() {
+export default async function CollectionsPage({
+  searchParams,
+}: {
+  searchParams: Promise<{ q?: string }>;
+}) {
   const session = await auth.api.getSession({ headers: await headers() });
   if (!session) return null;
 
-  const userCollections = await db.query.collections.findMany({
-    where: eq(collections.userId, session.user.id),
-    orderBy: desc(collections.updatedAt),
-    with: { recipes: { limit: 1 } },
-  });
+  const { q } = await searchParams;
+  const query = q?.trim();
+
+  const where = query
+    ? and(eq(collections.userId, session.user.id), or(ilike(collections.name, `%${query}%`), ilike(collections.description, `%${query}%`)))
+    : eq(collections.userId, session.user.id);
+
+  const [userCollections, countRows] = await Promise.all([
+    db.query.collections.findMany({
+      where,
+      orderBy: (t, { desc }) => desc(t.updatedAt),
+      with: {
+        recipes: {
+          limit: 4,
+          orderBy: (t, { asc }) => asc(t.position),
+          with: { recipe: { with: { photos: true } } },
+        },
+      },
+    }),
+    // Separate grouped count — the `with: { recipes: { limit: 4 } }` above is
+    // capped for thumbnail previews, so `.recipes.length` off that relation
+    // would only ever report up to 4, never the real total.
+    db
+      .select({ collectionId: collectionRecipes.collectionId, count: sql<number>`count(*)::int` })
+      .from(collectionRecipes)
+      .innerJoin(collections, eq(collectionRecipes.collectionId, collections.id))
+      .where(eq(collections.userId, session.user.id))
+      .groupBy(collectionRecipes.collectionId),
+  ]);
+
+  const countByCollection = new Map(countRows.map((r) => [r.collectionId, r.count]));
 
   return (
     <CollectionsPageContent
+      query={query ?? ""}
       collections={userCollections.map((col) => ({
         id: col.id,
         name: col.name,
         description: col.description,
+        tags: col.tags,
         isPublic: col.isPublic,
-        recipeCount: col.recipes.length,
+        recipeCount: countByCollection.get(col.id) ?? 0,
+        thumbnails: col.recipes.flatMap((r) => {
+          if (!r.recipe) return [];
+          const cover = r.recipe.photos.find((p) => p.isCover) ?? r.recipe.photos[0];
+          return [{
+            recipeId: r.recipe.id,
+            recipeType: r.recipe.recipeType,
+            coverIcon: r.recipe.coverIcon,
+            coverColor: r.recipe.coverColor,
+            photoUrl: cover ? getPublicUrl(cover.storageKey) : null,
+          }];
+        }),
       }))}
     />
   );