Estoy tratando de establecer un enlace dependiendo de si un usuario creó la publicación o no, si la creó, entonces aparece un botón EDITAR, de lo contrario, aparece un informe.

 const userLogin = useSelector((state) => state.userLogin) const { userInfo } = userLogin const productDetails = useSelector (state => state.productDetails)

const {cargando, error, producto} = detalles del producto

 useEffect(() => { dispatch(listProductDetails(id)) dispatch(listProducts()) }, [dispatch, id]) const [bid, setBid] = useState('') const submitHandler =(e) => { e.preventDefault() if (setBid > product.currentPrice + product.minIncrement){ dispatch(makeBid({bid, _id: id})) }else { console.log("Bid isn't big enough") } } return ( <> <Link className='btn btn-dark my-3' to='/'>more</Link>

el problema es aqui no puedo acceder a mis datos

 {userInfo ?(userInfo.id===product._id&&( <Link className='ml-19' to={`/product/${product._id}/edit`}>EDIT</L`enter code here`ink> )) :userInfo?(userInfo.id !== product._id&&( <Link to={`/product/${product._id}/report`}>REPORT</Link> )): (<></>)} {loading ? <Loader /> : error ? <Message variant='danger'>{error}</Message> : ( <> <Meta title={product.name} /> <Row> <Col md={4} > <Link className='link' to={`/profile/${product._id}`}> <h5>Listing created by</h5> <h6>{/*product.user.name*/}</h6> </Link> <Image className='border border-primary' src={product.image} alt={product.name} fluid/> ....