From 36601aba6017aeef16f89351eb487238402ab52e Mon Sep 17 00:00:00 2001
From: it-fixcomart <it@fixcomart.co.id>
Date: Tue, 24 Sep 2024 16:12:50 +0700
Subject: <iman> update Perapihan Tag

---
 .../components/elements/Navbar/NavbarDesktop.jsx   | 95 ++++++++++++----------
 1 file changed, 53 insertions(+), 42 deletions(-)

(limited to 'src/core/components/elements/Navbar')

diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index 2a51c41f..d480aa8d 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -5,7 +5,7 @@ import { createSlug } from '@/core/utils/slug';
 import whatsappUrl from '@/core/utils/whatsappUrl';
 import IndoteknikLogo from '@/images/logo.png';
 import Cardheader from '@/lib/cart/components/Cartheader';
-import Quotationheader from "../../../../../src/lib/quotation/components/Quotationheader.jsx"
+import Quotationheader from '../../../../../src/lib/quotation/components/Quotationheader.jsx';
 import Category from '@/lib/category/components/Category';
 import { useProductCartContext } from '@/contexts/ProductCartContext';
 import {
@@ -30,7 +30,7 @@ import {
   MenuList,
   useDisclosure,
 } from '@chakra-ui/react';
-import style from "./style/NavbarDesktop.module.css";
+import style from './style/NavbarDesktop.module.css';
 import useTransactions from '@/lib/transaction/hooks/useTransactions';
 import { useCartStore } from '~/modules/cart/stores/useCartStore';
 
@@ -43,7 +43,7 @@ const NavbarDesktop = () => {
 
   const [cartCount, setCartCount] = useState(0);
   const [quotationCount, setQuotationCount] = useState(0);
-  const [pendingTransactions, setPendingTransactions] = useState([])
+  const [pendingTransactions, setPendingTransactions] = useState([]);
   const [templateWA, setTemplateWA] = useState(null);
   const [payloadWA, setPayloadWa] = useState(null);
   const [urlPath, setUrlPath] = useState(null);
@@ -52,14 +52,17 @@ const NavbarDesktop = () => {
 
   const { product } = useProductContext();
   const { isOpen, onOpen, onClose } = useDisclosure();
-  
+
   const query = {
     context: 'quotation',
-    site:
-    (auth?.webRole === null && auth?.site ? auth.site : null),
+    site: auth?.webRole === null && auth?.site ? auth.site : null,
   };
-  
-  const { transactions } = useTransactions({ query });
+  let transactions = null;
+
+  if (auth) {
+    transactions = useTransactions({ query });
+  }
+
   const data = transactions?.data?.saleOrders.filter(
     (transaction) => transaction.status === 'draft'
   );
@@ -106,9 +109,8 @@ const NavbarDesktop = () => {
 
   useEffect(() => {
     setPendingTransactions(data);
-  }, [transactions.data]);
-  
-  
+  }, [transactions?.data]);
+
   useEffect(() => {
     if (router.pathname === '/shop/product/[slug]') {
       setPayloadWa({
@@ -117,11 +119,11 @@ const NavbarDesktop = () => {
         url: createSlug('/shop/product/', product?.name, product?.id, true),
       });
       setTemplateWA('product');
-      
+
       setUrlPath(router.asPath);
     }
   }, [product, router]);
-  
+
   useEffect(() => {
     const handleCartChange = () => {
       const cart = async () => {
@@ -130,14 +132,14 @@ const NavbarDesktop = () => {
       };
       cart();
     };
-    handleCartChange(); 
-    
+    handleCartChange();
+
     window.addEventListener('localStorageChange', handleCartChange);
-    
+
     return () => {
       window.removeEventListener('localStorageChange', handleCartChange);
     };
-  }, [transactions.data, cart]);
+  }, [transactions?.data, cart]);
 
   useEffect(() => {
     const handleQuotationChange = () => {
@@ -154,7 +156,7 @@ const NavbarDesktop = () => {
       window.removeEventListener('localStorageChange', handleQuotationChange);
     };
   }, [pendingTransactions]);
-  
+
   return (
     <DesktopView>
       <TopBanner onLoad={handleTopBannerLoad} />
@@ -174,7 +176,7 @@ const NavbarDesktop = () => {
               >
                 <div className='flex gap-x-1'>
                   <div>Fitur Layanan </div>
-                  <ChevronDownIcon className='w-5'/>
+                  <ChevronDownIcon className='w-5' />
                 </div>
               </MenuButton>
               <MenuList
@@ -217,7 +219,10 @@ const NavbarDesktop = () => {
             <Search />
           </div>
           <div className='flex gap-x-4 items-center'>
-            <Quotationheader quotationCount={quotationCount} data={pendingTransactions} />
+            <Quotationheader
+              quotationCount={quotationCount}
+              data={pendingTransactions}
+            />
 
             <Cardheader cartCount={cartCount} />
 
@@ -271,29 +276,30 @@ const NavbarDesktop = () => {
               </div>
             </div>
             <div className='w-6/12 flex px-1 divide-x divide-gray_r-6'>
-            
-            <Link
-                href="/shop/promo"
+              <Link
+                href='/shop/promo'
                 className={`${
                   router.asPath === '/shop/promo' && 'bg-gray_r-3'
                 }  flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition group relative`} // Added relative position
-                target="_blank"
-                rel="noreferrer"
+                target='_blank'
+                rel='noreferrer'
               >
-              {showPopup &&  (
-                <div className='w-full h-full relative justify-end items-start'> 
+                {showPopup && (
+                  <div className='w-full h-full relative justify-end items-start'>
                     <Image
-                    src='/images/penawaran-terbatas.jpg'
-                    alt='penawaran terbatas'
-                    width={1440}
-                    height={160}
-                    quality={100}
-                    // className={`fixed ${isTop ? 'md:top-[145px] lg:top-[160px] ' : 'lg:top-[85px] top-[80px]'} rounded-3xl md:left-1/4 lg:left-1/4 xl:left-1/4 left-2/3 w-40 h-12  p-2 z-50 transition-all duration-300 animate-pulse`}
-                    className={`inline-block relative -top-8 transition-all duration-300 z-20 animate-pulse`}
-                  />
+                      src='/images/penawaran-terbatas.jpg'
+                      alt='penawaran terbatas'
+                      width={1440}
+                      height={160}
+                      quality={85}
+                      // className={`fixed ${isTop ? 'md:top-[145px] lg:top-[160px] ' : 'lg:top-[85px] top-[80px]'} rounded-3xl md:left-1/4 lg:left-1/4 xl:left-1/4 left-2/3 w-40 h-12  p-2 z-50 transition-all duration-300 animate-pulse`}
+                      className={`inline-block relative -top-8 transition-all duration-300 z-20 animate-pulse`}
+                    />
                   </div>
-              )}
-                <span className="absolute inset-0 flex justify-center items-center group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200 z-10">Semua Promo</span>
+                )}
+                <span className='absolute inset-0 flex justify-center items-center group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200 z-10'>
+                  Semua Promo
+                </span>
               </Link>
               {/* {showPopup && router.pathname === '/' && (
                 <div className={`fixed ${isTop ? 'top-[170px]' : 'top-[90px]'} rounded-3xl left-[700px] w-fit object-center bg-green-50 text-xs font-medium text-green-700 ring-1 ring-inset ring-green-600/20 text-center p-2 z-50 transition-all duration-300`}>
@@ -302,17 +308,18 @@ const NavbarDesktop = () => {
                     </p>
                 </div>
               )} */}
-              
 
               <Link
                 href='/shop/brands'
-                className={`${  
+                className={`${
                   router.asPath === '/shop/brands' && 'bg-gray_r-3'
                 } p-4 flex-1 flex justify-center items-center !text-gray_r-12/80 hover:bg-gray_r-3 idt-transition group`}
                 target='_blank'
                 rel='noreferrer'
               >
-               <span className="group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200">Semua Brand</span>
+                <span className='group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200'>
+                  Semua Brand
+                </span>
               </Link>
               <Link
                 href='/shop/search?orderBy=stock'
@@ -323,7 +330,9 @@ const NavbarDesktop = () => {
                 target='_blank'
                 rel='noreferrer'
               >
-                <span className="group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200">Ready Stock</span>
+                <span className='group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200'>
+                  Ready Stock
+                </span>
               </Link>
               <Link
                 href='https://blog.indoteknik.com/'
@@ -331,7 +340,9 @@ const NavbarDesktop = () => {
                 target='_blank'
                 rel='noreferrer noopener'
               >
-                <span className="group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200">Blog Indoteknik</span>
+                <span className='group-hover:scale-105 group-hover:text-red-500 transition-transform duration-200'>
+                  Blog Indoteknik
+                </span>
               </Link>
               {/* <Link
                 href='/video'
-- 
cgit v1.2.3