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

feat(SW-251): use response to render filters

Browse Source
This commit is contained in:
Fredrik Thorsson
2024-09-11 15:39:57 +02:00
parent 43e58dcf01
commit 7eeafd2a20
6 changed files with 65 additions and 35 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
components/HotelReservation/HotelCard/index.tsx
View File

@@ -25,19 +25,16 @@ export default function HotelCard({ hotel }: HotelCardProps) {
const { hotelData } = hotel
const { price } = hotel
if (!hotelData) return null
if (!price) return null
const sortedAmenities = hotelData.detailedFacilities
?.sort((a, b) => b.sortOrder - a.sortOrder)
const sortedAmenities = hotelData?.detailedFacilities
.sort((a, b) => b.sortOrder - a.sortOrder)
.slice(0, 5)
return (
<article className={styles.card}>
<section className={styles.imageContainer}>
<Image
src={hotelData.hotelContent.images.imageSizes.medium}
alt={hotelData.hotelContent.images.metaData.altText}
src={hotelData?.hotelContent.images.imageSizes.medium ?? ""}
alt={hotelData?.hotelContent.images.metaData.altText ?? ""}
width={300}
height={200}
className={styles.image}
@@ -45,20 +42,20 @@ export default function HotelCard({ hotel }: HotelCardProps) {
<div className={styles.tripAdvisor}>
<Chip intent="primary" className={styles.tripAdvisor}>
<TripAdvisorIcon color="white" />
{hotelData.ratings?.tripAdvisor.rating}
{hotelData?.ratings?.tripAdvisor.rating}
</Chip>
</div>
</section>
<section className={styles.hotelInformation}>
<ScandicLogoIcon color="red" />
<Title as="h4" textTransform="capitalize">
{hotelData.name}
{hotelData?.name}
</Title>
<Footnote color="textMediumContrast" className={styles.adress}>
{`${hotelData.address?.streetAddress}, ${hotelData.address?.city}`}
{`${hotelData?.address?.streetAddress}, ${hotelData?.address?.city}`}
</Footnote>
<Footnote color="textMediumContrast">
{`${hotelData.location.distanceToCentre} ${intl.formatMessage({ id: "km to city center" })}`}
{`${hotelData?.location.distanceToCentre} ${intl.formatMessage({ id: "km to city center" })}`}
</Footnote>
</section>
<section className={styles.hotel}>