From 60060b517651e1122a638a3f592017879a0e9e63 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 17 Jul 2024 11:07:00 +0700
Subject: <iman> update all promotion

---
 src-migrate/modules/promo/components/FlashSale.tsx |   2 +-
 src-migrate/modules/promo/components/PromoList.jsx | 110 -----------------
 src-migrate/modules/promo/components/PromoList.tsx | 135 +++++++++++++++++++++
 3 files changed, 136 insertions(+), 111 deletions(-)
 delete mode 100644 src-migrate/modules/promo/components/PromoList.jsx
 create mode 100644 src-migrate/modules/promo/components/PromoList.tsx

(limited to 'src-migrate/modules')

diff --git a/src-migrate/modules/promo/components/FlashSale.tsx b/src-migrate/modules/promo/components/FlashSale.tsx
index 16cb7647..05bf1e11 100644
--- a/src-migrate/modules/promo/components/FlashSale.tsx
+++ b/src-migrate/modules/promo/components/FlashSale.tsx
@@ -12,7 +12,7 @@ const FlashSale = dynamic(
   const FlashSalePromo = ()=> {
     return(
         <>  
-            <h1 className='text-h-sm md:text-h-lg  font-semibold'>Bayar Setengahnya!</h1>
+            <h1 className='h-4'></h1>
             <FlashSale/>
         </>
     )
diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
deleted file mode 100644
index e6add893..00000000
--- a/src-migrate/modules/promo/components/PromoList.jsx
+++ /dev/null
@@ -1,110 +0,0 @@
-import React, { useEffect, useState } from 'react';
-import { Button, Skeleton } from '@chakra-ui/react'
-import clsxm from "~/libs/clsxm"
-import ProductPromoCard from '../../../../src-migrate/modules/product-promo/components/Card';
-import { fetchPromoItemsSolr } from '../../../../src/api/promoApi';
-import { Swiper, 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 '@/core/components/elements/Link/Link'
-
-const PromoList = ({ selectedPromo }) => {
-  const {
-    title,
-    slug,
-    promoItems,
-    promoData,
-    isLoading,
-    setTitle,
-    setSlug,
-    setPromoItems,
-    setPromoData,
-    setIsLoading,
-  } = usePromoStore();
-
-  const { isMobile } = useDevice();
-
-  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]);
-
-  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>
-      ) : (
-        <Skeleton
-        isLoaded={!isLoading}
-        className={clsxm(
-          "flex gap-x-4 overflow-x-auto px-4 md:px-0", {
-          "min-h-[340px]": promoData[0] && promoData?.length > 0
-        })}
-      >
-        {promoData?.map((promotion) => (
-          <div key={promotion.id} className="min-w-[400px] max-w-[400px]">
-            <ProductPromoCard promotion={promotion}  />
-          </div>
-        ))}
-      </Skeleton>
-      )}
-    </div>
-  );
-};
-
-export default PromoList;
\ No newline at end of file
diff --git a/src-migrate/modules/promo/components/PromoList.tsx b/src-migrate/modules/promo/components/PromoList.tsx
new file mode 100644
index 00000000..42725034
--- /dev/null
+++ b/src-migrate/modules/promo/components/PromoList.tsx
@@ -0,0 +1,135 @@
+import React, { useEffect, useState } from 'react';
+import { Button, Skeleton } from '@chakra-ui/react'
+import clsxm from "~/libs/clsxm"
+import ProductPromoCard from '../../product-promo/components/Card';
+import { fetchPromoItemsSolr } from '../../../../src/api/promoApi';
+import { Swiper, SwiperSlide } from 'swiper/react';
+import SwiperCore, { Navigation, Pagination } from 'swiper';
+import useDevice from '@/core/hooks/useDevice';
+import LogoSpinner from '../../../../src/core/components/elements/Spinner/LogoSpinner';
+import usePromoStore from './promoStore';
+import Link from "next/link"
+import { IPromotion } from '~/types/promotion';
+interface PromoListProps {
+  selectedPromo: string; // Tipe selectedPromo ditetapkan sebagai string
+}
+
+const PromoList: React.FC<PromoListProps> = ({ selectedPromo }) => {
+  const {
+    title,
+    slug,
+    promoItems,
+    promoData,
+    isLoading,
+    setTitle,
+    setSlug,
+    setPromoItems,
+    setPromoData,
+    setIsLoading,
+  } = usePromoStore();
+
+  const { isMobile, isDesktop } = useDevice();
+
+  const swiperBanner = {
+    modules: [Navigation],
+    className: 'h-[400px] w-full',
+    slidesPerView: isMobile ? 1.1 : 3.25,
+    spaceBetween: 10,
+    navigation:isMobile? true : false,
+    allowTouchMove:isMobile? false : true,
+  };
+
+  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]);
+
+  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>
+      ) : (
+        <Skeleton
+        isLoaded={!isLoading}
+        className={clsxm(
+          "flex gap-x-4 overflow-x-auto px-4 md:px-0", {
+          "min-h-[340px]": promoData[0] && promoData?.length > 0
+        })}
+      >
+        {isDesktop && (
+                    <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>
+        )}
+        {isMobile && (promoData?.map((promotion: IPromotion) => (
+          <div key={promotion.id} className="min-w-[400px] max-w-[400px]">
+            <ProductPromoCard promotion={promotion}  />
+          </div>
+        )))}
+        
+      </Skeleton>
+      )}
+    </div>
+  );
+};
+
+export default PromoList;
\ No newline at end of file
-- 
cgit v1.2.3


