diff --git a/components/layout/navbar.tsx b/components/layout/navbar.tsx
index 79e766f..6e7d6f6 100644
--- a/components/layout/navbar.tsx
+++ b/components/layout/navbar.tsx
@@ -12,6 +12,10 @@ import {
DropdownMenuItem,
DropdownMenuTrigger,
} from "../ui/dropdown-menu";
+import { useQuery } from "@tanstack/react-query";
+import httpClient from "@/request/api";
+import { endPoints } from "@/request/links";
+import { NavbarItem } from "@/lib/types";
export function Navbar() {
const locale = useLocale();
@@ -19,6 +23,18 @@ export function Navbar() {
const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
const [scrolled, setScrolled] = useState(false);
+ const { data: navbarItems } = useQuery({
+ queryKey: ["navbaritem"],
+ queryFn: () => httpClient(endPoints.navbar),
+ select: (data: any) => ({
+ results: data?.data?.data?.results,
+ total_items: data?.data?.data?.total_items,
+ total_pages: data?.data?.data?.total_pages,
+ }),
+ });
+
+ console.log({ navbarItems });
+
const tabs = [
{ name: t("navbar.about"), value: "" },
{ name: t("about.subPages.baza"), value: "baza" },
@@ -76,61 +92,44 @@ export function Navbar() {
{/* Desktop Navigation Menu */}
-
- {t("navbar.home")}
-
-
-
-
- {t("navbar.about")}
-
-
-
-
- {tabs.map((tab) => (
-
+ {navbarItems?.results ? (
+ navbarItems.results.map((item: NavbarItem) => (
+
+
- {tab.name}
+ {item.name}
+ {item.children.length > 0 && (
+
+ )}
-
- ))}
-
-
-
-
- {locale === "ru" ? "ЧЗВ" : "FAQ"}
-
-
- {t("navbar.services")}
-
-
-
- {t("navbar.products")}
-
-
- {t("navbar.contact")}
-
+
+ {item.children.length > 0 && (
+
+ {item.children.map((child: NavbarItem) => (
+
+ {child.name}
+
+ ))}
+
+ )}
+
+ ))
+ ) : (
+
+ {t("navbar.home")}
+
+ )}
@@ -207,67 +206,44 @@ export function Navbar() {
{/* Mobile Menu Links */}
- setIsMobileMenuOpen(false)}
- >
- {t("navbar.home")}
-
-
-
-
- {t("navbar.about")}
-
-
-
-
- {tabs.map((tab) => (
-
+ {navbarItems?.results ? (
+ navbarItems.results.map((item: NavbarItem) => (
+
+
- {tab.name}
+ {item.name}
+ {item.children.length > 0 && (
+
+ )}
-
- ))}
-
-
-
- {/* Mobile Pages Dropdown */}
- setIsMobileMenuOpen(false)}
- >
- {locale === "ru" ? "ЧЗВ" : "FAQ"}
-
- setIsMobileMenuOpen(false)}
- >
- {t("navbar.services")}
-
-
- setIsMobileMenuOpen(false)}
- >
- {t("navbar.products")}
-
- setIsMobileMenuOpen(false)}
- >
- {t("navbar.contact")}
-
+
+ {item.children.length > 0 && (
+
+ {item.children.map((child: NavbarItem) => (
+
+ {child.name}
+
+ ))}
+
+ )}
+
+ ))
+ ) : (
+
+ {t("navbar.home")}
+
+ )}
>
diff --git a/lib/types.ts b/lib/types.ts
index 5c72c1f..1a4b74d 100644
--- a/lib/types.ts
+++ b/lib/types.ts
@@ -38,3 +38,12 @@ export interface ProductDetail {
features: string[];
images: ProductImage[];
}
+
+export interface NavbarItem {
+ id: number;
+ name: string;
+ url: string;
+ order: number;
+ open_in_new_tab: boolean;
+ children: NavbarItem[];
+}
diff --git a/request/links.ts b/request/links.ts
index 7a23b1b..17c0554 100644
--- a/request/links.ts
+++ b/request/links.ts
@@ -35,6 +35,8 @@ export const endPoints = {
gallery: "gallery/?page_size=500",
contact: "contact/",
statistics: "statistics/",
+ banner: "banner/",
+ navbar:"navigationitem/?page_size=500",
filter: {
size: "size/",
sizePageItems: "size/?page_size=500",