2 files changed, 31 insertions, 3 deletions
diff --git a/src/lib/category/components/Category.jsx b/src/lib/category/components/Category.jsx
index ff958378..b10cb661 100644
--- a/src/lib/category/components/Category.jsx
+++ b/src/lib/category/components/Category.jsx
@@ -6,11 +6,36 @@ import { ChevronRightIcon } from '@heroicons/react/24/outline'
 import Image from 'next/image'
 import { useEffect, useState } from 'react'
 import PopularBrand from './PopularBrand'
+import { bannerApi } from '@/api/bannerApi';
+const { useQuery } = require('react-query')
 
 const Category = () => {
   const [categories, setCategories] = useState([])
   const [openCategories, setOpenCategory] = useState([]);
+  const [banner, setBanner] = useState([]);
+
+  const promotionProgram = useQuery('banner-promo-category-card', bannerApi({ type: 'banner-promo-category-card' }));
+  // const promotionProgram = useQuery('promotionProgram', bannerApi({ type: 'banner-promotion' }));
   
+  useEffect(() => {
+    const loadCategories = async () => {
+      let dataCategories = await odooApi('GET', '/api/v1/category/tree')
+      dataCategories = dataCategories?.map((category) => {
+        category.childs = category.childs.map((child1Category) => {
+          return {
+            ...child1Category,
+            isOpen: false
+          }
+        })
+        return {
+          ...category,
+          isOpen: false
+        }
+      })
+      setCategories(dataCategories)
+    }
+    loadCategories()
+  }, [])
 
   useEffect(() => {
     const loadCategories = async () => {
@@ -86,9 +111,12 @@ const Category = () => {
               </div>
               <div className='category-mega-box__child-wrapper !w-[260px] !flex !flex-col !gap-4'>
               <PopularBrand category={category} />
-                <div className='flex w-60 h-20 object-cover'>
-                  <Image src='https://erp.indoteknik.com/api/image/x_banner.banner/x_banner_image/397' alt='' width={275} height={4} />
+              {promotionProgram?.data[0]?.map((banner, index)=>(
+                <div key={index} className='flex w-60 h-20 object-cover'>
+                  {/* <Image src='https://erp.indoteknik.com/api/image/x_banner.banner/x_banner_image/397' alt='' width={275} height={4} /> */}
+                  <Image src={`${banner.image}`} alt={`${banner.name}`} width={275} height={4} />
                 </div>
+              ))}
               </div>
             </div>
           </div>
diff --git a/src/lib/category/components/PopularBrand.jsx b/src/lib/category/components/PopularBrand.jsx
index dca731e8..7c297d39 100644
--- a/src/lib/category/components/PopularBrand.jsx
+++ b/src/lib/category/components/PopularBrand.jsx
@@ -17,7 +17,7 @@ const PopularBrand = ({ category }) => {
 
     const fetchTopBrands = async () => {
         try {
-            const items = await fetchPromoItemsSolr(`category_id_ids:(${category.categoryDataIds.join(' OR ')})`);
+            const items = await fetchPromoItemsSolr(`category_id_ids:(${category?.categoryDataIds.join(' OR ')})`);
             // console.log("id",items)
             // Fungsi untuk deduplikasi dan mengambil 12 nama brand teratas
             const getTop12UniqueBrands = (prod) => {