Problem with "product-crawling-failed" React.js

I am trying to complete an order on my website, but i get the product-crawling-failed error every time and i cant figure out what i am doing wrong.

In the [Details] of the error it tells me this: "[Details] We have not been able to find item with id '3166' at (my url)". How can i fix this?

Hope someone can help me figure this out.

Thanks!

function DetailsPage() {

    const [info, setInfo] = useState([]);
    const [loading, setLoading] = useState(true);

    let navigate = useNavigate();
    const { id } = useParams();
    if(!id) {
        navigate("/produkter");
    }

    const detailUrl = url + id;
   
    useEffect( function() {
        async function fetchInfo() {
            try{
                const resp = await fetch(detailUrl);

                if (resp.ok) {
                    const data = await resp.json();
                    setInfo(data);
                }
            
            } catch (error) {
                console.log(error);
            } finally{
                setLoading(false);
            }

        }fetchInfo();

        // eslint-disable-next-line
    }, [detailUrl]);

    if (loading) {
        return (
            <>
                <h1>Loading....</h1>
            </>
            
        )
    }

    console.log(info);

    return (
        <div className='details-page'>
            <div className='details-page-section'>
                <div className='details-page-left'>
                    <div className='details-page-grid-img'>
                        <img src={info.acf.img2} alt={info.acf.navn} />
                        <img src={info.acf.img3} alt={info.acf.navn} />
                        <img src={info.acf.img4} alt={info.acf.navn} />
                    </div>
                    <div className='details-page-main-img'>
                        <img src={info.acf.img1} alt={info.acf.navn}/>
                    </div>
                </div>
                <div className='details-right'>
                    <div className='details-right-content'>
                        <h1>{info.acf.navn}</h1>
                        <div className='products-mal'>
                            <p>{info.acf.pm1}</p>
                            <p>{info.acf.pm2}</p>
                            <p>{info.acf.pm3}</p>
                            <p>{info.acf.pm4}</p>
                        </div>
                        <h3>{info.acf.pris}</h3>
                        <p>{info.acf.eksmva}</p>
                        <div className='product-desc'>
                            <p>{info.acf.pb1}</p>
                            <p>{info.acf.pb2}</p>
                        </div>
                        <button className="snipcart-add-item"
                            data-item-id={info.id}
                            data-item-price="0"
                            data-item-description={info.acf.pb1}
                            data-item-image={info.acf.img1}
                            data-item-name={info.acf.navn}>
                            Legg til handlekurv
                        </button>
                    </div>
                </div>
            </div>
        </div>
    )
}

export default DetailsPage;```