From a42272ae50a5e8661db5ae534f08f475efb05665 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 17 Jul 2024 14:09:51 +0700
Subject: <iman> update all promotion

---
 src-migrate/modules/promo/components/FlashSale.tsx |  1 -
 src-migrate/modules/promo/components/Hero.tsx      | 24 ++++++++++------------
 2 files changed, 11 insertions(+), 14 deletions(-)

(limited to 'src-migrate/modules')

diff --git a/src-migrate/modules/promo/components/FlashSale.tsx b/src-migrate/modules/promo/components/FlashSale.tsx
index 05bf1e11..c0259396 100644
--- a/src-migrate/modules/promo/components/FlashSale.tsx
+++ b/src-migrate/modules/promo/components/FlashSale.tsx
@@ -12,7 +12,6 @@ const FlashSale = dynamic(
   const FlashSalePromo = ()=> {
     return(
         <>  
-            <h1 className='h-4'></h1>
             <FlashSale/>
         </>
     )
diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx
index b6e27270..7eb84270 100644
--- a/src-migrate/modules/promo/components/Hero.tsx
+++ b/src-migrate/modules/promo/components/Hero.tsx
@@ -10,11 +10,11 @@ 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';
+import {bannerApi} from '../../../../src/api/bannerApi'
 
 interface IPromotionProgram {
-  banner_s: string;
-  name_s: string;
+  image: string ;
+  name: string;
 }
 
 const swiperBanner: SwiperProps = {
@@ -41,20 +41,18 @@ const swiperBannerMob = {
 };
 
 const Hero = () => {
-  const bannerQuery = useQuery({
-    queryKey: ['banner.all-promo'],
-    queryFn: getPromotionProgramSolr,
-  });
+  const heroBanner = useQuery('heroBannerSecondary', bannerApi({ type: 'banner-promotion' }))
 
   const banners: IPromotionProgram[] = useMemo(
-    () => bannerQuery.data?.response?.docs || [],
-    [bannerQuery.data]
+    () => heroBanner?.data || [],
+    [heroBanner.data]
   );
 
   const swiperBannerMobile = {
     ...swiperBannerMob,
     pagination: { dynamicBullets: false, clickable: true },
   };
+  
 
   return (
     <>
@@ -71,8 +69,8 @@ const Hero = () => {
               {banners.map((banner, index) => (
                 <SwiperSlide key={index}>
                   <Image
-                    src={banner.banner_s}
-                    alt={banner.name_s}
+                    src={banner.image}
+                    alt={banner.name}
                     width={666}
                     height={450}
                     quality={100}
@@ -91,8 +89,8 @@ const Hero = () => {
                       width={439}
                       height={150}
                       quality={100}
-                      src={banner.banner_s}
-                      alt={banner.name_s}
+                      src={banner.image}
+                      alt={banner.name}
                       className='w-full h-full object-cover object-center rounded-2xl'
                     />
               </SwiperSlide>
-- 
cgit v1.2.3


From 30142ab6c6f37fb381264efd0dc94aa997b1a278 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 17 Jul 2024 15:14:43 +0700
Subject: <iman> update dynamic description

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

(limited to 'src-migrate/modules')

diff --git a/src-migrate/modules/promo/components/Hero.tsx b/src-migrate/modules/promo/components/Hero.tsx
index 7eb84270..b91288dd 100644
--- a/src-migrate/modules/promo/components/Hero.tsx
+++ b/src-migrate/modules/promo/components/Hero.tsx
@@ -13,6 +13,8 @@ import DesktopView from '@/core/components/views/DesktopView';
 import {bannerApi} from '../../../../src/api/bannerApi'
 
 interface IPromotionProgram {
+  headline_banner: string;
+  description_banner: string;
   image: string ;
   name: string;
 }
@@ -58,27 +60,26 @@ const Hero = () => {
     <>
       <DesktopView>
         <div className={style['wrapper']}>
-          <div className={style['desc-section']}>
-            <div className={style['title']}>Pasti Hemat & Untung Selama Belanja di Indoteknik.com!</div>
-            <div className='h-4' />
-            <div className={style['subtitle']}>Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai! </div>
-          </div>
-
-          <div className={style['banner-section']}>
             <Swiper {...swiperBanner}>
               {banners.map((banner, index) => (
-                <SwiperSlide key={index}>
-                  <Image
-                    src={banner.image}
-                    alt={banner.name}
-                    width={666}
-                    height={450}
-                    quality={100}
-                    className='w-full h-full object-fit object-center rounded-2xl' />
+                <SwiperSlide key={index} className='flex flex-row'>
+                  <div className={style['desc-section']}>
+                    <div className={style['title']}>{banner.headline_banner? banner.headline_banner : "Pasti Hemat & Untung Selama Belanja di Indoteknik.com!"}</div>
+                    <div className='h-4' />
+                    <div className={style['subtitle']}>{banner.description_banner? banner.description_banner : "Cari paket yang kami sediakan dengan penawaran harga & Nikmati kemudahan dalam setiap transaksi dengan fitur lengkap Pembayaran hingga barang sampai!"}</div>
+                  </div>
+                  <div className={style['banner-section']}>
+                    <Image
+                      src={banner.image}
+                      alt={banner.name}
+                      width={666}
+                      height={450}
+                      quality={100}
+                      className='w-full h-full object-fit object-center rounded-2xl' />
+                  </div>
                 </SwiperSlide>
               ))}
             </Swiper>
-          </div>
         </div>
       </DesktopView>
       <MobileView>
-- 
cgit v1.2.3