Hi guys I got this error Found non-callable @@iterator on one page in my sveltekit code, everything worked before and I didn't change anything, how do I even start to debug this?

I have this code at the top of the specific page

<script context="module">
  export async function load({ fetch, page }) {
    const {p} = page.params
    const res = await fetch(`https://saffron-backend-prod-t3i75.ondigitalocean.app/api/packages/${p}`);

  if (res.ok) return { props: { packages: await res.json() } };
  return {
    status: res.status,
    error: new Error()
   };
  }
</script>

Edit: I started deleting random pieces of code and turns out it was this one

<Swiper
    loop={true}
    navigation="{true}"
    class="overflow-hidden rounded-xl w-full h-72 relative justify-center items-center object-cover"
    >
    <SwiperSlide>
        <img
            src="{p.image}"
            alt=""
            class="h-80 border border-gray-100 w-full object-cover rounded-xl group-hover:rotate-0 group-hover:transform"
        />
    </SwiperSlide>
        {#each p.pkgImages as img}
            <SwiperSlide>
                <img
                    class="h-80 border border-gray-100 w-full object-cover rounded-xl"
                    src="{img.image}"
                    alt="product"
                />
            </SwiperSlide>
        {/each}
    </Swiper>

I switched all the elements to regular divs and it works, but of course I lost all the functionality of swiper