From 3fe75f5dcaf75e71d29d50f3fb0aa1b5fb443224 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Sat, 13 Jul 2024 10:37:34 +0700
Subject: <iman> update revisi banner all promotion

---
 src-migrate/modules/promo/components/Hero.tsx | 33 +++++++++++++--------------
 1 file changed, 16 insertions(+), 17 deletions(-)

(limited to 'src-migrate/modules/promo/components/Hero.tsx')

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>
-- 
cgit v1.2.3

