"use client"

import { useSearchParams } from "next/navigation"
import { useEffect } from "react"

import TrackingSDK from "@/components/TrackingSDK"
import { trackOpenMapView } from "@/utils/tracking/destinationPage"

import type { TrackingSDKPageData } from "@/types/components/tracking"

interface DestinationTrackingProps {
  pageData: TrackingSDKPageData
}

export default function DestinationTracking({
  pageData,
}: DestinationTrackingProps) {
  const searchParams = useSearchParams()
  const isMapView = searchParams.get("view") === "map"
  const pagetype =
    pageData.pageType === "countrypage"
      ? "countrymapviewpage"
      : "citymapviewpage"
  const pagename = `${pageData.pageName}|map-view`

  useEffect(() => {
    if (isMapView) {
      trackOpenMapView(pagename, pagetype)
    }
  }, [isMapView, pagename, pagetype])

  return <TrackingSDK pageData={pageData} />
}
