client,server folders

2024-06-14 13:54:55 +05:00
parent e67512bd6d
commit 158f081b5f
649 changed files with 228 additions and 162 deletions
@@ -0,0 +1,45 @@
+import { useEffect, useState } from "react";
+import { isMobile } from "react-device-detect";
+import { useNavigate, useLocation } from "react-router-dom";
+import { Tab } from "../../../types/tab";
+import NavbarDesktop from "./NavbarDesktop";
+import NavbarMobile from "./NavbarMobile";
+import { tabs } from "../../../consts/tabs";
+
+const Navbar = () => {
+  const [selectedTab, setSelectedTab] = useState<Tab | null>(null);
+  const location = useLocation();
+  const navigate = useNavigate();
+
+  const onTabClick = (tab: Tab) => {
+    setSelectedTab(tab);
+    navigate(tab.path);
+  };
+
+  useEffect(() => {
+    const pathname = location.pathname;
+    const tab = tabs.find((tab) => tab.path === pathname);
+    const defaultTab = tabs[0];
+    if (tab) {
+      setSelectedTab(tab);
+    } else {
+      setSelectedTab(defaultTab);
+    }
+  }, [location.pathname]);
+
+  return (
+    <>
+      {isMobile ? (
+        <NavbarMobile onTabClick={onTabClick} tabs={tabs} />
+      ) : (
+        <NavbarDesktop
+          selectedTab={selectedTab}
+          onTabClick={onTabClick}
+          tabs={tabs}
+        />
+      )}
+    </>
+  );
+};
+
+export default Navbar;