import { Head, router } from '@inertiajs/react'; import type { FormEvent } from 'react'; import { useState } from 'react'; type Order = { order_number: string; status: string; payment_status: string; tracking_number: string | null; total: string; items: { id: number; product_name: string; sku: string; quantity: number; total: string }[]; }; export default function OrderTrack({ order, filters, }: { order: Order | null; filters: { order_number: string; email: string }; }) { const [orderNumber, setOrderNumber] = useState(filters.order_number); const [email, setEmail] = useState(filters.email); function submit(event: FormEvent) { event.preventDefault(); router.get('/orders/track/result', { order_number: orderNumber, email }); } return ( <>

Track order

{order ? (

Order

{order.order_number}

Status

{order.status.replace('_', ' ')}

Payment

{order.payment_status}

Tracking

{order.tracking_number ?? '-'}

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

{item.product_name}

SKU {item.sku} x {item.quantity}

{item.total}

))}

) : null}

); }