Schema.org AggregateRating JSON-LD markup is present and valid

Google requires a valid schema.org AggregateRating block to render star ratings in search results (rich snippets). Without it, your product pages compete in SERPs as plain blue links against competitors whose pages show 4.8★ inline — a significant CTR disadvantage. The schema.org Product.aggregateRating mapping specifies ratingValue must be a number, not a string: submitting "4.5" instead of 4.5 causes Google's Rich Results Test to flag the markup as invalid and suppresses the snippet. Hardcoded values are doubly penalised — they diverge from the displayed aggregate over time, which Google can detect by comparing the structured data to the visible page content.

Inject a <script type="application/ld+json"> block with dynamically computed values in components/ProductPage.tsx.

// components/ProductPage.tsx
export async function ProductPage({ product }: { product: Product }) {
  const approved = product.reviews.filter(r => r.status === 'approved')
  const ratingValue = approved.length > 0
    ? approved.reduce((s, r) => s + r.rating, 0) / approved.length
    : undefined

  const schema = {
    '@context': 'https://schema.org',
    '@type': 'Product',
    name: product.name,
    ...(ratingValue !== undefined && {
      aggregateRating: {
        '@type': 'AggregateRating',
        ratingValue: parseFloat(ratingValue.toFixed(1)), // number, not string
        reviewCount: approved.length,
        bestRating: 5,
        worstRating: 1
      }
    })
  }

  return (
    <>
      <script
        type="application/ld+json"
        dangerouslySetInnerHTML={{ __html: JSON.stringify(schema) }}
      />
      {/* page content */}
    </>
  )
}

Omit the aggregateRating block entirely when approved.length === 0 — Google rejects a reviewCount: 0 block as invalid.