diff options
| author | Rafi Zadanly <zadanlyr@gmail.com> | 2023-03-18 10:17:16 +0700 |
|---|---|---|
| committer | Rafi Zadanly <zadanlyr@gmail.com> | 2023-03-18 10:17:16 +0700 |
| commit | 62efd1afc02422545579c529cd954d0c157889ee (patch) | |
| tree | 09fa6a45b1b0f31af4e019ac6c4437721774e1cf /src/core/components/elements/Navbar | |
| parent | ff9e6c43f451ed933b0cb8d35623bf3b6a1de1c4 (diff) | |
navbar user dropdown, add to cart
Diffstat (limited to 'src/core/components/elements/Navbar')
| -rw-r--r-- | src/core/components/elements/Navbar/NavbarDesktop.jsx | 47 | ||||
| -rw-r--r-- | src/core/components/elements/Navbar/NavbarUserDropdown.jsx | 16 |
2 files changed, 49 insertions, 14 deletions
diff --git a/src/core/components/elements/Navbar/NavbarDesktop.jsx b/src/core/components/elements/Navbar/NavbarDesktop.jsx index fa620eb2..3ee9dc1e 100644 --- a/src/core/components/elements/Navbar/NavbarDesktop.jsx +++ b/src/core/components/elements/Navbar/NavbarDesktop.jsx @@ -11,11 +11,14 @@ import dynamic from 'next/dynamic' import IndoteknikLogo from '@/images/logo.png' import Category from '@/lib/category/components/Category' import { useState } from 'react' +import useAuth from '@/core/hooks/useAuth' +import NavbarUserDropdown from './NavbarUserDropdown' const Search = dynamic(() => import('./Search')) const NavbarDesktop = () => { const [isOpenCategory, setIsOpenCategory] = useState(false) + const auth = useAuth() return ( <DesktopView> @@ -82,7 +85,7 @@ const NavbarDesktop = () => { > <div>Kategori Produk</div> <ChevronDownIcon className={`ml-auto w-6 ${isOpenCategory ? 'rotate-180' : ''}`} /> - + <div className={`category-mega-box-wrapper ${isOpenCategory ? 'show' : ''}`}> <Category /> </div> @@ -113,19 +116,35 @@ const NavbarDesktop = () => { Blog Indoteknik </Link> </div> - <div className='w-3/12 flex gap-x-1'> - <Link - href='/login' - className='flex-1 flex justify-center items-center bg-red_r-11 !text-gray_r-1 rounded-none' - > - Masuk - </Link> - <Link - href='/register' - className='flex-1 flex justify-center items-center bg-red_r-11 !text-gray_r-1 rounded-none rounded-tr-xl' - > - Daftar - </Link> + + <div className='w-3/12 flex gap-x-1 relative'> + {!auth && ( + <> + <Link + href='/login' + className='flex-1 flex justify-center items-center bg-red_r-11 !text-gray_r-1 rounded-none' + > + Masuk + </Link> + <Link + href='/register' + className='flex-1 flex justify-center items-center bg-red_r-11 !text-gray_r-1 rounded-none rounded-tr-xl' + > + Daftar + </Link> + </> + )} + {auth && ( + <> + <Link href='/' className='navbar-user-dropdown-button'> + <span>Halo, {auth?.name}</span> + <div className='ml-auto'> + <ChevronDownIcon className='w-6' /> + </div> + </Link> + <NavbarUserDropdown /> + </> + )} </div> </div> </div> diff --git a/src/core/components/elements/Navbar/NavbarUserDropdown.jsx b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx new file mode 100644 index 00000000..fb95c593 --- /dev/null +++ b/src/core/components/elements/Navbar/NavbarUserDropdown.jsx @@ -0,0 +1,16 @@ +import Link from '../Link/Link' + +const NavbarUserDropdown = () => { + return ( + <div className='navbar-user-dropdown-wrapper'> + <div className='navbar-user-dropdown'> + <Link href='/'>Daftar Transaksi</Link> + <Link href='/'>Invoice & Faktur Pajak</Link> + <Link href='/'>Wishlist</Link> + <Link href='/'>Pengaturan Akun</Link> + </div> + </div> + ) +} + +export default NavbarUserDropdown |
