import { SelectHotelPage as SelectHotelPagePrimitive } from "@scandic-hotels/booking-flow/pages/SelectHotelPage"
import { AlertTypeEnum } from "@scandic-hotels/common/constants/alert"
import { toCapitalCase } from "@scandic-hotels/common/utils/toCapitalCase"
import { Alert } from "@scandic-hotels/design-system/Alert"

import { bookingFlowConfig } from "@/constants/bookingFlowConfig"

import { getIntl } from "@/i18n"
import { getLang } from "@/i18n/serverContext"

import type { Metadata } from "next"

import type { LangParams, PageArgs } from "@/types/params"

export async function generateMetadata({
  searchParams,
}: PageArgs<LangParams>): Promise<Metadata> {
  const { city } = await searchParams

  if (!city || Array.isArray(city)) {
    return {}
  }

  return {
    title: `${toCapitalCase(city)}`,
  }
}

export default async function SelectHotelPage(props: PageArgs<LangParams>) {
  const searchParams = await props.searchParams
  const lang = await getLang()
  const intl = await getIntl()

  return (
    <SelectHotelPagePrimitive
      lang={lang}
      searchParams={searchParams}
      config={bookingFlowConfig}
      topSlot={
        bookingFlowConfig.redemptionEnabled ? (
          <Alert
            heading={intl.formatMessage({
              id: "selectHotel.earnEuroBonusPointsAlert.heading",
              defaultMessage: "Earn & use EuroBonus points",
            })}
            text={intl.formatMessage({
              id: "selectHotel.earnEuroBonusPointsAlert.text",
              defaultMessage:
                "Collect new points with every booking, or use your current points to pay for hotel stays.",
            })}
            type={AlertTypeEnum.Info}
          />
        ) : undefined
      }
    />
  )
}