78 lines
2.4 KiB
TypeScript
78 lines
2.4 KiB
TypeScript
'use client';
|
|
import { Link } from '@/shared/config/i18n/navigation';
|
|
import { Button } from '@/shared/ui/button';
|
|
import {
|
|
NavigationMenu,
|
|
NavigationMenuContent,
|
|
NavigationMenuItem,
|
|
NavigationMenuLink,
|
|
NavigationMenuTrigger,
|
|
} from '@/shared/ui/navigation-menu';
|
|
import SubMenuLink from './SubMenuLink';
|
|
import { ChangeLang } from './ChangeLang';
|
|
import { useLoginModal, useRegisterModal } from '@/shared/zustand/auth';
|
|
import { useTranslations } from 'next-intl';
|
|
import { useUserPlagiatStore } from '@/shared/zustand/user';
|
|
|
|
function AuthButtons() {
|
|
const t = useTranslations('Navbar');
|
|
|
|
const auth = {
|
|
login: { title: t('login'), url: '#' },
|
|
signup: { title: t('signup'), url: '#' },
|
|
};
|
|
|
|
const userItem = [{ title: t('logout'), url: '#' }];
|
|
|
|
const toggleLoginModal = useLoginModal((state) => state.toggleLoginModal);
|
|
const toggleRegisterModal = useRegisterModal(
|
|
(state) => state.toggleRegisterModal,
|
|
);
|
|
const user = useUserPlagiatStore((state) => state.user);
|
|
console.log('Current user:', user);
|
|
|
|
if (user) {
|
|
return (
|
|
<div className="flex flex-row max-sm:items-center max-sm:justify-around gap-3">
|
|
<div className="sm:flex hidden">
|
|
<ChangeLang />
|
|
</div>
|
|
<NavigationMenu>
|
|
<NavigationMenuItem>
|
|
<NavigationMenuTrigger className="text-xl">
|
|
{user.name} {user.surname}
|
|
</NavigationMenuTrigger>
|
|
<NavigationMenuContent className="bg-popover text-popover-foreground">
|
|
{userItem.map((subItem) => (
|
|
<NavigationMenuLink
|
|
asChild
|
|
key={subItem.title}
|
|
className="w-80"
|
|
>
|
|
<SubMenuLink item={subItem} />
|
|
</NavigationMenuLink>
|
|
))}
|
|
</NavigationMenuContent>
|
|
</NavigationMenuItem>
|
|
</NavigationMenu>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="flex flex-row max-sm:items-center max-sm:justify-around gap-3">
|
|
<div className="sm:flex hidden">
|
|
<ChangeLang />
|
|
</div>
|
|
<Button variant="outline" onClick={() => toggleLoginModal()}>
|
|
<Link href={auth.login.url}>{auth.login.title}</Link>
|
|
</Button>
|
|
<Button onClick={() => toggleRegisterModal()}>
|
|
<Link href={auth.signup.url}>{auth.signup.title}</Link>
|
|
</Button>
|
|
</div>
|
|
);
|
|
}
|
|
|
|
export { AuthButtons };
|