70 lines
1.4 KiB
TypeScript
70 lines
1.4 KiB
TypeScript
"use client"
|
|
|
|
import Link from "next/link"
|
|
import { usePathname } from "next/navigation"
|
|
import { type ComponentProps, type PropsWithChildren, useMemo } from "react"
|
|
|
|
import { trackClick } from "@/utils/tracking"
|
|
|
|
import { variants } from "./variants"
|
|
|
|
import type { VariantProps } from "class-variance-authority"
|
|
|
|
export interface ButtonLinkProps
|
|
extends PropsWithChildren,
|
|
Omit<ComponentProps<typeof Link>, "color">,
|
|
VariantProps<typeof variants> {
|
|
trackingId?: string
|
|
trackingParams?: Record<string, string>
|
|
appendToCurrentPath?: boolean
|
|
}
|
|
|
|
export default function ButtonLink({
|
|
variant,
|
|
color,
|
|
size,
|
|
typography,
|
|
className,
|
|
href,
|
|
target,
|
|
onClick = () => {},
|
|
trackingId,
|
|
trackingParams,
|
|
appendToCurrentPath,
|
|
...props
|
|
}: ButtonLinkProps) {
|
|
const currentPageSlug = usePathname()
|
|
const classNames = variants({
|
|
variant,
|
|
color,
|
|
size,
|
|
|
|
typography,
|
|
className,
|
|
})
|
|
|
|
const fullUrl = useMemo(() => {
|
|
let newPath = href
|
|
if (appendToCurrentPath) {
|
|
newPath = `${currentPageSlug}${newPath}`
|
|
}
|
|
|
|
return newPath
|
|
}, [href, appendToCurrentPath, currentPageSlug])
|
|
|
|
return (
|
|
<Link
|
|
className={classNames}
|
|
href={fullUrl}
|
|
target={target}
|
|
onClick={(e) => {
|
|
onClick(e)
|
|
if (trackingId) {
|
|
trackClick(trackingId, trackingParams)
|
|
}
|
|
}}
|
|
{...props}
|
|
/>
|
|
)
|
|
}
|