Restaurant Menu

The /restaurants/:slug/menu child page renders the restaurant's full menu, grouped into sections. Menu data is fetched directly via useDomain().getRestaurantMenuBySlug(slug) (key restaurant-menu-${slug}) — the page does not rely on useRestaurant().

Route

/restaurants/:slug/menu

Components Used

Data Fetching

Menu data is fetched via useDomain().getRestaurantMenuBySlug(slug) wrapped in useAsyncData. The page injects the restaurant ref from the parent layout to read the restaurant name for the page <title> and meta description.

The expected response shape is { restaurant, menu: MenuSectionApiData[] } where each section has { id, name, description, image?, items: MenuItemApiData[] }. Items are normalised client-side to MenuItem[] with image, allergens, vegetarian/vegan/gluten-free flags.

Item rendering (dietary tags, price format, card variant) is controlled by useMenuCard() reading appConfig.xRestaurants.menuCard.

AI Context

route: /restaurants/:slug/menu
package: "@xenterprises/nuxt-x-restaurants"
use-when: >
  Rendering the menu tab on a restaurant profile. Menu data is fetched
  directly via useDomain().getRestaurantMenuBySlug(); use useMenuCard()
  to customise item display (variant, dietary tags, price formatting)
  via app.config.ts.