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

Fix/SW-2429 map view

Browse Source 
* feat(SW-2429): Removed [contentType]>[uid] and use app router based structure for content types

* feat(SW-2429): Added breadcrumbs to follow contenttype folder structure

* feat(SW-2429): Removed modal/dialog functionality from map views on hotel and destination pages

* fix(SW-2429): Fixed issue with booking widget on meeting pages. Also used same structure for content types

Approved-by: Arvid Norlin
This commit is contained in:
Erik Tiekstra
2025-04-25 05:36:44 +00:00
parent 6d7fbe0894
commit b75177ad98
55 changed files with 705 additions and 730 deletions
Download Patch File Download Diff File Expand all files Collapse all files

19
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@breadcrumbs/collection_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,19 @@
import { Suspense } from "react"
import Breadcrumbs from "@/components/Breadcrumbs"
import BreadcrumbsSkeleton from "@/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton"
import type { BreadcrumbsProps } from "@/components/TempDesignSystem/Breadcrumbs/breadcrumbs"
export default function CollectionPageBreadcrumbs() {
const variants: Pick<BreadcrumbsProps, "color" | "size"> = {
color: "Surface/Secondary/Default",
size: "contentWidth",
}
return (
<Suspense fallback={<BreadcrumbsSkeleton {...variants} />}>
<Breadcrumbs {...variants} />
</Suspense>
)
}

3
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@breadcrumbs/content_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,3 @@
export default function ContentPageBreadcrumbs() {
return null
}

3
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@breadcrumbs/destination_city_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,3 @@
export default function DestinationCityPageBreadcrumbs() {
return null
}

3
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@breadcrumbs/destination_country_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,3 @@
export default function DestinationCountryPageBreadcrumbs() {
return null
}

0
apps/scandic-web/app/[lang]/(live)/(public)/destination_overview_page/[uid]/@breadcrumbs/page.tsx → apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@breadcrumbs/destination_overview_page/[uid]/page.tsx
View File

3
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@breadcrumbs/hotel_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,3 @@
export default function HotelPageBreadcrumbs() {
return null
}

12
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@breadcrumbs/loyalty_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,12 @@
import { Suspense } from "react"
import Breadcrumbs from "@/components/Breadcrumbs"
import BreadcrumbsSkeleton from "@/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton"
export default function LoyaltyPageBreadcrumbs() {
return (
<Suspense fallback={<BreadcrumbsSkeleton />}>
<Breadcrumbs />
</Suspense>
)
}

3
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@breadcrumbs/start_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,3 @@
export default function StartPageBreadcrumbs() {
return null
}

1
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@preview/default.tsx Normal file
View File

@@ -0,0 +1 @@
export { default } from "./page"

0
apps/scandic-web/app/[lang]/(live)/(public)/[contentType]/[uid]/@preview/loading.tsx → apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@preview/loading.tsx
View File

0
apps/scandic-web/app/[lang]/(live)/(public)/[contentType]/[uid]/@preview/page.tsx → apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/@preview/page.tsx
View File

7
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/collection_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,7 @@
import CollectionPage from "@/components/ContentType/StaticPages/CollectionPage"
export { generateMetadata } from "@/utils/generateMetadata"
export default function CollectionPagePage() {
return <CollectionPage />
}

32
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/content_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,32 @@
import { headers } from "next/headers"
import { notFound, redirect } from "next/navigation"
import { overview } from "@/constants/routes/myPages"
import { isSignupPage } from "@/constants/routes/signup"
import { env } from "@/env/server"
import { auth } from "@/auth"
import ContentPage from "@/components/ContentType/StaticPages/ContentPage"
import { getLang } from "@/i18n/serverContext"
import { isValidSession } from "@/utils/session"
export { generateMetadata } from "@/utils/generateMetadata"
export default async function ContentPagePage() {
const lang = getLang()
const pathname = headers().get("x-pathname") || ""
const isSignupRoute = isSignupPage(pathname)
if (isSignupRoute) {
if (!env.SHOW_SIGNUP_FLOW) {
notFound()
}
const session = await auth()
if (isValidSession(session)) {
redirect(overview[lang])
}
}
return <ContentPage />
}

