Estos son los datos que obtuve de firestore y quiero usarlos en mi aplicación para mostrar los detalles del producto, pero no puedo recuperarlos en mi aplicación. Ejemplo, quiero que los datos de tienda->colecciones->bolsas->artículos muestren los detalles específicos del producto.

Y aquí está mi código en product-details.component.jsx:

 import React, { useEffect, useState } from "react"; import { connect } from "react-redux"; import { fetchCollectionsStart } from '../../redux/shop/shop.actions' const ProductDetailsPage = ({ fetchCollectionsStart, match, collections }) => { const {title, items} = collections; useEffect(() => { fetchCollectionsStart(); }, [fetchCollectionsStart]); console.log(match); const ShowProduct = () => { return ( <div> {title} </div> ) } return ( <div className='product-details'> <div className="row"> <ShowProduct /> </div> </div> ); }; const mapDispatchToProps = dispatch => ({ fetchCollectionsStart: () => dispatch(fetchCollectionsStart()) }); export default connect(null, mapDispatchToProps)(ProductDetailsPage);

La ventana emergente de error se muestra como la imagen a continuación:

No sé por qué no puedo desestructurar los datos de las colecciones. ¿Pensé que ya lo había obtenido con éxito en mi aplicación? ¡¡Muchas gracias por ayudarme!!