"use client"

import { usePathname, useSearchParams } from "next/navigation"
import { useEffect } from "react"
import { useIntl } from "react-intl"

import { BookingErrorCodeEnum } from "@scandic-hotels/trpc/enums/bookingErrorCode"

import { toast } from "@/components/TempDesignSystem/Toasts"

export default function AvailabilityError() {
  const intl = useIntl()
  const pathname = usePathname()
  const searchParams = useSearchParams()

  const errorCode = searchParams.get("errorCode")
  const hasAvailabilityError =
    errorCode === BookingErrorCodeEnum.AvailabilityError

  const errorMessage = intl.formatMessage({
    defaultMessage:
      "Unfortunately, one of the rooms you selected is sold out. Please choose another room to proceed.",
  })

  useEffect(() => {
    if (hasAvailabilityError) {
      toast.error(errorMessage)

      const newParams = new URLSearchParams(searchParams.toString())
      newParams.delete("errorCode")
      window.history.replaceState({}, "", `${pathname}?${newParams.toString()}`)
    }
  }, [errorMessage, hasAvailabilityError, pathname, searchParams])

  return null
}