Price preview

{
  "product_id": 10,
  "currency_code": "USD",
  "currency_minor_unit": 2,
  "regular_price": "1200",
  "prices": [
    { "quantity": 1, "price": "1200", "percent_saving": 0 },
    { "quantity": 12, "price": "1080", "percent_saving": 10 },
    { "quantity": 60, "price": "960", "percent_saving": 20 }
  ]
}

const money = (minor: string, currency: string) =>
  new Intl.NumberFormat('en', { style: 'currency', currency }).format(Number(minor) / 100)

export async function PriceTable({ productId }: { productId: number }) {
  const response = await fetch(
    `${process.env.WORDPRESS_URL}/wp-json/joinery/v1/price-preview?product_id=${productId}`,
    { next: { revalidate: 300 } }, // guest prices only; don't cache signed-in requests
  )
  const preview = await response.json()

  return (
    <table>
      <tbody>
        {preview.prices.map((row) => (
          <tr key={row.quantity}>
            <td>{row.quantity}+</td>
            <td>{money(row.price, preview.currency_code)}</td>
          </tr>
        ))}
      </tbody>
    </table>
  )
}