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

Merged in fix/SW-1103-page-loading (pull request #1181)

Browse Source 
Fix/SW-1103 page loading

* feat(SW-1103): Move backend req behinde suspense

* fix/SW-1103 fix merge conflicts


Approved-by: Joakim Jäderberg
This commit is contained in:
Pontus Dreij
2025-01-24 10:16:30 +00:00
parent 9ff976cde1
commit 7343d873c2
8 changed files with 63 additions and 77 deletions
Download Patch File Download Diff File Expand all files Collapse all files

24
app/[lang]/(live)/(public)/hotelreservation/(standard)/select-hotel/map/page.tsx
View File

@@ -1,4 +1,3 @@
import { notFound } from "next/navigation"
import { Suspense } from "react"
import { SelectHotelMapContainer } from "@/components/HotelReservation/SelectHotel/SelectHotelMap/SelectHotelMapContainer"
@@ -6,8 +5,6 @@ import { SelectHotelMapContainerSkeleton } from "@/components/HotelReservation/S
import { MapContainer } from "@/components/MapContainer"
import { setLang } from "@/i18n/serverContext"
import { getHotelSearchDetails } from "../../utils"
import styles from "./page.module.css"
import type { SelectHotelSearchParams } from "@/types/components/hotelReservation/selectHotel/selectHotelSearchParams"
@@ -18,32 +15,15 @@ export default async function SelectHotelMapPage({
searchParams,
}: PageArgs<LangParams, SelectHotelSearchParams>) {
setLang(params.lang)
const searchDetails = await getHotelSearchDetails({ searchParams })
if (!searchDetails) return notFound()
const {
city,
adultsInRoom,
childrenInRoomString,
childrenInRoom,
selectHotelParams,
} = searchDetails
if (!city) return notFound()
return (
<div className={styles.main}>
<MapContainer>
<Suspense
key={city.name}
key={searchParams.city}
fallback={<SelectHotelMapContainerSkeleton />}
>
<SelectHotelMapContainer
city={city}
selectHotelParams={selectHotelParams}
adultsInRoom={adultsInRoom}
childrenInRoomString={childrenInRoomString}
childrenInRoom={childrenInRoom}
/>
<SelectHotelMapContainer searchParams={searchParams} />
</Suspense>
</MapContainer>
</div>

32
app/[lang]/(live)/(public)/hotelreservation/(standard)/select-hotel/page.tsx
View File

@@ -1,12 +1,9 @@
import { notFound } from "next/navigation"
import { Suspense } from "react"
import SelectHotel from "@/components/HotelReservation/SelectHotel"
import { SelectHotelSkeleton } from "@/components/HotelReservation/SelectHotel/SelectHotelSkeleton"
import { setLang } from "@/i18n/serverContext"
import { getHotelSearchDetails } from "../utils"
import type { SelectHotelSearchParams } from "@/types/components/hotelReservation/selectHotel/selectHotelSearchParams"
import type { LangParams, PageArgs } from "@/types/params"
@@ -15,35 +12,18 @@ export default async function SelectHotelPage({
searchParams,
}: PageArgs<LangParams, SelectHotelSearchParams>) {
setLang(params.lang)
const searchDetails = await getHotelSearchDetails({ searchParams })
if (!searchDetails) return notFound()
const {
city,
selectHotelParams,
adultsInRoom,
childrenInRoomString,
childrenInRoom,
} = searchDetails
if (!city) return notFound()
const reservationParams = {
selectHotelParams,
adultsInRoom,
childrenInRoomString,
childrenInRoom,
}
const roomKey = Object.keys(searchParams)
.filter((key) => key.startsWith("room["))
.map((key) => searchParams[key])
.join("-")
return (
<Suspense
key={`${city.name}-${searchParams.fromDate}-${searchParams.toDate}-${adultsInRoom}-${childrenInRoomString}`}
key={`${searchParams.name}-${searchParams.fromDate}-${searchParams.toDate}-${roomKey}`}
fallback={<SelectHotelSkeleton />}
>
<SelectHotel
city={city}
params={params}
reservationParams={reservationParams}
/>
<SelectHotel params={params} searchParams={searchParams} />
</Suspense>
)
}