68 lines
2.3 KiB
JavaScript
68 lines
2.3 KiB
JavaScript
"use client";
|
|
import Link from "next/link";
|
|
import { usePathname } from "next/navigation";
|
|
export default function Menu() {
|
|
const pathname = usePathname();
|
|
const isActive = (path) => path === pathname;
|
|
const isHomeLinkActive = () => {
|
|
return homeLinks.some((link) => link.path === pathname) ? 1 : 0;
|
|
};
|
|
const isAboutLinkActive = () => {
|
|
return aboutLinks.some((link) => link.path === pathname) ? 1 : 0;
|
|
};
|
|
const isServicesLinkActive = () => {
|
|
return servicesLinks.some((link) => link.path === pathname) ? 1 : 0;
|
|
};
|
|
const isPagesLinkActive = () => {
|
|
return pagesLinks.some((link) => link.path === pathname) ? 1 : 0;
|
|
};
|
|
const isBlogLinkActive = () => {
|
|
return blogLinks.some((link) => link.path === pathname) ? 1 : 0;
|
|
};
|
|
|
|
return (
|
|
<>
|
|
<ul className="navigation">
|
|
<li>
|
|
<Link href="/" className={isActive("/") ? "active" : ""}>
|
|
home
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/about" className={isActive("/about") ? "active" : ""}>
|
|
about
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/services" className={isActive("/services") ? "active" : ""}>
|
|
services
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/portfolio" className={isActive("/portfolio") ? "active" : ""}>
|
|
portfolio
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/team" className={isActive("/team") ? "active" : ""}>
|
|
our team
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/#seocheck">SEO checker</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/blog" className={isActive("/blog") ? "active" : ""}>
|
|
blog
|
|
</Link>
|
|
</li>
|
|
<li>
|
|
<Link href="/contact" className={isActive("/contact") ? "active" : ""}>
|
|
contact us
|
|
</Link>
|
|
</li>
|
|
</ul>
|
|
</>
|
|
);
|
|
}
|