25
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/destination_city_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,25 @@
import { notFound } from "next/navigation"
import { Suspense } from "react"
import { env } from "@/env/server"
import DestinationCityPage from "@/components/ContentType/DestinationPage/DestinationCityPage"
import DestinationCityPageSkeleton from "@/components/ContentType/DestinationPage/DestinationCityPage/DestinationCityPageSkeleton"
import type { PageArgs } from "@/types/params"
export { generateMetadata } from "@/utils/generateMetadata"
export default function DestinationCityPagePage({
searchParams,
}: PageArgs<{}, { view?: "map" }>) {
if (env.HIDE_FOR_NEXT_RELEASE) {
notFound()
}
return (
<Suspense fallback={<DestinationCityPageSkeleton />}>
<DestinationCityPage isMapView={searchParams.view === "map"} />
</Suspense>
)
}

29
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/destination_country_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,29 @@
import { notFound } from "next/navigation"
import { Suspense } from "react"
import { env } from "@/env/server"
import DestinationCountryPage from "@/components/ContentType/DestinationPage/DestinationCountryPage"
import DestinationCountryPageSkeleton from "@/components/ContentType/DestinationPage/DestinationCountryPage/DestinationCountryPageSkeleton"
import type { PageArgs } from "@/types/params"
export { generateMetadata } from "@/utils/generateMetadata"
export default function DestinationCountryPagePage({}: PageArgs<
{},
{ view?: "map" }
>) {
if (env.HIDE_FOR_NEXT_RELEASE) {
notFound()
}
return (
<Suspense fallback={<DestinationCountryPageSkeleton />}>
<DestinationCountryPage
// isMapView={searchParams.view === "map"} // Disabled until further notice
isMapView={false}
/>
</Suspense>
)
}

0
apps/scandic-web/app/[lang]/(live)/(public)/destination_overview_page/[uid]/error.tsx → apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/destination_overview_page/[uid]/error.tsx
View File

0
apps/scandic-web/app/[lang]/(live)/(public)/destination_overview_page/[uid]/loading.tsx → apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/destination_overview_page/[uid]/loading.tsx
View File

0
apps/scandic-web/app/[lang]/(live)/(public)/destination_overview_page/[uid]/page.tsx → apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/destination_overview_page/[uid]/page.tsx
View File

38
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/hotel_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,38 @@
import { notFound } from "next/navigation"
import { env } from "@/env/server"
import { getHotelPage } from "@/lib/trpc/memoizedRequests"
import HotelMapPage from "@/components/ContentType/HotelMapPage"
import HotelPage from "@/components/ContentType/HotelPage"
import HotelSubpage from "@/components/ContentType/HotelSubpage"
import type { PageArgs } from "@/types/params"
export { generateMetadata } from "@/utils/generateMetadata"
export default async function HotelPagePage({
searchParams,
}: PageArgs<{}, { subpage?: string; view?: "map" }>) {
if (env.HIDE_FOR_NEXT_RELEASE) {
return notFound()
}
const hotelPageData = await getHotelPage()
if (!hotelPageData) {
notFound()
}
if (searchParams.subpage) {
return (
<HotelSubpage
hotelId={hotelPageData.hotel_page_id}
subpage={searchParams.subpage}
/>
)
}
if (searchParams.view === "map") {
return <HotelMapPage hotelId={hotelPageData.hotel_page_id} />
}
return <HotelPage hotelId={hotelPageData.hotel_page_id} />
}

0
apps/scandic-web/app/[lang]/(live)/(public)/[contentType]/[uid]/layout.module.css → apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/layout.module.css
View File

24
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/layout.tsx Normal file
View File

@@ -0,0 +1,24 @@
import styles from "./layout.module.css"
import type { LangParams, LayoutArgs } from "@/types/params"
export default function ContentTypeLayout({
breadcrumbs,
preview,
children,
}: React.PropsWithChildren<
LayoutArgs<LangParams> & {
breadcrumbs: React.ReactNode
preview: React.ReactNode
}
>) {
return (
<div className={styles.container}>
<section className={styles.layout}>
{preview}
{breadcrumbs}
{children}
</section>
</div>
)
}

0
apps/scandic-web/app/[lang]/(live)/(public)/[contentType]/[uid]/loading.tsx → apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/loading.tsx
View File

7
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/loyalty_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,7 @@
import LoyaltyPage from "@/components/ContentType/LoyaltyPage"
export { generateMetadata } from "@/utils/generateMetadata"
export default function LoyaltyPagePage() {
return <LoyaltyPage />
}

