diff --git a/apps/scandic-web/components/ContentType/CampaignOverviewPage/TopCampaign/index.tsx b/apps/scandic-web/components/ContentType/CampaignOverviewPage/TopCampaign/index.tsx index 396dcae83..dba79a3de 100644 --- a/apps/scandic-web/components/ContentType/CampaignOverviewPage/TopCampaign/index.tsx +++ b/apps/scandic-web/components/ContentType/CampaignOverviewPage/TopCampaign/index.tsx @@ -1,4 +1,5 @@ import { Typography } from "@scandic-hotels/design-system/Typography" +import { ContentEnum } from "@scandic-hotels/trpc/types/content" import CampaignHotelListing from "@/components/Blocks/CampaignHotelListing" import CampaignHero from "@/components/ContentType/CampaignPage/Hero" @@ -13,10 +14,12 @@ interface TopCampaignProps { topCampaign: CampaignOverviewPageData["topCampaign"] } -export default async function TopCampaign({ topCampaign }: TopCampaignProps) { +export async function TopCampaign({ topCampaign }: TopCampaignProps) { const lang = await getLang() const intl = await getIntl() + const { campaign, heading } = topCampaign + const buttonData = { cta: intl.formatMessage({ id: "campaign.exploreTheOffer", @@ -25,6 +28,41 @@ export default async function TopCampaign({ topCampaign }: TopCampaignProps) { url: `/${lang}${campaign.url}`, } + function CampaignContent() { + switch (campaign.typename) { + case ContentEnum.blocks.CampaignPage: + return ( + <> + + + + ) + case ContentEnum.blocks.PromoCampaignPage: + if (!campaign.hero) return null + return ( + + ) + default: + return null + } + } + return (
{heading ? ( @@ -32,19 +70,7 @@ export default async function TopCampaign({ topCampaign }: TopCampaignProps) {

{heading}

) : null} - - +
) } diff --git a/apps/scandic-web/components/ContentType/CampaignOverviewPage/index.tsx b/apps/scandic-web/components/ContentType/CampaignOverviewPage/index.tsx index a7b49ee31..3d1b4db83 100644 --- a/apps/scandic-web/components/ContentType/CampaignOverviewPage/index.tsx +++ b/apps/scandic-web/components/ContentType/CampaignOverviewPage/index.tsx @@ -6,7 +6,7 @@ import { TrackingSDK } from "@scandic-hotels/tracking/TrackingSDK" import { getCampaignOverviewPage } from "@/lib/trpc/memoizedRequests" -import TopCampaign from "@/components/ContentType/CampaignOverviewPage/TopCampaign" +import { TopCampaign } from "@/components/ContentType/CampaignOverviewPage/TopCampaign" import LinkChips from "@/components/TempDesignSystem/LinkChips" import Blocks from "./Blocks" @@ -23,7 +23,6 @@ export default async function CampaignOverviewPage() { const { campaign_overview_page, tracking } = pageData const { header, topCampaign, blocks } = campaign_overview_page - return ( <> }> diff --git a/apps/scandic-web/components/ContentType/CampaignPage/Hero/variants.ts b/apps/scandic-web/components/ContentType/CampaignPage/Hero/variants.ts index c606a1a7e..ce584a87f 100644 --- a/apps/scandic-web/components/ContentType/CampaignPage/Hero/variants.ts +++ b/apps/scandic-web/components/ContentType/CampaignPage/Hero/variants.ts @@ -10,7 +10,7 @@ const config = { }, }, defaultVariants: { - theme: "Peach", + theme: "Burgundy", }, } as const diff --git a/packages/trpc/lib/graphql/Fragments/Blocks/AllCampaigns.graphql.ts b/packages/trpc/lib/graphql/Fragments/Blocks/AllCampaigns.graphql.ts index e7d60df07..80c695f51 100644 --- a/packages/trpc/lib/graphql/Fragments/Blocks/AllCampaigns.graphql.ts +++ b/packages/trpc/lib/graphql/Fragments/Blocks/AllCampaigns.graphql.ts @@ -1,6 +1,7 @@ import { gql } from "graphql-tag" import { CampaignPageRef } from "../CampaignPage/Ref.graphql" +import { PromoCampaignPageRef } from "../PromoCampaignPage/Ref.graphql" export const AllCampaigns = gql` fragment AllCampaigns on CampaignOverviewPageBlocksAllCampaigns { @@ -21,6 +22,17 @@ export const AllCampaigns = gql` locale } } + ... on PromoCampaignPage { + url + card_content { + heading + image + text + } + system { + locale + } + } } } } @@ -36,10 +48,12 @@ export const AllCampaignsRefs = gql` node { __typename ...CampaignPageRef + ...PromoCampaignPageRef } } } } } ${CampaignPageRef} + ${PromoCampaignPageRef} ` diff --git a/packages/trpc/lib/graphql/Fragments/CampaignOverviewPage/TopCampaign.graphql.ts b/packages/trpc/lib/graphql/Fragments/CampaignOverviewPage/TopCampaign.graphql.ts index 66a6164eb..2e6336194 100644 --- a/packages/trpc/lib/graphql/Fragments/CampaignOverviewPage/TopCampaign.graphql.ts +++ b/packages/trpc/lib/graphql/Fragments/CampaignOverviewPage/TopCampaign.graphql.ts @@ -30,3 +30,23 @@ export const TopCampaignRef = gql` } ${System} ` + +export const TopPromoCampaign = gql` + fragment TopPromoCampaign on PromoCampaignPage { + url + promo_hero { + image + heading + benefits + } + } +` + +export const TopPromoCampaignRef = gql` + fragment TopPromoCampaignRef on PromoCampaignPage { + system { + ...System + } + } + ${System} +` diff --git a/packages/trpc/lib/graphql/Query/CampaignOverviewPage/CampaignOverviewPage.graphql.ts b/packages/trpc/lib/graphql/Query/CampaignOverviewPage/CampaignOverviewPage.graphql.ts index 820493142..a9b524910 100644 --- a/packages/trpc/lib/graphql/Query/CampaignOverviewPage/CampaignOverviewPage.graphql.ts +++ b/packages/trpc/lib/graphql/Query/CampaignOverviewPage/CampaignOverviewPage.graphql.ts @@ -16,6 +16,8 @@ import { import { TopCampaign, TopCampaignRef, + TopPromoCampaign, + TopPromoCampaignRef, } from "../../Fragments/CampaignOverviewPage/TopCampaign.graphql" import { System } from "../../Fragments/System.graphql" @@ -33,7 +35,9 @@ export const GetCampaignOverviewPage = gql` campaignConnection { edges { node { + __typename ...TopCampaign + ...TopPromoCampaign } } } @@ -57,6 +61,7 @@ export const GetCampaignOverviewPage = gql` ${System} ${NavigationLinks_CampaignOverviewPage} ${TopCampaign} + ${TopPromoCampaign} ${AllCampaigns} ${CarouselCards_CampaignOverviewPage} ${HotelListing_CampaignOverviewPage} @@ -73,6 +78,7 @@ export const GetCampaignOverviewPageRefs = gql` edges { node { ...TopCampaignRef + ...TopPromoCampaignRef } } } @@ -90,6 +96,7 @@ export const GetCampaignOverviewPageRefs = gql` ${System} ${NavigationLinksRef_CampaignOverviewPage} ${TopCampaignRef} + ${TopPromoCampaignRef} ${CarouselCards_CampaignOverviewPageRefs} ${AllCampaignsRefs} ` diff --git a/packages/trpc/lib/routers/contentstack/campaignOverviewPage/output.ts b/packages/trpc/lib/routers/contentstack/campaignOverviewPage/output.ts index b7a9044f1..398c37c86 100644 --- a/packages/trpc/lib/routers/contentstack/campaignOverviewPage/output.ts +++ b/packages/trpc/lib/routers/contentstack/campaignOverviewPage/output.ts @@ -2,12 +2,14 @@ import { z } from "zod" import { CampaignOverviewPageEnum } from "../../../types/campaignOverviewPageEnum" import { CampaignPageEnum } from "../../../types/campaignPage" +import { ContentEnum } from "../../../types/content" import { discriminatedUnionArray } from "../../../utils/discriminatedUnion" import { campaignPageHotelListing, heroSchema, includedHotelsSchema, } from "../campaignPage/output" +import { promoHeroSchema } from "../promoCampaignPage/output" import { allCampaignsRefsSchema, allCampaignsSchema, @@ -43,28 +45,69 @@ export const campaignPageBlocksSchema = z.discriminatedUnion("__typename", [ campaignPageHotelListing, ]) +const topCampaign = z.object({ + typename: z + .literal(ContentEnum.blocks.CampaignPage) + .optional() + .default(ContentEnum.blocks.CampaignPage), + hero: heroSchema, + included_hotels: includedHotelsSchema, + blocks: discriminatedUnionArray(campaignPageBlocksSchema.options), + url: z.string(), +}) + const topCampaignSchema = z .object({ - hero: heroSchema, - included_hotels: includedHotelsSchema, - blocks: discriminatedUnionArray(campaignPageBlocksSchema.options), - url: z.string(), + __typename: z.literal(ContentEnum.blocks.CampaignPage), }) - .transform((data) => { - const { blocks, included_hotels, ...rest } = data - const hotelListingBlock = blocks.find( - (block) => - block.__typename === CampaignPageEnum.ContentStack.blocks.HotelListing - ) + .merge(topCampaign) - return { - ...rest, - hotel_listing: { - heading: hotelListingBlock?.hotel_listing.heading || "", - hotelIds: included_hotels, - }, - } +export const transformTopCampaign = (data: z.infer) => { + const { blocks, included_hotels, ...rest } = data + const hotelListingBlock = blocks?.find( + (block) => + block.__typename === CampaignPageEnum.ContentStack.blocks.HotelListing + ) + return { + ...rest, + __typename: ContentEnum.blocks.CampaignPage, + hotel_listing: { + heading: hotelListingBlock?.hotel_listing.heading || "", + hotelIds: included_hotels, + }, + } +} +export const transformedTopCampaign = + topCampaignSchema.transform(transformTopCampaign) + +const topPromoCampaign = z.object({ + typename: z + .literal(ContentEnum.blocks.PromoCampaignPage) + .optional() + .default(ContentEnum.blocks.PromoCampaignPage), + promo_hero: promoHeroSchema.nullish(), + url: z.string(), +}) + +const topPromoCampaignSchema = z + .object({ + __typename: z.literal(ContentEnum.blocks.PromoCampaignPage), }) + .merge(topPromoCampaign) + +export const transformTopPromoCampaign = ( + data: z.infer +) => { + const { promo_hero, ...rest } = data + return { + ...rest, + __typename: ContentEnum.blocks.PromoCampaignPage, + hero: promo_hero, + } +} +export const transformedTopPromoCampaign = topPromoCampaignSchema.transform( + transformTopPromoCampaign +) const campaignOverviewPageCarouselCards = z .object({ @@ -109,9 +152,23 @@ export const campaignOverviewPageSchema = z.object({ heading: z.string().nullish(), campaignConnection: z.object({ edges: z.array( - z.object({ - node: topCampaignSchema, - }) + z + .object({ + node: z.discriminatedUnion("__typename", [ + topCampaignSchema, + topPromoCampaignSchema, + ]), + }) + .transform((data) => { + if (data.node.__typename === ContentEnum.blocks.CampaignPage) { + return { + node: transformTopCampaign(data.node), + } + } + return { + node: transformTopPromoCampaign(data.node), + } + }) ), }), }), diff --git a/packages/trpc/lib/routers/contentstack/schemas/blocks/allCampaigns.ts b/packages/trpc/lib/routers/contentstack/schemas/blocks/allCampaigns.ts index 74bea9764..b0af5263e 100644 --- a/packages/trpc/lib/routers/contentstack/schemas/blocks/allCampaigns.ts +++ b/packages/trpc/lib/routers/contentstack/schemas/blocks/allCampaigns.ts @@ -4,7 +4,7 @@ import { transformedImageVaultAssetSchema } from "@scandic-hotels/common/utils/i import { removeMultipleSlashes } from "@scandic-hotels/common/utils/url" import { BlocksEnums } from "../../../../types/blocksEnum" -import { campaignPageRefSchema } from "../pageLinks" +import { campaignPageRefSchema, promoCampaignPageRefSchema } from "../pageLinks" export const campaignPageCardSchema = z.object({ image: transformedImageVaultAssetSchema, @@ -72,7 +72,10 @@ export const allCampaignsRefsSchema = z.object({ campaignsConnection: z.object({ edges: z.array( z.object({ - node: campaignPageRefSchema, + node: z.discriminatedUnion("__typename", [ + campaignPageRefSchema, + promoCampaignPageRefSchema, + ]), }) ), }), diff --git a/packages/trpc/lib/types/campaignOverviewPage.ts b/packages/trpc/lib/types/campaignOverviewPage.ts index acca339c1..8ac996b8a 100644 --- a/packages/trpc/lib/types/campaignOverviewPage.ts +++ b/packages/trpc/lib/types/campaignOverviewPage.ts @@ -3,19 +3,27 @@ import type { z } from "zod" import type { campaignOverviewPageRefsSchema, campaignOverviewPageSchema, + transformedTopCampaign, + transformedTopPromoCampaign, } from "../routers/contentstack/campaignOverviewPage/output" -export interface GetCampaignOverviewPageData - extends z.input {} -export interface CampaignOverviewPage - extends z.output {} +export interface GetCampaignOverviewPageData extends z.input< + typeof campaignOverviewPageSchema +> {} +export interface CampaignOverviewPage extends z.output< + typeof campaignOverviewPageSchema +> {} export type CampaignOverviewPageData = CampaignOverviewPage["campaign_overview_page"] -export interface GetCampaignOverviewPageRefsData - extends z.input {} +export type TopCampaign = z.output +export type TopPromoCampaign = z.output +export interface GetCampaignOverviewPageRefsData extends z.input< + typeof campaignOverviewPageRefsSchema +> {} -export interface CampaignOverviewPageRefs - extends z.output {} +export interface CampaignOverviewPageRefs extends z.output< + typeof campaignOverviewPageRefsSchema +> {} export type Block = CampaignOverviewPageData["blocks"][number]