app/App.tsx

@@ -1,7 +1,7 @@
 "use client";
 import { useUserStore } from "./store/auth";
 import { usePreferencesStore } from "./store/preferences";
-import { Navbar } from "./components/Navbar/NavbarUpdate";
+import { Navbar } from "./components/Navbar/Navbar";
 import { Inter } from "next/font/google";
 import { useEffect, useState } from "react";
 import { Button, Modal } from "flowbite-react";

app/components/Navbar/NavbarUpdate.tsx

@@ -1,190 +0,0 @@
-"use client";
-
-import Link from "next/link";
-import Image from "next/image";
-import { useUserStore } from "#/store/auth";
-import { usePathname } from "next/navigation";
-import { useState } from "react";
-import { SettingsModal } from "#/components/SettingsModal/SettingsModal";
-import { usePreferencesStore } from "#/store/preferences";
-
-export const Navbar = () => {
-  const pathname = usePathname();
-  const userStore = useUserStore();
-  const [isSettingModalOpen, setIsSettingModalOpen] = useState(false);
-  const preferenceStore = usePreferencesStore();
-
-  const menuItems = [
-    {
-      id: 1,
-      title: "Домашняя",
-      href: "/",
-      hrefInCategory: "/home",
-      icon: {
-        default: "material-symbols--home-outline",
-        active: "material-symbols--home",
-      },
-      isAuthRequired: false,
-      isShownOnMobile: true,
-    },
-    {
-      id: 2,
-      title: "Поиск",
-      href: "/search",
-      icon: {
-        default: "material-symbols--search",
-        active: "material-symbols--search",
-      },
-      isAuthRequired: false,
-      isShownOnMobile: true,
-    },
-    {
-      id: 3,
-      title: "Закладки",
-      href: "/bookmarks",
-      icon: {
-        default: "material-symbols--bookmarks-outline",
-        active: "material-symbols--bookmarks",
-      },
-      isAuthRequired: true,
-      isShownOnMobile: true,
-    },
-    {
-      id: 4,
-      title: "Избранное",
-      href: "/favorites",
-      icon: {
-        default: "material-symbols--favorite-outline",
-        active: "material-symbols--favorite",
-      },
-      isAuthRequired: true,
-      isShownOnMobile: false,
-    },
-    {
-      id: 5,
-      title: "Коллекции",
-      href: "/collections",
-      icon: {
-        default: "material-symbols--collections-bookmark-outline",
-        active: "material-symbols--collections-bookmark",
-      },
-      isAuthRequired: true,
-      isShownOnMobile: false,
-    },
-    {
-      id: 6,
-      title: "История",
-      href: "/history",
-      icon: {
-        default: "material-symbols--history",
-        active: "material-symbols--history",
-      },
-      isAuthRequired: true,
-      isShownOnMobile: false,
-    },
-  ];
-
-  return (
-    <>
-      <header className="fixed bottom-0 left-0 z-50 w-full text-white bg-black rounded-t-lg sm:sticky sm:top-0 sm:rounded-t-none sm:rounded-b-lg">
-        <div className="container flex items-center justify-center mx-auto sm:justify-between">
-          <div className="flex items-center gap-4 px-2 py-4">
-            {menuItems.map((item) => {
-              return (
-                <Link
-                  href={item.href}
-                  key={`navbar__${item.id}`}
-                  className={`flex-col items-center justify-center gap-1 lg:flex-row ${
-                    item.isAuthRequired && !userStore.isAuth ? "hidden"
-                    : item.isShownOnMobile ? "flex"
-                    : "hidden sm:flex"
-                  } ${[item.href, item.hrefInCategory].includes("/" + pathname.split("/")[1]) ? "font-bold" : "font-medium"}`}
-                >
-                  <span
-                    className={`w-6 h-6 iconify ${[item.href, item.hrefInCategory].includes("/" + pathname.split("/")[1]) ? item.icon.active : item.icon.default}`}
-                  ></span>
-                  <span
-                    className={`text-xs sm:text-base ${preferenceStore.flags.showNavbarTitles == "always" || preferenceStore.flags.showNavbarTitles == "links" || (preferenceStore.flags.showNavbarTitles == "selected" && [item.href, item.hrefInCategory].includes("/" + pathname.split("/")[1])) ? "block" : "hidden"}`}
-                  >
-                    {item.title}
-                  </span>
-                </Link>
-              );
-            })}
-          </div>
-          <div className="flex items-center gap-4 px-2 py-4">
-            {!userStore.isAuth ?
-              <Link
-                href={
-                  pathname != "/login" ? `/login?redirect=${pathname}` : "#"
-                }
-                className={`flex items-center flex-col lg:flex-row gap-1 ${pathname == "/login" ? "font-bold" : "font-medium"}`}
-              >
-                <span className="w-6 h-6 iconify material-symbols--login"></span>
-                <span
-                  className={`text-xs sm:text-base ${preferenceStore.flags.showNavbarTitles == "always" || (preferenceStore.flags.showNavbarTitles == "selected" && pathname == "/login") ? "block" : "hidden"}`}
-                >
-                  Войти
-                </span>
-              </Link>
-            : <>
-                <Link
-                  href={`/profile/${userStore.user.id}`}
-                  className={`hidden lg:flex flex-col lg:flex-row items-center gap-1 ${pathname == `/profile/${userStore.user.id}` ? "font-bold" : "font-medium"}`}
-                >
-                  <Image
-                    src={userStore.user.avatar}
-                    alt=""
-                    className="w-6 h-6 rounded-full"
-                    width={24}
-                    height={24}
-                  />
-                  <span className={`text-xs sm:text-base ${preferenceStore.flags.showNavbarTitles == "always" || preferenceStore.flags.showNavbarTitles == "links" || (preferenceStore.flags.showNavbarTitles == "selected" && pathname == `/profile/${userStore.user.id}`) ? "block" : "hidden"}`}>
-                    {userStore.user.login}
-                  </span>
-                </Link>
-                <Link
-                  href={`/menu`}
-                  className={`flex flex-col lg:hidden items-center gap-1 ${pathname == `/menu` || pathname == `/profile/${userStore.user.id}` ? "font-bold" : "font-medium"}`}
-                >
-                  <Image
-                    src={userStore.user.avatar}
-                    alt=""
-                    className="w-6 h-6 rounded-full"
-                    width={24}
-                    height={24}
-                  />
-                  <span className={`text-xs sm:text-base ${preferenceStore.flags.showNavbarTitles == "always" || preferenceStore.flags.showNavbarTitles == "links" || (preferenceStore.flags.showNavbarTitles == "selected" && (pathname == `/menu` || pathname == `/profile/${userStore.user.id}`)) ? "block" : "hidden"}`}>
-                    {userStore.user.login}
-                  </span>
-                </Link>
-              </>
-            }
-            <button
-              className={`${userStore.isAuth ? "hidden lg:flex" : "flex"} flex-col items-center gap-1 lg:flex-row`}
-              onClick={() => setIsSettingModalOpen(true)}
-            >
-              <span className="w-6 h-6 iconify material-symbols--settings-outline-rounded"></span>
-              <span className={`text-xs sm:text-base ${preferenceStore.flags.showNavbarTitles == "always" ? "block" : "hidden"}`}>Настройки</span>
-            </button>
-            {userStore.isAuth && (
-              <button
-                className="flex-col items-center hidden gap-1 lg:flex-row lg:flex"
-                onClick={() => userStore.logout()}
-              >
-                <span className="w-6 h-6 iconify material-symbols--logout"></span>
-                <span className={`text-xs sm:text-base ${preferenceStore.flags.showNavbarTitles == "always" ? "lg:hidden xl:block" : "hidden"}`}>
-                  Выйти
-                </span>
-              </button>
-            )}
-          </div>
-        </div>
-      </header>
-      <SettingsModal
-        isOpen={isSettingModalOpen}
-        setIsOpen={setIsSettingModalOpen}
-      />
-    </>
-  );
-};

