forked from Transparency/kgroad-frontend2
76 lines
2.1 KiB
TypeScript
76 lines
2.1 KiB
TypeScript
"use client";
|
|
|
|
import "./Navbar.scss";
|
|
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";
|
|
|
|
const Navbar = () => {
|
|
const pathname = usePathname();
|
|
const [openMenu, setOpenMenu] = useState<boolean>(false);
|
|
const { locale } = useParams();
|
|
|
|
const FOUNDED: Record<string, StaticImageData> = {
|
|
ru: founded_ru,
|
|
kg: founded_kg,
|
|
en: founded_en,
|
|
};
|
|
|
|
return (
|
|
<section className="navbar">
|
|
<div className="navbar__logo">
|
|
<Link href="/">
|
|
<Image src={logo} alt="Logo" className="navbar__logo-ti" />
|
|
</Link>
|
|
<Image
|
|
className="navbar__logo_last"
|
|
src={FOUNDED[locale as string]}
|
|
alt="Founded by EU Image"
|
|
/>
|
|
<NavLanguage />
|
|
</div>
|
|
|
|
<nav className="navbar__links">
|
|
{LINKS().map((link) => (
|
|
<Link
|
|
className={`navbar__link${
|
|
pathname === link.pathname ? "_active" : ""
|
|
}`}
|
|
key={link.id}
|
|
href={link.pathname}
|
|
>
|
|
{link.pagename}
|
|
</Link>
|
|
))}
|
|
</nav>
|
|
|
|
<div className="navbar__lang-and-auth">
|
|
<NavAuth setOpenMenu={setOpenMenu} />
|
|
</div>
|
|
|
|
<button
|
|
onClick={() => setOpenMenu((prev) => !prev)}
|
|
className="navbar__menu"
|
|
>
|
|
<Image src={openMenu ? cross : menu} alt="menu icon" />
|
|
</button>
|
|
|
|
{openMenu && <NavMenu setOpenMenu={setOpenMenu} />}
|
|
</section>
|
|
);
|
|
};
|
|
|
|
export default Navbar;
|