Refactor

app/[lang]/(live)/(public)/hotelreservation/(standard)/step/enterDetailsTracking.tsx

@@ -1,7 +1,7 @@
 "use client"
 
 import { usePathname } from "next/navigation"
-import { useEffect, useState } from "react"
+import { useEffect, useMemo, useState } from "react"
 
 import { Lang } from "@/constants/languages"
 import { useStepsStore } from "@/stores/steps"
@@ -28,19 +28,14 @@ export default function EnterDetailsTracking(props: Props) {
   const { getPageLoadTime, hasRun } = useTrackingStore()
   const pathName = usePathname()
 
-  const [hotelsTrackingData, setHotelsTrackingData] = useState(
+  const pageObject = useMemo(() => {
-    initialHotelsTrackingData
-  )
-
-  useEffect(() => {
-    function trackData() {
     const pageTrackingData: TrackingSDKPageData = {
       pageId: currentStep,
       domainLanguage: lang,
       channel: TrackingChannelEnum["hotelreservation"],
       pageName: `hotelreservation|${currentStep}`,
       siteSections: `hotelreservation|${currentStep}`,
-        pageType: currentStep, // TODO: Change to correct
+      pageType: currentStep,
     }
 
     const trackingData = {
@@ -49,6 +44,18 @@ export default function EnterDetailsTracking(props: Props) {
       pageLoadTime: getPageLoadTime(),
     }
     const pageObject = createSDKPageObject(trackingData)
+    return pageObject
+  }, [currentStep, getPageLoadTime, lang, pathName])
+
+  const hotelDetailsData = useMemo(() => {
+    const data: TrackingSDKHotelInfo = { ...initialHotelsTrackingData }
+    return data
+  }, [initialHotelsTrackingData])
+
+  useEffect(() => {
+    if (!hasRun) {
+      return
+    }
     console.log("TRACKING: Tracking RouterTransition pageViewEnd", pageObject)
     console.log(
       "TRACKING: Tracking RouterTransition userData",
@@ -56,27 +63,15 @@ export default function EnterDetailsTracking(props: Props) {
     )
     console.log(
       "TRACKING: Tracking RouterTransition hotelInfo",
-        hotelsTrackingData
+      hotelDetailsData
     )
     window.adobeDataLayer.push({
       event: "pageViewEnd",
       pageInfo: pageObject,
       userInfo: userTrackingData,
-        hotelInfo: hotelsTrackingData,
+      hotelInfo: hotelDetailsData,
     })
-    }
+  }, [userTrackingData, hasRun, pageObject, hotelDetailsData])
-    if (hasRun) {
-      trackData()
-    }
-  }, [
-    currentStep,
-    getPageLoadTime,
-    hotelsTrackingData,
-    pathName,
-    userTrackingData,
-    hasRun,
-    lang,
-  ])
 
   return null
 }