"use client";
import { memo } from "react";
import { Swiper, SwiperSlide } from 'swiper/react';
import Image from "next/image";
import type { ProductMediaType } from "@/components/catalog/type";

const ImgSwiperInAddToCartModal = memo(function ImgSwiperInAddToCartModal({images}: {images: ProductMediaType[];}) { 
    return (
        <Swiper
            spaceBetween={10}
            slidesPerView={3}
            onSlideChange={() => console.log('slide change')}
            onSwiper={(swiper) => console.log(swiper)}
        >
            {images.map((img) => {
                return (
                <SwiperSlide key={img.id}>
                    <Image src={img.publicPath} alt={"todo test "} width={175} height={233} />
                </SwiperSlide>
                );
            })}
        </Swiper>
    );
});

export default ImgSwiperInAddToCartModal;