navbar redirect issue
Unanswered
Atlantic herring posted this in #help-forum
Original message was deleted.
7 Replies
Atlantic herring
Atlantic herring
i have a page /OurOffers/[id]
when i click on a tab in the navbar its redirecting me to another page includinf the ourOffers (eg http://localhost:3000/OurOffers/fr/About)
how can i fix this
when i click on a tab in the navbar its redirecting me to another page includinf the ourOffers (eg http://localhost:3000/OurOffers/fr/About)
how can i fix this
Brown bear
""'use client'
import { usePathname } from 'next/navigation'
import Link from 'next/link'
export function Navigation({ navLinks }) {
const pathname = usePathname()
return (
#Unknown Channel
{navLinks.map((link) => {
const isActive = pathname === link.href
return (
<Link
className={isActive ? 'text-blue' : 'text-black'}
href={link.href}
key={link.name}
>
{link.name}
</Link>
)
})}
</>
)
}""
import { usePathname } from 'next/navigation'
import Link from 'next/link'
export function Navigation({ navLinks }) {
const pathname = usePathname()
return (
#Unknown Channel
{navLinks.map((link) => {
const isActive = pathname === link.href
return (
<Link
className={isActive ? 'text-blue' : 'text-black'}
href={link.href}
key={link.name}
>
{link.name}
</Link>
)
})}
</>
)
}""
you can try like this in place of many if else condition just dont render the tab if its not active
just use here link componet why unneccesarry you are using router.push this code can be much simplified and readable and testable
Atlantic herring
you're right
i just let chat gpt do the work lmao