103 lines
2.7 KiB
JavaScript
103 lines
2.7 KiB
JavaScript
"use client";
|
|
import {
|
|
blogPages,
|
|
homepages,
|
|
otherPages,
|
|
servicePages,
|
|
shopPages,
|
|
} from "@/data/menu";
|
|
import Image from "next/image";
|
|
import Link from "next/link";
|
|
import { usePathname } from "next/navigation";
|
|
import React from "react";
|
|
|
|
export default function Nav() {
|
|
const pathname = usePathname();
|
|
const isActive = (link) => link.split("/")[1] == pathname.split("/")[1];
|
|
const isActiveParent = (links) => links.some((link) => isActive(link.href));
|
|
return (
|
|
<>
|
|
{" "}
|
|
<li
|
|
className={`has-child ${
|
|
isActiveParent(homepages) ? "current-menu" : ""
|
|
} `}
|
|
>
|
|
<a href="#">Services</a>
|
|
<ul className="submenu">
|
|
{otherPages.map((item) => (
|
|
<li
|
|
key={item.href}
|
|
className={`menu-item ${
|
|
isActive(item.href) ? "current-menu-item" : ""
|
|
}`}
|
|
>
|
|
<Link href={item.href}>{item.label}</Link>
|
|
</li>
|
|
))}
|
|
</ul>
|
|
</li>
|
|
<li
|
|
className={`has-child position-relative ${
|
|
isActiveParent(servicePages) ? "current-menu" : ""
|
|
} `}
|
|
>
|
|
<a href="#">Serivce</a>
|
|
{/* <ul className="submenu">
|
|
{servicePages.map((item) => (
|
|
<li
|
|
key={item.href}
|
|
className={`menu-item ${
|
|
isActive(item.href) ? "current-menu-item" : ""
|
|
}`}
|
|
>
|
|
<Link href={item.href}>{item.label}</Link>
|
|
</li>
|
|
))}
|
|
</ul> */}
|
|
</li>
|
|
<li
|
|
className={`has-child position-relative ${
|
|
isActiveParent(blogPages) ? "current-menu" : ""
|
|
} `}
|
|
>
|
|
<a href="#">Blog</a>
|
|
{/* <ul className="submenu">
|
|
{blogPages.map((item) => (
|
|
<li
|
|
key={item.href}
|
|
className={`menu-item ${
|
|
isActive(item.href) ? "current-menu-item" : ""
|
|
}`}
|
|
>
|
|
<Link href={item.href}>{item.label}</Link>
|
|
</li>
|
|
))}
|
|
</ul> */}
|
|
</li>
|
|
<li className={` ${isActive("/contact-us") ? "current-menu" : ""} `}>
|
|
<Link href={`/contact-us`}>Contact</Link>
|
|
</li>
|
|
<li
|
|
className={`has-child position-relative ${
|
|
isActiveParent(shopPages) ? "current-menu" : ""
|
|
} `}
|
|
>
|
|
<a href="#">Shop</a>
|
|
{/* <ul className="submenu">
|
|
{shopPages.map((item) => (
|
|
<li
|
|
key={item.href}
|
|
className={`menu-item ${
|
|
isActive(item.href) ? "current-menu-item" : ""
|
|
}`}
|
|
>
|
|
<Link href={item.href}>{item.label}</Link>
|
|
</li>
|
|
))}
|
|
</ul> */}
|
|
</li>
|
|
</>
|
|
);
|
|
}
|