"use client" import { useParams } from "next/navigation" import { useIntl } from "react-intl" import { Lang } from "@/constants/languages" import { selectRate } from "@/constants/routes/hotelReservation" import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data" import { CloseLargeIcon, TripAdvisorIcon } from "@/components/Icons" import Image from "@/components/Image" import Button from "@/components/TempDesignSystem/Button" import Chip from "@/components/TempDesignSystem/Chip" import Link from "@/components/TempDesignSystem/Link" import Body from "@/components/TempDesignSystem/Text/Body" import Caption from "@/components/TempDesignSystem/Text/Caption" import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" import styles from "./hotelCardDialog.module.css" import type { HotelCardDialogProps } from "@/types/components/hotelReservation/selectHotel/map" export default function HotelCardDialog({ data, isOpen, handleClose, }: HotelCardDialogProps) { const params = useParams() const lang = params.lang as Lang const intl = useIntl() if (!data) { return null } const { name, publicPrice, memberPrice, currency, amenities, images, ratings, } = data const firstImage = images[0]?.imageSizes?.small const altText = images[0]?.metaData?.altText return (
{altText}
{ratings}
{name}
{amenities.map((facility) => { const IconComponent = mapFacilityToIcon(facility.id) return (
{IconComponent && ( )} {facility.name}
) })}
{intl.formatMessage({ id: "From" })} {publicPrice} {currency} /{intl.formatMessage({ id: "night" })} {memberPrice && ( {memberPrice} {currency} /{intl.formatMessage({ id: "night" })} )}
) }