Not able to see data i’ve passed through an array. No error when checked in console too,it shows an empty array in console. (Im not using API)

ProductDetails.jsx
ProductDetailList.jsx

I’m currently working on a React project where I’m rendering product and delivery details using components. I have two components: ProductDetailsList.jsx and ProductDetails.jsx.

ProductDetailsList.jsx contains an array of product details and an array of delivery details, which are passed as props to the ProductDetails component. In ProductDetails.jsx, I map through these arrays to render the details in separate sections.

However, I’m facing an issue with rendering these details properly. Despite passing the props correctly, the details don’t seem to render as expected. I’ve checked the console logs within ProductDetails.jsx and confirmed that the props are being received correctly.

I’m not sure where the issue lies – whether it’s with the way I’m passing the props or with how I’m rendering them in the ProductDetails component.