scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

Merged in feat/sw-3473-remove-tracking-context (pull request #2843)

Browse Source 
feat(SW-3473): Rework booking-flow tracking provider

* Remove tracking context and import instead

* Remove unused file


Approved-by: Joakim Jäderberg
This commit is contained in:
Anton Gunnarsson
2025-09-22 13:08:10 +00:00
parent a7b19e8b14
commit 630e89c845
30 changed files with 77 additions and 382 deletions
Download Patch File Download Diff File Expand all files Collapse all files

30
apps/partner-sas/components/BookingFlowProviders.tsx
View File

@@ -1,21 +1,8 @@
"use client"
import { BookingFlowContextProvider } from "@scandic-hotels/booking-flow/BookingFlowContextProvider"
import { BookingFlowTrackingProvider } from "@scandic-hotels/booking-flow/BookingFlowTrackingProvider"
import { useIsUserLoggedIn } from "../hooks/useIsUserLoggedIn"
import {
trackAccordionItemOpen,
trackBedSelection,
trackBookingSearchClick,
trackBreakfastSelection,
trackGenericEvent,
trackGlaSaveCardAttempt,
trackLoginClick,
trackOpenSidePeek,
trackPaymentEvent,
trackUpdatePaymentMethod,
} from "../utils/tracking"
import type { ReactNode } from "react"
@@ -24,22 +11,7 @@ export function BookingFlowProviders({ children }: { children: ReactNode }) {
return (
<BookingFlowContextProvider data={{ isLoggedIn }}>
<BookingFlowTrackingProvider
trackingFunctions={{
trackBookingSearchClick,
trackAccordionItemOpen,
trackOpenSidePeek,
trackGenericEvent,
trackGlaSaveCardAttempt,
trackLoginClick,
trackPaymentEvent,
trackUpdatePaymentMethod,
trackBreakfastSelection,
trackBedSelection,
}}
>
{children}
</BookingFlowTrackingProvider>
{children}
</BookingFlowContextProvider>
)
}

152
apps/partner-sas/utils/tracking.ts
View File

@@ -1,152 +0,0 @@
"use client"
import type {
PaymentEvent,
PaymentFailEvent,
} from "@scandic-hotels/tracking/types"
import type { BreakfastPackages } from "@scandic-hotels/trpc/routers/hotels/output"
export function trackBookingSearchClick(
searchTerm: string,
searchType: "hotel" | "destination"
) {
console.warn("TODO: Implement trackBookingSearchClick", {
searchTerm,
searchType,
})
}
export function trackAccordionItemOpen(option: string) {
console.warn("TODO: Implement trackAccordionItemOpen", { option })
}
export function trackOpenSidePeek(input: {
name: string | null
hotelId: string
includePathname?: boolean
roomTypeCode?: string | null
}) {
console.warn("TODO: Implement trackOpenSidePeek", { input })
}
// eslint-disable-next-line @typescript-eslint/no-explicit-any
export function trackGenericEvent(data: any) {
console.warn("TODO: Implement trackGenericEvent", { data })
}
export function trackGlaSaveCardAttempt({
hotelId,
hasSavedCreditCard,
creditCardType,
lateArrivalGuarantee,
}: {
hotelId: string
hasSavedCreditCard: boolean
creditCardType?: string
lateArrivalGuarantee: "mandatory" | "yes" | "no" | "na"
}) {
console.warn("TODO: Implement trackGlaSaveCardAttempt", {
event: "glaCardSaveAttempt",
hotelInfo: {
hotelId,
lateArrivalGuarantee,
guaranteedProduct: "room",
},
paymentInfo: {
status: "glacardsaveattempt",
isSavedCreditCard: hasSavedCreditCard,
type: creditCardType,
},
})
}
export function trackLoginClick(
position:
| "top menu"
| "hamburger menu"
| "join scandic friends sidebar"
| "enter details"
| "my stay"
) {
console.warn("TODO: Implement trackLoginClick", {
event: "loginStart",
login: {
position,
action: "login start",
ctaName: "login",
},
})
}
export function trackPaymentEvent(paymentEvent: PaymentEvent) {
console.warn("TODO: Implement trackPaymentEvent", {
event: paymentEvent.event,
hotelInfo: {
hotelId: paymentEvent.hotelId,
},
paymentInfo: {
isSavedCard: paymentEvent.isSavedCreditCard,
status: paymentEvent.status,
type: paymentEvent.method,
smsEnable: paymentEvent.smsEnable,
errorMessage: isPaymentFailEvent(paymentEvent)
? paymentEvent.errorMessage
: undefined,
},
})
}
export function trackUpdatePaymentMethod({ method }: { method: string }) {
console.warn("TODO: Implement trackUpdatePaymentMethod", {
event: "paymentSelection",
hotelInfo: {
hotelId: "", // TODO: Needs to be verified with analytics if this should even be here
},
cta: {
name: method,
},
})
}
export function trackBreakfastSelection({
breakfastPackage,
hotelId,
units,
}: {
breakfastPackage: BreakfastPackages[number]
hotelId: string
units: number
}) {
console.warn("TODO: Implement trackBreakfastSelection", {
event: "breakfastSelection",
selection: {
name: "breakfast options selection click",
},
...(units > 0 && {
ancillaries: [
{
hotelId,
productCategory: "",
productId: breakfastPackage.code,
productUnits: units,
productPrice: breakfastPackage.localPrice.price * units,
productPoints: 0,
productType: "food",
productName: breakfastPackage.packageType,
},
],
}),
})
}
export function trackBedSelection(bedType: string) {
console.warn("TODO: Implement trackBedSelection", {
event: "bedSelection",
selection: {
name: "bed options selection click",
bedType: bedType,
},
})
}
function isPaymentFailEvent(event: PaymentEvent): event is PaymentFailEvent {
return "errorMessage" in event
}

32
apps/scandic-web/components/BookingFlowProviders.tsx
View File

@@ -1,23 +1,8 @@
"use client"
import { BookingFlowContextProvider } from "@scandic-hotels/booking-flow/BookingFlowContextProvider"
import { BookingFlowTrackingProvider } from "@scandic-hotels/booking-flow/BookingFlowTrackingProvider"
import { trackEvent } from "@scandic-hotels/tracking/base"
import { useIsUserLoggedIn } from "@/hooks/useIsUserLoggedIn"
import {
trackAccordionClick,
trackLoginClick,
trackOpenSidePeekEvent,
trackPaymentEvent,
trackUpdatePaymentMethod,
} from "@/utils/tracking"
import {
trackBedSelection,
trackBookingSearchClick,
trackBreakfastSelection,
} from "@/utils/tracking/booking"
import { trackGlaSaveCardAttempt } from "@/utils/tracking/myStay"
import type { ReactNode } from "react"
@@ -26,22 +11,7 @@ export function BookingFlowProviders({ children }: { children: ReactNode }) {
return (
<BookingFlowContextProvider data={{ isLoggedIn }}>
<BookingFlowTrackingProvider
trackingFunctions={{
trackBookingSearchClick,
trackAccordionItemOpen: trackAccordionClick,
trackOpenSidePeek: trackOpenSidePeekEvent,
trackGenericEvent: trackEvent,
trackGlaSaveCardAttempt,
trackLoginClick,
trackPaymentEvent,
trackUpdatePaymentMethod,
trackBreakfastSelection,
trackBedSelection,
}}
>
{children}
</BookingFlowTrackingProvider>
{children}
</BookingFlowContextProvider>
)
}

2
apps/scandic-web/components/HotelReservation/MyStay/ReferenceCard/Actions/NotCancelled/ManageStay/Actions/GuaranteeLateArrival/Form/index.tsx
View File

@@ -19,6 +19,7 @@ import Link from "@scandic-hotels/design-system/Link"
import { LoadingSpinner } from "@scandic-hotels/design-system/LoadingSpinner"
import { toast } from "@scandic-hotels/design-system/Toast"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { trackGlaSaveCardAttempt } from "@scandic-hotels/tracking/payment"
import { isWebview } from "@/constants/routes/webviews"
import { env } from "@/env/client"
@@ -27,7 +28,6 @@ import { useMyStayStore } from "@/stores/my-stay"
import { useGuaranteeBooking } from "@/hooks/booking/useGuaranteeBooking"
import useLang from "@/hooks/useLang"
import { trackUpdatePaymentMethod } from "@/utils/tracking"
import { trackGlaSaveCardAttempt } from "@/utils/tracking/myStay"
import { type GuaranteeFormData, paymentSchema } from "./schema"

2
apps/scandic-web/components/LanguageSwitcher/index.tsx
View File

@@ -8,6 +8,7 @@ import { useIntl } from "react-intl"
import { MaterialIcon } from "@scandic-hotels/design-system/Icons/MaterialIcon"
import SkeletonShimmer from "@scandic-hotels/design-system/SkeletonShimmer"
import { Typography } from "@scandic-hotels/design-system/Typography"
import { trackLanguageSwitchClick } from "@scandic-hotels/tracking/navigation"
import { trpc } from "@scandic-hotels/trpc/client"
import { languages } from "@/constants/languages"
@@ -16,7 +17,6 @@ import useDropdownStore from "@/stores/main-menu"
import useClickOutside from "@/hooks/useClickOutside"
import { useHandleKeyUp } from "@/hooks/useHandleKeyUp"
import useLang from "@/hooks/useLang"
import { trackLanguageSwitchClick } from "@/utils/tracking/navigation"
import LanguageSwitcherContainer from "./LanguageSwitcherContainer"
import LanguageSwitcherContent from "./LanguageSwitcherContent"

64
apps/scandic-web/utils/tracking/booking.ts
View File

@@ -1,64 +0,0 @@
"use client"
import { trackEvent } from "@scandic-hotels/tracking/base"
import type { BreakfastPackages } from "@scandic-hotels/trpc/routers/hotels/output"
// Tracking for sections of booking flow enter-details page
export function trackBedSelection(bedType: string) {
trackEvent({
event: "bedSelection",
selection: {
name: "bed options selection click",
bedType: bedType,
},
})
}
export function trackBreakfastSelection({
breakfastPackage,
hotelId,
units,
breakfastOption,
}: {
breakfastPackage: BreakfastPackages[number]
hotelId: string
units: number
breakfastOption: string
}) {
trackEvent({
event: "breakfastSelection",
selection: {
name: "breakfast options selection click",
breakfastOption,
},
...(units > 0 && {
ancillaries: [
{
hotelId,
productCategory: "",
productId: breakfastPackage.code,
productUnits: units,
productPrice: breakfastPackage.localPrice.price * units,
productPoints: 0,
productType: "food",
productName: breakfastPackage.packageType,
},
],
}),
})
}
export function trackBookingSearchClick(
searchTerm: string,
searchType: string
) {
trackEvent({
event: "hotelSearchButtonClick",
hotelInfo: {
searchTerm,
searchType,
action: "Hotel search",
},
})
}

36
apps/scandic-web/utils/tracking/componentEvents.ts
View File

@@ -1,36 +0,0 @@
"use client"
import { trackEvent } from "@scandic-hotels/tracking/base"
export function trackAccordionClick(option: string) {
trackEvent({
event: "accordionClick",
accordion: {
action: "accordion open click",
option,
},
})
}
export function trackOpenSidePeekEvent({
name,
hotelId,
includePathname,
roomTypeCode,
}: {
name: string | null
hotelId: string
includePathname?: boolean
roomTypeCode?: string | null
}) {
trackEvent({
event: "openSidePeek",
hotelInfo: {
hotelId: hotelId,
},
cta: {
name,
...(roomTypeCode ? { roomTypeCode } : {}),
...(includePathname ? { pathName: window.location.pathname } : {}),
},
})
}

14
apps/scandic-web/utils/tracking/index.ts
View File

@@ -1,11 +1,17 @@
export { trackAccordionClick, trackOpenSidePeekEvent } from "./componentEvents"
export { trackHotelMapClick, trackHotelTabClick } from "./hotelPage"
export { trackCancelStay, trackMyStayPageLink } from "./myStay"
export { trackClick } from "@scandic-hotels/tracking/base"
export {
trackAccordionClick,
trackOpenSidePeekEvent,
} from "@scandic-hotels/tracking/componentEvents"
export {
trackFooterClick,
trackLoginClick,
trackSocialMediaClick,
} from "./navigation"
export { trackPaymentEvent, trackUpdatePaymentMethod } from "./payment"
export { trackClick } from "@scandic-hotels/tracking/base"
} from "@scandic-hotels/tracking/navigation"
export { trackPageViewStart } from "@scandic-hotels/tracking/pageview"
export {
trackPaymentEvent,
trackUpdatePaymentMethod,
} from "@scandic-hotels/tracking/payment"

