59 lines
2.1 KiB
TypeScript
59 lines
2.1 KiB
TypeScript
'use client';
|
|
|
|
import useGlobalStore from '@/config/use-global';
|
|
import { buttonVariants } from '@workspace/airo-ui/components/button';
|
|
import { cn } from '@workspace/airo-ui/lib/utils';
|
|
import { useTranslations } from 'next-intl';
|
|
import Image from 'next/legacy/image';
|
|
import Link from 'next/link';
|
|
import LanguageSwitch from '../language-switch';
|
|
// import ThemeSwitch from '../theme-switch';
|
|
import { useLoginDialog } from '@/app/auth/LoginDialogContext';
|
|
import { UserNav } from '../user-nav';
|
|
|
|
export default function Header() {
|
|
const t = useTranslations('common');
|
|
|
|
const { user } = useGlobalStore();
|
|
const Logo = (
|
|
<Link href='/' className='-mt-2.5 flex items-center gap-2 font-bold'>
|
|
<Image src={'image.png'} width={102} height={49} alt='logo' objectFit='cover' unoptimized />
|
|
</Link>
|
|
);
|
|
|
|
const { openLoginDialog } = useLoginDialog();
|
|
return (
|
|
<>
|
|
<header className='fixed top-10 z-50 w-full'>
|
|
<div className={'container'}>
|
|
<div className='flex h-[60px] items-center justify-between rounded-[50px] bg-white pl-4 pr-1 sm:h-[73px] md:pl-7'>
|
|
<nav className='flex-col gap-6 font-medium md:flex md:flex-row md:items-center md:gap-5 md:text-sm lg:gap-6'>
|
|
{Logo}
|
|
</nav>
|
|
<div className='flex h-full flex-1 items-center justify-end gap-2 py-1'>
|
|
<LanguageSwitch />
|
|
{/*<ThemeSwitch />*/}
|
|
<UserNav />
|
|
{!user && (
|
|
<Link
|
|
href='#'
|
|
onClick={() => openLoginDialog()}
|
|
className={cn(
|
|
buttonVariants({
|
|
size: 'lg',
|
|
variant: 'outline',
|
|
}),
|
|
'h-full rounded-[50px] border-0 border-[#0F2C53] bg-[#0F2C53] px-5 text-[16px] font-bold text-white transition hover:bg-[#225BA9] hover:text-white sm:px-14 sm:text-2xl',
|
|
)}
|
|
>
|
|
{t('login')}
|
|
</Link>
|
|
)}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
</header>
|
|
</>
|
|
);
|
|
}
|