From 208b234320b6c42491a4e87a1c3db3abab9c1715 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 21 Jun 2024 10:52:28 +0700
Subject: <iman> update all-promotion

---
 src-migrate/modules/promo/components/PromoList.jsx | 194 +++++++++++++++++++++
 1 file changed, 194 insertions(+)
 create mode 100644 src-migrate/modules/promo/components/PromoList.jsx

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
new file mode 100644
index 00000000..af2958aa
--- /dev/null
+++ b/src-migrate/modules/promo/components/PromoList.jsx
@@ -0,0 +1,194 @@
+import Image from 'next/image';
+import Link from '@/core/components/elements/Link/Link';
+import ProductPromoCard from '../../../../src-migrate/modules/product-promo/components/Card'
+// import { fetchPromoItemsSolr, fetchVariantSolr } from '../../../api/promoApi'
+
+
+export const fetchPromoItemsSolr = async (type) => {
+  // let query = type ? `type_value_s:${type}` : '*:*';
+  let start = 0
+  let rows = 100
+  try {
+    const queryParams = new URLSearchParams({ q: type });
+    const response = await fetch(`/solr/promotion_program_lines/select?${queryParams.toString()}&rows=${rows}&start=${start}`);
+    if (!response.ok) {
+      throw new Error(`HTTP error! status: ${response.status}`);
+    }
+    const data = await response.json();
+    const promotions = await map(data.response.docs);
+    return promotions;
+  } catch (error) {
+    console.error("Error fetching promotion data:", error);
+    return [];
+  }
+};
+
+
+const PromoList = ({ selectedPromo }) => {
+
+  useEffect(() => {
+    const loadPromo = async () => {
+      setLoading(true);
+      
+      
+      try {
+        const items = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug}`);
+        setPromoItems(items);
+        
+        if (items.length === 0) {
+          setPromoData([])
+          setLoading(false);
+          return;
+          }
+          
+          const brandArray = Array.isArray(brand) ? brand : brand.split(',');
+          const categoryArray = Array.isArray(category) ? category : category.split(',');
+          
+          const promoDataPromises = items.map(async (item) => {
+            
+            try { 
+              let brandQuery = '';
+              if (brand) {
+                brandQuery = brandArray.map(b => `manufacture_name_s:${b}`).join(' OR ');
+                brandQuery = `(${brandQuery})`;
+              }
+  
+              let categoryQuery = '';
+              if (category) {
+                categoryQuery = categoryArray.map(c => `category_name:${c}`).join(' OR ');
+                categoryQuery = `(${categoryQuery})`;
+              }
+  
+              let priceQuery = '';
+              if (priceFrom && priceTo) {
+                priceQuery = `price_f:[${priceFrom} TO ${priceTo}]`;
+              } else if (priceFrom) {
+                priceQuery = `price_f:[${priceFrom} TO *]`;
+              } else if (priceTo) {
+                priceQuery = `price_f:[* TO ${priceTo}]`;
+              }
+  
+              let combinedQuery = '';
+              let combinedQueryPrice = `${priceQuery}`;
+              if (brand && category && priceFrom || priceTo) {
+                combinedQuery = `${brandQuery} AND ${categoryQuery} `;
+              } else if (brand && category) {
+                combinedQuery = `${brandQuery} AND ${categoryQuery}`;
+              } else if (brand && priceFrom || priceTo) {
+                combinedQuery = `${brandQuery}`;
+              } else if (category && priceFrom || priceTo) {
+                combinedQuery = `${categoryQuery}`;
+              } else if (brand) {
+                combinedQuery = brandQuery;
+              } else if (category) {
+                combinedQuery = categoryQuery;
+              }
+  
+              if (combinedQuery && priceFrom || priceTo) {
+                const response = await fetchVariantSolr(`id:${item.product_id} AND ${combinedQuery}`);
+                const product = response.response.docs[0];
+                const product_id = product.id;
+                const response2 = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug} AND product_ids:${product_id} AND ${combinedQueryPrice}`);  
+                return response2;
+              }else if(combinedQuery){
+                const response = await fetchVariantSolr(`id:${item.product_id} AND ${combinedQuery}`);
+                const product = response.response.docs[0];
+                const product_id = product.id;
+                const response2 = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug} AND product_ids:${product_id} `); 
+                return response2;
+              } else {
+                const response = await fetchPromoItemsSolr(`id:${item.id}`);
+                return response;
+              }
+            } catch (fetchError) {
+              return [];
+            }
+          });
+
+        const promoDataArray = await Promise.all(promoDataPromises);
+        const mergedPromoData = promoDataArray.reduce((accumulator, currentValue) => accumulator.concat(currentValue), []);
+        setPromoData(mergedPromoData);
+
+        const dataBrandCategoryPromises = promoDataArray.map(async (promoData) => {
+          if (promoData) {
+            const dataBrandCategory = promoData.map(async (item) => {
+              let response;
+              if(category){
+                const categoryQuery = categoryArray.map(c => `category_name:${c}`).join(' OR ');
+                response = await fetchVariantSolr(`id:${item.products[0].product_id} AND (${categoryQuery})`);
+              }else{
+                response = await fetchVariantSolr(`id:${item.products[0].product_id}`)    
+              }
+              
+
+              if (response.response?.docs?.length > 0) {
+                const product = response.response.docs[0];
+                const manufactureNameS = product.manufacture_name;
+                if (Array.isArray(manufactureNameS)) {
+                  for (let i = 0; i < manufactureNameS.length; i += 2) {
+                    const brand = manufactureNameS[i];
+                    const qty = 1;
+                    const existingBrandIndex = brandsData.findIndex(b => b.brand === brand);
+                    if (existingBrandIndex !== -1) {
+                      brandsData[existingBrandIndex].qty += qty;
+                    } else {
+                      brandsData.push({ brand, qty });
+                    }
+                  }
+                }
+
+                const categoryNameS = product.category_name;
+                if (Array.isArray(categoryNameS)) {
+                  for (let i = 0; i < categoryNameS.length; i += 2) {
+                    const name = categoryNameS[i];
+                    const qty = 1;
+                    const existingCategoryIndex = categoriesData.findIndex(c => c.name === name);
+                    if (existingCategoryIndex !== -1) {
+                      categoriesData[existingCategoryIndex].qty += qty;
+                    } else {
+                      categoriesData.push({ name, qty });
+                    }
+                  }
+                }
+              }
+            });
+
+            return Promise.all(dataBrandCategory);
+          }
+        });
+
+        await Promise.all(dataBrandCategoryPromises);
+        setBrands(brandsData);
+        setCategories(categoriesData);
+        setLoading(false);
+
+      } catch (loadError) {
+        // console.error("Error loading promo items:", loadError)
+        setLoading(false);
+      }
+    }
+
+    if (slug) {
+      loadPromo()
+    }
+  },[slug, brand, category, priceFrom, priceTo, currentPage]);
+
+  let title = '';
+  
+  if (selectedPromo === 'Bundling') {
+    title = 'Kombinasi Kilat Pilihan Kami!';
+  } else if (selectedPromo === 'Loading') {
+    title = 'Belanja Borong Pilihan Kami!';
+  } else if (selectedPromo === 'Merchandise') {
+    title = 'Gratis Merchandise Spesial Indoteknik';
+  }
+
+  return (
+    <div>
+      <h1 className='text-h-sm md:text-h-lg font-semibold mb-4'>{title}</h1>
+      <div>DISINI CARD {selectedPromo}</div>
+    </div>
+  );
+}
+
+export default PromoList;
-- 
cgit v1.2.3


From 7b08c9358888148bf6f6c2c7145d75e466550298 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 21 Jun 2024 11:04:57 +0700
Subject: <iman> update after marge

---
 src-migrate/modules/promo/components/PromoList.jsx | 170 ---------------------
 1 file changed, 170 deletions(-)

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
index af2958aa..ed758fbc 100644
--- a/src-migrate/modules/promo/components/PromoList.jsx
+++ b/src-migrate/modules/promo/components/PromoList.jsx
@@ -1,178 +1,8 @@
 import Image from 'next/image';
 import Link from '@/core/components/elements/Link/Link';
 import ProductPromoCard from '../../../../src-migrate/modules/product-promo/components/Card'
-// import { fetchPromoItemsSolr, fetchVariantSolr } from '../../../api/promoApi'
-
-
-export const fetchPromoItemsSolr = async (type) => {
-  // let query = type ? `type_value_s:${type}` : '*:*';
-  let start = 0
-  let rows = 100
-  try {
-    const queryParams = new URLSearchParams({ q: type });
-    const response = await fetch(`/solr/promotion_program_lines/select?${queryParams.toString()}&rows=${rows}&start=${start}`);
-    if (!response.ok) {
-      throw new Error(`HTTP error! status: ${response.status}`);
-    }
-    const data = await response.json();
-    const promotions = await map(data.response.docs);
-    return promotions;
-  } catch (error) {
-    console.error("Error fetching promotion data:", error);
-    return [];
-  }
-};
-
 
 const PromoList = ({ selectedPromo }) => {
-
-  useEffect(() => {
-    const loadPromo = async () => {
-      setLoading(true);
-      
-      
-      try {
-        const items = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug}`);
-        setPromoItems(items);
-        
-        if (items.length === 0) {
-          setPromoData([])
-          setLoading(false);
-          return;
-          }
-          
-          const brandArray = Array.isArray(brand) ? brand : brand.split(',');
-          const categoryArray = Array.isArray(category) ? category : category.split(',');
-          
-          const promoDataPromises = items.map(async (item) => {
-            
-            try { 
-              let brandQuery = '';
-              if (brand) {
-                brandQuery = brandArray.map(b => `manufacture_name_s:${b}`).join(' OR ');
-                brandQuery = `(${brandQuery})`;
-              }
-  
-              let categoryQuery = '';
-              if (category) {
-                categoryQuery = categoryArray.map(c => `category_name:${c}`).join(' OR ');
-                categoryQuery = `(${categoryQuery})`;
-              }
-  
-              let priceQuery = '';
-              if (priceFrom && priceTo) {
-                priceQuery = `price_f:[${priceFrom} TO ${priceTo}]`;
-              } else if (priceFrom) {
-                priceQuery = `price_f:[${priceFrom} TO *]`;
-              } else if (priceTo) {
-                priceQuery = `price_f:[* TO ${priceTo}]`;
-              }
-  
-              let combinedQuery = '';
-              let combinedQueryPrice = `${priceQuery}`;
-              if (brand && category && priceFrom || priceTo) {
-                combinedQuery = `${brandQuery} AND ${categoryQuery} `;
-              } else if (brand && category) {
-                combinedQuery = `${brandQuery} AND ${categoryQuery}`;
-              } else if (brand && priceFrom || priceTo) {
-                combinedQuery = `${brandQuery}`;
-              } else if (category && priceFrom || priceTo) {
-                combinedQuery = `${categoryQuery}`;
-              } else if (brand) {
-                combinedQuery = brandQuery;
-              } else if (category) {
-                combinedQuery = categoryQuery;
-              }
-  
-              if (combinedQuery && priceFrom || priceTo) {
-                const response = await fetchVariantSolr(`id:${item.product_id} AND ${combinedQuery}`);
-                const product = response.response.docs[0];
-                const product_id = product.id;
-                const response2 = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug} AND product_ids:${product_id} AND ${combinedQueryPrice}`);  
-                return response2;
-              }else if(combinedQuery){
-                const response = await fetchVariantSolr(`id:${item.product_id} AND ${combinedQuery}`);
-                const product = response.response.docs[0];
-                const product_id = product.id;
-                const response2 = await fetchPromoItemsSolr(`type_value_s:${Array.isArray(slug) ? slug[0] : slug} AND product_ids:${product_id} `); 
-                return response2;
-              } else {
-                const response = await fetchPromoItemsSolr(`id:${item.id}`);
-                return response;
-              }
-            } catch (fetchError) {
-              return [];
-            }
-          });
-
-        const promoDataArray = await Promise.all(promoDataPromises);
-        const mergedPromoData = promoDataArray.reduce((accumulator, currentValue) => accumulator.concat(currentValue), []);
-        setPromoData(mergedPromoData);
-
-        const dataBrandCategoryPromises = promoDataArray.map(async (promoData) => {
-          if (promoData) {
-            const dataBrandCategory = promoData.map(async (item) => {
-              let response;
-              if(category){
-                const categoryQuery = categoryArray.map(c => `category_name:${c}`).join(' OR ');
-                response = await fetchVariantSolr(`id:${item.products[0].product_id} AND (${categoryQuery})`);
-              }else{
-                response = await fetchVariantSolr(`id:${item.products[0].product_id}`)    
-              }
-              
-
-              if (response.response?.docs?.length > 0) {
-                const product = response.response.docs[0];
-                const manufactureNameS = product.manufacture_name;
-                if (Array.isArray(manufactureNameS)) {
-                  for (let i = 0; i < manufactureNameS.length; i += 2) {
-                    const brand = manufactureNameS[i];
-                    const qty = 1;
-                    const existingBrandIndex = brandsData.findIndex(b => b.brand === brand);
-                    if (existingBrandIndex !== -1) {
-                      brandsData[existingBrandIndex].qty += qty;
-                    } else {
-                      brandsData.push({ brand, qty });
-                    }
-                  }
-                }
-
-                const categoryNameS = product.category_name;
-                if (Array.isArray(categoryNameS)) {
-                  for (let i = 0; i < categoryNameS.length; i += 2) {
-                    const name = categoryNameS[i];
-                    const qty = 1;
-                    const existingCategoryIndex = categoriesData.findIndex(c => c.name === name);
-                    if (existingCategoryIndex !== -1) {
-                      categoriesData[existingCategoryIndex].qty += qty;
-                    } else {
-                      categoriesData.push({ name, qty });
-                    }
-                  }
-                }
-              }
-            });
-
-            return Promise.all(dataBrandCategory);
-          }
-        });
-
-        await Promise.all(dataBrandCategoryPromises);
-        setBrands(brandsData);
-        setCategories(categoriesData);
-        setLoading(false);
-
-      } catch (loadError) {
-        // console.error("Error loading promo items:", loadError)
-        setLoading(false);
-      }
-    }
-
-    if (slug) {
-      loadPromo()
-    }
-  },[slug, brand, category, priceFrom, priceTo, currentPage]);
-
   let title = '';
   
   if (selectedPromo === 'Bundling') {
-- 
cgit v1.2.3


From 3ada88f0faf901e05bd56ecff8c4bcb209c06787 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Fri, 21 Jun 2024 15:31:12 +0700
Subject: <iman> update all-promotion

---
 src-migrate/modules/promo/components/PromoList.jsx | 98 ++++++++++++++++++----
 1 file changed, 83 insertions(+), 15 deletions(-)

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
index ed758fbc..fb4b6ee3 100644
--- a/src-migrate/modules/promo/components/PromoList.jsx
+++ b/src-migrate/modules/promo/components/PromoList.jsx
@@ -1,24 +1,92 @@
-import Image from 'next/image';
-import Link from '@/core/components/elements/Link/Link';
-import ProductPromoCard from '../../../../src-migrate/modules/product-promo/components/Card'
+import React, { useState, useEffect } from 'react';
+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'
 
 const PromoList = ({ selectedPromo }) => {
-  let title = '';
-  
-  if (selectedPromo === 'Bundling') {
-    title = 'Kombinasi Kilat Pilihan Kami!';
-  } else if (selectedPromo === 'Loading') {
-    title = 'Belanja Borong Pilihan Kami!';
-  } else if (selectedPromo === 'Merchandise') {
-    title = 'Gratis Merchandise Spesial Indoteknik';
-  }
+  const [title, setTitle] = useState('');
+  const [slug, setSlug] = useState('');
+  const [promoItems, setPromoItems] = useState([]);
+  const [promoData, setPromoData] = useState([]);
+  const [isLoading, setIsLoading] = useState(true);
+  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]);
+
+  useEffect(() => {
+    const fetchPromotions = async () => {
+      setIsLoading(true);
+      try {
+        const items = await fetchPromoItemsSolr(`type_value_s:${slug}`, 0, 50);
+        setPromoItems(items);
+
+        console.log("selectedPromo",selectedPromo)
+        console.log("slug",slug)
+        console.log("items",items)
+        console.log("promoItems",promoItems)
+
+        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);
+      // Reset the promoItems and promoData when slug changes
+      setPromoItems([]);
+      setPromoData([]);
+      fetchPromotions();
+    }
+  }, [slug]);
 
   return (
     <div>
-      <h1 className='text-h-sm md:text-h-lg font-semibold mb-4'>{title}</h1>
-      <div>DISINI CARD {selectedPromo}</div>
+      <h1 className='text-h-sm md:text-h-lg  font-semibold py-4'>{title}</h1>
+      {isLoading ? (
+        <div className="loading-spinner flex justify-center">
+          <LogoSpinner width={48} height={48} />
+        </div>
+      ) : (
+        
+        <Swiper slidesPerView={isMobile ? 1.5 : 3.25} spaceBetween={12} freeMode>
+          {promoData?.map((promotion) => (
+            <SwiperSlide key={promotion.id}>
+              <div className="min-w-[380px] max-w-[380px] mb-[20px] sm:min-w-[330px] md:min-w-[360px] lg:min-w-[380px] xl:min-w-[380px]">
+                <ProductPromoCard promotion={promotion} />
+              </div>
+            </SwiperSlide>
+          ))}
+        </Swiper>
+      )}
     </div>
   );
-}
+};
 
 export default PromoList;
-- 
cgit v1.2.3


From 8456bd17207e349c717d062fcc6fe4d032da1334 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Sat, 22 Jun 2024 12:39:22 +0700
Subject: <iman> update bagian footer untuk penawaran(baru tampilan saja) all
 promotion

---
 src-migrate/modules/promo/components/PromoList.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
index fb4b6ee3..9b1a30a4 100644
--- a/src-migrate/modules/promo/components/PromoList.jsx
+++ b/src-migrate/modules/promo/components/PromoList.jsx
@@ -67,7 +67,7 @@ const PromoList = ({ selectedPromo }) => {
   }, [slug]);
 
   return (
-    <div>
+    <div className='h-[420px]'>
       <h1 className='text-h-sm md:text-h-lg  font-semibold py-4'>{title}</h1>
       {isLoading ? (
         <div className="loading-spinner flex justify-center">
-- 
cgit v1.2.3


From bfeb27c25e416db41e211de54e7f7d0cac4ad792 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 24 Jun 2024 09:13:24 +0700
Subject: <iman> update all promotion add zustand

---
 src-migrate/modules/promo/components/PromoList.jsx | 35 ++++++++++++----------
 1 file changed, 19 insertions(+), 16 deletions(-)

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
index 9b1a30a4..a21ba188 100644
--- a/src-migrate/modules/promo/components/PromoList.jsx
+++ b/src-migrate/modules/promo/components/PromoList.jsx
@@ -1,16 +1,25 @@
-import React, { useState, useEffect } from 'react';
+import React, { useEffect } from 'react';
 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 LogoSpinner from '../../../../src/core/components/elements/Spinner/LogoSpinner';
+import usePromoStore from './promoStore'; // Adjust the path accordingly
 
 const PromoList = ({ selectedPromo }) => {
-  const [title, setTitle] = useState('');
-  const [slug, setSlug] = useState('');
-  const [promoItems, setPromoItems] = useState([]);
-  const [promoData, setPromoData] = useState([]);
-  const [isLoading, setIsLoading] = useState(true);
+  const {
+    title,
+    slug,
+    promoItems,
+    promoData,
+    isLoading,
+    setTitle,
+    setSlug,
+    setPromoItems,
+    setPromoData,
+    setIsLoading,
+  } = usePromoStore();
+
   const { isMobile } = useDevice();
 
   useEffect(() => {
@@ -24,7 +33,7 @@ const PromoList = ({ selectedPromo }) => {
       setTitle('Gratis Merchandise Spesial Indoteknik');
       setSlug('merchandise');
     }
-  }, [selectedPromo]);
+  }, [selectedPromo, setTitle, setSlug]);
 
   useEffect(() => {
     const fetchPromotions = async () => {
@@ -33,11 +42,6 @@ const PromoList = ({ selectedPromo }) => {
         const items = await fetchPromoItemsSolr(`type_value_s:${slug}`, 0, 50);
         setPromoItems(items);
 
-        console.log("selectedPromo",selectedPromo)
-        console.log("slug",slug)
-        console.log("items",items)
-        console.log("promoItems",promoItems)
-
         const promoDataPromises = items.map(async (item) => {
           try {
             const response = await fetchPromoItemsSolr(`id:${item.id}`, 0, 10);
@@ -64,17 +68,16 @@ const PromoList = ({ selectedPromo }) => {
       setPromoData([]);
       fetchPromotions();
     }
-  }, [slug]);
+  }, [slug, setPromoItems, setPromoData, setIsLoading]);
 
   return (
     <div className='h-[420px]'>
-      <h1 className='text-h-sm md:text-h-lg  font-semibold py-4'>{title}</h1>
+      <h1 className='text-h-sm md:text-h-lg font-semibold py-4'>{title}</h1>
       {isLoading ? (
         <div className="loading-spinner flex justify-center">
           <LogoSpinner width={48} height={48} />
         </div>
       ) : (
-        
         <Swiper slidesPerView={isMobile ? 1.5 : 3.25} spaceBetween={12} freeMode>
           {promoData?.map((promotion) => (
             <SwiperSlide key={promotion.id}>
-- 
cgit v1.2.3


From 6f05ae8199603c7c8502987cc01ba7d0b31b27c2 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 24 Jun 2024 14:36:06 +0700
Subject: <iman> add tampilkan lebih banyak pada card

---
 src-migrate/modules/promo/components/PromoList.jsx | 36 ++++++++++++++++++----
 1 file changed, 30 insertions(+), 6 deletions(-)

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
index a21ba188..7187e9d7 100644
--- a/src-migrate/modules/promo/components/PromoList.jsx
+++ b/src-migrate/modules/promo/components/PromoList.jsx
@@ -1,10 +1,11 @@
-import React, { useEffect } from 'react';
+import React, { useEffect, useState } from 'react';
 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'; // Adjust the path accordingly
+import usePromoStore from './promoStore'; // Sesuaikan dengan path yang sesuai
+import { ChevronRightIcon } from '@heroicons/react/24/outline';
 
 const PromoList = ({ selectedPromo }) => {
   const {
@@ -39,7 +40,7 @@ const PromoList = ({ selectedPromo }) => {
     const fetchPromotions = async () => {
       setIsLoading(true);
       try {
-        const items = await fetchPromoItemsSolr(`type_value_s:${slug}`, 0, 50);
+        const items = await fetchPromoItemsSolr(`type_value_s:${slug}`, 0, 10); 
         setPromoItems(items);
 
         const promoDataPromises = items.map(async (item) => {
@@ -54,6 +55,7 @@ const PromoList = ({ selectedPromo }) => {
         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 {
@@ -63,13 +65,19 @@ const PromoList = ({ selectedPromo }) => {
 
     if (slug) {
       setIsLoading(true);
-      // Reset the promoItems and promoData when slug changes
       setPromoItems([]);
       setPromoData([]);
       fetchPromotions();
     }
   }, [slug, setPromoItems, setPromoData, setIsLoading]);
 
+ 
+
+  const navigateToPromoPage = () => {
+    // Fungsi untuk menavigasikan pengguna ke halaman promo yang sesuai dengan slug
+    window.location.href = '/shop/promo/' + slug;
+  };
+
   return (
     <div className='h-[420px]'>
       <h1 className='text-h-sm md:text-h-lg font-semibold py-4'>{title}</h1>
@@ -78,14 +86,26 @@ const PromoList = ({ selectedPromo }) => {
           <LogoSpinner width={48} height={48} />
         </div>
       ) : (
-        <Swiper slidesPerView={isMobile ? 1.5 : 3.25} spaceBetween={12} freeMode>
-          {promoData?.map((promotion) => (
+        <Swiper slidesPerView={isMobile ? 1.5 : 3.25} spaceBetween={12} freeMode >
+            {promoData?.map((promotion) => (
             <SwiperSlide key={promotion.id}>
               <div className="min-w-[380px] max-w-[380px] mb-[20px] sm:min-w-[330px] md:min-w-[360px] lg:min-w-[380px] xl:min-w-[380px]">
                 <ProductPromoCard promotion={promotion} />
               </div>
             </SwiperSlide>
           ))}
+         <SwiperSlide>
+              <div className='rounded-lg flex items-center justify-center flex-col cursor-pointer  h-96 text-red-500 font-bold border-2 min-w-[380px] max-w-[380px] mb-[20px] sm:min-w-[330px] md:min-w-[360px] lg:min-w-[380px] xl:min-w-[380px]' onClick={navigateToPromoPage}>
+                <ChevronRightIcon className="w-48 h-48 ml-2 font-normal text-red-500 hover:text-red-400 transition duration-300 transform hover:scale-125" />
+                <span className=''>
+                  Lihat lebih banyak
+                </span>
+
+                {/* <button className="mt-4 text-black font-bold py-2 px-4 rounded min-w-[380px] max-w-[380px] mb-[20px] sm:min-w-[330px] md:min-w-[360px] lg:min-w-[380px] xl:min-w-[380px]" onClick={navigateToPromoPage}>
+                </button> */}
+              </div>
+            </SwiperSlide> 
+          
         </Swiper>
       )}
     </div>
@@ -93,3 +113,7 @@ const PromoList = ({ selectedPromo }) => {
 };
 
 export default PromoList;
+// border-radius: 0.5rem;
+//     border-width: 1px;
+//     --tw-border-opacity: 1;
+//     border-color: rgb(219 219 219 / var(--tw-border-opacity));
\ No newline at end of file
-- 
cgit v1.2.3


From eec3440fe52db85b325c600fdd393590dee906fe Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Wed, 26 Jun 2024 15:30:48 +0700
Subject: <iman> update all promotion

---
 src-migrate/modules/promo/components/PromoList.jsx | 37 +++++++---------------
 1 file changed, 11 insertions(+), 26 deletions(-)

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
index 7187e9d7..529d54a1 100644
--- a/src-migrate/modules/promo/components/PromoList.jsx
+++ b/src-migrate/modules/promo/components/PromoList.jsx
@@ -4,8 +4,9 @@ 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'; // Sesuaikan dengan path yang sesuai
+import usePromoStore from './promoStore';
 import { ChevronRightIcon } from '@heroicons/react/24/outline';
+import Link from '@/core/components/elements/Link/Link'
 
 const PromoList = ({ selectedPromo }) => {
   const {
@@ -71,16 +72,16 @@ const PromoList = ({ selectedPromo }) => {
     }
   }, [slug, setPromoItems, setPromoData, setIsLoading]);
 
- 
-
-  const navigateToPromoPage = () => {
-    // Fungsi untuk menavigasikan pengguna ke halaman promo yang sesuai dengan slug
-    window.location.href = '/shop/promo/' + slug;
-  };
-
   return (
     <div className='h-[420px]'>
-      <h1 className='text-h-sm md:text-h-lg font-semibold py-4'>{title}</h1>
+      <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} />
@@ -94,26 +95,10 @@ const PromoList = ({ selectedPromo }) => {
               </div>
             </SwiperSlide>
           ))}
-         <SwiperSlide>
-              <div className='rounded-lg flex items-center justify-center flex-col cursor-pointer  h-96 text-red-500 font-bold border-2 min-w-[380px] max-w-[380px] mb-[20px] sm:min-w-[330px] md:min-w-[360px] lg:min-w-[380px] xl:min-w-[380px]' onClick={navigateToPromoPage}>
-                <ChevronRightIcon className="w-48 h-48 ml-2 font-normal text-red-500 hover:text-red-400 transition duration-300 transform hover:scale-125" />
-                <span className=''>
-                  Lihat lebih banyak
-                </span>
-
-                {/* <button className="mt-4 text-black font-bold py-2 px-4 rounded min-w-[380px] max-w-[380px] mb-[20px] sm:min-w-[330px] md:min-w-[360px] lg:min-w-[380px] xl:min-w-[380px]" onClick={navigateToPromoPage}>
-                </button> */}
-              </div>
-            </SwiperSlide> 
-          
         </Swiper>
       )}
     </div>
   );
 };
 
-export default PromoList;
-// border-radius: 0.5rem;
-//     border-width: 1px;
-//     --tw-border-opacity: 1;
-//     border-color: rgb(219 219 219 / var(--tw-border-opacity));
\ No newline at end of file
+export default PromoList;
\ No newline at end of file
-- 
cgit v1.2.3


From 367bf6f382392774680abcf4a5ca4b4d03915650 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 8 Jul 2024 14:31:45 +0700
Subject: <iman> update mobile view

---
 src-migrate/modules/promo/components/PromoList.jsx | 6 +++---
 1 file changed, 3 insertions(+), 3 deletions(-)

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
index 529d54a1..a7356d71 100644
--- a/src-migrate/modules/promo/components/PromoList.jsx
+++ b/src-migrate/modules/promo/components/PromoList.jsx
@@ -73,7 +73,7 @@ const PromoList = ({ selectedPromo }) => {
   }, [slug, setPromoItems, setPromoData, setIsLoading]);
 
   return (
-    <div className='h-[420px]'>
+    <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>
@@ -87,10 +87,10 @@ const PromoList = ({ selectedPromo }) => {
           <LogoSpinner width={48} height={48} />
         </div>
       ) : (
-        <Swiper slidesPerView={isMobile ? 1.5 : 3.25} spaceBetween={12} freeMode >
+        <Swiper slidesPerView={isMobile ? 1.2 : 3.25} spaceBetween={12} freeMode >
             {promoData?.map((promotion) => (
             <SwiperSlide key={promotion.id}>
-              <div className="min-w-[380px] max-w-[380px] mb-[20px] sm:min-w-[330px] md:min-w-[360px] lg:min-w-[380px] xl:min-w-[380px]">
+              <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>
-- 
cgit v1.2.3


From 8ce480fedfa91e16d9adb997311a999aaabaafb2 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 8 Jul 2024 16:08:21 +0700
Subject: <iman> update testing swiper

---
 src-migrate/modules/promo/components/PromoList.jsx | 104 ---------------------
 1 file changed, 104 deletions(-)
 delete mode 100644 src-migrate/modules/promo/components/PromoList.jsx

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
deleted file mode 100644
index a7356d71..00000000
--- a/src-migrate/modules/promo/components/PromoList.jsx
+++ /dev/null
@@ -1,104 +0,0 @@
-import React, { useEffect, useState } from 'react';
-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>
-      ) : (
-        <Swiper slidesPerView={isMobile ? 1.2 : 3.25} spaceBetween={12} freeMode >
-            {promoData?.map((promotion) => (
-            <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;
\ No newline at end of file
-- 
cgit v1.2.3


From 678c5144cb7ac2a3c6bc8dc090e31313809d13a3 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 8 Jul 2024 16:53:36 +0700
Subject: <iman> update swiper

---
 src-migrate/modules/promo/components/PromoList.jsx | 110 +++++++++++++++++++++
 1 file changed, 110 insertions(+)
 create mode 100644 src-migrate/modules/promo/components/PromoList.jsx

(limited to 'src-migrate/modules/promo/components/PromoList.jsx')

diff --git a/src-migrate/modules/promo/components/PromoList.jsx b/src-migrate/modules/promo/components/PromoList.jsx
new file mode 100644
index 00000000..e6add893
--- /dev/null
+++ b/src-migrate/modules/promo/components/PromoList.jsx
@@ -0,0 +1,110 @@
+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
-- 
cgit v1.2.3

