Merged in feat/SW-965-select-rate-modify-room (pull request #1326)

Feat/SW-965 select rate modify room

* feat(SW-965): added new state for modify room and smaller fixes

* feat(SW-965): update state handling of modifyRateIndex

* fix: adjust scroll animation to handle modifyRateIndex

* fix: room state logic and removed unused css class


Approved-by: Pontus Dreij
Approved-by: Arvid Norlin
This commit is contained in:
Tobias Johansson
2025-02-14 07:48:30 +00:00
parent f9a03052b1
commit 53b6628b25
10 changed files with 210 additions and 118 deletions

View File

@@ -7,6 +7,7 @@ import { useRateSelectionStore } from "@/stores/select-rate/rate-selection"
import { EditIcon } from "@/components/Icons"
import Image from "@/components/Image"
import Button from "@/components/TempDesignSystem/Button"
import Body from "@/components/TempDesignSystem/Text/Body"
import Caption from "@/components/TempDesignSystem/Text/Caption"
import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
@@ -42,41 +43,45 @@ export default function SelectedRoomPanel({
return (
<div className={styles.selectedRoomPanel}>
<div>
<Caption type="bold">
{intl.formatMessage(
{
id: "Room {roomIndex}",
},
{
roomIndex: roomIndex + 1,
}
)}
</Caption>
<Subtitle>
{selectedRate?.roomType},{" "}
{intl.formatMessage(
{
id: room.childrenInRoom?.length
? "{adults} adults, {children} children"
: "{adults} adults",
},
{
adults: room.adults,
children: room.childrenInRoom?.length,
}
)}
</Subtitle>
<Caption>
{selectedRate?.priceName}, {selectedRate?.priceTerm}
</Caption>
<Caption>
{selectedRate?.public.localPrice.pricePerNight}{" "}
{selectedRate?.public.localPrice.currency}/
{intl.formatMessage({
id: "night",
})}
</Caption>
<div className={styles.titleContainer}>
<div>
<Caption type="regular">
{intl.formatMessage(
{
id: "Room {roomIndex}",
},
{
roomIndex: roomIndex + 1,
}
)}
</Caption>
<Subtitle color="uiTextHighContrast">
{selectedRate?.roomType},{" "}
{intl.formatMessage(
{
id: room.childrenInRoom?.length
? "{adults} adults, {children} children"
: "{adults} adults",
},
{
adults: room.adults,
children: room.childrenInRoom?.length,
}
)}
</Subtitle>
</div>
<div>
<Body>
{selectedRate?.priceName}, {selectedRate?.priceTerm}
</Body>
<Body>
{selectedRate?.public.localPrice.pricePerNight}{" "}
{selectedRate?.public.localPrice.currency}/
{intl.formatMessage({
id: "night",
})}
</Body>
</div>
</div>
<div className={styles.imageAndModifyButtonContainer}>
{images?.[0]?.imageSizes?.tiny && (