54 lines
1.3 KiB
TypeScript
54 lines
1.3 KiB
TypeScript
"use client"
|
|
|
|
import { usePathname } from "next/navigation"
|
|
import { PropsWithChildren, useEffect } from "react"
|
|
|
|
import { login } from "@/constants/routes/handleAuth"
|
|
|
|
import Link from "@/components/TempDesignSystem/Link"
|
|
import { LinkProps } from "@/components/TempDesignSystem/Link/link"
|
|
import { trackLoginClick } from "@/utils/tracking"
|
|
|
|
import { TrackingPosition } from "@/types/components/tracking"
|
|
import { LangParams } from "@/types/params"
|
|
|
|
export default function LoginButton({
|
|
className,
|
|
position,
|
|
trackingId,
|
|
lang,
|
|
children,
|
|
color = "black",
|
|
}: PropsWithChildren<
|
|
LangParams & {
|
|
className: string
|
|
trackingId: string
|
|
position: TrackingPosition
|
|
color?: LinkProps["color"]
|
|
}
|
|
>) {
|
|
const pathName = usePathname()
|
|
|
|
useEffect(() => {
|
|
document
|
|
.getElementById(trackingId)
|
|
?.addEventListener("click", () => trackLoginClick(position))
|
|
return () => {
|
|
document
|
|
.getElementById(trackingId)
|
|
?.removeEventListener("click", () => trackLoginClick(position))
|
|
}
|
|
}, [position, trackingId])
|
|
|
|
return (
|
|
<Link
|
|
className={className}
|
|
id={trackingId}
|
|
color={color}
|
|
href={`${login[lang]}?redirectTo=${encodeURIComponent(`/${lang}${pathName}`)}`}
|
|
>
|
|
{children}
|
|
</Link>
|
|
)
|
|
}
|