Merged in feat/sw-3322-move-base-tracking-to-common (pull request #2713)

feat(SW-3322): Move base tracking to common package

* Move base tracking to common package

* Update lock file


Approved-by: Joakim Jäderberg

apps/scandic-web/components/HotelReservation/EnterDetails/Payment/PaymentCallback/HandleErrorCallback.tsx

@@ -4,13 +4,13 @@ import { useRouter } from "next/navigation"
 import { useEffect } from "react"
 
 import { serializeBookingSearchParams } from "@scandic-hotels/booking-flow/utils/url"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 import { PaymentCallbackStatusEnum } from "@/constants/booking"
 import { detailsStorageName } from "@/stores/enter-details"
 
 import LoadingSpinner from "@/components/LoadingSpinner"
 import { trackPaymentEvent } from "@/utils/tracking"
-import { trackEvent } from "@/utils/tracking/base"
 
 import {
   clearPaymentInfoSessionStorage,

apps/scandic-web/components/HotelReservation/EnterDetails/Payment/PaymentCallback/tracking.ts

@@ -1,4 +1,4 @@
-import { trackEvent } from "@/utils/tracking/base"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 import { clearGlaSessionStorage, readGlaFromSessionStorage } from "./helpers"
 

apps/scandic-web/components/HotelReservation/EnterDetails/Payment/PaymentClient.tsx

@@ -15,6 +15,7 @@ import {
 } from "@scandic-hotels/common/constants/routes/hotelReservation"
 import useStickyPosition from "@scandic-hotels/common/hooks/useStickyPosition"
 import { logger } from "@scandic-hotels/common/logger"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 import Body from "@scandic-hotels/design-system/Body"
 import { Button } from "@scandic-hotels/design-system/Button"
 import Checkbox from "@scandic-hotels/design-system/Form/Checkbox"
@@ -35,7 +36,6 @@ import { useHandleBookingStatus } from "@/hooks/booking/useHandleBookingStatus"
 import useLang from "@/hooks/useLang"
 import { formatPhoneNumber } from "@/utils/phone"
 import { trackPaymentEvent } from "@/utils/tracking"
-import { trackEvent } from "@/utils/tracking/base"
 import { trackGlaSaveCardAttempt } from "@/utils/tracking/myStay"
 
 import ConfirmBooking, { ConfirmBookingRedemption } from "../Confirm"

apps/scandic-web/components/HotelReservation/MyStay/TrackGuarantee.tsx

@@ -3,6 +3,8 @@
 import { useRouter } from "next/navigation"
 import { useEffect } from "react"
 
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
+
 import { PaymentCallbackStatusEnum } from "@/constants/booking"
 
 import {
@@ -11,7 +13,6 @@ import {
 } from "@/components/HotelReservation/EnterDetails/Payment/PaymentCallback/helpers"
 import { getAncillarySessionData } from "@/components/HotelReservation/MyStay/utils/ancillaries"
 import LoadingSpinner from "@/components/LoadingSpinner"
-import { trackEvent } from "@/utils/tracking/base"
 import {
   buildAncillariesTracking,
   buildBreakfastTracking,

apps/scandic-web/components/HotelReservation/SelectHotel/Filters/HotelFilter/index.tsx

@@ -3,10 +3,11 @@
 import { usePathname, useSearchParams } from "next/navigation"
 import { useCallback, useEffect } from "react"
 
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
+
 import { useHotelFilterStore } from "@/stores/hotel-filters"
 
 import useInitializeFiltersFromUrl from "@/hooks/useInitializeFiltersFromUrl"
-import { trackEvent } from "@/utils/tracking/base"
 
 import FilterContent from "../FilterContent"
 

apps/scandic-web/components/HotelReservation/SelectHotel/HotelSorter/index.tsx

@@ -4,10 +4,9 @@ import { usePathname, useSearchParams } from "next/navigation"
 import { useCallback } from "react"
 import { useIntl } from "react-intl"
 
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 import DeprecatedSelect from "@scandic-hotels/design-system/DeprecatedSelect"
 
-import { trackEvent } from "@/utils/tracking/base"
-
 import {
   type HotelSorterProps,
   type SortItem,

apps/scandic-web/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContent/index.tsx

@@ -15,6 +15,7 @@ import {
   selectHotel,
 } from "@scandic-hotels/common/constants/routes/hotelReservation"
 import { useScrollToTop } from "@scandic-hotels/common/hooks/useScrollToTop"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 import { debounce } from "@scandic-hotels/common/utils/debounce"
 import { BackToTopButton } from "@scandic-hotels/design-system/BackToTopButton"
 import { Button } from "@scandic-hotels/design-system/Button"
@@ -30,7 +31,6 @@ import { RoomCardSkeleton } from "@/components/HotelReservation/RoomCardSkeleton
 import { useIsUserLoggedIn } from "@/hooks/useIsUserLoggedIn"
 import useLang from "@/hooks/useLang"
 import { mapApiImagesToGalleryImages } from "@/utils/imageGallery"
-import { trackEvent } from "@/utils/tracking/base"
 
 import FilterAndSortModal from "../../Filters/FilterAndSortModal"
 import HotelListing from "../HotelListing"

apps/scandic-web/components/TrackingSDK/hooks.ts

@@ -15,6 +15,7 @@ import {
   type UseFromSubscribe,
 } from "react-hook-form"
 
+import { useSessionId } from "@scandic-hotels/common/hooks/useSessionId"
 import { logger } from "@scandic-hotels/common/logger"
 import { trpc } from "@scandic-hotels/trpc/client"
 
@@ -22,7 +23,6 @@ import useRouterTransitionStore from "@/stores/router-transition"
 import useTrackingStore from "@/stores/tracking"
 
 import useLang from "@/hooks/useLang"
-import { useSessionId } from "@/hooks/useSessionId"
 import { promiseWithTimeout } from "@/utils/promiseWithTimeout"
 import { createSDKPageObject, trackPageView } from "@/utils/tracking"
 import {

apps/scandic-web/hooks/booking/useGuaranteeBooking.ts

@@ -2,12 +2,12 @@ import { useRouter } from "next/navigation"
 import { useCallback, useEffect, useState } from "react"
 import { useIntl } from "react-intl"
 
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 import { trpc } from "@scandic-hotels/trpc/client"
 import { BookingStatusEnum } from "@scandic-hotels/trpc/enums/bookingStatus"
 
 import { toast } from "@/components/TempDesignSystem/Toasts"
 import { useHandleBookingStatus } from "@/hooks/booking/useHandleBookingStatus"
-import { trackEvent } from "@/utils/tracking/base"
 
 const maxRetries = 15
 const retryInterval = 2000

apps/scandic-web/stores/enter-details/helpers.ts

@@ -2,8 +2,8 @@ import isEqual from "fast-deep-equal"
 import { parsePhoneNumberFromString } from "libphonenumber-js"
 
 import { CurrencyEnum } from "@scandic-hotels/common/constants/currency"
-import { logger } from "@scandic-hotels/common/logger"
 import { RateTypeEnum } from "@scandic-hotels/common/constants/rateType"
+import { logger } from "@scandic-hotels/common/logger"
 
 import {
   sumPackages,

apps/scandic-web/utils/tracking/booking.ts

@@ -1,6 +1,6 @@
 "use client"
 
-import { trackEvent } from "./base"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 import type { BreakfastPackages } from "@/types/components/hotelReservation/breakfast"
 import type { LowestRoomPriceEvent } from "@/types/components/tracking"

apps/scandic-web/utils/tracking/componentEvents.ts

@@ -1,5 +1,5 @@
 "use client"
-import { trackEvent } from "./base"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 export function trackAccordionClick(option: string) {
   trackEvent({

apps/scandic-web/utils/tracking/destinationPage.ts

@@ -1,4 +1,4 @@
-import { trackEvent } from "./base"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 export function trackSortingChangeEvent(sortOption: string) {
   trackEvent({

apps/scandic-web/utils/tracking/form.ts

@@ -1,4 +1,4 @@
-import { trackEvent } from "./base"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 export type FormType = "checkout" | "signup"
 

apps/scandic-web/utils/tracking/hotelPage.ts

@@ -1,4 +1,4 @@
-import { trackEvent } from "./base"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 export function trackHotelMapClick() {
   trackEvent({

apps/scandic-web/utils/tracking/index.ts

@@ -1,4 +1,3 @@
-export { trackClick } from "./base"
 export {
   trackBedSelection,
   trackBreakfastSelection,
@@ -18,3 +17,4 @@ export {
   trackPageViewStart,
 } from "./pageview"
 export { trackPaymentEvent, trackUpdatePaymentMethod } from "./payment"
+export { trackClick } from "@scandic-hotels/common/tracking/base"

apps/scandic-web/utils/tracking/myStay.ts

@@ -1,8 +1,7 @@
 import { CurrencyEnum } from "@scandic-hotels/common/constants/currency"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 import { BreakfastPackageEnum } from "@scandic-hotels/trpc/enums/breakfast"
 
-import { trackEvent } from "./base"
-
 import type { PackageSchema } from "@scandic-hotels/trpc/types/bookingConfirmation"
 import type { CreditCard } from "@scandic-hotels/trpc/types/user"
 

apps/scandic-web/utils/tracking/navigation.ts

@@ -1,4 +1,4 @@
-import { trackEvent } from "./base"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 import type { TrackingPosition } from "@/types/components/tracking"
 

apps/scandic-web/utils/tracking/pageview.ts

@@ -1,4 +1,4 @@
-import { trackEvent } from "./base"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 import type { TrackingSDKData } from "@/types/components/tracking"
 

apps/scandic-web/utils/tracking/payment.ts

@@ -1,4 +1,4 @@
-import { trackEvent } from "./base"
+import { trackEvent } from "@scandic-hotels/common/tracking/base"
 
 import type {
   PaymentEvent,

packages/common/global.d.ts

@@ -2,4 +2,14 @@ import type { DataCache } from "./dataCache/Cache"
 
 declare global {
   var cacheClient: Promise<DataCache> | undefined
+
+  interface Window {
+    dataLayer: {
+      [key: string]: any
+      push: (...args: unknown) => void
+    }
+    adobeDataLayer: {
+      push: (...args: unknown) => void
+    }
+  }
 }

packages/common/package.json

@@ -15,6 +15,7 @@
     "./dataCache": "./dataCache/index.ts",
     "./telemetry": "./telemetry/index.ts",
     "./tokenManager": "./tokenManager/index.ts",
+    "./tracking/base": "./tracking/base.ts",
     "./dt": "./dt/dt.ts",
     "./logger": "./logger/index.ts",
     "./logger/*": "./logger/*.ts",
@@ -52,6 +53,7 @@
     "deepmerge": "^4.3.1",
     "flat": "^6.0.1",
     "lodash-es": "^4.17.21",
+    "nanoid": "^5.1.5",
     "zod": "^3.24.4",
     "zustand": "^4.5.2"
   },

packages/common/tracking/base.ts

@@ -1,8 +1,7 @@
 "use client"
 
-import { logger } from "@scandic-hotels/common/logger"
-
-import { SESSION_ID_KEY_NAME } from "@/hooks/useSessionId"
+import { SESSION_ID_KEY_NAME } from "../hooks/useSessionId"
+import { logger } from "../logger"
 
 export function trackEvent(data: any) {
   if (

yarn.lock

@@ -6158,6 +6158,7 @@ __metadata:
     eslint-plugin-simple-import-sort: "npm:^12.1.1"
     flat: "npm:^6.0.1"
     lodash-es: "npm:^4.17.21"
+    nanoid: "npm:^5.1.5"
     typescript: "npm:5.8.3"
     vitest: "npm:^3.2.4"
     zod: "npm:^3.24.4"