diff --git a/components/TempDesignSystem/Link/index.tsx b/components/TempDesignSystem/Link/index.tsx index 885543bef..80a3bd981 100644 --- a/components/TempDesignSystem/Link/index.tsx +++ b/components/TempDesignSystem/Link/index.tsx @@ -1,7 +1,7 @@ "use client" import NextLink from "next/link" import { usePathname } from "next/navigation" -import { useEffect } from "react" +import { useCallback, useEffect } from "react" import { trackClick } from "@/utils/tracking" @@ -36,19 +36,23 @@ export default function Link({ variant, }) - useEffect(() => { + const trackClickById = useCallback(() => { if (trackingId) { - document - .getElementById(trackingId) - ?.addEventListener("click", () => trackClick(trackingId)) - return () => { - document - .getElementById(trackingId) - ?.removeEventListener("click", () => trackClick(trackingId)) - } + trackClick(trackingId) } }, [trackingId]) + useEffect(() => { + if (trackingId) { + const linkComponent = document.getElementById(trackingId) + + linkComponent?.addEventListener("click", trackClickById) + return () => { + linkComponent?.removeEventListener("click", trackClickById) + } + } + }, [trackClickById, trackingId]) + return (