Files
web/apps/scandic-web/components/HotelReservation/EnterDetails/Details/RoomOne/MemberPriceModal/index.tsx
Matilda Landström 5de2a993a7 Merged in feat/SW-1711-switch-icons (pull request #1558)
Switches out all the old icons to new ones, and moves them to the design system. The new icons are of three different types: Materialise Symbol, Nucleo, and Customized. Also adds further mapping between facilities/amenities and icons.

Approved-by: Michael Zetterberg
Approved-by: Erik Tiekstra
2025-03-27 09:42:52 +00:00

69 lines
2.0 KiB
TypeScript

"use client"
import { useIntl } from "react-intl"
import { MagicWandIcon } from "@scandic-hotels/design-system/Icons"
import Modal from "@/components/Modal"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import Title from "@/components/TempDesignSystem/Text/Title"
import { useRoomContext } from "@/contexts/Details/Room"
import { formatPrice } from "@/utils/numberFormatting"
import styles from "./modal.module.css"
import type { Dispatch, SetStateAction } from "react"
import { CurrencyEnum } from "@/types/enums/currency"
export default function MemberPriceModal({
isOpen,
setIsOpen,
}: {
isOpen: boolean
setIsOpen: Dispatch<SetStateAction<boolean>>
}) {
const { room } = useRoomContext()
const memberRate = room.roomRate.memberRate
const intl = useIntl()
const memberPrice = memberRate?.localPrice ?? memberRate?.requestedPrice
return (
<Modal isOpen={isOpen} onToggle={setIsOpen}>
<div className={styles.modalContent}>
<div className={styles.innerModalContent}>
<MagicWandIcon width="265px" />
<Title as="h3" level="h1" textTransform="regular">
{intl.formatMessage({
id: "Member price activated",
})}
</Title>
{memberPrice && (
<span className={styles.newPrice}>
<Body>
{intl.formatMessage({
id: "The new price is",
})}
</Body>
<Subtitle type="two" color="red">
{formatPrice(
intl,
memberPrice.pricePerStay ?? 0,
memberPrice.currency ?? CurrencyEnum.Unknown
)}
</Subtitle>
</span>
)}
</div>
<Button intent="primary" theme="base" onClick={() => setIsOpen(false)}>
{intl.formatMessage({ id: "OK" })}
</Button>
</div>
</Modal>
)
}