fix(SW-1830): Adjusted schemas for city and country pages to accept less data
* fix(SW-1830): Adjusted schemas for city and country pages to accept less data Approved-by: Fredrik Thorsson Approved-by: Matilda Landström
This commit is contained in:
@@ -51,7 +51,9 @@ export default async function DestinationCityPage() {
|
|||||||
<div className={styles.pageContainer}>
|
<div className={styles.pageContainer}>
|
||||||
<header className={styles.header}>
|
<header className={styles.header}>
|
||||||
<Breadcrumbs variant={PageContentTypeEnum.destinationCityPage} />
|
<Breadcrumbs variant={PageContentTypeEnum.destinationCityPage} />
|
||||||
|
{images?.length && (
|
||||||
<TopImages images={images} destinationName={city.name} />
|
<TopImages images={images} destinationName={city.name} />
|
||||||
|
)}
|
||||||
</header>
|
</header>
|
||||||
<main className={styles.mainContent}>
|
<main className={styles.mainContent}>
|
||||||
<HotelListing />
|
<HotelListing />
|
||||||
@@ -61,7 +63,7 @@ export default async function DestinationCityPage() {
|
|||||||
<SidebarContentWrapper location={city.name}>
|
<SidebarContentWrapper location={city.name}>
|
||||||
<Body color="uiTextMediumContrast">{preamble}</Body>
|
<Body color="uiTextMediumContrast">{preamble}</Body>
|
||||||
<ExperienceList experiences={experiences} />
|
<ExperienceList experiences={experiences} />
|
||||||
{has_sidepeek && (
|
{has_sidepeek && sidepeek_content && (
|
||||||
<DestinationPageSidePeek
|
<DestinationPageSidePeek
|
||||||
buttonText={sidepeek_button_text}
|
buttonText={sidepeek_button_text}
|
||||||
sidePeekContent={sidepeek_content}
|
sidePeekContent={sidepeek_content}
|
||||||
|
|||||||
@@ -55,7 +55,12 @@ export default async function DestinationCountryPage() {
|
|||||||
variant={PageContentTypeEnum.destinationCityPage}
|
variant={PageContentTypeEnum.destinationCityPage}
|
||||||
/>
|
/>
|
||||||
</Suspense>
|
</Suspense>
|
||||||
<TopImages images={images} destinationName={translatedCountry} />
|
{images?.length && (
|
||||||
|
<TopImages
|
||||||
|
images={images}
|
||||||
|
destinationName={translatedCountry}
|
||||||
|
/>
|
||||||
|
)}
|
||||||
</header>
|
</header>
|
||||||
<main className={styles.mainContent}>
|
<main className={styles.mainContent}>
|
||||||
<CityListing />
|
<CityListing />
|
||||||
@@ -65,7 +70,7 @@ export default async function DestinationCountryPage() {
|
|||||||
<SidebarContentWrapper location={translatedCountry}>
|
<SidebarContentWrapper location={translatedCountry}>
|
||||||
<Body color="uiTextMediumContrast">{preamble}</Body>
|
<Body color="uiTextMediumContrast">{preamble}</Body>
|
||||||
<ExperienceList experiences={experiences} />
|
<ExperienceList experiences={experiences} />
|
||||||
{has_sidepeek && (
|
{has_sidepeek && sidepeek_content && (
|
||||||
<DestinationPageSidePeek
|
<DestinationPageSidePeek
|
||||||
buttonText={sidepeek_button_text}
|
buttonText={sidepeek_button_text}
|
||||||
sidePeekContent={sidepeek_content}
|
sidePeekContent={sidepeek_content}
|
||||||
|
|||||||
@@ -1,6 +1,7 @@
|
|||||||
"use client"
|
"use client"
|
||||||
|
|
||||||
import { useState } from "react"
|
import { useState } from "react"
|
||||||
|
import { useIntl } from "react-intl"
|
||||||
|
|
||||||
import { ChevronRightSmallIcon } from "@/components/Icons"
|
import { ChevronRightSmallIcon } from "@/components/Icons"
|
||||||
import JsonToHtml from "@/components/JsonToHtml"
|
import JsonToHtml from "@/components/JsonToHtml"
|
||||||
@@ -12,7 +13,7 @@ import type { DestinationCityPageData } from "@/types/trpc/routers/contentstack/
|
|||||||
import type { DestinationCountryPageData } from "@/types/trpc/routers/contentstack/destinationCountryPage"
|
import type { DestinationCountryPageData } from "@/types/trpc/routers/contentstack/destinationCountryPage"
|
||||||
|
|
||||||
interface DestinationPageSidepeekProps {
|
interface DestinationPageSidepeekProps {
|
||||||
buttonText: string
|
buttonText?: string | null
|
||||||
sidePeekContent: NonNullable<
|
sidePeekContent: NonNullable<
|
||||||
| DestinationCityPageData["sidepeek_content"]
|
| DestinationCityPageData["sidepeek_content"]
|
||||||
| DestinationCountryPageData["sidepeek_content"]
|
| DestinationCountryPageData["sidepeek_content"]
|
||||||
@@ -24,6 +25,7 @@ export default function DestinationPageSidepeek({
|
|||||||
sidePeekContent,
|
sidePeekContent,
|
||||||
location,
|
location,
|
||||||
}: DestinationPageSidepeekProps) {
|
}: DestinationPageSidepeekProps) {
|
||||||
|
const intl = useIntl()
|
||||||
const [sidePeekIsOpen, setSidePeekIsOpen] = useState(false)
|
const [sidePeekIsOpen, setSidePeekIsOpen] = useState(false)
|
||||||
const { heading, content } = sidePeekContent
|
const { heading, content } = sidePeekContent
|
||||||
|
|
||||||
@@ -42,7 +44,7 @@ export default function DestinationPageSidepeek({
|
|||||||
size="small"
|
size="small"
|
||||||
wrapping
|
wrapping
|
||||||
>
|
>
|
||||||
{buttonText}
|
{buttonText || intl.formatMessage({ id: "Read more" })}
|
||||||
<ChevronRightSmallIcon />
|
<ChevronRightSmallIcon />
|
||||||
</Button>
|
</Button>
|
||||||
<SidePeek
|
<SidePeek
|
||||||
|
|||||||
@@ -23,7 +23,7 @@ export default function TopImages({ images, destinationName }: TopImageProps) {
|
|||||||
open: false,
|
open: false,
|
||||||
activeIndex: 0,
|
activeIndex: 0,
|
||||||
})
|
})
|
||||||
const lightboxImages = mapImageVaultImagesToGalleryImages(images || [])
|
const lightboxImages = mapImageVaultImagesToGalleryImages(images)
|
||||||
const maxWidth = 1366 // 1366px is the max width of the image container
|
const maxWidth = 1366 // 1366px is the max width of the image container
|
||||||
const visibleImages = images.slice(0, 3)
|
const visibleImages = images.slice(0, 3)
|
||||||
|
|
||||||
|
|||||||
@@ -125,17 +125,20 @@ export const destinationCityPageSchema = z.object({
|
|||||||
.object({
|
.object({
|
||||||
destination_experiences: z.array(z.string()),
|
destination_experiences: z.array(z.string()),
|
||||||
})
|
})
|
||||||
.transform(({ destination_experiences }) => destination_experiences),
|
.nullish()
|
||||||
|
.transform((experiences) => experiences?.destination_experiences ?? []),
|
||||||
images: z
|
images: z
|
||||||
.array(z.object({ image: tempImageVaultAssetSchema }))
|
.array(z.object({ image: tempImageVaultAssetSchema }))
|
||||||
.transform((images) =>
|
.transform((images) =>
|
||||||
images
|
images
|
||||||
.map((image) => image.image)
|
.map((image) => image.image)
|
||||||
.filter((image): image is ImageVaultAsset => !!image)
|
.filter((image): image is ImageVaultAsset => !!image)
|
||||||
),
|
)
|
||||||
|
.nullish(),
|
||||||
has_sidepeek: z.boolean().default(false),
|
has_sidepeek: z.boolean().default(false),
|
||||||
sidepeek_button_text: z.string().default(""),
|
sidepeek_button_text: z.string().nullish().default(""),
|
||||||
sidepeek_content: z.object({
|
sidepeek_content: z
|
||||||
|
.object({
|
||||||
heading: z.string(),
|
heading: z.string(),
|
||||||
content: z.object({
|
content: z.object({
|
||||||
json: z.any(),
|
json: z.any(),
|
||||||
@@ -153,7 +156,8 @@ export const destinationCityPageSchema = z.object({
|
|||||||
),
|
),
|
||||||
}),
|
}),
|
||||||
}),
|
}),
|
||||||
}),
|
})
|
||||||
|
.nullish(),
|
||||||
blocks: discriminatedUnionArray(blocksSchema.options).nullable(),
|
blocks: discriminatedUnionArray(blocksSchema.options).nullable(),
|
||||||
system: systemSchema.merge(
|
system: systemSchema.merge(
|
||||||
z.object({
|
z.object({
|
||||||
@@ -228,7 +232,8 @@ const blocksRefsSchema = z.discriminatedUnion("__typename", [
|
|||||||
|
|
||||||
export const destinationCityPageRefsSchema = z.object({
|
export const destinationCityPageRefsSchema = z.object({
|
||||||
destination_city_page: z.object({
|
destination_city_page: z.object({
|
||||||
sidepeek_content: z.object({
|
sidepeek_content: z
|
||||||
|
.object({
|
||||||
content: z.object({
|
content: z.object({
|
||||||
embedded_itemsConnection: z.object({
|
embedded_itemsConnection: z.object({
|
||||||
edges: z.array(
|
edges: z.array(
|
||||||
@@ -238,7 +243,8 @@ export const destinationCityPageRefsSchema = z.object({
|
|||||||
),
|
),
|
||||||
}),
|
}),
|
||||||
}),
|
}),
|
||||||
}),
|
})
|
||||||
|
.nullish(),
|
||||||
blocks: discriminatedUnionArray(blocksRefsSchema.options).nullable(),
|
blocks: discriminatedUnionArray(blocksRefsSchema.options).nullable(),
|
||||||
system: systemSchema,
|
system: systemSchema,
|
||||||
}),
|
}),
|
||||||
|
|||||||
@@ -63,10 +63,12 @@ export const destinationCountryPageSchema = z.object({
|
|||||||
images
|
images
|
||||||
.map((image) => image.image)
|
.map((image) => image.image)
|
||||||
.filter((image): image is ImageVaultAsset => !!image)
|
.filter((image): image is ImageVaultAsset => !!image)
|
||||||
),
|
)
|
||||||
|
.nullish(),
|
||||||
has_sidepeek: z.boolean().default(false),
|
has_sidepeek: z.boolean().default(false),
|
||||||
sidepeek_button_text: z.string().default(""),
|
sidepeek_button_text: z.string().nullish(),
|
||||||
sidepeek_content: z.object({
|
sidepeek_content: z
|
||||||
|
.object({
|
||||||
heading: z.string(),
|
heading: z.string(),
|
||||||
content: z.object({
|
content: z.object({
|
||||||
json: z.any(),
|
json: z.any(),
|
||||||
@@ -84,7 +86,8 @@ export const destinationCountryPageSchema = z.object({
|
|||||||
),
|
),
|
||||||
}),
|
}),
|
||||||
}),
|
}),
|
||||||
}),
|
})
|
||||||
|
.nullish(),
|
||||||
blocks: discriminatedUnionArray(blocksSchema.options).nullable(),
|
blocks: discriminatedUnionArray(blocksSchema.options).nullable(),
|
||||||
system: systemSchema.merge(
|
system: systemSchema.merge(
|
||||||
z.object({
|
z.object({
|
||||||
|
|||||||
Reference in New Issue
Block a user