From fdf124bd0c065efa5e19171dd79e4d9868599088 Mon Sep 17 00:00:00 2001 From: Linus Flood Date: Fri, 7 Nov 2025 07:57:19 +0000 Subject: [PATCH] Merged in feat/book-504-at-pageview (pull request #3099) MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit Feat(BOOK-504): basic pageview event * fix * Cleanup Approved-by: Joakim Jäderberg --- .../ContentType/HotelPage/index.tsx | 7 +- .../lib/pages/AlternativeHotelsMapPage.tsx | 8 +- .../lib/pages/AlternativeHotelsPage.tsx | 23 ++--- .../lib/pages/SelectHotelPage.tsx | 23 ++--- packages/tracking/lib/TrackingSDK.tsx | 12 +++ .../lib/useTrackHardNavigationBasic.ts | 62 ++++++++++++++ .../lib/useTrackSoftNavigationBasic.ts | 83 +++++++++++++++++++ 7 files changed, 176 insertions(+), 42 deletions(-) create mode 100644 packages/tracking/lib/useTrackHardNavigationBasic.ts create mode 100644 packages/tracking/lib/useTrackSoftNavigationBasic.ts diff --git a/apps/scandic-web/components/ContentType/HotelPage/index.tsx b/apps/scandic-web/components/ContentType/HotelPage/index.tsx index 00b52abb3..5c29439e4 100644 --- a/apps/scandic-web/components/ContentType/HotelPage/index.tsx +++ b/apps/scandic-web/components/ContentType/HotelPage/index.tsx @@ -337,12 +337,7 @@ export default async function HotelPage({ - - - + ) } diff --git a/packages/booking-flow/lib/pages/AlternativeHotelsMapPage.tsx b/packages/booking-flow/lib/pages/AlternativeHotelsMapPage.tsx index 7a5438d6b..12a617031 100644 --- a/packages/booking-flow/lib/pages/AlternativeHotelsMapPage.tsx +++ b/packages/booking-flow/lib/pages/AlternativeHotelsMapPage.tsx @@ -124,11 +124,11 @@ export async function AlternativeHotelsMapPage({ isAlternativeHotels={true} filterList={filterList} /> - + ) diff --git a/packages/booking-flow/lib/pages/AlternativeHotelsPage.tsx b/packages/booking-flow/lib/pages/AlternativeHotelsPage.tsx index 3fc58f105..45c20a834 100644 --- a/packages/booking-flow/lib/pages/AlternativeHotelsPage.tsx +++ b/packages/booking-flow/lib/pages/AlternativeHotelsPage.tsx @@ -1,7 +1,5 @@ -import stringify from "json-stable-stringify-without-jsonify" import { cookies } from "next/headers" import { notFound } from "next/navigation" -import { Suspense } from "react" import { FamilyAndFriendsCodes } from "@scandic-hotels/common/constants/familyAndFriends" import { NoAvailabilityTracking } from "@scandic-hotels/tracking/NoAvailabilityTracking" @@ -113,8 +111,6 @@ export async function AlternativeHotelsPage({ config, }) - const suspenseKey = stringify(searchParams) - const shouldTrackNoAvailability = !!( hotels.every((hotel) => hotel.availability.status !== "Available") || (booking.bookingCode && hotels.length > 0 && !isBookingCodeRateAvailable) @@ -132,18 +128,13 @@ export async function AlternativeHotelsPage({ } lang={lang} /> - - - - + + ) } diff --git a/packages/booking-flow/lib/pages/SelectHotelPage.tsx b/packages/booking-flow/lib/pages/SelectHotelPage.tsx index 59594c7f1..3b10304c9 100644 --- a/packages/booking-flow/lib/pages/SelectHotelPage.tsx +++ b/packages/booking-flow/lib/pages/SelectHotelPage.tsx @@ -1,7 +1,5 @@ -import stringify from "json-stable-stringify-without-jsonify" import { cookies } from "next/headers" import { notFound } from "next/navigation" -import { Suspense } from "react" import { FamilyAndFriendsCodes } from "@scandic-hotels/common/constants/familyAndFriends" import { NoAvailabilityTracking } from "@scandic-hotels/tracking/NoAvailabilityTracking" @@ -99,8 +97,6 @@ export async function SelectHotelPage({ config, }) - const suspenseKey = stringify(searchParams) - const shouldTrackNoAvailability = !!( hotels.every((hotel) => hotel.availability.status !== "Available") || (booking.bookingCode && hotels.length > 0 && !isBookingCodeRateAvailable) @@ -116,18 +112,13 @@ export async function SelectHotelPage({ title={city.name} lang={lang} /> - - - - + + ) } diff --git a/packages/tracking/lib/TrackingSDK.tsx b/packages/tracking/lib/TrackingSDK.tsx index 5388e5885..99b84e10d 100644 --- a/packages/tracking/lib/TrackingSDK.tsx +++ b/packages/tracking/lib/TrackingSDK.tsx @@ -3,7 +3,9 @@ import { usePathname } from "next/navigation" import { useTrackHardNavigation } from "./useTrackHardNavigation" +import { useTrackHardNavigationBasic } from "./useTrackHardNavigationBasic" import { useTrackSoftNavigation } from "./useTrackSoftNavigation" +import { useTrackSoftNavigationBasic } from "./useTrackSoftNavigationBasic" import type { TrackingSDKAncillaries, @@ -25,6 +27,16 @@ export function TrackingSDK({ }) { const pathName = usePathname() + useTrackHardNavigationBasic({ + pageData, + pathName, + }) + + useTrackSoftNavigationBasic({ + pageData, + pathName, + }) + useTrackHardNavigation({ pageData, hotelInfo, diff --git a/packages/tracking/lib/useTrackHardNavigationBasic.ts b/packages/tracking/lib/useTrackHardNavigationBasic.ts new file mode 100644 index 000000000..c3e30fadf --- /dev/null +++ b/packages/tracking/lib/useTrackHardNavigationBasic.ts @@ -0,0 +1,62 @@ +"use client" + +import { useSession } from "next-auth/react" +import { useEffect } from "react" + +import { useSessionId } from "@scandic-hotels/common/hooks/useSessionId" +import { isValidSession } from "@scandic-hotels/trpc/utils/session" + +import { createSDKPageObject, trackPageView } from "./pageview" + +import type { TrackingSDKPageData } from "./types" + +type TrackingSDKProps = { + pageData: TrackingSDKPageData + pathName: string +} + +let hasTrackedHardNavigationBasic = false +export const useTrackHardNavigationBasic = ({ + pageData, + pathName, +}: TrackingSDKProps) => { + const sessionId = useSessionId() + const { data: session } = useSession() + const validSession = isValidSession(session) + + useEffect(() => { + if (hasTrackedHardNavigationBasic) return + + trackBasicPageView({ + pathName, + sessionId, + pageData, + validSession, + }) + + hasTrackedHardNavigationBasic = true + }, [pathName, pageData, sessionId, validSession]) +} + +const trackBasicPageView = async ({ + pathName, + sessionId, + pageData, + validSession, +}: { + pathName: string + sessionId: string | null + pageData: TrackingSDKProps["pageData"] + validSession: boolean +}) => { + const trackingData = { ...pageData, pathName, sessionId } + const pageObject = createSDKPageObject(trackingData) + + trackPageView({ + event: "pageViewBasic", + pageInfo: pageObject, + userInfo: { + loginStatus: validSession ? "logged in" : "Non-logged in", + }, + }) +} diff --git a/packages/tracking/lib/useTrackSoftNavigationBasic.ts b/packages/tracking/lib/useTrackSoftNavigationBasic.ts new file mode 100644 index 000000000..55ed1e43c --- /dev/null +++ b/packages/tracking/lib/useTrackSoftNavigationBasic.ts @@ -0,0 +1,83 @@ +"use client" + +import { useSession } from "next-auth/react" +import { startTransition, useEffect, useRef, useState } from "react" + +import { useSessionId } from "@scandic-hotels/common/hooks/useSessionId" +import useRouterTransitionStore from "@scandic-hotels/common/stores/router-transition" +import { isValidSession } from "@scandic-hotels/trpc/utils/session" + +import { createSDKPageObject, trackPageView } from "./pageview" + +import type { TrackingSDKPageData } from "./types" + +type TrackingSDKProps = { + pageData: TrackingSDKPageData + pathName: string +} + +enum TransitionStatusEnum { + NotRun = "NotRun", + Running = "Running", + Done = "Done", +} + +type TransitionStatus = keyof typeof TransitionStatusEnum + +export const useTrackSoftNavigationBasic = ({ + pageData, + pathName, +}: TrackingSDKProps) => { + const [status, setStatus] = useState( + TransitionStatusEnum.NotRun + ) + + const sessionId = useSessionId() + const { data: session } = useSession() + const validSession = isValidSession(session) + const { isTransitioning, stopRouterTransition } = useRouterTransitionStore() + + const previousPathname = useRef(null) + + useEffect(() => { + if (isTransitioning && status === TransitionStatusEnum.NotRun) { + startTransition(() => { + setStatus(TransitionStatusEnum.Running) + }) + return + } + + if (isTransitioning && status === TransitionStatusEnum.Running) { + setStatus(TransitionStatusEnum.Done) + stopRouterTransition() + return + } + + if (!isTransitioning && status === TransitionStatusEnum.Done) { + const trackingData = { + ...pageData, + sessionId, + pathName, + } + const pageObject = createSDKPageObject(trackingData) + + trackPageView({ + event: "pageViewBasic", + pageInfo: pageObject, + userInfo: { + loginStatus: validSession ? "logged in" : "Non-logged in", + }, + }) + + setStatus(TransitionStatusEnum.NotRun) // Reset status + previousPathname.current = pathName // Update for next render + } + }, [ + isTransitioning, + status, + stopRouterTransition, + pageData, + pathName, + sessionId, + ]) +}