app/components/SettingsModal/SettingsModal.tsx

@@ -27,13 +27,6 @@ const BookmarksCategory = {
   abandoned: "Заброшено",
 };
 
-const NavbarTitles = {
-  always: "Всегда",
-  links: "Только ссылки",
-  selected: "Только выбранные",
-  never: "Никогда",
-}
-
 export const SettingsModal = (props: { isOpen: boolean; setIsOpen: any }) => {
   const preferenceStore = usePreferencesStore();
 
@@ -96,7 +89,7 @@ export const SettingsModal = (props: { isOpen: boolean; setIsOpen: any }) => {
               checked={preferenceStore.params.skipToCategory.enabled}
             />
           </div>
-          {preferenceStore.params.skipToCategory.enabled ?
+          {preferenceStore.params.skipToCategory.enabled ? (
             <>
               <div className="flex items-center justify-between">
                 <p className=" dark:text-white max-w-96">
@@ -161,33 +154,9 @@ export const SettingsModal = (props: { isOpen: boolean; setIsOpen: any }) => {
                 </Dropdown>
               </div>
             </>
-          : ""}
+          ) : (
-          <div className="flex items-center justify-between">
+            ""
-            <p className=" dark:text-white max-w-96">
+          )}
-              Показывать название пункта в навигации
-            </p>
-            <Dropdown
-              color="blue"
-              label={
-                NavbarTitles[preferenceStore.flags.showNavbarTitles]
-              }
-            >
-              {Object.keys(NavbarTitles).map((key: "always" | "links" | "selected" | "never") => {
-                return (
-                  <Dropdown.Item
-                    key={`navbar-titles-${key}`}
-                    onClick={() =>
-                      preferenceStore.setFlags({
-                        showNavbarTitles: key,
-                      })
-                    }
-                  >
-                    {NavbarTitles[key]}
-                  </Dropdown.Item>
-                );
-              })}
-            </Dropdown>
-          </div>
           <HR className="my-4 dark:bg-slate-400" />
           <div className="flex items-center gap-2">
             <span className="w-6 h-6 iconify material-symbols--settings-outline"></span>

app/pages/MobileMenuPage.tsx

@@ -81,7 +81,7 @@ export const MenuPage = () => {
               </button>
             </div>
           </div>
-          <Link href="/favorites" className="flex-1 sm:hidden">
+          <Link href="/favorites" className="flex-1">
             <Card>
               <div className="flex items-center gap-2">
                 <span
@@ -91,7 +91,7 @@ export const MenuPage = () => {
               </div>
             </Card>
           </Link>
-          <Link href="/collections" className="flex-1 sm:hidden">
+          <Link href="/collections" className="flex-1">
             <Card>
               <div className="flex items-center gap-2">
                 <span
@@ -101,7 +101,7 @@ export const MenuPage = () => {
               </div>
             </Card>
           </Link>
-          <Link href="/history" className="flex-1 sm:hidden">
+          <Link href="/history" className="flex-1">
             <Card>
               <div className="flex items-center gap-2">
                 <span

app/store/preferences.ts

@@ -10,7 +10,6 @@ interface preferencesState {
     saveWatchHistory?: boolean;
     showChangelog?: boolean;
     enableAnalytics?: boolean;
-    showNavbarTitles?: "always" | "links" | "selected" | "never";
   };
   params: {
     isFirstLaunch?: boolean;
@@ -43,7 +42,6 @@ export const usePreferencesStore = create<preferencesState>()(
         saveWatchHistory: true,
         showChangelog: true,
         enableAnalytics: true,
-        showNavbarTitles: "always",
       },
       params: {
         isFirstLaunch: true,