Merged in Feature/popup_cart (pull request #72)

Feature/popup cart

1 files changed, 23 insertions, 26 deletions

diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index 655c4732..3aba55c9 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -10,18 +10,17 @@ import DesktopView from '../../views/DesktopView'
 import dynamic from 'next/dynamic'
 import IndoteknikLogo from '@/images/logo.png'
 import Category from '@/lib/category/components/Category'
-import { useContext, useEffect, useState } from 'react'
+import { useCallback, useContext, useEffect, useState } from 'react'
 import useAuth from '@/core/hooks/useAuth'
 import NavbarUserDropdown from './NavbarUserDropdown'
-import { getCountCart } from '@/core/utils/cart'
+import { getCartApi, getCountCart } from '@/core/utils/cart'
 import whatsappUrl from '@/core/utils/whatsappUrl'
 import { useRouter } from 'next/router'
 import { getAuth, setAuth } from '@/core/utils/auth'
 import { createSlug, getIdFromSlug } from '@/core/utils/slug'
-import productApi from '@/lib/product/api/productApi'
-import { useSession } from 'next-auth/react'
-import { AuthContext } from '@/pages/_app'
 import { TopBannerSkeleton } from '../Skeleton/TopBannerSkeleton'
+import { useProductContext } from '@/contexts/ProductContext'
+import Cardheader from '@/lib/cart/components/Cartheader'
 
 const Search = dynamic(() => import('./Search'))
 const TopBanner = dynamic(() => import('./TopBanner'), {
@@ -30,7 +29,6 @@ const TopBanner = dynamic(() => import('./TopBanner'), {
 
 const NavbarDesktop = () => {
   const [isOpenCategory, setIsOpenCategory] = useState(false)
-  const {authenticated} = useContext(AuthContext)
   const auth = useAuth()
 
   const [cartCount, setCartCount] = useState(0)
@@ -40,8 +38,23 @@ const NavbarDesktop = () => {
   const [urlPath, setUrlPath] = useState(null)
 
   const router = useRouter()
+
+  const { product } = useProductContext()
   
   useEffect(() => {
+    if (router.pathname === '/shop/product/[slug]') {
+      setPayloadWa({
+        name: product?.name,
+        manufacture: product?.manufacture.name,
+        url: createSlug('/shop/product/', product?.name, product?.id, true)
+      })
+      setTemplateWA('product')
+
+      setUrlPath(router.asPath)
+    }
+  }, [product, router])
+
+  useEffect(() => {
     const handleCartChange = () => {
       const cart = async () => {
         const listCart = await getCountCart()
@@ -52,23 +65,6 @@ const NavbarDesktop = () => {
     handleCartChange()
 
     window.addEventListener('localStorageChange', handleCartChange)
-    if (router.pathname === '/shop/product/[slug]') {
-      const authToken = getAuth().token
-
-      const { slug } = router.query
-      const getProduct = async () => {
-        let product = await productApi({ id: getIdFromSlug(slug), headers: { Token: authToken } })
-        setPayloadWa({
-          name: product[0]?.name,
-          manufacture: product[0]?.manufacture.name,
-          url: createSlug('/shop/product/', product[0]?.name, product[0]?.id, true)
-        })
-      }
-      getProduct()
-      setTemplateWA('product')
-
-      setUrlPath(router.asPath)
-    }
 
     return () => {
       window.removeEventListener('localStorageChange', handleCartChange)
@@ -102,7 +98,7 @@ const NavbarDesktop = () => {
           <div className='flex-1 flex items-center'>
             <Search />
           </div>
-          <div className='flex gap-x-4'>
+          <div className='flex gap-x-4 items-center'>
             <Link
               href='/my/transactions'
               target='_blank'
@@ -114,7 +110,8 @@ const NavbarDesktop = () => {
               <br />
               Quotation
             </Link>
-            <Link
+            <Cardheader cartCount={cartCount}/>
+            {/* <Link
               href='/shop/cart'
               target='_blank'
               rel='noreferrer'
@@ -133,7 +130,7 @@ const NavbarDesktop = () => {
                 <br />
                 Belanja
               </span>
-            </Link>
+            </Link> */}
             <Link
               target='_blank'
               rel='noreferrer'