Fix: Merging issues

This commit is contained in:
Pontus Dreij
2024-12-13 09:51:35 +01:00
parent c2b4d8abcf
commit 20cbb4b0a0
5 changed files with 19 additions and 9 deletions

View File

@@ -27,7 +27,7 @@ export default async function SelectHotelPage({
return ( return (
<Suspense <Suspense
key={`${city.name}-${searchParams.fromDate}-${searchParams.toDate}-${adultsParams}-${childrenParams}`} key={`${city.name}-${searchParams.fromDate}-${searchParams.toDate}-${adultsInRoom}-${childrenInRoom}`}
fallback={<SelectHotelSkeleton />} fallback={<SelectHotelSkeleton />}
> >
<SelectHotel <SelectHotel

View File

@@ -42,7 +42,7 @@ export default function SelectHotelContent({
const isAboveMobile = useMediaQuery("(min-width: 768px)") const isAboveMobile = useMediaQuery("(min-width: 768px)")
const [visibleHotels, setVisibleHotels] = useState<HotelData[]>([]) const [visibleHotels, setVisibleHotels] = useState<HotelData[]>([])
const [showSkeleton, setShowSkeleton] = useState<boolean>(false) const [showSkeleton, setShowSkeleton] = useState<boolean>(true)
const listingContainerRef = useRef<HTMLDivElement | null>(null) const listingContainerRef = useRef<HTMLDivElement | null>(null)
const activeFilters = useHotelFilterStore((state) => state.activeFilters) const activeFilters = useHotelFilterStore((state) => state.activeFilters)
@@ -85,7 +85,7 @@ export default function SelectHotelContent({
const visibleHotels = getVisibleHotels(hotels, filteredHotelPins, map) const visibleHotels = getVisibleHotels(hotels, filteredHotelPins, map)
setVisibleHotels(visibleHotels) setVisibleHotels(visibleHotels)
setTimeout(() => { setTimeout(() => {
setShowSkeleton(true) setShowSkeleton(false)
}, SKELETON_LOAD_DELAY) }, SKELETON_LOAD_DELAY)
}, [hotels, filteredHotelPins, map]) }, [hotels, filteredHotelPins, map])
@@ -99,7 +99,7 @@ export default function SelectHotelContent({
() => () =>
debounce(() => { debounce(() => {
if (!map) return if (!map) return
setShowSkeleton(false) setShowSkeleton(true)
getHotelCards() getHotelCards()
}, 100), }, 100),
[map, getHotelCards] [map, getHotelCards]
@@ -138,11 +138,12 @@ export default function SelectHotelContent({
</Button> </Button>
<FilterAndSortModal filters={filterList} /> <FilterAndSortModal filters={filterList} />
</div> </div>
{showSkeleton ? ( {showSkeleton ? (
<> <div className={styles.skeletonContainer}>
<RoomCardSkeleton /> <RoomCardSkeleton />
<RoomCardSkeleton /> <RoomCardSkeleton />
</> </div>
) : ( ) : (
<HotelListing hotels={visibleHotels} /> <HotelListing hotels={visibleHotels} />
)} )}

View File

@@ -48,4 +48,10 @@
padding: 0 0 var(--Spacing-x1); padding: 0 0 var(--Spacing-x1);
position: static; position: static;
} }
.skeletonContainer {
display: flex;
flex-direction: column;
gap: var(--Spacing-x2);
}
} }

View File

@@ -1,5 +1,4 @@
import { type RefObject,useEffect,useState } from "react" import { type RefObject, useEffect, useState } from "react"
interface UseScrollToTopProps { interface UseScrollToTopProps {
threshold: number threshold: number

View File

@@ -470,7 +470,11 @@ export const hotelAttributesSchema = z.object({
isPublished: z.boolean(), isPublished: z.boolean(),
keywords: z.array(z.string()), keywords: z.array(z.string()),
location: locationSchema, location: locationSchema,
merchantInformationData: merchantInformationSchema, merchantInformationData: merchantInformationSchema.default({
webMerchantId: "",
cards: {},
alternatePaymentOptions: {},
}),
name: z.string(), name: z.string(),
operaId: z.string(), operaId: z.string(),
parking: z.array(parkingSchema), parking: z.array(parkingSchema),