53 lines
1.3 KiB
TypeScript
53 lines
1.3 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 { rooms, isSummaryOpen, toggleSummaryOpen } = useEnterDetailsStore(
|
|
(state) => ({
|
|
rooms: state.rooms,
|
|
isSummaryOpen: state.isSummaryOpen,
|
|
toggleSummaryOpen: state.actions.toggleSummaryOpen,
|
|
})
|
|
)
|
|
|
|
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 isUserLoggedIn={isUserLoggedIn} />
|
|
</div>
|
|
</SummaryBottomSheet>
|
|
</div>
|
|
)
|
|
}
|