feat(SW-826): Added showCTA prop
This commit is contained in:
@@ -10,12 +10,12 @@ import styles from "./readMore.module.css"
|
|||||||
import { ReadMoreProps } from "@/types/components/hotelReservation/selectHotel/selectHotel"
|
import { ReadMoreProps } from "@/types/components/hotelReservation/selectHotel/selectHotel"
|
||||||
import { SidePeekEnum } from "@/types/components/hotelReservation/sidePeek"
|
import { SidePeekEnum } from "@/types/components/hotelReservation/sidePeek"
|
||||||
|
|
||||||
export default function ReadMore({ label, hotelId }: ReadMoreProps) {
|
export default function ReadMore({ label, hotelId, showCTA }: ReadMoreProps) {
|
||||||
const openSidePeek = useSidePeekStore((state) => state.openSidePeek)
|
const openSidePeek = useSidePeekStore((state) => state.openSidePeek)
|
||||||
return (
|
return (
|
||||||
<Button
|
<Button
|
||||||
onPress={() => {
|
onPress={() => {
|
||||||
openSidePeek({ key: SidePeekEnum.hotelDetails, hotelId })
|
openSidePeek({ key: SidePeekEnum.hotelDetails, hotelId, showCTA })
|
||||||
}}
|
}}
|
||||||
intent="text"
|
intent="text"
|
||||||
theme="base"
|
theme="base"
|
||||||
|
|||||||
@@ -81,6 +81,7 @@ export default function HotelInfoCard({ hotelData }: HotelInfoCardProps) {
|
|||||||
label={intl.formatMessage({ id: "Show all amenities" })}
|
label={intl.formatMessage({ id: "Show all amenities" })}
|
||||||
hotelId={hotelAttributes.operaId}
|
hotelId={hotelAttributes.operaId}
|
||||||
hotel={hotelAttributes}
|
hotel={hotelAttributes}
|
||||||
|
showCTA={false}
|
||||||
/>
|
/>
|
||||||
</div>
|
</div>
|
||||||
</div>
|
</div>
|
||||||
|
|||||||
@@ -17,6 +17,7 @@ export default function HotelReservationSidePeek({
|
|||||||
const activeSidePeek = useSidePeekStore((state) => state.activeSidePeek)
|
const activeSidePeek = useSidePeekStore((state) => state.activeSidePeek)
|
||||||
const hotelId = useSidePeekStore((state) => state.hotelId)
|
const hotelId = useSidePeekStore((state) => state.hotelId)
|
||||||
const roomTypeCode = useSidePeekStore((state) => state.roomTypeCode)
|
const roomTypeCode = useSidePeekStore((state) => state.roomTypeCode)
|
||||||
|
const showCTA = useSidePeekStore((state) => state.showCTA)
|
||||||
const close = useSidePeekStore((state) => state.closeSidePeek)
|
const close = useSidePeekStore((state) => state.closeSidePeek)
|
||||||
const lang = useLang()
|
const lang = useLang()
|
||||||
|
|
||||||
@@ -43,6 +44,7 @@ export default function HotelReservationSidePeek({
|
|||||||
hotel={hotelData.data?.attributes}
|
hotel={hotelData.data?.attributes}
|
||||||
activeSidePeek={activeSidePeek}
|
activeSidePeek={activeSidePeek}
|
||||||
close={close}
|
close={close}
|
||||||
|
showCTA={showCTA}
|
||||||
/>
|
/>
|
||||||
)}
|
)}
|
||||||
{selectedRoom && (
|
{selectedRoom && (
|
||||||
|
|||||||
@@ -27,12 +27,11 @@ export default function HotelSidePeek({
|
|||||||
hotel,
|
hotel,
|
||||||
activeSidePeek,
|
activeSidePeek,
|
||||||
close,
|
close,
|
||||||
|
showCTA = true,
|
||||||
}: HotelSidePeekProps) {
|
}: HotelSidePeekProps) {
|
||||||
const intl = useIntl()
|
const intl = useIntl()
|
||||||
const amenitiesList = getAmenitiesList(hotel)
|
const amenitiesList = getAmenitiesList(hotel)
|
||||||
|
|
||||||
const isSelectHotelPage = window.location.href.includes("select-hotel")
|
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<SidePeek
|
<SidePeek
|
||||||
title={hotel.name}
|
title={hotel.name}
|
||||||
@@ -64,7 +63,7 @@ export default function HotelSidePeek({
|
|||||||
)
|
)
|
||||||
})}
|
})}
|
||||||
</Accordion>
|
</Accordion>
|
||||||
{isSelectHotelPage && (
|
{showCTA && (
|
||||||
/* TODO: handle linking to Hotel Page */
|
/* TODO: handle linking to Hotel Page */
|
||||||
<Button theme={"base"}>To the hotel</Button>
|
<Button theme={"base"}>To the hotel</Button>
|
||||||
)}
|
)}
|
||||||
|
|||||||
@@ -6,14 +6,17 @@ interface SidePeekState {
|
|||||||
activeSidePeek: SidePeekEnum | null
|
activeSidePeek: SidePeekEnum | null
|
||||||
hotelId: string | null
|
hotelId: string | null
|
||||||
roomTypeCode: string | null
|
roomTypeCode: string | null
|
||||||
|
showCTA: boolean
|
||||||
openSidePeek: ({
|
openSidePeek: ({
|
||||||
key,
|
key,
|
||||||
hotelId,
|
hotelId,
|
||||||
roomTypeCode,
|
roomTypeCode,
|
||||||
|
showCTA,
|
||||||
}: {
|
}: {
|
||||||
key: SidePeekEnum | null
|
key: SidePeekEnum | null
|
||||||
hotelId: string
|
hotelId: string
|
||||||
roomTypeCode?: string
|
roomTypeCode?: string
|
||||||
|
showCTA?: boolean
|
||||||
}) => void
|
}) => void
|
||||||
closeSidePeek: () => void
|
closeSidePeek: () => void
|
||||||
}
|
}
|
||||||
@@ -22,8 +25,9 @@ const useSidePeekStore = create<SidePeekState>((set) => ({
|
|||||||
activeSidePeek: null,
|
activeSidePeek: null,
|
||||||
hotelId: null,
|
hotelId: null,
|
||||||
roomTypeCode: null,
|
roomTypeCode: null,
|
||||||
openSidePeek: ({ key, hotelId, roomTypeCode }) =>
|
showCTA: true,
|
||||||
set({ activeSidePeek: key, hotelId, roomTypeCode }),
|
openSidePeek: ({ key, hotelId, roomTypeCode, showCTA }) =>
|
||||||
|
set({ activeSidePeek: key, hotelId, roomTypeCode, showCTA }),
|
||||||
closeSidePeek: () =>
|
closeSidePeek: () =>
|
||||||
set({ activeSidePeek: null, hotelId: null, roomTypeCode: null }),
|
set({ activeSidePeek: null, hotelId: null, roomTypeCode: null }),
|
||||||
}))
|
}))
|
||||||
|
|||||||
@@ -5,4 +5,5 @@ export type HotelSidePeekProps = {
|
|||||||
hotel: Hotel
|
hotel: Hotel
|
||||||
activeSidePeek: SidePeekEnum
|
activeSidePeek: SidePeekEnum
|
||||||
close: () => void
|
close: () => void
|
||||||
|
showCTA?: boolean
|
||||||
}
|
}
|
||||||
|
|||||||
@@ -9,6 +9,7 @@ export interface ReadMoreProps {
|
|||||||
label: string
|
label: string
|
||||||
hotelId: string
|
hotelId: string
|
||||||
hotel: Hotel
|
hotel: Hotel
|
||||||
|
showCTA: boolean
|
||||||
}
|
}
|
||||||
|
|
||||||
export interface ContactProps {
|
export interface ContactProps {
|
||||||
|
|||||||
Reference in New Issue
Block a user