60 lines
1.9 KiB
TypeScript
60 lines
1.9 KiB
TypeScript
"use client";
|
|
|
|
import React from "react";
|
|
import Link from "next/link";
|
|
import clsx from "clsx";
|
|
import { usePathname } from "next/navigation";
|
|
|
|
import { sidebarData } from "@/lib/database/pathnames";
|
|
import { useAppSelector } from "@/redux/hooks";
|
|
|
|
export const Sidebar = () => {
|
|
const pathname = usePathname();
|
|
|
|
const lang = useAppSelector(
|
|
(state) => state.headerSlice.activeLang.localization
|
|
);
|
|
|
|
return (
|
|
<div className="flex flex-col bg-white rounded-lg px-6 py-4 items-start gap-y-[12px] pb-5 mt-12 sticky top-0 left-0 overflow-hidden">
|
|
{sidebarData
|
|
.filter(
|
|
(obj) =>
|
|
(pathname === "/company/aboutus" && obj.company) ||
|
|
(pathname.includes("/members") && obj.members) ||
|
|
(pathname.includes("/news") && obj.news) ||
|
|
(pathname.includes("/visitors") && obj.visitors) ||
|
|
(pathname.includes("/services") && obj.services)
|
|
)
|
|
.map((item, i) => (
|
|
<div key={i}>
|
|
<p
|
|
className={clsx("mb-[16px] text-[16px] font-bold leading-[1.5]")}
|
|
>
|
|
{lang === "ru" ? item.pathname : item.pathnameEn}
|
|
</p>
|
|
<div className="flex flex-col items-start gap-y-[8px]">
|
|
<div className="flex flex-col gap-[10px] pl-4 pr-10">
|
|
{item.info.map((obj, i) => (
|
|
<Link
|
|
href={obj.link}
|
|
className={clsx(
|
|
"cursor-pointer py-1 leading-[130%] transition-all hover:opacity-80",
|
|
{
|
|
"hover:text-PRIMARY text-PRIMARY hover:cursor-default":
|
|
obj.link === pathname,
|
|
}
|
|
)}
|
|
key={i}
|
|
>
|
|
{lang === "ru" ? obj.title : obj.titleEn}
|
|
</Link>
|
|
))}
|
|
</div>
|
|
</div>
|
|
</div>
|
|
))}
|
|
</div>
|
|
);
|
|
};
|