136 lines
6.3 KiB
JavaScript

import Link from "next/link"
// import { useRouter } from "next/router"
import Rehabilitation from "@/utils/Rehabilitation.utils"
import Accident from "@/utils/Accident.utils"
import { areaOfInjuryData } from "@/utils/AreaOfInjery.utils"
import { servicesList } from "@/utils/Services.utils"
export default function Menu() {
// const router = useRouter()
return (
<>
{/* <ul className="sub-menu">
<Link className={router.pathname == "/" ? "active" : ""}>Home Default</Link>
<Link className={router.pathname == "/index-2" ? "active" : ""}>Home Interior</Link>
</ul> */}
<ul className="navigation new-nav clearfix">
<li className="dropdown"><Link href="/">Home</Link>
{/* <ul>
<li><Link href="/">Home Page One</Link></li>
<li><Link href="/index-2">Home Page Two</Link></li>
<li><Link href="/index-3">Home Page Three</Link></li>
<li><Link href="/onepage">OnePage Home</Link></li>
</ul> */}
</li>
<li className="dropdown menu-item-has-children"><Link href="/about-us">About Us</Link>
<ul>
<li><Link href="/our-team-physiotherapy-etobicoke">Our Team</Link></li>
<li><Link href="/ourapproach-physiotherapy-etobicoke">Our Approach</Link></li>
<li><Link href="/gallery-physiotherapy-etobicoke">Gallery</Link></li>
<li><Link href="/covid-19-updates">Covid-19-Updates</Link></li>
</ul>
</li>
<li className="dropdown menu-item-has-children relative group">
<Link href="/etobicoke-treatment-service">Services</Link>
{/* Dropdown */}
<ul className="absolute left-0 hidden group-hover:grid p-4
grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"
style={{ columnCount: 4, width: "100%", left: "0px" }}>
{servicesList.map((item) => (
<li key={item.id} className="break-inside-avoid">
<Link href={`/etobicoke-treatment-service/${item.slug}`}>
{item.shortTitle}
</Link>
</li>
))}
</ul>
</li>
{/* <li className="dropdown"><Link href="/">Team</Link>
<ul>
<li><Link href="/team">Our Team</Link></li>
<li><Link href="/team-details">Team Details</Link></li>
</ul>
</li> */}
{/* Pages */}
{/* <li className="dropdown"><Link href="/">Pages</Link>
<ul>
<li className="dropdown"><Link href="/">Blog</Link>
<ul>
<li><Link href="/blog">Blog Grid</Link></li>
<li><Link href="/blog-2">Blog Sidebar</Link></li>
<li><Link href="/blog-details">Blog Details</Link></li>
</ul>
</li>
<li><Link href="/tesmonial">Tesmonial</Link></li>
<li><Link href="/works">How it works</Link></li>
<li><Link href="/chooseus">Why Choose Us</Link></li>
<li><Link href="/pricing-table">Pricing-Table</Link></li>
<li><Link href="/faq">Faq's</Link></li>
<li><Link href="/gallery">Gallery</Link></li>
<li><Link href="/appointment">Make Appointment</Link></li>
<li><Link href="/error-page">Page Not Found</Link></li>
</ul>
</li> */}
<li className="dropdown menu-item-has-children"><Link href="/area-of-injury">Area of Injury</Link>
<ul>
{areaOfInjuryData.map(item => (
<li key={item.id}>
<Link href={`/area-of-injury/${item.slug}`}>
{item.title}
</Link>
</li>
))}
</ul>
{/* <ul className="absolute left-0 hidden group-hover:grid p-4
grid-cols-1 sm:grid-cols-2 md:grid-cols-3 lg:grid-cols-4 gap-4"
style={{ columnCount: 2, width: "50%", left: "480px" }}>
{areaOfInjuryData.map((item) => (
<li key={item.id} className="break-inside-avoid">
<Link href={`/area-of-injury/${item.slug}`}>
{item.title}
</Link>
</li>
))}
</ul> */}
</li>
<li className="dropdown menu-item-has-children"><Link href="/rehabilitation">Rehabilitation</Link>
<ul>
{Rehabilitation.map(item => (
<li key={item.id}>
<Link href={`/rehabilitation/${item.slug}`}>
{item.title}
</Link>
</li>
))}
</ul>
</li>
<li className="dropdown menu-item-has-children"><Link href="/accident">Accident</Link>
<ul>
{Accident.map(item => (
<li key={item.id}>
<Link href={`/accident/${item.slug}`}>
{item.title}
</Link>
</li>
))}
</ul>
</li>
<li><Link href="/blog">Blog</Link></li>
{/* Contact */}
<li><Link href="/contact">Contact</Link></li>
</ul>
</>
)
}