react orders practice

import { useState, useEffect } from 'react'
import { useNavigate } from 'react-router-dom'
import './MyOrders.css'

function MyOrders({ user }) {
const navigate = useNavigate()
const [orders, setOrders] = useState([])

useEffect(() => {
if (!user) { navigate('/login'); return }
const load = async () => {
const res = await fetch(/api/orders/${user.customerID})
const data = await res.json()
setOrders(data)
}
load()
}, [user])

if (!user) return

Please log in.

return (

My Orders

{orders.length === 0 &&

No orders yet.

}
{orders.map(order => (

{order.product_name}

Quantity: {order.product_quantity}

Date: {new Date(order.order_date).toLocaleDateString()}

))}

)
}

export default MyOrders