Merged in feat/SW-286-collectionPage (pull request #765)

Feat(SW-286): CollectionPage

Approved-by: Erik Tiekstra
Approved-by: Fredrik Thorsson

server/routers/contentstack/bookingwidget/output.ts

@@ -11,6 +11,7 @@ const bookingWidgetToggleSchema = z
 export const validateBookingWidgetToggleSchema = z.object({
   account_page: bookingWidgetToggleSchema,
   loyalty_page: bookingWidgetToggleSchema,
+  collection_page: bookingWidgetToggleSchema,
   content_page: bookingWidgetToggleSchema,
   hotel_page: bookingWidgetToggleSchema,
   current_blocks_page: bookingWidgetToggleSchema,

server/routers/contentstack/bookingwidget/query.ts

@@ -2,6 +2,7 @@ import { ValueOf } from "next/dist/shared/lib/constants"
 
 import {
   GetAccountPageSettings,
+  GetCollectionPageSettings,
   GetContentPageSettings,
   GetCurrentBlocksPageSettings,
   GetHotelPageSettings,
@@ -43,6 +44,9 @@ export const bookingwidgetQueryRouter = router({
         case ContentTypeEnum.loyaltyPage:
           GetPageSettings = GetLoyaltyPageSettings
           break
+        case ContentTypeEnum.collectionPage:
+          GetPageSettings = GetCollectionPageSettings
+          break
         case ContentTypeEnum.contentPage:
           GetPageSettings = GetContentPageSettings
           break

server/routers/contentstack/breadcrumbs/output.ts

@@ -50,6 +50,16 @@ export type GetLoyaltyPageBreadcrumbsRefsData = z.infer<
   typeof validateLoyaltyPageBreadcrumbsRefsContentstackSchema
 >
 
+export const validateCollectionPageBreadcrumbsRefsContentstackSchema = z.object(
+  {
+    collection_page: breadcrumbsRefs,
+  }
+)
+
+export type GetCollectionPageBreadcrumbsRefsData = z.infer<
+  typeof validateCollectionPageBreadcrumbsRefsContentstackSchema
+>
+
 export const validateContentPageBreadcrumbsRefsContentstackSchema = z.object({
   content_page: breadcrumbsRefs,
 })
@@ -107,3 +117,11 @@ export const validateContentPageBreadcrumbsContentstackSchema = z.object({
 export type GetContentPageBreadcrumbsData = z.infer<
   typeof validateContentPageBreadcrumbsContentstackSchema
 >
+
+export const validateCollectionPageBreadcrumbsContentstackSchema = z.object({
+  collection_page: page,
+})
+
+export type GetCollectionPageBreadcrumbsData = z.infer<
+  typeof validateCollectionPageBreadcrumbsContentstackSchema
+>

server/routers/contentstack/breadcrumbs/query.ts

@@ -2,6 +2,10 @@ import {
   GetMyPagesBreadcrumbs,
   GetMyPagesBreadcrumbsRefs,
 } from "@/lib/graphql/Query/Breadcrumbs/AccountPage.graphql"
+import {
+  GetCollectionPageBreadcrumbs,
+  GetCollectionPageBreadcrumbsRefs,
+} from "@/lib/graphql/Query/Breadcrumbs/CollectionPage.graphql"
 import {
   GetContentPageBreadcrumbs,
   GetContentPageBreadcrumbsRefs,
@@ -13,12 +17,16 @@ import {
 import { contentstackExtendedProcedureUID, router } from "@/server/trpc"
 
 import {
+  GetCollectionPageBreadcrumbsData,
+  GetCollectionPageBreadcrumbsRefsData,
   type GetContentPageBreadcrumbsData,
   type GetContentPageBreadcrumbsRefsData,
   type GetLoyaltyPageBreadcrumbsData,
   type GetLoyaltyPageBreadcrumbsRefsData,
   type GetMyPagesBreadcrumbsData,
   type GetMyPagesBreadcrumbsRefsData,
+  validateCollectionPageBreadcrumbsContentstackSchema,
+  validateCollectionPageBreadcrumbsRefsContentstackSchema,
   validateContentPageBreadcrumbsContentstackSchema,
   validateContentPageBreadcrumbsRefsContentstackSchema,
   validateLoyaltyPageBreadcrumbsContentstackSchema,
@@ -84,6 +92,48 @@ async function getLoyaltyPageBreadcrumbs(variables: Variables) {
   )
 }
 
+async function getCollectionPageBreadcrumbs(variables: Variables) {
+  const refsResponse =
+    await getRefsResponse<GetCollectionPageBreadcrumbsRefsData>(
+      GetCollectionPageBreadcrumbsRefs,
+      variables
+    )
+  const validatedRefsData =
+    validateCollectionPageBreadcrumbsRefsContentstackSchema.safeParse(
+      refsResponse.data
+    )
+
+  if (!validatedRefsData.success) {
+    console.error(
+      `Failed to validate CollectionPpage Breadcrumbs Refs - (uid: ${variables.uid})`
+    )
+    console.error(validatedRefsData.error)
+    return null
+  }
+  const tags = getTags(validatedRefsData.data.collection_page, variables)
+  const response = await getResponse<GetCollectionPageBreadcrumbsData>(
+    GetCollectionPageBreadcrumbs,
+    variables,
+    tags
+  )
+  if (!response.data.collection_page.web?.breadcrumbs?.title) {
+    return null
+  }
+  const validatedBreadcrumbsData =
+    validateCollectionPageBreadcrumbsContentstackSchema.safeParse(response.data)
+  if (!validatedBreadcrumbsData.success) {
+    console.error(
+      `Failed to validate Collectionpage Breadcrumbs Data - (uid: ${variables.uid})`
+    )
+    console.error(validatedBreadcrumbsData.error)
+    return null
+  }
+  return getBreadcrumbs(
+    validatedBreadcrumbsData.data.collection_page,
+    variables.locale
+  )
+}
+
 async function getContentPageBreadcrumbs(variables: Variables) {
   const refsResponse = await getRefsResponse<GetContentPageBreadcrumbsRefsData>(
     GetContentPageBreadcrumbsRefs,
@@ -189,6 +239,8 @@ export const breadcrumbsQueryRouter = router({
     switch (ctx.contentType) {
       case PageTypeEnum.accountPage:
         return await getMyPagesBreadcrumbs(variables)
+      case PageTypeEnum.collectionPage:
+        return await getCollectionPageBreadcrumbs(variables)
       case PageTypeEnum.contentPage:
         return await getContentPageBreadcrumbs(variables)
       case PageTypeEnum.loyaltyPage:

server/routers/contentstack/collectionPage/index.ts

@@ -0,0 +1,5 @@
+import { mergeRouters } from "@/server/trpc"
+
+import { collectionPageQueryRouter } from "./query"
+
+export const collectionPageRouter = mergeRouters(collectionPageQueryRouter)

server/routers/contentstack/collectionPage/output.ts

@@ -0,0 +1,121 @@
+import { z } from "zod"
+
+import { discriminatedUnionArray } from "@/lib/discriminatedUnion"
+
+import {
+  cardGridRefsSchema,
+  cardsGridSchema,
+} from "../schemas/blocks/cardsGrid"
+import {
+  shortcutsRefsSchema,
+  shortcutsSchema,
+} from "../schemas/blocks/shortcuts"
+import { uspGridRefsSchema, uspGridSchema } from "../schemas/blocks/uspGrid"
+import { tempImageVaultAssetSchema } from "../schemas/imageVault"
+import {
+  linkAndTitleSchema,
+  linkConnectionRefs,
+} from "../schemas/linkConnection"
+import { systemSchema } from "../schemas/system"
+
+import { CollectionPageEnum } from "@/types/enums/collectionPage"
+
+// Block schemas
+export const collectionPageCards = z
+  .object({
+    __typename: z.literal(CollectionPageEnum.ContentStack.blocks.CardsGrid),
+  })
+  .merge(cardsGridSchema)
+
+export const collectionPageShortcuts = z
+  .object({
+    __typename: z.literal(CollectionPageEnum.ContentStack.blocks.Shortcuts),
+  })
+  .merge(shortcutsSchema)
+
+export const collectionPageUspGrid = z
+  .object({
+    __typename: z.literal(CollectionPageEnum.ContentStack.blocks.UspGrid),
+  })
+  .merge(uspGridSchema)
+
+export const blocksSchema = z.discriminatedUnion("__typename", [
+  collectionPageCards,
+  collectionPageShortcuts,
+  collectionPageUspGrid,
+])
+
+const navigationLinksSchema = z
+  .array(linkAndTitleSchema)
+  .nullable()
+  .transform((data) => {
+    if (!data) {
+      return null
+    }
+
+    return data
+      .filter((item) => !!item.link)
+      .map((item) => ({
+        url: item.link!.url,
+        title: item.title || item.link!.title,
+      }))
+  })
+
+// Content Page Schema and types
+export const collectionPageSchema = z.object({
+  collection_page: z.object({
+    hero_image: tempImageVaultAssetSchema,
+    blocks: discriminatedUnionArray(blocksSchema.options).nullable(),
+    title: z.string(),
+    header: z.object({
+      heading: z.string(),
+      preamble: z.string(),
+      navigation_links: navigationLinksSchema,
+    }),
+    system: systemSchema.merge(
+      z.object({
+        created_at: z.string(),
+        updated_at: z.string(),
+      })
+    ),
+  }),
+})
+
+/** REFS */
+const collectionPageCardsRefs = z
+  .object({
+    __typename: z.literal(CollectionPageEnum.ContentStack.blocks.CardsGrid),
+  })
+  .merge(cardGridRefsSchema)
+
+const collectionPageShortcutsRefs = z
+  .object({
+    __typename: z.literal(CollectionPageEnum.ContentStack.blocks.Shortcuts),
+  })
+  .merge(shortcutsRefsSchema)
+
+const collectionPageUspGridRefs = z
+  .object({
+    __typename: z.literal(CollectionPageEnum.ContentStack.blocks.UspGrid),
+  })
+  .merge(uspGridRefsSchema)
+
+const collectionPageBlockRefsItem = z.discriminatedUnion("__typename", [
+  collectionPageShortcutsRefs,
+  collectionPageCardsRefs,
+  collectionPageUspGridRefs,
+])
+
+const collectionPageHeaderRefs = z.object({
+  navigation_links: z.array(linkConnectionRefs),
+})
+
+export const collectionPageRefsSchema = z.object({
+  collection_page: z.object({
+    header: collectionPageHeaderRefs,
+    blocks: discriminatedUnionArray(
+      collectionPageBlockRefsItem.options
+    ).nullable(),
+    system: systemSchema,
+  }),
+})

server/routers/contentstack/collectionPage/query.ts

@@ -0,0 +1,78 @@
+import { Lang } from "@/constants/languages"
+import { GetCollectionPage } from "@/lib/graphql/Query/CollectionPage/CollectionPage.graphql"
+import { request } from "@/lib/graphql/request"
+import { contentstackExtendedProcedureUID, router } from "@/server/trpc"
+
+import { collectionPageSchema } from "./output"
+import {
+  fetchCollectionPageRefs,
+  generatePageTags,
+  getCollectionPageCounter,
+  validateCollectionPageRefs,
+} from "./utils"
+
+import {
+  TrackingChannelEnum,
+  type TrackingSDKPageData,
+} from "@/types/components/tracking"
+import { GetCollectionPageSchema } from "@/types/trpc/routers/contentstack/collectionPage"
+
+export const collectionPageQueryRouter = router({
+  get: contentstackExtendedProcedureUID.query(async ({ ctx }) => {
+    const { lang, uid } = ctx
+
+    const collectionPageRefsData = await fetchCollectionPageRefs(lang, uid)
+
+    const collectionPageRefs = validateCollectionPageRefs(
+      collectionPageRefsData,
+      lang,
+      uid
+    )
+    if (!collectionPageRefs) {
+      return null
+    }
+    const tags = generatePageTags(collectionPageRefs, lang)
+
+    getCollectionPageCounter.add(1, { lang, uid })
+    console.info(
+      "contentstack.collectionPage start",
+      JSON.stringify({
+        query: { lang, uid },
+      })
+    )
+
+    const response = await request<GetCollectionPageSchema>(
+      GetCollectionPage,
+      { locale: lang, uid },
+      {
+        cache: "force-cache",
+        next: {
+          tags,
+        },
+      }
+    )
+
+    const collectionPage = collectionPageSchema.safeParse(response.data)
+    if (!collectionPage.success) {
+      console.error(
+        `Failed to validate CollectionPage Data - (lang: ${lang}, uid: ${uid})`
+      )
+      console.error(collectionPage.error?.format())
+      return null
+    }
+
+    const tracking: TrackingSDKPageData = {
+      pageId: collectionPage.data.collection_page.system.uid,
+      lang: collectionPage.data.collection_page.system.locale as Lang,
+      publishedDate: collectionPage.data.collection_page.system.updated_at,
+      createdDate: collectionPage.data.collection_page.system.created_at,
+      channel: TrackingChannelEnum["collection-page"],
+      pageType: "collectionpage",
+    }
+
+    return {
+      collectionPage: collectionPage.data.collection_page,
+      tracking,
+    }
+  }),
+})

server/routers/contentstack/collectionPage/utils.ts

@@ -0,0 +1,152 @@
+import { metrics } from "@opentelemetry/api"
+
+import { Lang } from "@/constants/languages"
+import { GetCollectionPageRefs } from "@/lib/graphql/Query/CollectionPage/CollectionPage.graphql"
+import { request } from "@/lib/graphql/request"
+import { notFound } from "@/server/errors/trpc"
+
+import { generateTag, generateTagsFromSystem } from "@/utils/generateTag"
+
+import { collectionPageRefsSchema } from "./output"
+
+import { CollectionPageEnum } from "@/types/enums/collectionPage"
+import { System } from "@/types/requests/system"
+import {
+  CollectionPageRefs,
+  GetCollectionPageRefsSchema,
+} from "@/types/trpc/routers/contentstack/collectionPage"
+
+const meter = metrics.getMeter("trpc.collectionPage")
+// OpenTelemetry metrics: CollectionPage
+
+export const getCollectionPageCounter = meter.createCounter(
+  "trpc.contentstack.collectionPage.get"
+)
+
+const getCollectionPageRefsCounter = meter.createCounter(
+  "trpc.contentstack.collectionPage.get"
+)
+const getCollectionPageRefsFailCounter = meter.createCounter(
+  "trpc.contentstack.collectionPage.get-fail"
+)
+const getCollectionPageRefsSuccessCounter = meter.createCounter(
+  "trpc.contentstack.collectionPage.get-success"
+)
+
+export async function fetchCollectionPageRefs(lang: Lang, uid: string) {
+  getCollectionPageRefsCounter.add(1, { lang, uid })
+  console.info(
+    "contentstack.collectionPage.refs start",
+    JSON.stringify({
+      query: { lang, uid },
+    })
+  )
+  const refsResponse = await request<GetCollectionPageRefsSchema>(
+    GetCollectionPageRefs,
+    { locale: lang, uid },
+    {
+      cache: "force-cache",
+      next: {
+        tags: [generateTag(lang, uid)],
+      },
+    }
+  )
+
+  if (!refsResponse.data) {
+    const notFoundError = notFound(refsResponse)
+    getCollectionPageRefsFailCounter.add(1, {
+      lang,
+      uid,
+      error_type: "http_error",
+      error: JSON.stringify({
+        code: notFoundError.code,
+      }),
+    })
+    console.error(
+      "contentstack.collectionPage.refs not found error",
+      JSON.stringify({
+        query: {
+          lang,
+          uid,
+        },
+        error: { code: notFoundError.code },
+      })
+    )
+    throw notFoundError
+  }
+
+  return refsResponse.data
+}
+
+export function validateCollectionPageRefs(
+  data: GetCollectionPageRefsSchema,
+  lang: Lang,
+  uid: string
+) {
+  const validatedData = collectionPageRefsSchema.safeParse(data)
+  if (!validatedData.success) {
+    getCollectionPageRefsFailCounter.add(1, {
+      lang,
+      uid,
+      error_type: "validation_error",
+      error: JSON.stringify(validatedData.error),
+    })
+    console.error(
+      "contentstack.collectionPage.refs validation error",
+      JSON.stringify({
+        query: { lang, uid },
+        error: validatedData.error,
+      })
+    )
+    return null
+  }
+  getCollectionPageRefsSuccessCounter.add(1, { lang, uid })
+  console.info(
+    "contentstack.collectionPage.refs success",
+    JSON.stringify({
+      query: { lang, uid },
+    })
+  )
+
+  return validatedData.data
+}
+
+export function generatePageTags(
+  validatedData: CollectionPageRefs,
+  lang: Lang
+): string[] {
+  const connections = getConnections(validatedData)
+  return [
+    generateTagsFromSystem(lang, connections),
+    generateTag(lang, validatedData.collection_page.system.uid),
+  ].flat()
+}
+
+export function getConnections({ collection_page }: CollectionPageRefs) {
+  const connections: System["system"][] = [collection_page.system]
+  if (collection_page.blocks) {
+    collection_page.blocks.forEach((block) => {
+      switch (block.__typename) {
+        case CollectionPageEnum.ContentStack.blocks.Shortcuts: {
+          if (block.shortcuts.shortcuts.length) {
+            connections.push(...block.shortcuts.shortcuts)
+          }
+          break
+        }
+        case CollectionPageEnum.ContentStack.blocks.CardsGrid: {
+          if (block.cards_grid.length) {
+            connections.push(...block.cards_grid)
+          }
+          break
+        }
+        case CollectionPageEnum.ContentStack.blocks.UspGrid: {
+          if (block.usp_grid.length) {
+            connections.push(...block.usp_grid)
+          }
+        }
+      }
+    })
+  }
+
+  return connections
+}

server/routers/contentstack/contentPage/utils.ts

@@ -162,6 +162,18 @@ export function getConnections({ content_page }: ContentPageRefs) {
             }
           }
           break
+        case ContentPageEnum.ContentStack.blocks.CardsGrid: {
+          if (block.cards_grid.length) {
+            connections.push(...block.cards_grid)
+          }
+          break
+        }
+        case ContentPageEnum.ContentStack.blocks.DynamicContent: {
+          if (block.dynamic_content.link) {
+            connections.push(block.dynamic_content.link)
+          }
+          break
+        }
         case ContentPageEnum.ContentStack.blocks.Shortcuts: {
           if (block.shortcuts.shortcuts.length) {
             connections.push(...block.shortcuts.shortcuts)

server/routers/contentstack/index.ts

@@ -4,6 +4,7 @@ import { accountPageRouter } from "./accountPage"
 import { baseRouter } from "./base"
 import { bookingwidgetRouter } from "./bookingwidget"
 import { breadcrumbsRouter } from "./breadcrumbs"
+import { collectionPageRouter } from "./collectionPage"
 import { contentPageRouter } from "./contentPage"
 import { hotelPageRouter } from "./hotelPage"
 import { languageSwitcherRouter } from "./languageSwitcher"
@@ -21,6 +22,7 @@ export const contentstackRouter = router({
   hotelPage: hotelPageRouter,
   languageSwitcher: languageSwitcherRouter,
   loyaltyPage: loyaltyPageRouter,
+  collectionPage: collectionPageRouter,
   contentPage: contentPageRouter,
   myPages: myPagesRouter,
   metaData: metaDataRouter,

server/routers/contentstack/languageSwitcher/query.ts

@@ -7,6 +7,10 @@ import {
   GetDaDeEnUrlsAccountPage,
   GetFiNoSvUrlsAccountPage,
 } from "@/lib/graphql/Query/AccountPage/AccountPage.graphql"
+import {
+  GetDaDeEnUrlsCollectionPage,
+  GetFiNoSvUrlsCollectionPage,
+} from "@/lib/graphql/Query/CollectionPage/CollectionPage.graphql"
 import {
   GetDaDeEnUrlsContentPage,
   GetFiNoSvUrlsContentPage,
@@ -88,6 +92,10 @@ async function getLanguageSwitcher(options: LanguageSwitcherVariables) {
       daDeEnDocument = GetDaDeEnUrlsContentPage
       fiNoSvDocument = GetFiNoSvUrlsContentPage
       break
+    case PageTypeEnum.collectionPage:
+      daDeEnDocument = GetDaDeEnUrlsCollectionPage
+      fiNoSvDocument = GetFiNoSvUrlsCollectionPage
+      break
     default:
       console.error(`type: [${options.contentType}]`)
       console.error(`Trying to get a content type that is not supported`)

server/routers/contentstack/schemas/blocks/cardsGrid.ts

@@ -11,6 +11,7 @@ import { imageContainerSchema } from "./imageContainer"
 
 import { BlocksEnums } from "@/types/enums/blocks"
 import { CardsGridEnum, CardsGridLayoutEnum } from "@/types/enums/cardsGrid"
+import { scriptedCardThemeEnum } from "@/types/enums/scriptedCard"
 
 export const cardBlockSchema = z.object({
   __typename: z.literal(CardsGridEnum.cards.Card),
@@ -161,7 +162,7 @@ export const cardsGridSchema = z.object({
       }),
       layout: z.nativeEnum(CardsGridLayoutEnum),
       preamble: z.string().optional().default(""),
-      theme: z.enum(["one", "two", "three"]).nullable(),
+      theme: z.nativeEnum(scriptedCardThemeEnum).nullable(),
       title: z.string().optional().default(""),
     })
     .transform((data) => {

server/routers/contentstack/schemas/linkConnection.ts

@@ -5,6 +5,7 @@ import * as pageLinks from "@/server/routers/contentstack/schemas/pageLinks"
 
 const linkUnionSchema = z.discriminatedUnion("__typename", [
   pageLinks.contentPageSchema,
+  pageLinks.collectionPageSchema,
   pageLinks.hotelPageSchema,
   pageLinks.loyaltyPageSchema,
 ])

server/routers/contentstack/schemas/pageLinks.ts

@@ -30,6 +30,16 @@ export const extendedPageLinkSchema = pageLinkSchema.merge(
     }),
   })
 )
+export const collectionPageSchema = z
+  .object({
+    __typename: z.literal(ContentEnum.blocks.CollectionPage),
+  })
+  .merge(extendedPageLinkSchema)
+
+export const collectionPageRefSchema = z.object({
+  __typename: z.literal(ContentEnum.blocks.CollectionPage),
+  system: systemSchema,
+})
 
 export const contentPageSchema = z
   .object({
@@ -67,6 +77,7 @@ export const loyaltyPageRefSchema = z.object({
 type Data =
   | z.output<typeof accountPageSchema>
   | z.output<typeof contentPageSchema>
+  | z.output<typeof collectionPageSchema>
   | z.output<typeof hotelPageSchema>
   | z.output<typeof loyaltyPageSchema>
   | Object
@@ -83,6 +94,7 @@ export function transform(data: Data) {
           url: removeMultipleSlashes(`/${data.system.locale}/${data.url}`),
         }
       case ContentEnum.blocks.ContentPage:
+      case ContentEnum.blocks.CollectionPage:
       case ContentEnum.blocks.LoyaltyPage:
         // TODO: Once all links use this transform
         // `web` can be removed and not to be worried
@@ -102,6 +114,7 @@ export function transform(data: Data) {
 
 type RefData =
   | z.output<typeof accountPageRefSchema>
+  | z.output<typeof collectionPageRefSchema>
   | z.output<typeof contentPageRefSchema>
   | z.output<typeof hotelPageRefSchema>
   | z.output<typeof loyaltyPageRefSchema>
@@ -112,6 +125,7 @@ export function transformRef(data: RefData) {
     switch (data.__typename) {
       case ContentEnum.blocks.AccountPage:
       case ContentEnum.blocks.ContentPage:
+      case ContentEnum.blocks.CollectionPage:
       case ContentEnum.blocks.HotelPage:
       case ContentEnum.blocks.LoyaltyPage:
         return data.system

server/routers/contentstack/schemas/sidebar/scriptedCard.ts

@@ -7,6 +7,7 @@ import {
   transformCardBlockRefs,
 } from "../blocks/cardsGrid"
 
+import { scriptedCardThemeEnum } from "@/types/enums/scriptedCard"
 import { SidebarEnums } from "@/types/enums/sidebar"
 
 export const scriptedCardsSchema = z.object({
@@ -16,17 +17,7 @@ export const scriptedCardsSchema = z.object({
     .default(SidebarEnums.blocks.ScriptedCard),
   scripted_card: z
     .object({
-      theme: z
-        .enum([
-          "one",
-          "two",
-          "three",
-          "primaryDim",
-          "primaryDark",
-          "primaryInverted",
-          "primaryStrong",
-        ])
-        .nullable(),
+      theme: z.nativeEnum(scriptedCardThemeEnum).nullable(),
       scripted_cardConnection: z.object({
         edges: z.array(
           z.object({