Merged in Feature/all-promotion (pull request #164)

Feature/all promotion

1 files changed, 16 insertions, 17 deletions

diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx
index 2701250d..b6e27270 100644
--- a/src-migrate/modules/promo/components/Hero.tsx
+++ b/src-migrate/modules/promo/components/Hero.tsx
@@ -4,14 +4,18 @@ import Image from 'next/image';
 import { useEffect, useMemo } from 'react';
 import { useQuery } from 'react-query';
 import { Swiper, SwiperProps, SwiperSlide }  from 'swiper/react';
-
-import { getBanner } from '~/services/banner';
 import style from '../styles/hero.module.css';
 import 'swiper/css/navigation';
 import 'swiper/css/pagination';
 import  { Navigation, Pagination, Autoplay } from 'swiper';
 import MobileView from '../../../../src/core/components/views/MobileView';
 import DesktopView from '@/core/components/views/DesktopView';
+import { getPromotionProgramSolr } from '~/services/promotionProgram';
+
+interface IPromotionProgram {
+  banner_s: string;
+  name_s: string;
+}
 
 const swiperBanner: SwiperProps = {
   modules:[Navigation, Pagination, Autoplay],
@@ -39,18 +43,13 @@ const swiperBannerMob = {
 const Hero = () => {
   const bannerQuery = useQuery({
     queryKey: ['banner.all-promo'],
-    queryFn: () => getBanner({ type: 'banner-promotion' })
-  })
-
-  const banners = useMemo(() => bannerQuery.data || [], [bannerQuery.data]);
+    queryFn: getPromotionProgramSolr,
+  });
 
-  useEffect(() => {
-    if (banners.length > 1) {
-      swiperBanner.slidesPerView = 1.1;
-      swiperBanner.loop = true;
-      swiperBannerMobile.loop = true;
-    }
-  }, [banners]);
+  const banners: IPromotionProgram[] = useMemo(
+    () => bannerQuery.data?.response?.docs || [],
+    [bannerQuery.data]
+  );
 
   const swiperBannerMobile = {
     ...swiperBannerMob,
@@ -72,8 +71,8 @@ const Hero = () => {
               {banners.map((banner, index) => (
                 <SwiperSlide key={index}>
                   <Image
-                    src={banner.image}
-                    alt={banner.name}
+                    src={banner.banner_s}
+                    alt={banner.name_s}
                     width={666}
                     height={450}
                     quality={100}
@@ -92,8 +91,8 @@ const Hero = () => {
                       width={439}
                       height={150}
                       quality={100}
-                      src={banner.image}
-                      alt={banner.name}
+                      src={banner.banner_s}
+                      alt={banner.name_s}
                       className='w-full h-full object-cover object-center rounded-2xl'
                     />
               </SwiperSlide>