import { Head, Link } from '@inertiajs/react'; import { PublicLayout } from '@/layouts/public-layout'; type OrderItem = { id: number; product_id: number | null; product_name: string; product_slug: string | null; sku: string | null; quantity: number; unit_price_minor: number; line_total_minor: number; }; type OrderDetails = { id: number; order_number: string; status: string; currency: string; subtotal_minor: number; total_minor: number; customer_name: string; customer_email: string; customer_phone: string | null; address_line1: string; address_line2: string | null; city: string; postal_code: string; country: string; notes: string | null; placed_at: string | null; items: OrderItem[]; }; type OrderShowProps = { order: OrderDetails; }; export default function AccountOrderShow({ order }: OrderShowProps) { return (

Order {order.order_number}

Status: {order.status} | Placed:{' '} {order.placed_at || '-'}

Back to Orders

Items

{order.items.map((item) => (

{item.product_slug ? ( {item.product_name} ) : (

{item.product_name}

)}

Qty: {item.quantity} {item.sku ? ` | SKU: ${item.sku}` : ''}

{formatMoney( item.line_total_minor, order.currency, )}

))}

Summary

Subtotal:{' '} {formatMoney( order.subtotal_minor, order.currency, )}

Total:{' '} {formatMoney( order.total_minor, order.currency, )}

Shipping

{order.customer_name}

{order.customer_email}

{order.customer_phone ? (

{order.customer_phone}

) : null}

{order.address_line1}

{order.address_line2 ? (

{order.address_line2}

) : null}

{order.city}, {order.postal_code}

{order.country}

{order.notes ? (

Notes

{order.notes}

) : null}

); } function formatMoney(minor: number, currency: string): string { return `${currency} ${(minor / 100).toFixed(2)}`; }