2 files changed, 12 insertions, 4 deletions
diff --git a/src/core/components/elements/Appbar/Appbar.jsx b/src/core/components/elements/Appbar/Appbar.jsx
index e19d5f0a..16bccbd5 100644
--- a/src/core/components/elements/Appbar/Appbar.jsx
+++ b/src/core/components/elements/Appbar/Appbar.jsx
@@ -2,7 +2,7 @@ import { useRouter } from 'next/router'
 import Link from '../Link/Link'
 import { HomeIcon, Bars3Icon, ShoppingCartIcon, ChevronLeftIcon } from '@heroicons/react/24/outline'
 import { useEffect, useState } from 'react'
-import { getCart } from '@/core/utils/cart'
+import { getCart, getCountCart } from '@/core/utils/cart'
 
 /**
  * The AppBar component is a navigation component used to display a header or toolbar
@@ -19,7 +19,11 @@ const AppBar = ({ title }) => {
 
   useEffect(() => {
     const handleCartChange = () => {
-      setCartCount(Object.keys(getCart()).length)
+      const cart = async () => {
+        const listCart = await getCountCart()
+        setCartCount(listCart)
+      }
+      cart()
     }
     handleCartChange()
 
diff --git a/src/core/components/elements/Navbar/NavbarMobile.jsx b/src/core/components/elements/Navbar/NavbarMobile.jsx
index b69e86e8..704e91b6 100644
--- a/src/core/components/elements/Navbar/NavbarMobile.jsx
+++ b/src/core/components/elements/Navbar/NavbarMobile.jsx
@@ -6,7 +6,7 @@ import useSidebar from '@/core/hooks/useSidebar'
 import dynamic from 'next/dynamic'
 import IndoteknikLogo from '@/images/logo.png'
 import { useEffect, useState } from 'react'
-import { getCart } from '@/core/utils/cart'
+import { getCart, getCountCart } from '@/core/utils/cart'
 import TopBanner from './TopBanner'
 
 const Search = dynamic(() => import('./Search'))
@@ -18,7 +18,11 @@ const NavbarMobile = () => {
 
   useEffect(() => {
     const handleCartChange = () => {
-      setCartCount(Object.keys(getCart()).length)
+      const cart = async () => {
+        const listCart = await getCountCart()
+        setCartCount(listCart)
+      }
+      cart()
     }
     handleCartChange()