"use client";
import Link from "next/link";
import { usePathname } from "next/navigation";
import { useUserStore } from "#/store/auth";
import { usePreferencesStore } from "#/store/preferences";
import {
Dropdown,
Modal,
Button,
DarkThemeToggle,
useThemeMode,
} from "flowbite-react";
import { useState } from "react";
export const Navbar = () => {
const pathname = usePathname();
const userStore: any = useUserStore((state) => state);
const [isSettingModalOpen, setIsSettingModalOpen] = useState(false);
const navLinks = [
{
id: 1,
icon: "material-symbols--home-outline",
iconActive: "material-symbols--home",
title: "Домашняя",
href: "/",
withAuthOnly: false,
mobileMenu: false,
},
{
id: 2,
icon: "material-symbols--search",
iconActive: "material-symbols--search",
title: "Поиск",
href: "/search",
withAuthOnly: false,
mobileMenu: false,
},
{
id: 3,
icon: "material-symbols--bookmarks-outline",
iconActive: "material-symbols--bookmarks",
title: "Закладки",
href: "/bookmarks",
withAuthOnly: true,
mobileMenu: false,
},
{
id: 4,
icon: "material-symbols--favorite-outline",
iconActive: "material-symbols--favorite",
title: "Избранное",
href: "/favorites",
withAuthOnly: true,
mobileMenu: true,
},
{
id: 5,
icon: "material-symbols--history",
iconActive: "material-symbols--history",
title: "История",
href: "/history",
withAuthOnly: true,
mobileMenu: true,
},
];
return (
<>
{userStore.isAuth ? (
Профиль
{navLinks.map((link) => {
return (
{link.title}
);
})}
{
setIsSettingModalOpen(true);
}}
className="flex items-center gap-1 text-sm md:text-base"
>
Настройки
{
userStore.logout();
}}
className="flex items-center gap-1 text-sm md:text-base"
>
Выйти
) : (
Войти
{
setIsSettingModalOpen(true);
}}
className="flex items-center gap-1 text-sm md:text-base"
>
Настройки
)}
>
);
};
const SettingsModal = (props: { isOpen: boolean; setIsOpen: any }) => {
const preferenceStore = usePreferencesStore();
const { computedMode, setMode } = useThemeMode();
return (
props.setIsOpen(false)}
>
Настройки
Тема
);
};