26
apps/scandic-web/utils/tracking/myStay.ts
View File

@@ -35,32 +35,6 @@ export function trackMyStayPageLink(ctaName: string) {
})
}
export function trackGlaSaveCardAttempt({
hotelId,
hasSavedCreditCard,
creditCardType,
lateArrivalGuarantee,
}: {
hotelId: string
hasSavedCreditCard: boolean
creditCardType?: string
lateArrivalGuarantee: "mandatory" | "yes" | "no" | "na"
}) {
trackEvent({
event: "glaCardSaveAttempt",
hotelInfo: {
hotelId,
lateArrivalGuarantee,
guaranteedProduct: "room",
},
paymentInfo: {
status: "glacardsaveattempt",
isSavedCreditCard: hasSavedCreditCard,
type: creditCardType,
},
})
}
export function buildAncillariesTracking(
packages: {
code: string

42
apps/scandic-web/utils/tracking/navigation.ts
View File

@@ -1,42 +0,0 @@
import { trackEvent } from "@scandic-hotels/tracking/base"
import type { TrackingPosition } from "@scandic-hotels/tracking/types"
export function trackFooterClick(group: string, name: string) {
trackEvent({
event: "footer link",
footer: {
footerLinkClicked: `${group}:${name}`,
},
})
}
export function trackSocialMediaClick(socialMediaName: string) {
trackEvent({
event: "social media",
social: {
socialIconClicked: socialMediaName,
},
})
}
export function trackLoginClick(position: TrackingPosition) {
trackEvent({
event: "loginStart",
login: {
position,
action: "login start",
ctaName: "login",
},
})
}
export function trackLanguageSwitchClick(fromLang: string, toLang: string) {
trackEvent({
event: "languageSelection",
language: {
fromSelection: fromLang,
toSelection: toLang,
},
})
}

41
apps/scandic-web/utils/tracking/payment.ts
View File

@@ -1,41 +0,0 @@
import { trackEvent } from "@scandic-hotels/tracking/base"
import type {
PaymentEvent,
PaymentFailEvent,
} from "@scandic-hotels/tracking/types"
function isPaymentFailEvent(event: PaymentEvent): event is PaymentFailEvent {
return "errorMessage" in event
}
export function trackUpdatePaymentMethod({ method }: { method: string }) {
trackEvent({
event: "paymentSelection",
hotelInfo: {
hotelId: "", // TODO: Needs to be verified with analytics if this should even be here
},
cta: {
name: method,
},
})
}
export function trackPaymentEvent(paymentEvent: PaymentEvent) {
const paymentAttempt = {
event: paymentEvent.event,
hotelInfo: {
hotelId: paymentEvent.hotelId,
},
paymentInfo: {
isSavedCard: paymentEvent.isSavedCreditCard,
status: paymentEvent.status,
type: paymentEvent.method,
smsEnable: paymentEvent.smsEnable,
errorMessage: isPaymentFailEvent(paymentEvent)
? paymentEvent.errorMessage
: undefined,
},
}
trackEvent(paymentAttempt)
}