scandic/web
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat(SW-453): Fixed new filter buttons and updated price in summary

Browse Source
This commit is contained in:
Pontus Dreij
2024-10-28 10:43:53 +01:00
parent 7b36139684
commit 8da94fc259
39 changed files with 367 additions and 62 deletions
Download Patch File Download Diff File Expand all files Collapse all files

23
components/HotelReservation/SelectRate/RoomSelection/RateSummary/index.tsx
View File

@@ -7,15 +7,28 @@ import Subtitle from "@/components/TempDesignSystem/Text/Subtitle"
import styles from "./rateSummary.module.css"
import { RateSummaryProps } from "@/types/components/hotelReservation/selectRate/rateSummary"
import { RoomPackageCodeEnum } from "@/types/components/hotelReservation/selectRate/roomFilter"
export default function RateSummary({
rateSummary,
isUserLoggedIn,
packages,
}: RateSummaryProps) {
const intl = useIntl()
const priceToShow = isUserLoggedIn ? rateSummary.member : rateSummary.public
const isPetRoomSelect = rateSummary.features.some(
(feature) => feature.code === RoomPackageCodeEnum.PETR
)
const petRoomPackage = packages.find(
(pkg) => pkg.code === RoomPackageCodeEnum.PETR
)
const petRoomPrice = petRoomPackage ? petRoomPackage.calculatedPrice : null
const petRoomCurrency = petRoomPackage ? petRoomPackage.currency : null
return (
<div className={styles.summary}>
<div className={styles.summaryText}>
@@ -34,6 +47,16 @@ export default function RateSummary({
{priceToShow?.requestedPrice?.currency}
</Body>
</div>
{isPetRoomSelect && (
<div className={styles.petInfo}>
<Body color="uiTextHighContrast" textTransform="bold">
+ {petRoomPrice} {petRoomCurrency}
</Body>
<Body color="uiTextMediumContrast">
{intl.formatMessage({ id: "Pet charge" })}
</Body>
</div>
)}
<Button type="submit" theme="base">
{intl.formatMessage({ id: "Continue" })}
</Button>

5
components/HotelReservation/SelectRate/RoomSelection/RateSummary/rateSummary.module.css
View File

@@ -15,3 +15,8 @@
display: flex;
gap: var(--Spacing-x4);
}
.petInfo {
border-left: 1px solid var(--Primary-Light-On-Surface-Divider-subtle);
padding-left: var(--Spacing-x2);
}