import { Swiper, SwiperSlide } from "swiper/react";
import "swiper/css";
import "swiper/css/pagination";
import { Pagination } from "swiper/modules";
import Image from "next/image";
import img1 from "@/public/assets/home/full-banner.webp";
const MdSwiper = ({ images } : { images: any }) => {
  return (
    <>
      <Swiper
        pagination={true}
        loop={true}
        modules={[Pagination]}
        className="MD mySwiper "
      >
        {images.map((item : any, index : number ) => {
          return (
            <SwiperSlide key={item.id} className=" !h-[222px] md:!h-[500px]">
              <Image
                src={item?.image ?? img1}
                alt="img"
                width={600}
                height={500}
                quality={85}
                priority = {index === 0}
                className="!h-[222px] md:!h-[500px]"
              />
            </SwiperSlide>
          );
        })}
      </Swiper>
    </>
  );
};

export default MdSwiper;