From 6b173eaf8a95432316822b1d41b084875adfbd83 Mon Sep 17 00:00:00 2001
From: "tri.susilo" <tri.susilo@altama.co.id>
Date: Wed, 8 May 2024 14:47:11 +0700
Subject: [agnes] - Feature category management

---
 src/lib/category/components/Category.jsx | 79 +++++++++++++++++++++++++-------
 1 file changed, 62 insertions(+), 17 deletions(-)

(limited to 'src/lib/category/components/Category.jsx')

diff --git a/src/lib/category/components/Category.jsx b/src/lib/category/components/Category.jsx
index e6ea5acf..c147a3b3 100644
--- a/src/lib/category/components/Category.jsx
+++ b/src/lib/category/components/Category.jsx
@@ -2,10 +2,14 @@ import odooApi from '@/core/api/odooApi'
 import Link from '@/core/components/elements/Link/Link'
 import DesktopView from '@/core/components/views/DesktopView'
 import { createSlug } from '@/core/utils/slug'
+import { ChevronRightIcon } from '@heroicons/react/24/outline'
+import Image from 'next/image'
 import { useEffect, useState } from 'react'
 
 const Category = () => {
   const [categories, setCategories] = useState([])
+  const [openCategories, setOpenCategory] = useState([]);
+  
 
   useEffect(() => {
     const loadCategories = async () => {
@@ -31,7 +35,7 @@ const Category = () => {
     <DesktopView>
       <div className='category-mega-box'>
         {categories?.map((category) => (
-          <div key={category.id}>
+          <div key={category.id} className='flex'>
             <Link
               href={createSlug('/shop/category/', category.name, category.id)}
               className='category-mega-box__parent'
@@ -39,33 +43,74 @@ const Category = () => {
               {category.name}
             </Link>
             <div className='category-mega-box__child-wrapper'>
-              <div className='grid grid-cols-3 gap-x-4 gap-y-6 max-h-full overflow-auto'>
+              <div className='grid grid-cols-3 gap-x-4 gap-y-6 max-h-full !w-[590px] overflow-auto'>
                 {category.childs.map((child1Category) => (
-                  <div key={child1Category.id}>
+                  <div key={child1Category.id} className='w-full'>
                     <Link
                       href={createSlug('/shop/category/', child1Category.name, child1Category.id)}
-                      className='category-mega-box__child-one mb-4'
+                      className='category-mega-box__child-one mb-4 w-full h-8 flex justify-center line-clamp-2'
                     >
                       {child1Category.name}
                     </Link>
-                    <div className='flex flex-col gap-y-3'>
-                      {child1Category.childs.map((child2Category) => (
-                        <Link
-                          href={createSlug(
-                            '/shop/category/',
-                            child2Category.name,
-                            child2Category.id
-                          )}
-                          className='category-mega-box__child-two'
-                          key={child2Category.id}
-                        >
-                          {child2Category.name}
-                        </Link>
+                    <div className='flex flex-col gap-y-3 w-full'>
+                      {child1Category.childs.map((child2Category, index) => (
+                        (index < 4) && (
+                          <Link
+                            href={createSlug('/shop/category/', child2Category.name, child2Category.id)}
+                            className='category-mega-box__child-two truncate'
+                            key={child2Category.id}
+                          >
+                            {child2Category.name}
+                          </Link>
+                        )
                       ))}
+                      {child1Category.childs.length > 5 && (
+                        <div className='flex hover:bg-gray_r-8/35 rounded-10'>
+                          <Link
+                            href={createSlug('/shop/category/', child1Category.name, child1Category.id)}
+                            className='category-mega-box__child-one flex items-center gap-4 font-bold hover:ml-4'
+                          >
+                            <p className='mt-2 mb-0 text-danger-500 font-semibold'>Lihat Semua</p>
+                            <ChevronRightIcon className='w-4 text-danger-500 font-bold' />
+                          </Link>
+                        </div>
+                      )}
                     </div>
                   </div>
                 ))}
               </div>
+              <div className='category-mega-box__child-wrapper !w-[260px] !flex !flex-col !gap-4'>
+                <div className='flex flex-col'>
+                  <div className='grid grid-cols-2 max-h-full w-full gap-2'>
+                    {category.childs.map((brand, index) => (
+                      (index < 8 ) && (
+                        <div key={brand.id} className='w-full flex items-center justify-center pb-2'>
+                          <Link
+                            href={createSlug('/shop/category/', brand.name, brand.id)}
+                            className='category-mega-box__child-one w-fit h-full flex items-center justify-center '
+                          >
+                            <Image src='https://erp.indoteknik.com/api/image/x_manufactures/x_logo_manufacture/661' alt='' width={104} height={44} objectFit='cover' />
+                          </Link>
+                        </div>
+                      )
+                    ))}
+                  </div>
+                  {category.childs.length > 8 && (
+                    <div className='flex hover:bg-gray_r-8/35 rounded-10'>
+                      <Link
+                        href={createSlug('/shop/category/', category.name, category.id)}
+                        className='category-mega-box__child-one flex items-center gap-4 font-bold hover:ml-4'
+                      >
+                        <p className='mt-2 mb-0 text-danger-500 font-semibold'>Lihat Semua Brand</p>
+                        <ChevronRightIcon className='w-4 text-danger-500 font-bold' />
+                      </Link>
+                    </div>
+                  )}
+                </div>
+                <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} />
+                </div>
+              </div>
             </div>
           </div>
         ))}
-- 
cgit v1.2.3


From aaac6b72dddf8ef8460941797a1f6d88f289f726 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 5 Aug 2024 15:59:30 +0700
Subject: <iman> update category management

---
 src/lib/category/components/Category.jsx | 35 +++++++-------------------------
 1 file changed, 7 insertions(+), 28 deletions(-)

(limited to 'src/lib/category/components/Category.jsx')

diff --git a/src/lib/category/components/Category.jsx b/src/lib/category/components/Category.jsx
index c147a3b3..1f3d7a51 100644
--- a/src/lib/category/components/Category.jsx
+++ b/src/lib/category/components/Category.jsx
@@ -5,6 +5,7 @@ import { createSlug } from '@/core/utils/slug'
 import { ChevronRightIcon } from '@heroicons/react/24/outline'
 import Image from 'next/image'
 import { useEffect, useState } from 'react'
+import PopularBrand from './PopularBrand'
 
 const Category = () => {
   const [categories, setCategories] = useState([])
@@ -30,6 +31,7 @@ const Category = () => {
     }
     loadCategories()
   }, [])
+  console.log("categories",categories)
 
   return (
     <DesktopView>
@@ -38,8 +40,11 @@ const Category = () => {
           <div key={category.id} className='flex'>
             <Link
               href={createSlug('/shop/category/', category.name, category.id)}
-              className='category-mega-box__parent'
+              className='category-mega-box__parent flex items-center'
             >
+              <div className='w-6 h-6 border mr-2 rounded-full flex justify-center items-center'>
+                <Image src={category.image} alt='' width={16} height={16} />
+              </div>
               {category.name}
             </Link>
             <div className='category-mega-box__child-wrapper'>
@@ -80,33 +85,7 @@ const Category = () => {
                 ))}
               </div>
               <div className='category-mega-box__child-wrapper !w-[260px] !flex !flex-col !gap-4'>
-                <div className='flex flex-col'>
-                  <div className='grid grid-cols-2 max-h-full w-full gap-2'>
-                    {category.childs.map((brand, index) => (
-                      (index < 8 ) && (
-                        <div key={brand.id} className='w-full flex items-center justify-center pb-2'>
-                          <Link
-                            href={createSlug('/shop/category/', brand.name, brand.id)}
-                            className='category-mega-box__child-one w-fit h-full flex items-center justify-center '
-                          >
-                            <Image src='https://erp.indoteknik.com/api/image/x_manufactures/x_logo_manufacture/661' alt='' width={104} height={44} objectFit='cover' />
-                          </Link>
-                        </div>
-                      )
-                    ))}
-                  </div>
-                  {category.childs.length > 8 && (
-                    <div className='flex hover:bg-gray_r-8/35 rounded-10'>
-                      <Link
-                        href={createSlug('/shop/category/', category.name, category.id)}
-                        className='category-mega-box__child-one flex items-center gap-4 font-bold hover:ml-4'
-                      >
-                        <p className='mt-2 mb-0 text-danger-500 font-semibold'>Lihat Semua Brand</p>
-                        <ChevronRightIcon className='w-4 text-danger-500 font-bold' />
-                      </Link>
-                    </div>
-                  )}
-                </div>
+              <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} />
                 </div>
-- 
cgit v1.2.3


From 54fca7062ee0963d6ea6a22a82fba7fa3fa516e5 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 5 Aug 2024 17:07:35 +0700
Subject: <iman> update category management

---
 src/lib/category/components/Category.jsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

(limited to 'src/lib/category/components/Category.jsx')

diff --git a/src/lib/category/components/Category.jsx b/src/lib/category/components/Category.jsx
index 1f3d7a51..ff958378 100644
--- a/src/lib/category/components/Category.jsx
+++ b/src/lib/category/components/Category.jsx
@@ -31,7 +31,7 @@ const Category = () => {
     }
     loadCategories()
   }, [])
-  console.log("categories",categories)
+  // console.log("categories",categories)
 
   return (
     <DesktopView>
-- 
cgit v1.2.3


From 4dc62bbe5262be23b2622853973e803f63214a60 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Mon, 12 Aug 2024 17:09:13 +0700
Subject: <iman> update category management

---
 src/lib/category/components/Category.jsx | 32 ++++++++++++++++++++++++++++++--
 1 file changed, 30 insertions(+), 2 deletions(-)

(limited to 'src/lib/category/components/Category.jsx')

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


From 004a9a644aed65d5c02263f19cce8b7c3000f354 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Tue, 13 Aug 2024 10:19:38 +0700
Subject: <iman> update category

---
 src/lib/category/components/Category.jsx | 38 ++++++++++++++++----------------
 1 file changed, 19 insertions(+), 19 deletions(-)

(limited to 'src/lib/category/components/Category.jsx')

diff --git a/src/lib/category/components/Category.jsx b/src/lib/category/components/Category.jsx
index b10cb661..374cdf78 100644
--- a/src/lib/category/components/Category.jsx
+++ b/src/lib/category/components/Category.jsx
@@ -37,25 +37,25 @@ const Category = () => {
     loadCategories()
   }, [])
 
-  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 () => {
+  //     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()
+  // }, [])
   // console.log("categories",categories)
 
   return (
-- 
cgit v1.2.3


From 5e2a8d315fa0bc58a18d4df5a995e402388995c9 Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Thu, 22 Aug 2024 13:10:29 +0700
Subject: <iman> update category dropdown

---
 src/lib/category/components/Category.jsx | 30 +++---------------------------
 1 file changed, 3 insertions(+), 27 deletions(-)

(limited to 'src/lib/category/components/Category.jsx')

diff --git a/src/lib/category/components/Category.jsx b/src/lib/category/components/Category.jsx
index 374cdf78..f76e6e42 100644
--- a/src/lib/category/components/Category.jsx
+++ b/src/lib/category/components/Category.jsx
@@ -15,7 +15,6 @@ const Category = () => {
   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 () => {
@@ -36,28 +35,6 @@ const Category = () => {
     }
     loadCategories()
   }, [])
-
-  // 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()
-  // }, [])
-  // console.log("categories",categories)
-
   return (
     <DesktopView>
       <div className='category-mega-box'>
@@ -67,8 +44,8 @@ const Category = () => {
               href={createSlug('/shop/category/', category.name, category.id)}
               className='category-mega-box__parent flex items-center'
             >
-              <div className='w-6 h-6 border mr-2 rounded-full flex justify-center items-center'>
-                <Image src={category.image} alt='' width={16} height={16} />
+              <div className='mr-2  flex justify-center items-center'>
+                <Image src={category.image} alt='' width={25} height={25} />
               </div>
               {category.name}
             </Link>
@@ -111,9 +88,8 @@ const Category = () => {
               </div>
               <div className='category-mega-box__child-wrapper !w-[260px] !flex !flex-col !gap-4'>
               <PopularBrand category={category} />
-              {promotionProgram?.data[0]?.map((banner, index)=>(
+              {Array.isArray(promotionProgram?.data) && promotionProgram?.data.length > 0 && 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>
               ))}
-- 
cgit v1.2.3