More props to track in enter details

This commit is contained in:
Linus Flood
2024-11-29 08:36:21 +01:00
parent 43b38bf894
commit 1fb90ba9bd
3 changed files with 77 additions and 5 deletions

View File

@@ -4,30 +4,75 @@ import { usePathname } from "next/navigation"
import { useEffect, useMemo } from "react" import { useEffect, useMemo } from "react"
import { Lang } from "@/constants/languages" import { Lang } from "@/constants/languages"
import { RoomConfiguration } from "@/server/routers/hotels/output"
import { useEnterDetailsStore } from "@/stores/enter-details" import { useEnterDetailsStore } from "@/stores/enter-details"
import useTrackingStore from "@/stores/tracking" import useTrackingStore from "@/stores/tracking"
import { createSDKPageObject } from "@/utils/tracking" import { createSDKPageObject } from "@/utils/tracking"
import { RoomPackageCodeEnum } from "@/types/components/hotelReservation/selectRate/roomFilter"
import { import {
TrackingChannelEnum, TrackingChannelEnum,
TrackingSDKHotelInfo, TrackingSDKHotelInfo,
TrackingSDKPageData, TrackingSDKPageData,
TrackingSDKUserData, TrackingSDKUserData,
} from "@/types/components/tracking" } from "@/types/components/tracking"
import { Packages } from "@/types/requests/packages"
type Props = { type Props = {
initialHotelsTrackingData: TrackingSDKHotelInfo initialHotelsTrackingData: TrackingSDKHotelInfo
userTrackingData: TrackingSDKUserData userTrackingData: TrackingSDKUserData
lang: Lang lang: Lang
selectedRoom: RoomConfiguration
cancellationRule: string
} }
export default function EnterDetailsTracking(props: Props) { export default function EnterDetailsTracking(props: Props) {
const { initialHotelsTrackingData, userTrackingData, lang } = props const {
const currentStep = useEnterDetailsStore((state) => state.currentStep) initialHotelsTrackingData,
userTrackingData,
lang,
selectedRoom,
cancellationRule,
} = props
const {
currentStep,
bedType,
breakfast,
totalPrice,
roomPrice,
roomRate,
packages,
} = useEnterDetailsStore((state) => state)
const { getPageLoadTime, hasRun } = useTrackingStore() const { getPageLoadTime, hasRun } = useTrackingStore()
const pathName = usePathname() const pathName = usePathname()
const getSpecialRoomType = (packages: Packages | null) => {
if (!packages) {
return ""
}
const specialRoom = packages.find((p) =>
[
RoomPackageCodeEnum.PET_ROOM,
RoomPackageCodeEnum.ALLERGY_ROOM,
RoomPackageCodeEnum.ACCESSIBILITY_ROOM,
].includes(p.code)
)
switch (specialRoom?.code) {
case RoomPackageCodeEnum.PET_ROOM:
return "pet-friendly"
case RoomPackageCodeEnum.ALLERGY_ROOM:
return "allergy room"
case RoomPackageCodeEnum.ACCESSIBILITY_ROOM:
return "accessibility room"
default:
return ""
}
}
const pageObject = useMemo(() => { const pageObject = useMemo(() => {
const pageTrackingData: TrackingSDKPageData = { const pageTrackingData: TrackingSDKPageData = {
pageId: currentStep, pageId: currentStep,
@@ -48,9 +93,34 @@ export default function EnterDetailsTracking(props: Props) {
}, [currentStep, getPageLoadTime, lang, pathName]) }, [currentStep, getPageLoadTime, lang, pathName])
const hotelDetailsData = useMemo(() => { const hotelDetailsData = useMemo(() => {
const data: TrackingSDKHotelInfo = { ...initialHotelsTrackingData } const data: TrackingSDKHotelInfo = {
...initialHotelsTrackingData,
rateCode: roomRate.memberRate?.rateCode,
rateCodeType: roomRate.memberRate?.rateType,
rateCodeName: roomRate.memberRate?.rateCode,
rateCodeCancellationRule: cancellationRule,
revenueCurrencyCode: roomRate.memberRate?.requestedPrice?.currency,
breakfastOption: breakfast ? "breakfast buffet" : "no breakfast",
totalPrice: totalPrice.euro?.price,
specialRoomType: getSpecialRoomType(packages),
roomTypeName: selectedRoom.roomType,
bedType: bedType?.description,
roomTypeCode: bedType?.roomTypeCode,
roomPrice: roomPrice?.euro?.price,
}
return data return data
}, [initialHotelsTrackingData]) }, [
initialHotelsTrackingData,
selectedRoom,
cancellationRule,
bedType,
roomPrice,
totalPrice,
roomRate,
breakfast,
packages,
])
useEffect(() => { useEffect(() => {
if (!hasRun) { if (!hasRun) {

View File

@@ -277,6 +277,8 @@ export default async function StepPage({
<EnterDetailsTracking <EnterDetailsTracking
initialHotelsTrackingData={initialHotelsTrackingData} initialHotelsTrackingData={initialHotelsTrackingData}
userTrackingData={userTrackingData} userTrackingData={userTrackingData}
selectedRoom={roomAvailability.selectedRoom}
cancellationRule={roomAvailability.cancellationText}
lang={lang} lang={lang}
/> />
<TrackingSDK <TrackingSDK

View File

@@ -60,7 +60,7 @@ export type TrackingSDKHotelInfo = {
availableResults?: number // Number of hotels to choose from after a city search availableResults?: number // Number of hotels to choose from after a city search
bookingTypeofDay?: "weekend" | "weekday" bookingTypeofDay?: "weekend" | "weekday"
searchTerm?: string searchTerm?: string
roomPrice?: string roomPrice?: number
rateCode?: string rateCode?: string
rateCodeCancellationRule?: string rateCodeCancellationRule?: string
rateCodeName?: string // Scandic Friends - full flex inkl. frukost rateCodeName?: string // Scandic Friends - full flex inkl. frukost