Restaurant Reviews
Restaurant Reviews
The /restaurants/:slug/reviews child page renders the restaurant's customer reviews with a client-side load-more pattern (10 reviews per page, click "Load More" to reveal the next batch). Each review is rendered using XRDProfileReviewsItem.
Route
/restaurants/:slug/reviews
Components Used
| Component | Role |
|---|---|
XRDProfileReviews | (Note: currently the page implements review rendering inline; XRDProfileReviews exists as a component but is not used on this page.) |
XRDProfileReviewsItem | Individual review card with author, rating, date, and body text. |
Data Fetching
The page itself fetches reviews directly via useDomain().getRestaurantReviewsBySlug(slug) wrapped in useAsyncData (key restaurant-reviews-${slug}). It also injects the restaurant ref from the parent layout to read averageRating and totalReviews for the header summary.
Response shapes are normalised client-side — the page accepts either an array of reviews or an object with { reviews, totalReviews, reviewCount, averageRating }.
Pagination is purely client-side via a displayedCount ref; no additional API calls are made on load-more.
AI Context
route: /restaurants/:slug/reviews
package: "@xenterprises/nuxt-x-restaurants"
use-when: >
Rendering the reviews tab on a restaurant profile. Reviews are fetched
per-page via useDomain().getRestaurantReviewsBySlug(); pagination is
client-side (10 per page). The restaurant summary at the top reads from
the injected restaurant ref provided by the parent layout.