fix: ad events for tracking navigations and initial page load

components/TempDesignSystem/Link/index.tsx

@@ -1,7 +1,9 @@
 "use client"
 import NextLink from "next/link"
 import { usePathname, useRouter } from "next/navigation"
-import { useCallback, useEffect, useTransition } from "react"
+import { startTransition, useCallback, useEffect } from "react"
+
+import useRouterTransitionStore from "@/stores/router-transition"
 
 import { trackClick, trackPageViewStart } from "@/utils/tracking"
 
@@ -39,9 +41,12 @@ export default function Link({
     variant,
   })
 
-  const [isPending, startTransition] = useTransition()
   const router = useRouter()
 
+  const startRouterTransition = useRouterTransitionStore(
+    (state) => state.startRouterTransition
+  )
+
   const trackClickById = useCallback(() => {
     if (trackingId) {
       trackClick(trackingId)
@@ -59,26 +64,16 @@ export default function Link({
     }
   }, [trackClickById, trackingId])
 
-  useEffect(() => {
-    if (!isPending) {
-      console.log("PENDING IS DONE")
-    }
-  }, [isPending])
-
   return (
     <NextLink
       scroll={scroll}
       prefetch={prefetch}
       className={classNames}
       onClick={() => {
-        trackPageViewStart()
-
         startTransition(() => {
+          trackPageViewStart()
+          startRouterTransition()
           router.push(href)
-          console.log({ isPending })
-          if (!isPending) {
-            console.log("Not pending anymore!")
-          }
         })
       }}
       href={href}