19
apps/scandic-web/app/[lang]/(live)/(public)/(contentTypes)/start_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,19 @@
import { notFound } from "next/navigation"
import { env } from "@/env/server"
import StartPage from "@/components/ContentType/StartPage"
import type { BookingWidgetSearchData } from "@/types/components/bookingWidget"
import type { PageArgs } from "@/types/params"
export { generateMetadata } from "@/utils/generateMetadata"
export default function StartPagePage({
searchParams,
}: PageArgs<{}, BookingWidgetSearchData>) {
if (env.HIDE_FOR_NEXT_RELEASE) {
notFound()
}
return <StartPage searchParams={searchParams} />
}

55
apps/scandic-web/app/[lang]/(live)/(public)/[contentType]/[uid]/@breadcrumbs/page.tsx
View File

@@ -1,55 +0,0 @@
import { Suspense } from "react"
import Breadcrumbs from "@/components/Breadcrumbs"
import BreadcrumbsSkeleton from "@/components/TempDesignSystem/Breadcrumbs/BreadcrumbsSkeleton"
import type { ContentTypeParams, LangParams, PageArgs } from "@/types/params"
import { PageContentTypeEnum } from "@/types/requests/contentType"
import type { BreadcrumbsProps } from "@/components/TempDesignSystem/Breadcrumbs/breadcrumbs"
// This is a temporary solution to avoid showing breadcrumbs on certain content types.
// This should be refactored in the future to handle content types differently, similar to `destination_overview_page`.
const IGNORED_CONTENT_TYPES = [
PageContentTypeEnum.hotelPage,
PageContentTypeEnum.contentPage,
PageContentTypeEnum.destinationCityPage,
PageContentTypeEnum.destinationCountryPage,
PageContentTypeEnum.destinationOverviewPage,
PageContentTypeEnum.startPage,
]
// This function is temporary until the content types are refactored and handled differently, similar to `destination_overview_page`.
function getBreadcrumbsVariantsByContentType(
contentType: PageContentTypeEnum
): Pick<BreadcrumbsProps, "color" | "size"> | null {
switch (contentType) {
case PageContentTypeEnum.collectionPage:
return { color: "Surface/Secondary/Default", size: "contentWidth" }
default:
return null
}
}
// We need to return null for both ignored content types and non-existent content types
// In order to no having to maintain an explicit array of all content types besides the PageContentTypeEnum we convert it here.
const allowedContentTypes = Object.keys(PageContentTypeEnum)
.map((key) => {
return PageContentTypeEnum[key as keyof typeof PageContentTypeEnum]
})
.filter((c) => !IGNORED_CONTENT_TYPES.includes(c))
export default function PageBreadcrumbs({
params,
}: PageArgs<LangParams & ContentTypeParams>) {
if (!allowedContentTypes.includes(params.contentType)) {
return null
}
const variants = getBreadcrumbsVariantsByContentType(params.contentType)
return (
<Suspense fallback={<BreadcrumbsSkeleton {...variants} />}>
<Breadcrumbs {...variants} />
</Suspense>
)
}

35
apps/scandic-web/app/[lang]/(live)/(public)/[contentType]/[uid]/layout.tsx
View File

@@ -1,35 +0,0 @@
import styles from "./layout.module.css"
import type {
ContentTypeParams,
LangParams,
LayoutArgs,
UIDParams,
} from "@/types/params"
export default function ContentTypeLayout({
breadcrumbs,
preview,
children,
//params,
}: React.PropsWithChildren<
LayoutArgs<LangParams & ContentTypeParams & UIDParams> & {
breadcrumbs: React.ReactNode
preview: React.ReactNode
}
>) {
// Would like a better way to check if the contentType is valid.
// Perhaps a case for using an `{} as const` object for PageContentTypes instead?
// if (!Object.values(PageContentTypeEnum).includes(params.contentType)) {
// notFound()
// }
return (
<div className={styles.container}>
<section className={styles.layout}>
{preview}
{breadcrumbs}
{children}
</section>
</div>
)
}

111
apps/scandic-web/app/[lang]/(live)/(public)/[contentType]/[uid]/page.tsx
View File

