When the ShopOrders component mounts, we will load the relevant orders by using the listByShop fetch method and set the retrieved orders to state.
mern-marketplace/client/order/ShopOrders.js:
loadOrders = () => { const jwt = auth.isAuthenticated() listByShop({ shopId: this.match.params.shopId }, {t: jwt.token}).then((data) => { if (data.error) { console.log(data) } else { this.setState({orders: data}) } }) }
In the view, we will iterate through the list of orders and render each order in a collapsible list from Material-UI, which will expand on click.
mern-marketplace/client/order/ShopOrders.js:
<Typography type="title"> Orders in {this.match.params.shop} </Typography><List dense> {this.state.orders.map((order, index) => { return ...