98 lines
2.4 KiB
TypeScript
98 lines
2.4 KiB
TypeScript
"use client"
|
|
|
|
import { useEnterDetailsStore } from "@/stores/enter-details"
|
|
|
|
import Summary from "@/components/HotelReservation/Summary"
|
|
import { SummaryBottomSheet } from "@/components/HotelReservation/Summary/BottomSheet"
|
|
|
|
import styles from "./summary.module.css"
|
|
|
|
import type { ClientSummaryProps } from "@/types/components/hotelReservation/enterDetails/summary"
|
|
import type { DetailsState } from "@/types/stores/enter-details"
|
|
|
|
function storeSelector(state: DetailsState) {
|
|
return {
|
|
bedType: state.bedType,
|
|
breakfast: state.breakfast,
|
|
fromDate: state.booking.fromDate,
|
|
join: state.guest.join,
|
|
membershipNo: state.guest.membershipNo,
|
|
packages: state.packages,
|
|
roomRate: state.roomRate,
|
|
roomPrice: state.roomPrice,
|
|
toDate: state.booking.toDate,
|
|
toggleSummaryOpen: state.actions.toggleSummaryOpen,
|
|
totalPrice: state.totalPrice,
|
|
}
|
|
}
|
|
|
|
export default function ClientSummary({
|
|
adults,
|
|
cancellationText,
|
|
isMember,
|
|
kids,
|
|
memberRate,
|
|
rateDetails,
|
|
roomType,
|
|
}: ClientSummaryProps) {
|
|
const {
|
|
bedType,
|
|
breakfast,
|
|
fromDate,
|
|
join,
|
|
membershipNo,
|
|
packages,
|
|
roomPrice,
|
|
toDate,
|
|
toggleSummaryOpen,
|
|
totalPrice,
|
|
} = useEnterDetailsStore(storeSelector)
|
|
|
|
const showMemberPrice = !!(isMember && memberRate) || join || !!membershipNo
|
|
const room = {
|
|
adults,
|
|
cancellationText,
|
|
children: kids,
|
|
packages,
|
|
rateDetails,
|
|
roomPrice,
|
|
roomType,
|
|
}
|
|
|
|
return (
|
|
<>
|
|
<div className={styles.mobileSummary}>
|
|
<SummaryBottomSheet>
|
|
<div className={styles.summary}>
|
|
<Summary
|
|
bedType={bedType}
|
|
breakfast={breakfast}
|
|
fromDate={fromDate}
|
|
showMemberPrice={showMemberPrice}
|
|
room={room}
|
|
toDate={toDate}
|
|
toggleSummaryOpen={toggleSummaryOpen}
|
|
totalPrice={totalPrice}
|
|
/>
|
|
</div>
|
|
</SummaryBottomSheet>
|
|
</div>
|
|
<div className={styles.desktopSummary}>
|
|
<div className={styles.hider} />
|
|
<div className={styles.summary}>
|
|
<Summary
|
|
bedType={bedType}
|
|
breakfast={breakfast}
|
|
fromDate={fromDate}
|
|
showMemberPrice={showMemberPrice}
|
|
room={room}
|
|
toDate={toDate}
|
|
totalPrice={totalPrice}
|
|
/>
|
|
</div>
|
|
<div className={styles.shadow} />
|
|
</div>
|
|
</>
|
|
)
|
|
}
|