"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,
  wrapping,
  className,
  href,
  target,
  onClick = () => {},
  trackingId,
  trackingParams,
  appendToCurrentPath,
  ...props
}: ButtonLinkProps) {
  const currentPageSlug = usePathname()
  const classNames = variants({
    variant,
    color,
    size,
    wrapping,
    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}
    />
  )
}