@@ -1,111 +0,0 @@
import { headers } from "next/headers"
import { notFound, redirect } from "next/navigation"
import { Suspense } from "react"
import { overview } from "@/constants/routes/myPages"
import { isSignupPage } from "@/constants/routes/signup"
import { env } from "@/env/server"
import { getHotelPage } from "@/lib/trpc/memoizedRequests"
import { auth } from "@/auth"
import DestinationCityPage from "@/components/ContentType/DestinationPage/DestinationCityPage"
import DestinationCityPageSkeleton from "@/components/ContentType/DestinationPage/DestinationCityPage/DestinationCityPageSkeleton"
import DestinationCountryPage from "@/components/ContentType/DestinationPage/DestinationCountryPage"
import DestinationCountryPageSkeleton from "@/components/ContentType/DestinationPage/DestinationCountryPage/DestinationCountryPageSkeleton"
import HotelPage from "@/components/ContentType/HotelPage"
import HotelSubpage from "@/components/ContentType/HotelSubpage"
import LoyaltyPage from "@/components/ContentType/LoyaltyPage"
import StartPage from "@/components/ContentType/StartPage"
import CollectionPage from "@/components/ContentType/StaticPages/CollectionPage"
import ContentPage from "@/components/ContentType/StaticPages/ContentPage"
import { getLang } from "@/i18n/serverContext"
import { isValidSession } from "@/utils/session"
import type {
LangParams,
NonAppRouterContentTypeParams,
PageArgs,
UIDParams,
} from "@/types/params"
import { PageContentTypeEnum } from "@/types/requests/contentType"
export { generateMetadata } from "@/utils/generateMetadata"
export default async function ContentTypePage({
params,
searchParams,
}: PageArgs<
LangParams & NonAppRouterContentTypeParams & UIDParams,
{ subpage?: string; filterFromUrl?: string }
>) {
const pathname = headers().get("x-pathname") || ""
switch (params.contentType) {
case PageContentTypeEnum.collectionPage:
return <CollectionPage />
case PageContentTypeEnum.contentPage: {
const isSignupRoute = isSignupPage(pathname)
if (isSignupRoute) {
if (!env.SHOW_SIGNUP_FLOW) {
return notFound()
}
const session = await auth()
if (isValidSession(session)) {
redirect(overview[getLang()])
}
}
return <ContentPage />
}
case PageContentTypeEnum.loyaltyPage:
return <LoyaltyPage />
case PageContentTypeEnum.destinationCountryPage:
if (env.HIDE_FOR_NEXT_RELEASE) {
return notFound()
}
return (
<Suspense fallback={<DestinationCountryPageSkeleton />}>
<DestinationCountryPage />
</Suspense>
)
case PageContentTypeEnum.destinationCityPage:
if (env.HIDE_FOR_NEXT_RELEASE) {
return notFound()
}
return (
<Suspense fallback={<DestinationCityPageSkeleton />}>
<DestinationCityPage />
</Suspense>
)
case PageContentTypeEnum.hotelPage:
if (env.HIDE_FOR_NEXT_RELEASE) {
return notFound()
}
const hotelPageData = await getHotelPage()
if (hotelPageData) {
if (searchParams.subpage) {
return (
<HotelSubpage
hotelId={hotelPageData.hotel_page_id}
subpage={searchParams.subpage}
/>
)
}
return <HotelPage hotelId={hotelPageData.hotel_page_id} />
}
notFound()
case PageContentTypeEnum.startPage:
if (env.HIDE_FOR_NEXT_RELEASE) {
return notFound()
}
return <StartPage searchParams={searchParams} />
default:
const type: never = params.contentType
console.error(`Unsupported content type given: ${type}`)
notFound()
}
}

1
apps/scandic-web/app/[lang]/(live)/(public)/destination_overview_page/[uid]/@preview/loading.tsx
View File

@@ -1 +0,0 @@
export { default } from "../../../[contentType]/[uid]/@preview/loading"

1
apps/scandic-web/app/[lang]/(live)/(public)/destination_overview_page/[uid]/@preview/page.tsx
View File

@@ -1 +0,0 @@
export { default } from "../../../[contentType]/[uid]/@preview/page"

1
apps/scandic-web/app/[lang]/(live)/(public)/destination_overview_page/[uid]/layout.tsx
View File

@@ -1 +0,0 @@
export { default } from "../../[contentType]/[uid]/layout"

