fix: rating not shown after refresh, comment reactions not shown until clicked
- The interactive RatingStars widget was always initialized with
initialScore={0}, ignoring the current user's existing rating.
Fetch it via a third parallel query and pass it through — the
rating was persisted correctly all along, just never displayed
back.
- CommentReactions never fetched its counts on mount, relying solely
on initialCounts/initialUserReactions props that comments-section
always passed as empty — so every comment showed zero reactions
until you clicked one yourself (which returns fresh counts from the
POST response). Fetch on mount via the existing GET endpoint.
Co-Authored-By: Claude Sonnet 5 <noreply@anthropic.com>
This commit is contained in:
@@ -55,7 +55,7 @@ export default async function RecipePage({ params }: Params) {
|
||||
const VISIBILITY_LABEL = m.recipe.visibility;
|
||||
const DIETARY_LABELS = m.recipe.dietary;
|
||||
|
||||
const [recipe, ratingData, favoriteData] = await Promise.all([
|
||||
const [recipe, ratingData, favoriteData, myRating] = await Promise.all([
|
||||
db.query.recipes.findFirst({
|
||||
where: and(
|
||||
eq(recipes.id, id),
|
||||
@@ -70,6 +70,7 @@ export default async function RecipePage({ params }: Params) {
|
||||
}),
|
||||
db.select({ avgScore: avg(ratings.score), total: count() }).from(ratings).where(eq(ratings.recipeId, id)),
|
||||
db.query.favorites.findFirst({ where: and(eq(favorites.userId, session.user.id), eq(favorites.recipeId, id)) }),
|
||||
db.query.ratings.findFirst({ where: and(eq(ratings.recipeId, id), eq(ratings.userId, session.user.id)) }),
|
||||
]);
|
||||
|
||||
if (!recipe) notFound();
|
||||
@@ -79,6 +80,7 @@ export default async function RecipePage({ params }: Params) {
|
||||
const avgScore = ratingData[0]?.avgScore ? parseFloat(ratingData[0].avgScore) : null;
|
||||
const ratingCount = ratingData[0]?.total ?? 0;
|
||||
const isFavorited = !!favoriteData;
|
||||
const myScore = myRating?.score ?? 0;
|
||||
|
||||
const cover = recipe.photos.find((p) => p.isCover) ?? recipe.photos[0];
|
||||
const totalMins = (recipe.prepMins ?? 0) + (recipe.cookMins ?? 0);
|
||||
@@ -384,7 +386,7 @@ export default async function RecipePage({ params }: Params) {
|
||||
<>
|
||||
<Separator />
|
||||
<div className="space-y-4">
|
||||
<RatingStars recipeId={id} initialScore={0} />
|
||||
<RatingStars recipeId={id} initialScore={myScore} />
|
||||
</div>
|
||||
<Separator />
|
||||
<CommentsSection recipeId={id} currentUserId={session.user.id} />
|
||||
|
||||
Reference in New Issue
Block a user