Merged in feat/book-595-gla-tracking (pull request #3187)

feat(BOOK-595): add pageview tracking to gla-callback and get-booking pages

* feat(BOOK-595): add pageview tracking to gla-callback and get-booking pages


Approved-by: Bianca Widstam

apps/partner-sas/app/[lang]/hotelreservation/(payment-callback)/payment-callback/[status]/page.tsx

@@ -1,5 +1,10 @@
 import { PaymentCallbackPage as PaymentCallbackPagePrimitive } from "@scandic-hotels/booking-flow/pages/PaymentCallbackPage"
 import { logger } from "@scandic-hotels/common/logger"
+import { TrackingSDK } from "@scandic-hotels/tracking/TrackingSDK"
+import {
+  TrackingChannelEnum,
+  type TrackingSDKPageData,
+} from "@scandic-hotels/tracking/types"
 
 import { bookingFlowConfig } from "@/constants/bookingFlowConfig"
 
@@ -23,13 +28,26 @@ export default async function PaymentCallbackPage(
     userAccessToken = session.access_token
   }
 
+  const pageTrackingData: TrackingSDKPageData = {
+    pageId: "payment-callback",
+    domainLanguage: lang,
+    channel: TrackingChannelEnum["hotelreservation"],
+    pageName: "payment-callback",
+    siteSections: "hotelreservation|payment-callback",
+    pageType: "hotelreservationspayment-callback",
+    siteVersion: "new-web",
+  }
+
   return (
-    <PaymentCallbackPagePrimitive
+    <>
-      lang={lang}
+      <TrackingSDK pageData={pageTrackingData} />
-      userAccessToken={userAccessToken}
+      <PaymentCallbackPagePrimitive
-      searchParams={searchParams}
+        lang={lang}
-      status={params.status as PaymentCallbackStatusEnum}
+        userAccessToken={userAccessToken}
-      config={bookingFlowConfig}
+        searchParams={searchParams}
-    />
+        status={params.status as PaymentCallbackStatusEnum}
+        config={bookingFlowConfig}
+      />
+    </>
   )
 }

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/gla-payment-callback/page.tsx

@@ -2,6 +2,11 @@ import { notFound } from "next/navigation"
 
 import { myStay } from "@scandic-hotels/common/constants/routes/myStay"
 import { logger } from "@scandic-hotels/common/logger"
+import { TrackingSDK } from "@scandic-hotels/tracking/TrackingSDK"
+import {
+  TrackingChannelEnum,
+  type TrackingSDKPageData,
+} from "@scandic-hotels/tracking/types"
 
 import GuaranteeCallbackPage from "@/components/GuaranteeCallback"
 
@@ -29,14 +34,27 @@ export default async function GuaranteePaymentCallbackPage(
   }
   const myStayUrl = `${myStay[lang]}?RefId=${encodeURIComponent(refId)}`
 
+  const pageTrackingData: TrackingSDKPageData = {
+    pageId: "gla-payment-callback",
+    domainLanguage: lang,
+    channel: TrackingChannelEnum["hotelreservation"],
+    pageName: "gla-payment-callback",
+    siteSections: "hotelreservation|gla-payment-callback",
+    pageType: "hotelreservationsgla-payment-callback",
+    siteVersion: "new-web",
+  }
+
   return (
-    <GuaranteeCallbackPage
+    <>
-      status={status}
+      <TrackingSDK pageData={pageTrackingData} />
-      confirmationNumber={confirmationNumber}
+      <GuaranteeCallbackPage
-      refId={refId}
+        status={status}
-      myStayUrl={myStayUrl}
+        confirmationNumber={confirmationNumber}
-      lang={lang}
+        refId={refId}
-      isAncillaryFlow={!!searchParams.ancillary}
+        myStayUrl={myStayUrl}
-    />
+        lang={lang}
+        isAncillaryFlow={!!searchParams.ancillary}
+      />
+    </>
   )
 }

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/(payment-callback)/payment-callback/page.tsx

@@ -1,5 +1,10 @@
 import { PaymentCallbackPage as PaymentCallbackPagePrimitive } from "@scandic-hotels/booking-flow/pages/PaymentCallbackPage"
 import { logger } from "@scandic-hotels/common/logger"
+import { TrackingSDK } from "@scandic-hotels/tracking/TrackingSDK"
+import {
+  TrackingChannelEnum,
+  type TrackingSDKPageData,
+} from "@scandic-hotels/tracking/types"
 import { isValidSession } from "@scandic-hotels/trpc/utils/session"
 
 import { bookingFlowConfig } from "@/constants/bookingFlowConfig"
