diff options
| author | it-fixcomart <it@fixcomart.co.id> | 2024-07-08 16:53:36 +0700 |
|---|---|---|
| committer | it-fixcomart <it@fixcomart.co.id> | 2024-07-08 16:53:36 +0700 |
| commit | 678c5144cb7ac2a3c6bc8dc090e31313809d13a3 (patch) | |
| tree | 52f53d623bfd21962a768981aeeeaaf0328acaa8 /src-migrate/modules/promo/components/PromoList.tsx | |
| parent | 8ce480fedfa91e16d9adb997311a999aaabaafb2 (diff) | |
<iman> update swiper
Diffstat (limited to 'src-migrate/modules/promo/components/PromoList.tsx')
| -rw-r--r-- | src-migrate/modules/promo/components/PromoList.tsx | 122 |
1 files changed, 0 insertions, 122 deletions
diff --git a/src-migrate/modules/promo/components/PromoList.tsx b/src-migrate/modules/promo/components/PromoList.tsx deleted file mode 100644 index 1b359857..00000000 --- a/src-migrate/modules/promo/components/PromoList.tsx +++ /dev/null @@ -1,122 +0,0 @@ -import React, { useEffect, useState } from 'react'; -import ProductPromoCard from '../../product-promo/components/Card'; -import { fetchPromoItemsSolr } from '../../../../src/api/promoApi'; -import { Swiper, SwiperProps, SwiperSlide } from 'swiper/react'; -import useDevice from '@/core/hooks/useDevice'; -import LogoSpinner from '../../../../src/core/components/elements/Spinner/LogoSpinner'; -import usePromoStore from './promoStore'; -import { ChevronRightIcon } from '@heroicons/react/24/outline'; -import Link from "next/link" -import SwiperCore, { Navigation, Pagination } from 'swiper'; -import { IPromotion } from '~/types/promotion'; - -SwiperCore.use([Navigation, Pagination]); - -interface PromoListProps { - selectedPromo: string; // Tipe selectedPromo ditetapkan sebagai string -} - -const PromoList: React.FC<PromoListProps> = ({ selectedPromo }) => { - const { isMobile } = useDevice(); - const { - title, - slug, - promoItems, - promoData, - isLoading, - setTitle, - setSlug, - setPromoItems, - setPromoData, - setIsLoading, - } = usePromoStore(); - - - useEffect(() => { - if (selectedPromo === 'Bundling') { - setTitle('Kombinasi Kilat Pilihan Kami!'); - setSlug('bundling'); - } else if (selectedPromo === 'Loading') { - setTitle('Belanja Borong Pilihan Kami!'); - setSlug('discount_loading'); - } else if (selectedPromo === 'Merchandise') { - setTitle('Gratis Merchandise Spesial Indoteknik'); - setSlug('merchandise'); - } - }, [selectedPromo, setTitle, setSlug]); - - useEffect(() => { - const fetchPromotions = async () => { - setIsLoading(true); - try { - const items = await fetchPromoItemsSolr(`type_value_s:${slug}`, 0, 10); - setPromoItems(items); - - const promoDataPromises = items.map(async (item) => { - try { - const response = await fetchPromoItemsSolr(`id:${item.id}`, 0, 10); - return response; - } catch (fetchError) { - return []; - } - }); - - const promoDataArray = await Promise.all(promoDataPromises); - const mergedPromoData = promoDataArray.reduce((accumulator, currentValue) => accumulator.concat(currentValue), []); - setPromoData(mergedPromoData); - - } catch (error) { - console.error('Error fetching promo items:', error); - } finally { - setIsLoading(false); - } - }; - - if (slug) { - setIsLoading(true); - setPromoItems([]); - setPromoData([]); - fetchPromotions(); - } - }, [slug, setPromoItems, setPromoData, setIsLoading]); - - const swiperBanner: SwiperProps = { - modules: [Navigation], - className: 'h-[400px] w-full', - slidesPerView: isMobile ? 1.1 : 3.25, - spaceBetween: 10, - navigation:isMobile? true : false, - allowTouchMove:isMobile? false : true, - }; - return ( - <> - <div className='min-h-[360px]'> - <div className='flex justify-between items-center'> - <h1 className='text-h-sm md:text-h-lg font-semibold py-4'>{title}</h1> - <div> - <Link href={`/shop/promo/${slug}`} className='!text-red-500 font-semibold'> - Lihat Semua - </Link> - </div> - </div> - {isLoading ? ( - <div className="loading-spinner flex justify-center"> - <LogoSpinner width={48} height={48} /> - </div> - ) : ( - <Swiper {...swiperBanner}> - {promoData?.map((promotion: IPromotion) => ( - <SwiperSlide key={promotion.id}> - <div className="min-w-36 max-w-[400px] mb-[20px] sm:w-full md:w-full lg:w-full xl:w-full"> - <ProductPromoCard promotion={promotion} /> - </div> - </SwiperSlide> - ))} - </Swiper> - )} - </div> - </> - ); -}; - -export default PromoList; |
