summaryrefslogtreecommitdiff
path: root/src/core/components/elements/Navbar/NavbarDesktop.jsx
diff options
context:
space:
mode:
authorit-fixcomart <it@fixcomart.co.id>2024-09-26 11:16:32 +0700
committerit-fixcomart <it@fixcomart.co.id>2024-09-26 11:16:32 +0700
commit9dc7af1641f06f3c7cffda102febe90c806ffee1 (patch)
treee82bd0209247d5b85e7434e81bde8f2d9b525289 /src/core/components/elements/Navbar/NavbarDesktop.jsx
parent461d2786935c5c9b3cf627c44fc06fcd1c3e8075 (diff)
parent1c56a76f979a6e433d70634b92b1887fb1f19509 (diff)
Merge branch 'new-release' into Feature/switch-account
Diffstat (limited to 'src/core/components/elements/Navbar/NavbarDesktop.jsx')
-rw-r--r--src/core/components/elements/Navbar/NavbarDesktop.jsx85
1 files changed, 46 insertions, 39 deletions
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx
index 2a51c41f..eebfbcd5 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,13 +52,12 @@ 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 });
const data = transactions?.data?.saleOrders.filter(
(transaction) => transaction.status === 'draft'
@@ -107,8 +106,7 @@ const NavbarDesktop = () => {
useEffect(() => {
setPendingTransactions(data);
}, [transactions.data]);
-
-
+
useEffect(() => {
if (router.pathname === '/shop/product/[slug]') {
setPayloadWa({
@@ -117,11 +115,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,10 +128,10 @@ const NavbarDesktop = () => {
};
cart();
};
- handleCartChange();
-
+ handleCartChange();
+
window.addEventListener('localStorageChange', handleCartChange);
-
+
return () => {
window.removeEventListener('localStorageChange', handleCartChange);
};
@@ -154,7 +152,7 @@ const NavbarDesktop = () => {
window.removeEventListener('localStorageChange', handleQuotationChange);
};
}, [pendingTransactions]);
-
+
return (
<DesktopView>
<TopBanner onLoad={handleTopBannerLoad} />
@@ -174,7 +172,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 +215,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 +272,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={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`}
+ />
</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 +304,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 +326,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 +336,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'