80 lines
2.6 KiB
TypeScript
80 lines
2.6 KiB
TypeScript
"use client";
|
|
|
|
import Image, { StaticImageData } from "next/image";
|
|
import { Link } from "@/shared/config/navigation";
|
|
import { usePathname } from "@/shared/config/navigation";
|
|
import logo from "@/shared/assets/logo.svg";
|
|
import { LINKS } from "@/shared/variables/links";
|
|
import NavLanguage from "./NavLanguage/NavLanguage";
|
|
// import NavAuth from "./NavAuth/NavAuth";
|
|
import menu from "./icons/menu.svg";
|
|
import cross from "./icons/cross.svg";
|
|
import NavMenu from "./NavMenu/NavMenu";
|
|
import { useState } from "react";
|
|
import founded_ru from "./assets/founded-ru.png";
|
|
import founded_en from "./assets/founded-en.png";
|
|
import founded_kg from "./assets/founded-kg.png";
|
|
import { useParams } from "next/navigation";
|
|
import NavAuth from "./NavAuth/NavAuth";
|
|
import { Container } from "@/shared/ui";
|
|
import { useSession } from "next-auth/react";
|
|
|
|
const Navbar = () => {
|
|
const session = useSession();
|
|
const pathname = usePathname();
|
|
const [openMenu, setOpenMenu] = useState<boolean>(false);
|
|
const { locale } = useParams();
|
|
console.log(session);
|
|
const FOUNDED: Record<string, StaticImageData> = {
|
|
ru: founded_ru,
|
|
kg: founded_kg,
|
|
en: founded_en,
|
|
};
|
|
return (
|
|
<header className="bg-white">
|
|
<Container>
|
|
<nav className="mx-auto flex items-center justify-between py-6 mm:px-[20px]">
|
|
<div className="flex items-center gap-[10px]">
|
|
<Link href="/">
|
|
<Image src={logo} alt="Logo" className="navbar__logo-ti" />
|
|
</Link>
|
|
<Image
|
|
className="mt-[30px] h-[120px] w-[120px] inline-block mr-[10px] object-cover"
|
|
src={FOUNDED[locale as string]}
|
|
alt="Founded by EU Image"
|
|
/>
|
|
<NavLanguage />
|
|
</div>
|
|
<nav className="hidden lg:flex lg:justify-between lg:gap-x-4 w-[500px]">
|
|
{LINKS().map((link) => (
|
|
<Link
|
|
className={`text-black opacity-0.5 font-normal${
|
|
pathname === link.pathname ? "opacity-1 font-bold" : ""
|
|
}`}
|
|
key={link.id}
|
|
href={link.pathname}
|
|
>
|
|
{link.pagename}
|
|
</Link>
|
|
))}
|
|
</nav>
|
|
<div className="hidden lg:flex items-center gap-6">
|
|
<NavAuth setOpenMenu={setOpenMenu} />
|
|
</div>
|
|
|
|
<button
|
|
onClick={() => setOpenMenu((prev) => !prev)}
|
|
className="flex lg:hidden"
|
|
>
|
|
<Image src={openMenu ? cross : menu} alt="menu icon" />
|
|
</button>
|
|
|
|
{openMenu && <NavMenu setOpenMenu={setOpenMenu} />}
|
|
</nav>
|
|
</Container>
|
|
</header>
|
|
);
|
|
};
|
|
|
|
export default Navbar;
|