"use client" import { useIntl } from "react-intl" import { BookingStatusEnum } from "@/constants/booking" import { ChevronDownIcon } from "@/components/Icons" import Modal from "@/components/Modal" import Button from "@/components/TempDesignSystem/Button" import GuaranteeLateArrival from "../GuaranteeLateArrival" import { useManageStayStore } from "../stores/manageStayStore" import CancelStay from "./ActionPanel/Actions/CancelStay" import ModifyStay from "./ActionPanel/Actions/ModifyStay" import ActionPanel from "./ActionPanel" import type { Hotel } from "@/types/hotel" import type { BookingConfirmation } from "@/types/trpc/routers/booking/confirmation" import { type CreditCard, type User } from "@/types/user" interface ManageStayProps { booking: BookingConfirmation["booking"] hotel: Hotel setBookingStatus: (status: BookingStatusEnum) => void bookingStatus: string | null user: User | null savedCreditCards: CreditCard[] | null refId: string } export default function ManageStay({ booking, hotel, setBookingStatus, bookingStatus, user, savedCreditCards, refId, }: ManageStayProps) { const intl = useIntl() const { isOpen, activeView, actions: { setIsOpen, handleCloseModal, setActiveView }, } = useManageStayStore() const showGuaranteeButton = bookingStatus !== BookingStatusEnum.Cancelled && !booking.guaranteeInfo function renderContent() { switch (activeView) { case "cancelStay": return ( setBookingStatus(BookingStatusEnum.Cancelled) } /> ) case "modifyStay": return case "guaranteeLateArrival": return ( setActiveView("actionPanel")} savedCreditCards={savedCreditCards} refId={refId} /> ) default: return ( setActiveView("cancelStay")} onGuaranteeClick={() => setActiveView("guaranteeLateArrival")} showGuaranteeButton={showGuaranteeButton} /> ) } } return ( <> {renderContent()} ) }