From a70fd5b6d9c7a769ac1aaa22a7d037ba3be27a05 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Tue, 16 Jan 2024 16:08:43 +0700 Subject: Update improve product detail performance --- .../components/elements/Navbar/NavbarDesktop.jsx | 124 ++++++++++++--------- .../components/elements/Navbar/NavbarMobile.jsx | 69 +++++++----- 2 files changed, 108 insertions(+), 85 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 d9f5658e..9bcd4df2 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -2,74 +2,72 @@ import { ChevronDownIcon, HeartIcon, ShoppingCartIcon, - DocumentCheckIcon -} from '@heroicons/react/24/outline' -import Link from '../Link/Link' -import Image from 'next/image' -import DesktopView from '../../views/DesktopView' -import dynamic from 'next/dynamic' -import IndoteknikLogo from '@/images/logo.png' -import Category from '@/lib/category/components/Category' -import { useCallback, useContext, useEffect, useState } from 'react' -import useAuth from '@/core/hooks/useAuth' -import NavbarUserDropdown from './NavbarUserDropdown' -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 { 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'), { - loading: () => -}) + DocumentCheckIcon, +} from '@heroicons/react/24/outline'; +import Link from '../Link/Link'; +import Image from 'next/image'; +import DesktopView from '../../views/DesktopView'; +import dynamic from 'next/dynamic'; +import IndoteknikLogo from '@/images/logo.png'; +import Category from '@/lib/category/components/Category'; +import { useCallback, useContext, useEffect, useState } from 'react'; +import useAuth from '@/core/hooks/useAuth'; +import NavbarUserDropdown from './NavbarUserDropdown'; +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 { TopBannerSkeleton } from '../Skeleton/TopBannerSkeleton'; +import { useProductContext } from '@/contexts/ProductContext'; +import Cardheader from '@/lib/cart/components/Cartheader'; + +const Search = dynamic(() => import('./Search'), { ssr: false }); +const TopBanner = dynamic(() => import('./TopBanner'), { ssr: false }); const NavbarDesktop = () => { - const [isOpenCategory, setIsOpenCategory] = useState(false) - const auth = useAuth() + const [isOpenCategory, setIsOpenCategory] = useState(false); + const auth = useAuth(); - const [cartCount, setCartCount] = useState(0) + const [cartCount, setCartCount] = useState(0); - const [templateWA, setTemplateWA] = useState(null) - const [payloadWA, setPayloadWa] = useState(null) - const [urlPath, setUrlPath] = useState(null) + const [templateWA, setTemplateWA] = useState(null); + const [payloadWA, setPayloadWa] = useState(null); + const [urlPath, setUrlPath] = useState(null); - const router = useRouter() + const router = useRouter(); - const { product } = useProductContext() + 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') + url: createSlug('/shop/product/', product?.name, product?.id, true), + }); + setTemplateWA('product'); - setUrlPath(router.asPath) + setUrlPath(router.asPath); } - }, [product, router]) + }, [product, router]); useEffect(() => { const handleCartChange = () => { const cart = async () => { - const listCart = await getCountCart() - setCartCount(listCart) - } - cart() - } - handleCartChange() + const listCart = await getCountCart(); + setCartCount(listCart); + }; + cart(); + }; + handleCartChange(); - window.addEventListener('localStorageChange', handleCartChange) + window.addEventListener('localStorageChange', handleCartChange); return () => { - window.removeEventListener('localStorageChange', handleCartChange) - } - }, []) + window.removeEventListener('localStorageChange', handleCartChange); + }; + }, []); return ( @@ -93,7 +91,12 @@ const NavbarDesktop = () => { - ) -} + ); +}; -export default NavbarDesktop +export default NavbarDesktop; diff --git a/src/core/components/elements/Navbar/NavbarMobile.jsx b/src/core/components/elements/Navbar/NavbarMobile.jsx index 704e91b6..92bd5627 100644 --- a/src/core/components/elements/Navbar/NavbarMobile.jsx +++ b/src/core/components/elements/Navbar/NavbarMobile.jsx @@ -1,51 +1,60 @@ -import Image from 'next/image' -import MobileView from '../../views/MobileView' -import Link from '../Link/Link' -import { Bars3Icon, HeartIcon, ShoppingCartIcon } from '@heroicons/react/24/outline' -import useSidebar from '@/core/hooks/useSidebar' -import dynamic from 'next/dynamic' -import IndoteknikLogo from '@/images/logo.png' -import { useEffect, useState } from 'react' -import { getCart, getCountCart } from '@/core/utils/cart' -import TopBanner from './TopBanner' +import Image from 'next/image'; +import MobileView from '../../views/MobileView'; +import Link from '../Link/Link'; +import { + Bars3Icon, + HeartIcon, + ShoppingCartIcon, +} from '@heroicons/react/24/outline'; +import useSidebar from '@/core/hooks/useSidebar'; +import dynamic from 'next/dynamic'; +import IndoteknikLogo from '@/images/logo.png'; +import { useEffect, useState } from 'react'; +import { getCart, getCountCart } from '@/core/utils/cart'; +// import TopBanner from './TopBanner'; -const Search = dynamic(() => import('./Search')) +const Search = dynamic(() => import('./Search')); const NavbarMobile = () => { - const { Sidebar, open } = useSidebar() + const { Sidebar, open } = useSidebar(); - const [cartCount, setCartCount] = useState(0) + const [cartCount, setCartCount] = useState(0); useEffect(() => { const handleCartChange = () => { const cart = async () => { - const listCart = await getCountCart() - setCartCount(listCart) - } - cart() - } - handleCartChange() + const listCart = await getCountCart(); + setCartCount(listCart); + }; + cart(); + }; + handleCartChange(); - window.addEventListener('localStorageChange', handleCartChange) + window.addEventListener('localStorageChange', handleCartChange); return () => { - window.removeEventListener('localStorageChange', handleCartChange) - } - }, []) + window.removeEventListener('localStorageChange', handleCartChange); + }; + }, []); return ( - + {/* */} {Sidebar} - ) -} + ); +}; -export default NavbarMobile +export default NavbarMobile; -- cgit v1.2.3 From e35595250f9e0408e23d1da3ac30ac1179e2a376 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Sat, 27 Jan 2024 11:46:36 +0700 Subject: Refactor layout --- .../components/elements/Navbar/NavbarDesktop.jsx | 33 +++++++++++----------- .../components/elements/Navbar/NavbarMobile.jsx | 12 ++++---- 2 files changed, 23 insertions(+), 22 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 9bcd4df2..d1ff2d58 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -1,29 +1,30 @@ +import { useProductContext } from '@/contexts/ProductContext'; +import useAuth from '@/core/hooks/useAuth'; +import { getCountCart } from '@/core/utils/cart'; +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 Category from '@/lib/category/components/Category'; import { ChevronDownIcon, - HeartIcon, - ShoppingCartIcon, DocumentCheckIcon, + HeartIcon, } from '@heroicons/react/24/outline'; -import Link from '../Link/Link'; +import dynamic from 'next/dynamic'; import Image from 'next/image'; +import { useRouter } from 'next/router'; +import { useEffect, useState } from 'react'; import DesktopView from '../../views/DesktopView'; -import dynamic from 'next/dynamic'; -import IndoteknikLogo from '@/images/logo.png'; -import Category from '@/lib/category/components/Category'; -import { useCallback, useContext, useEffect, useState } from 'react'; -import useAuth from '@/core/hooks/useAuth'; +import Link from '../Link/Link'; import NavbarUserDropdown from './NavbarUserDropdown'; -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 { TopBannerSkeleton } from '../Skeleton/TopBannerSkeleton'; -import { useProductContext } from '@/contexts/ProductContext'; -import Cardheader from '@/lib/cart/components/Cartheader'; const Search = dynamic(() => import('./Search'), { ssr: false }); -const TopBanner = dynamic(() => import('./TopBanner'), { ssr: false }); +const TopBanner = dynamic(() => import('./TopBanner'), { + ssr: false, + loading: () => , +}); const NavbarDesktop = () => { const [isOpenCategory, setIsOpenCategory] = useState(false); diff --git a/src/core/components/elements/Navbar/NavbarMobile.jsx b/src/core/components/elements/Navbar/NavbarMobile.jsx index 92bd5627..bcf45e0a 100644 --- a/src/core/components/elements/Navbar/NavbarMobile.jsx +++ b/src/core/components/elements/Navbar/NavbarMobile.jsx @@ -1,16 +1,16 @@ -import Image from 'next/image'; -import MobileView from '../../views/MobileView'; -import Link from '../Link/Link'; +import useSidebar from '@/core/hooks/useSidebar'; +import { getCountCart } from '@/core/utils/cart'; +import IndoteknikLogo from '@/images/logo.png'; import { Bars3Icon, HeartIcon, ShoppingCartIcon, } from '@heroicons/react/24/outline'; -import useSidebar from '@/core/hooks/useSidebar'; import dynamic from 'next/dynamic'; -import IndoteknikLogo from '@/images/logo.png'; +import Image from 'next/image'; import { useEffect, useState } from 'react'; -import { getCart, getCountCart } from '@/core/utils/cart'; +import MobileView from '../../views/MobileView'; +import Link from '../Link/Link'; // import TopBanner from './TopBanner'; const Search = dynamic(() => import('./Search')); -- cgit v1.2.3 From de4e52bd63a85b8251d8369866e0b3ffd37b6059 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Tue, 20 Feb 2024 10:06:07 +0700 Subject: Add smooth animation on top banner --- .../components/elements/Navbar/NavbarDesktop.jsx | 6 +-- src/core/components/elements/Navbar/TopBanner.jsx | 43 +++++++++++++--------- 2 files changed, 26 insertions(+), 23 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 d1ff2d58..05ef0fb0 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -18,13 +18,9 @@ import { useEffect, useState } from 'react'; import DesktopView from '../../views/DesktopView'; import Link from '../Link/Link'; import NavbarUserDropdown from './NavbarUserDropdown'; -import { TopBannerSkeleton } from '../Skeleton/TopBannerSkeleton'; const Search = dynamic(() => import('./Search'), { ssr: false }); -const TopBanner = dynamic(() => import('./TopBanner'), { - ssr: false, - loading: () => , -}); +const TopBanner = dynamic(() => import('./TopBanner'), { ssr: false }); const NavbarDesktop = () => { const [isOpenCategory, setIsOpenCategory] = useState(false); diff --git a/src/core/components/elements/Navbar/TopBanner.jsx b/src/core/components/elements/Navbar/TopBanner.jsx index a757c260..4342149d 100644 --- a/src/core/components/elements/Navbar/TopBanner.jsx +++ b/src/core/components/elements/Navbar/TopBanner.jsx @@ -1,21 +1,28 @@ -import odooApi from '@/core/api/odooApi' -import { useQuery } from 'react-query' -import Image from 'next/image' -import Link from '../Link/Link' -import { TopBannerSkeleton } from '../Skeleton/TopBannerSkeleton' +import odooApi from '@/core/api/odooApi'; +import Image from 'next/image'; +import { useQuery } from 'react-query'; +import clsxm from '~/libs/clsxm'; +import Link from '../Link/Link'; const TopBanner = () => { - const fetchTopBanner = async () => await odooApi('GET', '/api/v1/banner?type=top-banner') - const topBanner = useQuery('topBanner', fetchTopBanner, { refetchOnWindowFocus: false }) + const topBanner = useQuery({ + queryKey: 'topBanner', + queryFn: async () => await odooApi('GET', '/api/v1/banner?type=top-banner'), + refetchOnWindowFocus: false, + }); - if (topBanner.isLoading) { - return - } + const backgroundColor = topBanner.data?.[0]?.backgroundColor || 'transparent'; + const hasData = topBanner.data?.length > 0; return ( - topBanner.isFetched && - topBanner.data?.length > 0 && ( -
+
+ {hasData && ( { className='object-cover object-center h-full mx-auto' /> -
- ) - ) -} + )} +
+ ); +}; -export default TopBanner +export default TopBanner; -- cgit v1.2.3 From bb1451372cd847def47fcaed6669a72c664f68e3 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Tue, 20 Feb 2024 13:53:53 +0700 Subject: Create and implement smooth render --- src/core/components/elements/Navbar/TopBanner.jsx | 35 +++++++++++------------ 1 file changed, 17 insertions(+), 18 deletions(-) (limited to 'src/core/components/elements/Navbar') diff --git a/src/core/components/elements/Navbar/TopBanner.jsx b/src/core/components/elements/Navbar/TopBanner.jsx index 4342149d..ff5b1d90 100644 --- a/src/core/components/elements/Navbar/TopBanner.jsx +++ b/src/core/components/elements/Navbar/TopBanner.jsx @@ -1,8 +1,8 @@ import odooApi from '@/core/api/odooApi'; import Image from 'next/image'; import { useQuery } from 'react-query'; -import clsxm from '~/libs/clsxm'; import Link from '../Link/Link'; +import SmoothRender from '~/components/ui/smooth-render'; const TopBanner = () => { const topBanner = useQuery({ @@ -13,27 +13,26 @@ const TopBanner = () => { const backgroundColor = topBanner.data?.[0]?.backgroundColor || 'transparent'; const hasData = topBanner.data?.length > 0; + const data = topBanner.data?.[0] || null; return ( -
- {hasData && ( - - {topBanner.data[0].name} - - )} -
+ + {data?.name} + + ); }; -- cgit v1.2.3 From 5d3807a89596958a1e23e02ae11f73a2474c3432 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Tue, 20 Feb 2024 22:27:06 +0700 Subject: Update smooth render function --- src/core/components/elements/Navbar/TopBanner.jsx | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) (limited to 'src/core/components/elements/Navbar') diff --git a/src/core/components/elements/Navbar/TopBanner.jsx b/src/core/components/elements/Navbar/TopBanner.jsx index ff5b1d90..ded2857f 100644 --- a/src/core/components/elements/Navbar/TopBanner.jsx +++ b/src/core/components/elements/Navbar/TopBanner.jsx @@ -18,9 +18,9 @@ const TopBanner = () => { return ( -- cgit v1.2.3 From ab61908296a05d303cb9c0d019b5a92002e03972 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Wed, 21 Feb 2024 09:12:40 +0700 Subject: Fix weight on cart --- src/core/components/elements/Navbar/TopBanner.jsx | 5 +++-- 1 file changed, 3 insertions(+), 2 deletions(-) (limited to 'src/core/components/elements/Navbar') diff --git a/src/core/components/elements/Navbar/TopBanner.jsx b/src/core/components/elements/Navbar/TopBanner.jsx index ded2857f..f9ac7032 100644 --- a/src/core/components/elements/Navbar/TopBanner.jsx +++ b/src/core/components/elements/Navbar/TopBanner.jsx @@ -1,8 +1,9 @@ -import odooApi from '@/core/api/odooApi'; import Image from 'next/image'; import { useQuery } from 'react-query'; -import Link from '../Link/Link'; + +import odooApi from '@/core/api/odooApi'; import SmoothRender from '~/components/ui/smooth-render'; +import Link from '../Link/Link'; const TopBanner = () => { const topBanner = useQuery({ -- cgit v1.2.3 From 4bac265bf958d67dfbd584fd524d661287661368 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Thu, 22 Feb 2024 16:29:01 +0700 Subject: Improve render on checkout page --- src/core/components/elements/Navbar/TopBanner.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (limited to 'src/core/components/elements/Navbar') diff --git a/src/core/components/elements/Navbar/TopBanner.jsx b/src/core/components/elements/Navbar/TopBanner.jsx index f9ac7032..722a7501 100644 --- a/src/core/components/elements/Navbar/TopBanner.jsx +++ b/src/core/components/elements/Navbar/TopBanner.jsx @@ -21,7 +21,7 @@ const TopBanner = () => { isLoaded={hasData} height='36px' duration='700ms' - delay='500ms' + delay='300ms' style={{ backgroundColor }} > -- cgit v1.2.3 From 756f93807a33bb1398931ae894b071504dfec3b8 Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Tue, 27 Feb 2024 13:16:57 +0700 Subject: fixing pencarian brand di mobile & active button tab header --- src/core/components/elements/Navbar/NavbarDesktop.jsx | 6 +++--- 1 file changed, 3 insertions(+), 3 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 05ef0fb0..e11ad214 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -166,7 +166,7 @@ const NavbarDesktop = () => {
@@ -174,7 +174,7 @@ const NavbarDesktop = () => { @@ -190,7 +190,7 @@ const NavbarDesktop = () => { -- cgit v1.2.3 From 65377952fbd0721ce1550c42384d723ccd7b9b1a Mon Sep 17 00:00:00 2001 From: "HATEC\\SPVDEV001" Date: Fri, 1 Mar 2024 09:20:11 +0700 Subject: generate recomendation --- src/core/components/elements/Navbar/NavbarUserDropdown.jsx | 5 +++++ 1 file changed, 5 insertions(+) (limited to 'src/core/components/elements/Navbar') diff --git a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx index 1851ce84..42bdc12a 100644 --- a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx +++ b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx @@ -2,9 +2,11 @@ import { deleteAuth } from '@/core/utils/auth' import Link from '../Link/Link' import { useRouter } from 'next/router' import { signOut, useSession } from 'next-auth/react' +import useAuth from '@/core/hooks/useAuth' const NavbarUserDropdown = () => { const router = useRouter() + const atuh = useAuth() const logout = async () => { deleteAuth().then(() => { @@ -21,6 +23,9 @@ const NavbarUserDropdown = () => { Invoice & Faktur Pajak Wishlist Daftar Alamat + {!atuh?.external && + Dashboard Recomendation + } -- cgit v1.2.3 From 9d6f553be717d2e70969629fd6ec0113d8538c18 Mon Sep 17 00:00:00 2001 From: "tri.susilo" Date: Mon, 25 Mar 2024 17:04:45 +0700 Subject: [Agnes] Pindah sosmes icon --- .../components/elements/Navbar/NavbarDesktop.jsx | 102 ++++++++++++++++++++- 1 file changed, 98 insertions(+), 4 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 e11ad214..49eb52e8 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -18,6 +18,7 @@ import { useEffect, useState } from 'react'; import DesktopView from '../../views/DesktopView'; import Link from '../Link/Link'; import NavbarUserDropdown from './NavbarUserDropdown'; +import NextImage from 'next/image'; const Search = dynamic(() => import('./Search'), { ssr: false }); const TopBanner = dynamic(() => import('./TopBanner'), { ssr: false }); @@ -69,11 +70,16 @@ const NavbarDesktop = () => { return ( -
+
- - Tentang Indoteknik.com - +
+ + Tentang Indoteknik.com + +
+ +
+
Pembayaran Tempo @@ -234,4 +240,92 @@ const NavbarDesktop = () => { ); }; +const SocialMedias = () => ( +
+ {/*
Temukan Kami
*/} + +
+); + export default NavbarDesktop; -- cgit v1.2.3 From 632be0a06f404bb588787d4b7c5cfc9066e9f0f1 Mon Sep 17 00:00:00 2001 From: Rafi Zadanly Date: Mon, 1 Apr 2024 15:31:30 +0700 Subject: Update youtube url --- src/core/components/elements/Navbar/NavbarDesktop.jsx | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) (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 49eb52e8..3aa1720e 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -247,7 +247,7 @@ const SocialMedias = () => ( Date: Tue, 2 Apr 2024 09:17:07 +0700 Subject: CR sosmed --- .../components/elements/Navbar/NavbarDesktop.jsx | 25 ++++++++++++++-------- 1 file changed, 16 insertions(+), 9 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 49eb52e8..32b29a40 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -73,14 +73,14 @@ const NavbarDesktop = () => {