@@ -23,14 +28,27 @@ export default async function PaymentCallbackPage(
     userAccessToken = session.token.access_token
   }
 
+  const pageTrackingData: TrackingSDKPageData = {
+    pageId: "payment-callback",
+    domainLanguage: lang,
+    channel: TrackingChannelEnum["hotelreservation"],
+    pageName: "payment-callback",
+    siteSections: "hotelreservation|payment-callback",
+    pageType: "hotelreservationspayment-callback",
+    siteVersion: "new-web",
+  }
+
   return (
-    <PaymentCallbackPagePrimitive
+    <>
-      lang={lang}
+      <TrackingSDK pageData={pageTrackingData} />
-      userAccessToken={userAccessToken}
+      <PaymentCallbackPagePrimitive
-      searchParams={searchParams}
+        lang={lang}
-      // TODO refactor this route to get this from params instead of rewriting in next.config
+        userAccessToken={userAccessToken}
-      status={searchParams.status as PaymentCallbackStatusEnum}
+        searchParams={searchParams}
-      config={bookingFlowConfig}
+        // TODO refactor this route to get this from params instead of rewriting in next.config
-    />
+        status={searchParams.status as PaymentCallbackStatusEnum}
+        config={bookingFlowConfig}
+      />
+    </>
   )
 }

apps/scandic-web/app/[lang]/(live)/(public)/hotelreservation/get-booking/page.tsx

@@ -1,11 +1,35 @@
+import { TrackingSDK } from "@scandic-hotels/tracking/TrackingSDK"
+import {
+  TrackingChannelEnum,
+  type TrackingSDKPageData,
+} from "@scandic-hotels/tracking/types"
+
 import FindMyBooking from "@/components/HotelReservation/FindMyBooking"
 import { getIntl } from "@/i18n"
 
 import styles from "./page.module.css"
 
-export default function GetBookingPage() {
+import type { Lang } from "@scandic-hotels/common/constants/language"
+
+export default async function GetBookingPage(
+  props: PageProps<"/[lang]/hotelreservation/get-booking">
+) {
+  const params = await props.params
+  const lang = params.lang as Lang
+
+  const pageTrackingData: TrackingSDKPageData = {
+    pageId: "get-booking",
+    domainLanguage: lang,
+    channel: TrackingChannelEnum["hotelreservation"],
+    pageName: "get-booking",
+    siteSections: "hotelreservation|get-booking",
+    pageType: "hotelreservationsget-booking",
+    siteVersion: "new-web",
+  }
+
   return (
     <main className={styles.main}>
+      <TrackingSDK pageData={pageTrackingData} />
       <div className={styles.form}>
         <FindMyBooking />
       </div>

apps/scandic-web/app/[lang]/webview/(views)/hotelreservation/gla-payment-callback/page.tsx

@@ -1,6 +1,11 @@
 import { notFound } from "next/navigation"
 
 import { logger } from "@scandic-hotels/common/logger"
+import { TrackingSDK } from "@scandic-hotels/tracking/TrackingSDK"
+import {
+  TrackingChannelEnum,
+  type TrackingSDKPageData,
+} from "@scandic-hotels/tracking/types"
 
 import { myStay } from "@/constants/routes/webviews"
 
@@ -28,15 +33,28 @@ export default async function GuaranteePaymentWebViewCallbackPage(
   }
   const myStayUrl = `${myStay[lang]}?RefId=${encodeURIComponent(refId)}`
 
+  const pageTrackingData: TrackingSDKPageData = {
+    pageId: "webview|gla-payment-callback",
+    domainLanguage: lang,
+    channel: TrackingChannelEnum["hotelreservation"],
+    pageName: "webview|gla-payment-callback",
+    siteSections: "webview|hotelreservation|gla-payment-callback",
+    pageType: "hotelreservationsgla-payment-callback",
+    siteVersion: "new-web",
+  }
+
   logger.debug(`[gla-payment-callback] callback started`)
   return (
-    <GuaranteeCallbackPage
+    <>
-      status={status}
+      <TrackingSDK pageData={pageTrackingData} />
-      confirmationNumber={confirmationNumber}
+      <GuaranteeCallbackPage
-      refId={refId}
+        status={status}
-      myStayUrl={myStayUrl}
+        confirmationNumber={confirmationNumber}
-      lang={lang}
+        refId={refId}
-      isAncillaryFlow={!!searchParams.ancillary}
+        myStayUrl={myStayUrl}
-    />
+        lang={lang}
+        isAncillaryFlow={!!searchParams.ancillary}
+      />
+    </>
   )
 }