summaryrefslogtreecommitdiff
path: root/src/core/components
diff options
context:
space:
mode:
Diffstat (limited to 'src/core/components')
-rw-r--r--src/core/components/elements/Navbar/Navbar.jsx6
-rw-r--r--src/core/components/elements/Navbar/NavbarDesktop.jsx63
-rw-r--r--src/core/components/elements/Navbar/NavbarMobile.jsx43
-rw-r--r--src/core/components/layouts/BasicLayout.jsx4
4 files changed, 70 insertions, 46 deletions
diff --git a/src/core/components/elements/Navbar/Navbar.jsx b/src/core/components/elements/Navbar/Navbar.jsx
index 57904498..59f743a2 100644
--- a/src/core/components/elements/Navbar/Navbar.jsx
+++ b/src/core/components/elements/Navbar/Navbar.jsx
@@ -3,10 +3,12 @@ import dynamic from 'next/dynamic'
const NavbarDesktop = dynamic(() => import('./NavbarDesktop'))
const NavbarMobile = dynamic(() => import('./NavbarMobile'))
-const Navbar = () => {
+const Navbar = ({isMobile} ) => {
+
+ if(isMobile) return <NavbarMobile />
+
return (
<>
- <NavbarMobile />
<NavbarDesktop />
</>
)
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index fa3df5bf..f4b0d5e1 100644
--- a/src/core/components/elements/Navbar/NavbarDesktop.jsx
+++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx
@@ -12,12 +12,9 @@ import {
MenuButton,
MenuItem,
MenuList,
- useDisclosure
+ useDisclosure,
} from '@chakra-ui/react';
-import {
- ChevronDownIcon,
- HeartIcon
-} from '@heroicons/react/24/outline';
+import { ChevronDownIcon, HeartIcon } from '@heroicons/react/24/outline';
import dynamic from 'next/dynamic';
import { default as Image, default as NextImage } from 'next/image';
import { useRouter } from 'next/router';
@@ -81,21 +78,17 @@ const NavbarDesktop = () => {
};
window.addEventListener('scroll', handleScroll);
+
return () => {
window.removeEventListener('scroll', handleScroll);
};
}, []);
useEffect(() => {
- const handleScroll = () => {
- setIsTop(window.scrollY < 100);
- };
-
- window.addEventListener('scroll', handleScroll);
- return () => {
- window.removeEventListener('scroll', handleScroll);
- };
- }, []);
+ if (auth) {
+ loadCart(auth.id);
+ }
+ }, [auth]);
useEffect(() => {
setPendingTransactions(data);
@@ -115,20 +108,22 @@ const NavbarDesktop = () => {
}, [product, router]);
useEffect(() => {
- const handleCartChange = () => {
- const cart = async () => {
- const listCart = await getCountCart();
- setCartCount(listCart);
- };
- cart();
- };
- handleCartChange();
-
- window.addEventListener('localStorageChange', handleCartChange);
-
- return () => {
- window.removeEventListener('localStorageChange', handleCartChange);
- };
+ // const handleCartChange = () => {
+ // const cart = async () => {
+ // const listCart = await getCountCart();
+ // setCartCount(listCart);
+ // };
+ // cart();
+ // };
+ // handleCartChange();
+
+ setCartCount(cart?.products?.length)
+
+ // window.addEventListener('localStorageChange', handleCartChange);
+
+ // return () => {
+ // window.removeEventListener('localStorageChange', handleCartChange);
+ // };
}, [transactions.data, cart]);
useEffect(() => {
@@ -202,7 +197,9 @@ const NavbarDesktop = () => {
src={IndoteknikLogo}
alt='Indoteknik Logo'
width={210}
- height={210 / 3}
+ height={70}
+ loading='eager'
+ priority={true}
/>
</Link>
<div className='flex-1 flex items-center'>
@@ -236,6 +233,7 @@ const NavbarDesktop = () => {
alt='Whatsapp'
width={48}
height={48}
+ loading='eager'
/>
<div>
<div className='font-semibold'>Whatsapp</div>
@@ -284,6 +282,7 @@ const NavbarDesktop = () => {
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`}
+ loading='eager'
/>
</div>
)}
@@ -394,6 +393,7 @@ const SocialMedias = () => (
// alt='Youtube - Indoteknik.com'
width={24}
height={24}
+ loading='eager'
/>
</a>
<a
@@ -406,6 +406,7 @@ const SocialMedias = () => (
// alt='TikTok - Indoteknik.com'
width={24}
height={24}
+ loading='eager'
/>
</a>
{/* <a target='_blank' rel='noreferrer' href={whatsappUrl(null)}>
@@ -426,6 +427,7 @@ const SocialMedias = () => (
// alt='Facebook - Indoteknik.com'
width={24}
height={24}
+ loading='eager'
/>
</a>
<a
@@ -438,6 +440,7 @@ const SocialMedias = () => (
// alt='Instagram - Indoteknik.com'
width={24}
height={24}
+ loading='eager'
/>
</a>
<a
@@ -450,6 +453,7 @@ const SocialMedias = () => (
// alt='Linkedin - Indoteknik.com'
width={24}
height={24}
+ loading='eager'
/>
</a>
<a
@@ -462,6 +466,7 @@ const SocialMedias = () => (
// alt='Maps - Indoteknik.com'
width={24}
height={24}
+ loading='eager'
/>
</a>
</div>
diff --git a/src/core/components/elements/Navbar/NavbarMobile.jsx b/src/core/components/elements/Navbar/NavbarMobile.jsx
index 90314671..47182a47 100644
--- a/src/core/components/elements/Navbar/NavbarMobile.jsx
+++ b/src/core/components/elements/Navbar/NavbarMobile.jsx
@@ -12,30 +12,44 @@ import { useEffect, useState } from 'react';
import MobileView from '../../views/MobileView';
import Link from '../Link/Link';
import TopBanner from './TopBanner';
+import { useCartStore } from '~/modules/cart/stores/useCartStore';
+import useAuth from '@/core/hooks/useAuth';
const Search = dynamic(() => import('./Search'));
const NavbarMobile = () => {
const { Sidebar, open } = useSidebar();
+ const auth = useAuth();
const [cartCount, setCartCount] = useState(0);
+ const { loadCart, cart, summary, updateCartItem } = useCartStore();
- useEffect(() => {
- const handleCartChange = () => {
- const cart = async () => {
- const listCart = await getCountCart();
- setCartCount(listCart);
- };
- cart();
- };
- handleCartChange();
+ // useEffect(() => {
+ // const handleCartChange = () => {
+ // const cart = async () => {
+ // const listCart = await getCountCart();
+ // setCartCount(listCart);
+ // };
+ // cart();
+ // };
+ // handleCartChange();
+
+ // window.addEventListener('localStorageChange', handleCartChange);
- window.addEventListener('localStorageChange', handleCartChange);
+ // return () => {
+ // window.removeEventListener('localStorageChange', handleCartChange);
+ // };
+ // }, []);
- return () => {
- window.removeEventListener('localStorageChange', handleCartChange);
- };
- }, []);
+ useEffect(() => {
+ if(auth){
+ loadCart(auth?.id);
+ }
+ }, [auth]);
+
+ useEffect(() => {
+ setCartCount(cart?.products?.length);
+ }, [cart]);
return (
<MobileView>
@@ -48,6 +62,7 @@ const NavbarMobile = () => {
alt='Indoteknik Logo'
width={120}
height={40}
+ loading='eager'
/>
</Link>
<div className='flex gap-x-3'>
diff --git a/src/core/components/layouts/BasicLayout.jsx b/src/core/components/layouts/BasicLayout.jsx
index 1b62bf05..2998fa63 100644
--- a/src/core/components/layouts/BasicLayout.jsx
+++ b/src/core/components/layouts/BasicLayout.jsx
@@ -112,7 +112,7 @@ const BasicLayout = ({ children }) => {
onAnimationEnd={() => setHighlight(false)}
/>
)}
- <Navbar />
+ <Navbar isMobile = {isMobile} />
<AnimationLayout>
{children}
<div
@@ -149,6 +149,7 @@ const BasicLayout = ({ children }) => {
className='block sm:hidden'
width={36}
height={36}
+ loading='eager'
/>
<Image
src='/images/socials/WHATSAPP.svg'
@@ -156,6 +157,7 @@ const BasicLayout = ({ children }) => {
className='hidden sm:block'
width={44}
height={44}
+ loading='eager'
/>
</a>
</div>
generated by cgit v1.2.3 (git 2.25.1) at 2026-04-18 06:03:40 +0000