"use client"

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

import { trpc } from "@/lib/trpc/client"

import {
  clearAncillarySessionData,
  getAncillarySessionData,
} from "@/components/HotelReservation/MyStay/utils/ancillaries"
import LoadingSpinner from "@/components/LoadingSpinner"
import {
  trackAncillaryFailed,
  trackAncillarySuccess,
} from "@/utils/tracking/myStay"

import type { Lang } from "@/constants/languages"

export default function GuaranteeAncillaryHandler({
  confirmationNumber,
  returnUrl,
  refId,
  lang,
}: {
  confirmationNumber: string
  refId: string
  returnUrl: string
  lang: Lang
}) {
  const router = useRouter()

  const addAncillary = trpc.booking.packages.useMutation()

  useEffect(() => {
    if (addAncillary.isPending || addAncillary.submittedAt) {
      return
    }

    const sessionData = getAncillarySessionData()
    if (
      !sessionData?.formData ||
      !sessionData?.selectedAncillary ||
      !sessionData?.packages
    ) {
      router.replace(`${returnUrl}&errorCode=AncillaryFailed`)
      return
    }

    const { formData, selectedAncillary, packages, breakfastData } = sessionData

    addAncillary.mutate(
      {
        refId,
        ancillaryComment: formData.optionalText,
        ancillaryDeliveryTime: selectedAncillary.requiresDeliveryTime
          ? formData.deliveryTime
          : undefined,
        packages,
        language: lang,
      },
      {
        onSuccess: (data) => {
          if (data) {
            trackAncillarySuccess(
              confirmationNumber,
              packages,
              formData.deliveryTime,
              "room + ancillary",
              selectedAncillary,
              breakfastData
            )
            clearAncillarySessionData()
            router.replace(returnUrl)
          } else {
            trackAncillaryFailed(
              packages,
              formData.deliveryTime,
              selectedAncillary,
              breakfastData
            )
            router.replace(`${returnUrl}&errorCode=AncillaryFailed`)
          }
        },
        onError: () => {
          trackAncillaryFailed(
            packages,
            formData.deliveryTime,
            selectedAncillary,
            breakfastData
          )
          router.replace(`${returnUrl}&errorCode=AncillaryFailed`)
        },
      }
    )
  }, [confirmationNumber, refId, returnUrl, addAncillary, lang, router])

  return <LoadingSpinner />
}
