Sanity doesnt connect blog post? - reactjs

Question

i have an issue with sanity, but i think the problem is the code doesnt fetch the blog post. any idea?
import { useState, useEffect } from "react"
import { Link, useParams } from "react-router-dom"
import client from "../client"
import { PortableText } from '#portabletext/react'
export default function SinglePost() {
const [singlePost, setSinglePost] = useState([])
const [isLoading, setIsLoading] = useState(true)
const { slug } = useParams()
useEffect(() => {
client
.fetch(
`*[slug.current == "${slug}"] {
title,
body,
mainImage {
asset -> {
_id,
url
},
alt
}
}`
)
.then((data) => setSinglePost(data[0]))
setIsLoading(false)
}, [slug])
return (
<>
{isLoading ? (
Loading...
) : (
{singlePost.title}
{singlePost.mainImage && singlePost.mainImage.asset && (
)}
<div className="block__content">
<PortableText
value={singlePost.body}
projectId="*******"
dataset="production"
/>
</div>
<button>
<Link
to="/blog"
className="py-2 px-6 rounded shadow text-white bg-black hover:bg-transparent border-2 border-black transition-all duration-500 hover:text-black font-bold"
>
Read more articles
</Link>
</button>
</section>
)}
</>
)
}