63 lines
1.8 KiB
TypeScript
63 lines
1.8 KiB
TypeScript
'use client';
|
|
import { Link } from '@/shared/config/i18n/navigation';
|
|
import { Button } from '@/shared/ui/button';
|
|
import { useUserLogin } from '@/shared/zustand/userLogin';
|
|
import {
|
|
NavigationMenuContent,
|
|
NavigationMenuItem,
|
|
NavigationMenuLink,
|
|
NavigationMenuTrigger,
|
|
} from '@/shared/ui/navigation-menu';
|
|
import SubMenuLink from './SubMenuLink';
|
|
import { ChangeLang } from './ChangeLang';
|
|
import { useLoginModal, useRegisterModal } from '@/shared/zustand/auth';
|
|
|
|
function AuthButtons() {
|
|
const auth = {
|
|
login: { title: 'Login', url: '#' },
|
|
signup: { title: 'Sign up', url: '#' },
|
|
};
|
|
|
|
const userItem = [
|
|
{ title: 'Profile', url: '/profile' },
|
|
{ title: 'Logout', url: '#' },
|
|
];
|
|
|
|
const toggleLoginModal = useLoginModal((state) => state.toggleLoginModal);
|
|
const toggleRegisterModal = useRegisterModal(
|
|
(state) => state.toggleRegisterModal,
|
|
);
|
|
const user = useUserLogin((state) => state.user);
|
|
|
|
if (user) {
|
|
return (
|
|
<NavigationMenuItem>
|
|
<NavigationMenuTrigger>{user.name}</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>
|
|
);
|
|
}
|
|
|
|
return (
|
|
<div className="flex lg:flex-row flex-col gap-3">
|
|
<div className="lg: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 };
|