tengo un problema,
tengo una aplicación que hace llamado a una api, y utiliza redux para el estado de la aplicación, el llamado a la api esta funcionando bien, el problema es cuando quiero pasar ese estado a un componente por medio de props, cuando hago eso todo se rompe, que puedo hacer?,
gracias

    const dispatch = useDispatch()

    useEffect(()=>{
        //consulta api
        const cargarProducto=()=>dispatch(obtenerProductosAction())
        cargarProducto()
    },[])
    const productos = useSelector(state=>state.productos.productos)
    const error = useSelector(state=>state.productos.error)
    const cargando = useSelector(state=>state.productos.loading)

la consola de productos devuelve mi arreglo que necesito:

   

     [
        {name:'manzana',
        thumb_url:'url'
        },
    {name:'mango',
        thumb_url:'url'
        }
        ]

///hasta qui todo bien


    <ProductoCard productoDetails={producto} className={styles.user} item={Socials} />

//aqui al intentar pasar el estado por props, "funciona", peero si yo doy F5 todo deja de funcionar y me devuelve este error:

TypeError: Cannot read property 'thumb_url' of undefined

si quito mi componente ProductoCard puedo dar f5 cuantas veces quiera y todo funciona.

datos en componente ProductoCard:

    const User = ({ productoDetails }) => {
    return (
    <div className={styles.avatar}>
              <img src={productoDetails.thumb_url} alt="Avatar" />
            </div>
    <p>{productoDetails.name}</p>
    )
    }