80 lines
2.0 KiB
TypeScript
80 lines
2.0 KiB
TypeScript
"use client"
|
|
|
|
import { useIntl } from "react-intl"
|
|
|
|
import { Typography } from "@scandic-hotels/design-system/Typography"
|
|
|
|
import styles from "./parkingList.module.css"
|
|
|
|
import type { ParkingListProps } from "@/types/components/hotelPage/sidepeek/parking"
|
|
|
|
export default function ParkingList({
|
|
numberOfChargingSpaces,
|
|
canMakeReservation,
|
|
numberOfParkingSpots,
|
|
distanceToHotel,
|
|
address,
|
|
}: ParkingListProps) {
|
|
const intl = useIntl()
|
|
|
|
const canMakeReservationYesMsg = intl.formatMessage({
|
|
defaultMessage: "Parking can be reserved in advance: Yes",
|
|
})
|
|
const canMakeReservationNoMsg = intl.formatMessage({
|
|
defaultMessage: "Parking can be reserved in advance: No",
|
|
})
|
|
|
|
return (
|
|
<Typography variant="Body/Paragraph/mdRegular">
|
|
<ul className={styles.listStyling}>
|
|
{numberOfChargingSpaces ? (
|
|
<li>
|
|
{intl.formatMessage(
|
|
{
|
|
defaultMessage:
|
|
"Number of charging points for electric cars: {number}",
|
|
},
|
|
{ number: numberOfChargingSpaces }
|
|
)}
|
|
</li>
|
|
) : null}
|
|
<li>
|
|
{canMakeReservation
|
|
? canMakeReservationYesMsg
|
|
: canMakeReservationNoMsg}
|
|
</li>
|
|
{numberOfParkingSpots ? (
|
|
<li>
|
|
{intl.formatMessage(
|
|
{
|
|
defaultMessage: "Number of parking spots: {number}",
|
|
},
|
|
{ number: numberOfParkingSpots }
|
|
)}
|
|
</li>
|
|
) : null}
|
|
{distanceToHotel ? (
|
|
<li>
|
|
{intl.formatMessage(
|
|
{
|
|
defaultMessage: "Distance to hotel: {distanceInM} m",
|
|
},
|
|
{ distanceInM: distanceToHotel }
|
|
)}
|
|
</li>
|
|
) : null}
|
|
{address ? (
|
|
<li>
|
|
{intl.formatMessage(
|
|
{
|
|
defaultMessage: "Address: {address}",
|
|
},
|
|
{ address }
|
|
)}
|
|
</li>
|
|
) : null}
|
|
</ul>
|
|
</Typography>
|
|
)
|
|
}
|