Files
web/packages/booking-flow/lib/components/EnterDetails/Summary/Mobile/index.tsx
Joakim Jäderberg 7dee6d5083 Merged in chore/move-enter-details (pull request #2778)
Chore/move enter details

Approved-by: Anton Gunnarsson
2025-09-11 07:16:24 +00:00

69 lines
1.8 KiB
TypeScript

"use client"
import { useEnterDetailsStore } from "../../../../stores/enter-details"
import SignupPromoMobile from "../../../SignupPromo/Mobile"
import SummaryUI from "../UI"
import SummaryBottomSheet from "./BottomSheet"
import styles from "./mobile.module.css"
type Props = {
isUserLoggedIn: boolean
}
export default function MobileSummary({ isUserLoggedIn }: Props) {
const { isSummaryOpen, toggleSummaryOpen } = useEnterDetailsStore(
(state) => ({
isSummaryOpen: state.isSummaryOpen,
toggleSummaryOpen: state.actions.toggleSummaryOpen,
})
)
const { booking, rooms, totalPrice, vat, defaultCurrency } =
useEnterDetailsStore((state) => ({
booking: state.booking,
rooms: state.rooms,
totalPrice: state.totalPrice,
vat: state.vat,
defaultCurrency: state.defaultCurrency,
}))
const showPromo =
!isUserLoggedIn &&
rooms.length === 1 &&
!rooms[0].room.guest.join &&
!rooms[0].room.guest.membershipNo
return (
<div className={styles.mobileSummary}>
{showPromo ? (
<div className={styles.signupPromoWrapper}>
<SignupPromoMobile />
</div>
) : null}
{isSummaryOpen && (
<div
className={styles.overlay}
role="presentation"
aria-hidden="true"
onClick={toggleSummaryOpen}
/>
)}
<SummaryBottomSheet isUserLoggedIn={isUserLoggedIn}>
<div className={styles.wrapper}>
<SummaryUI
booking={booking}
rooms={rooms}
isUserLoggedIn={isUserLoggedIn}
totalPrice={totalPrice}
vat={vat}
toggleSummaryOpen={toggleSummaryOpen}
defaultCurrency={defaultCurrency}
/>
</div>
</SummaryBottomSheet>
</div>
)
}