import { useIntl } from "react-intl" import { mapFacilityToIcon } from "@/components/ContentType/HotelPage/data" import Contact from "@/components/HotelReservation/Contact" import { AccessibilityIcon } from "@/components/Icons" import Accordion from "@/components/TempDesignSystem/Accordion" import AccordionItem from "@/components/TempDesignSystem/Accordion/AccordionItem" import Button from "@/components/TempDesignSystem/Button" import SidePeek from "@/components/TempDesignSystem/SidePeek" import Body from "@/components/TempDesignSystem/Text/Body" import Subtitle from "@/components/TempDesignSystem/Text/Subtitle" import styles from "./hotelSidePeek.module.css" import type { HotelSidePeekProps } from "@/types/components/hotelReservation/hotelSidePeek" import type { ParkingProps } from "@/types/components/hotelReservation/selectHotel/selectHotel" import { SidePeekEnum } from "@/types/components/hotelReservation/sidePeek" import { IconName } from "@/types/components/icon" import type { Amenities, Hotel } from "@/types/hotel" function getAmenitiesList(hotel: Hotel) { const detailedAmenities: Amenities = hotel.detailedFacilities.filter( // Remove Parking facilities since parking accordion is based on hotel.parking (facility) => !facility.name.startsWith("Parking") && facility.public ) return detailedAmenities } export default function HotelSidePeek({ hotel, activeSidePeek, close, showCTA, }: HotelSidePeekProps) { const intl = useIntl() const amenitiesList = getAmenitiesList(hotel) return (

{intl.formatMessage({ id: "Practical information" })} {/* parking */} {hotel.parking.length ? ( {hotel.parking.map((p) => ( ))} ) : null}

{intl.formatMessage({ id: "Accessibility" })}

{amenitiesList.map((amenity) => { const Icon = mapFacilityToIcon(amenity.id) return (

{Icon && ( )} {amenity.name}

) })} {showCTA && ( /* TODO: handle linking to Hotel Page */ )}

) } function Parking({ parking }: ParkingProps) { const intl = useIntl() return (

{`${intl.formatMessage({ id: parking.type })} (${parking.name})`}

{`${intl.formatMessage({ id: "Number of charging points for electric cars", })}: ${parking.numberOfChargingSpaces}`}
{`${intl.formatMessage({ id: "Parking can be reserved in advance" })}: ${parking.canMakeReservation ? intl.formatMessage({ id: "Yes" }) : intl.formatMessage({ id: "No" })}`}
{`${intl.formatMessage({ id: "Number of parking spots" })}: ${parking.numberOfParkingSpots}`}
{`${intl.formatMessage({ id: "Distance to hotel" })}: ${parking.distanceToHotel} m`}
{`${intl.formatMessage({ id: "Address" })}: ${parking.address}`}

) }