24
apps/scandic-web/app/[lang]/(live)/@bookingwidget/(contentTypes)/destination_city_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,24 @@
import { env } from "@/env/server"
import { getDestinationCityPage } from "@/lib/trpc/memoizedRequests"
import BookingWidget from "@/components/BookingWidget"
import type { BookingWidgetSearchData } from "@/types/components/bookingWidget"
import type { PageArgs } from "@/types/params"
export default async function BookingWidgetDestinationCityPage({
searchParams,
}: PageArgs<{}, BookingWidgetSearchData>) {
if (!env.ENABLE_BOOKING_WIDGET) {
return null
}
const { bookingCode } = searchParams
const pageData = await getDestinationCityPage()
const bookingWidgetSearchParams = {
bookingCode: bookingCode ?? "",
city: pageData?.city.name ?? "",
}
return <BookingWidget bookingWidgetSearchParams={bookingWidgetSearchParams} />
}

39
apps/scandic-web/app/[lang]/(live)/@bookingwidget/(contentTypes)/hotel_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,39 @@
import { env } from "@/env/server"
import { getHotel, getHotelPage } from "@/lib/trpc/memoizedRequests"
import BookingWidget from "@/components/BookingWidget"
import { getLang } from "@/i18n/serverContext"
import type { BookingWidgetSearchData } from "@/types/components/bookingWidget"
import type { PageArgs } from "@/types/params"
export default async function BookingWidgetHotelPage({
searchParams,
}: PageArgs<{}, BookingWidgetSearchData & { subpage?: string }>) {
if (!env.ENABLE_BOOKING_WIDGET) {
return null
}
const { bookingCode, subpage } = searchParams
const hotelPageData = await getHotelPage()
const hotelData = await getHotel({
hotelId: hotelPageData?.hotel_page_id || "",
language: getLang(),
isCardOnlyPayment: false,
})
const isMeetingSubpage =
subpage && hotelData?.additionalData.meetingRooms.nameInUrl === subpage
if (isMeetingSubpage) {
return null
}
const bookingWidgetSearchParams = {
bookingCode: bookingCode ?? "",
hotel: hotelData?.hotel.id ?? "",
city: hotelData?.hotel.cityName ?? "",
}
return <BookingWidget bookingWidgetSearchParams={bookingWidgetSearchParams} />
}

3
apps/scandic-web/app/[lang]/(live)/@bookingwidget/(contentTypes)/start_page/[uid]/page.tsx Normal file
View File

@@ -0,0 +1,3 @@
export default async function BookingWidgetStartPage() {
return null
}

1
apps/scandic-web/app/[lang]/(live)/@bookingwidget/[contentType]/[uid]/[...paths]/page.tsx
View File

@@ -1 +0,0 @@
export { default } from "../page"

64
apps/scandic-web/app/[lang]/(live)/@bookingwidget/[contentType]/[uid]/page.tsx
View File

@@ -1,64 +0,0 @@
import { env } from "@/env/server"
import { getHotel, getHotelPage } from "@/lib/trpc/memoizedRequests"
import BookingWidget from "@/components/BookingWidget"
import { getLang } from "@/i18n/serverContext"
import type { BookingWidgetSearchData } from "@/types/components/bookingWidget"
import type { ContentTypeParams, PageArgs } from "@/types/params"
import { PageContentTypeEnum } from "@/types/requests/contentType"
export default async function BookingWidgetPage({
params,
searchParams,
}: PageArgs<ContentTypeParams, BookingWidgetSearchData>) {
if (!env.ENABLE_BOOKING_WIDGET) {
return null
}
if (params.contentType === PageContentTypeEnum.startPage) {
return null
}
if (params.contentType === PageContentTypeEnum.hotelPage) {
return (
<BookingWidgetOnHotelPage
bookingCode={searchParams.bookingCode}
subpage={searchParams.subpage}
/>
)
}
return <BookingWidget bookingWidgetSearchParams={searchParams} />
}
async function BookingWidgetOnHotelPage({
bookingCode,
subpage,
}: {
bookingCode?: string
subpage: string
}) {
const hotelPageData = await getHotelPage()
const hotelData = await getHotel({
hotelId: hotelPageData?.hotel_page_id || "",
language: getLang(),
isCardOnlyPayment: false,
})
const isMeetingSubpage =
hotelData?.additionalData.meetingRooms.nameInUrl === subpage
if (isMeetingSubpage) {
return null
}
const hotelPageParams = {
bookingCode: bookingCode ?? "",
hotel: hotelData?.hotel.id ?? "",
city: hotelData?.hotel.cityName ?? "",
}
return <BookingWidget bookingWidgetSearchParams={hotelPageParams} />
}