Arnaud
e8c687e53a
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>
75 lines
2.6 KiB
TypeScript
75 lines
2.6 KiB
TypeScript
import type { Metadata } from "next";
|
|
import { headers } from "next/headers";
|
|
import { auth } from "@/lib/auth/server";
|
|
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({
|
|
searchParams,
|
|
}: {
|
|
searchParams: Promise<{ q?: string }>;
|
|
}) {
|
|
const session = await auth.api.getSession({ headers: await headers() });
|
|
if (!session) return null;
|
|
|
|
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: 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,
|
|
}];
|
|
}),
|
|
}))}
|
|
/>
|
|
);
|
|
}
|