web/apps/scandic-web/components/HotelReservation/BookingConfirmation/Tracking/index.tsx

"use client"

import { useEffect, useState } from "react"

import { useBookingConfirmationStore } from "@/stores/booking-confirmation"

import TrackingSDK from "@/components/TrackingSDK"
import useLang from "@/hooks/useLang"
import { useSearchHistory } from "@/hooks/useSearchHistory"

import { clearPaymentInfoSessionStorage } from "../../EnterDetails/Payment/helpers"
import { getTracking } from "./tracking"

import type { BookingConfirmation } from "@scandic-hotels/trpc/types/bookingConfirmation"

import type { Room } from "@/types/stores/booking-confirmation"

export default function Tracking({
  bookingConfirmation,
  refId,
}: {
  bookingConfirmation: BookingConfirmation
  refId: string
}) {
  const lang = useLang()
  const bookingRooms = useBookingConfirmationStore((state) => state.rooms)

  const [loadedBookingConfirmationRefId] = useState(() => {
    if (typeof window !== "undefined") {
      return sessionStorage.getItem("loadedBookingConfirmationRefId")
    }
    return null
  })

  useEffect(() => {
    sessionStorage.setItem("loadedBookingConfirmationRefId", refId)
  }, [refId])

  const searchHistory = useSearchHistory()
  const searchTerm = searchHistory.searchHistory[0]?.name

  let trackingData = null

  if (bookingRooms.every(Boolean)) {
    const rooms = bookingRooms.filter((room): room is Room => !!room)
    trackingData = getTracking(
      lang,
      bookingConfirmation.booking,
      bookingConfirmation.hotel,
      rooms,
      searchTerm
    )
  }

  useEffect(() => {
    if (trackingData?.paymentInfo) {
      clearPaymentInfoSessionStorage()
    }
  }, [trackingData])

  if (!trackingData) {
    return null
  }

  const { hotelsTrackingData, pageTrackingData, paymentInfo, ancillaries } =
    trackingData

  return (
    <TrackingSDK
      pageData={pageTrackingData}
      hotelInfo={
        loadedBookingConfirmationRefId === refId
          ? undefined
          : hotelsTrackingData
      }
      paymentInfo={
        loadedBookingConfirmationRefId === refId ? undefined : paymentInfo
      }
      ancillaries={
        loadedBookingConfirmationRefId === refId ? undefined : ancillaries
      }
    />
  )
}