Merged in fix/SW-2676-tracking-select-hotel (pull request #2165)

Fix/SW-2676 tracking select hotel

* fix(SW-2676): add tracking select hotel

* fix(SW-2676): fix tracking text

* fix(SW-2676): create tracking function


Approved-by: Tobias Johansson

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

@@ -9,6 +9,7 @@ import { useHotelFilterStore } from "@/stores/hotel-filters"
 import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
 import Title from "@/components/TempDesignSystem/Text/Title"
 import useInitializeFiltersFromUrl from "@/hooks/useInitializeFiltersFromUrl"
+import { trackEvent } from "@/utils/tracking/base"
 
 import FilterCheckbox from "./FilterCheckbox"
 
@@ -26,6 +27,31 @@ export default function HotelFilter({ className, filters }: HotelFiltersProps) {
   const toggleFilter = useHotelFilterStore((state) => state.toggleFilter)
   useInitializeFiltersFromUrl()
   const activeFilters = useHotelFilterStore((state) => state.activeFilters)
+  const facilityMap = new Map(
+    filters.facilityFilters.map((f) => [f.id.toString(), f.name])
+  )
+  const surroundingsMap = new Map(
+    filters.surroundingsFilters.map((f) => [f.id.toString(), f.name])
+  )
+
+  function trackFiltersEvent() {
+    const hotelFacilitiesFilter = activeFilters
+      .filter((id) => facilityMap.has(id))
+      .map((id) => facilityMap.get(id))
+      .join(",")
+
+    const hotelSurroundingsFilter = activeFilters
+      .filter((id) => surroundingsMap.has(id))
+      .map((id) => surroundingsMap.get(id))
+      .join(",")
+
+    trackEvent({
+      event: "filterUsed",
+      filter: {
+        filtersUsed: `Filters values - hotelfacilities:${hotelFacilitiesFilter}|hotelsurroundings:${hotelSurroundingsFilter}`,
+      },
+    })
+  }
 
   // Update the URL when the filters changes
   useEffect(() => {
@@ -35,6 +61,7 @@ export default function HotelFilter({ className, filters }: HotelFiltersProps) {
     if (values === "") {
       newSearchParams.delete("filters")
     } else {
+      trackFiltersEvent()
       newSearchParams.set("filters", values)
     }
 

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

@@ -5,6 +5,7 @@ import { useCallback } from "react"
 import { useIntl } from "react-intl"
 
 import Select from "@/components/TempDesignSystem/Select"
+import { trackEvent } from "@/utils/tracking/base"
 
 import {
   type HotelSorterProps,
@@ -28,7 +29,12 @@ export default function HotelSorter({ discreet }: HotelSorterProps) {
 
       const newSearchParams = new URLSearchParams(searchParams)
       newSearchParams.set("sort", newSort)
-
+      trackEvent({
+        event: "sortOptionClick",
+        filter: {
+          sortOptions: newSort,
+        },
+      })
       window.history.replaceState(
         null,
         "",