feat: rating stars on recipe cards (Search, Explore)

New lib/recipe-ratings.ts helper batches avg score + review count for
a set of recipe ids in one grouped query, kept separate from the main
paginated/sorted search query rather than joining+grouping it directly
(would've forced grouping by every selected column). Wired into
/api/v1/search and the Explore page's trending/recent queries;
SearchResultCard renders the star only when a recipe has at least one
rating.

Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
Arnaud
2026-07-13 22:43:58 +02:00
parent 95a4dccce8
commit c21157fc93
9 changed files with 70 additions and 7 deletions
+14 -2
View File
@@ -12,6 +12,7 @@ import {
count,
} from "@epicure/db";
import { ExplorePageContent } from "@/components/search/explore-page-content";
import { getAvgRatingsByRecipeId } from "@/lib/recipe-ratings";
export const metadata: Metadata = {};
@@ -22,6 +23,8 @@ export type RecipeResult = {
difficulty: string | null;
prepMins: number | null;
cookMins: number | null;
avgRating: number | null;
ratingCount: number;
};
export default async function ExplorePage({
@@ -73,8 +76,17 @@ export default async function ExplorePage({
.orderBy(desc(recipes.createdAt))
.limit(12);
const trending: RecipeResult[] = trendingRows.map(({ favoriteCount: _fc, ...r }) => r);
const recent: RecipeResult[] = recentRows;
const ratingByRecipe = await getAvgRatingsByRecipeId([
...trendingRows.map((r) => r.id),
...recentRows.map((r) => r.id),
]);
const withRating = (r: { id: string }) => ({
avgRating: ratingByRecipe.get(r.id)?.avgRating ?? null,
ratingCount: ratingByRecipe.get(r.id)?.ratingCount ?? 0,
});
const trending: RecipeResult[] = trendingRows.map(({ favoriteCount: _fc, ...r }) => ({ ...r, ...withRating(r) }));
const recent: RecipeResult[] = recentRows.map((r) => ({ ...r, ...withRating(r) }));
// Most-used tags across public recipes — shown as filter chips on the
// search bar so browsing by tag doesn't require typing the exact word.