Full-Stack React Projects - Second Edition

List orders

When the ShopOrders component mounts in the view, we will retrieve the list of orders for the provided shop ID from the database and set it to the state to be rendered in the view. We will make a request to the backend API to list orders by shop using the listByShop fetch method and set the retrieved orders to the state in a useEffect hook, as shown in the following code.

mern-marketplace/client/order/ShopOrders.js:

useEffect(() => {  const jwt = auth.isAuthenticated()  const abortController = new AbortController()  const signal = abortController.signal  listByShop({    shopId: match.params.shopId  }, {t: jwt.token}, signal).then((data) => {     if (data.error) {       console.log(data)     } else {       setOrders(data)     }  })    return function cleanup(){