import { Suspense } from "react"

import { env } from "@/env/server"

import TrackingSDK from "@/components/TrackingSDK"

import styles from "./page.module.css"

import {
  TrackingChannelEnum,
  type TrackingSDKPageData,
} from "@/types/components/tracking"
import type { LangParams, PageArgs } from "@/types/params"

export default function HotelReservationPage({ params }: PageArgs<LangParams>) {
  if (!env.ENABLE_BOOKING_WIDGET_HOTELRESERVATION_PATH) {
    return null
  }

  const pageTrackingData: TrackingSDKPageData = {
    pageId: "hotelreservation",
    domainLanguage: params.lang,
    channel: TrackingChannelEnum["hotelreservation"],
    pageName: "hotelreservation",
    siteSections: "hotelreservation",
    pageType: "hotelreservationstartpage",
    siteVersion: "new-web",
  }

  return (
    <div className={styles.page}>
      New booking flow! Please report errors/issues in Slack.
      <Suspense fallback={null}>
        <TrackingSDK pageData={pageTrackingData} />
      </Suspense>
    </div>
  )
}