Files
web/components/TempDesignSystem/Link/index.tsx
2024-07-15 13:35:36 +02:00

58 lines
1.1 KiB
TypeScript

"use client"
import NextLink from "next/link"
import { usePathname } from "next/navigation"
import { useEffect } from "react"
import { linkVariants } from "./variants"
import type { LinkProps } from "./link"
export default function Link({
className,
color,
href,
partialMatch = false,
textDecoration,
size,
scroll = true,
prefetch,
variant,
trackingId,
...props
}: LinkProps) {
const currentPageSlug = usePathname()
let isActive = currentPageSlug === href
if (partialMatch && !isActive) {
isActive = currentPageSlug === href
}
const classNames = linkVariants({
active: isActive,
className,
textDecoration,
color,
size,
variant,
})
useEffect(() => {
if (trackingId) {
document.getElementById(trackingId)?.addEventListener("click", () => {})
return () => {
document
.getElementById(trackingId)
?.removeEventListener("click", () => {})
}
}
}, [trackingId])
return (
<NextLink
scroll={scroll}
prefetch={prefetch}
className={classNames}
href={href}
{...props}
/>
)
}