"use client"
import { DialogTrigger } from "react-aria-components"
import { useIntl } from "react-intl"

import Modal from "@/components/HotelReservation/MyStay/Modal"
import CustomerSupportModal from "@/components/HotelReservation/MyStay/ReferenceCard/Actions/CustomerSupportModal"
import { trackMyStayPageLink } from "@/utils/tracking"

export default function CustomerSupport() {
  const intl = useIntl()

  function trackCustomerSupport() {
    trackMyStayPageLink("customer service")
  }

  return (
    <DialogTrigger>
      <Modal.Button icon="support_agent" onClick={trackCustomerSupport}>
        {intl.formatMessage({ defaultMessage: "Customer support" })}
      </Modal.Button>
      <CustomerSupportModal />
    </DialogTrigger>
  )
}
