feat(SW-186): implemented changes in cms

components/Current/Header/index.tsx

@@ -20,9 +20,6 @@ export default async function Header({
   const data = await serverClient().contentstack.base.currentHeader({
     lang: getLang(),
   })
-  const newHeaderData = await serverClient().contentstack.base.header()
-
-  console.log({ newHeaderData })
   const user = await serverClient().user.name()
 
   if (!data) {

lib/graphql/Query/Header.graphql

@@ -10,20 +10,49 @@ query GetHeader($locale: String!) {
   all_header(limit: 1, locale: $locale) {
     items {
       top_link {
-        ...InternalOrExternalLink
+        title
+        linkConnection {
+          edges {
+            node {
+              ...ContentPageLink
+              ...LoyaltyPageLink
+            }
+          }
+        }
       }
       menu_items {
         title
-        link {
+        linkConnection {
-          ...InternalOrExternalLink
+          edges {
+            node {
+              ...ContentPageLink
+              ...LoyaltyPageLink
+            }
+          }
         }
         see_all_link {
-          ...InternalOrExternalLink
+          title
+          linkConnection {
+            edges {
+              node {
+                ...ContentPageLink
+                ...LoyaltyPageLink
+              }
+            }
+          }
         }
         submenu {
           title
           links {
-            ...InternalOrExternalLink
+            title
+            linkConnection {
+              edges {
+                node {
+                  ...ContentPageLink
+                  ...LoyaltyPageLink
+                }
+              }
+            }
           }
         }
         cardConnection {

server/routers/contentstack/base/output.ts

@@ -292,48 +292,28 @@ const linkConnectionNodeSchema = z
     const url = node.url
     const originalUrl = node.web?.original_url
     const lang = node.system.locale
-    return { originalUrl, url: removeMultipleSlashes(`/${lang}/${url}`) }
-  })
-
-const internalExternalLinkSchema = z
-  .object({
-    external_link: z.object({
-      href: z.string(),
-      title: z.string(),
-    }),
-    is_external_link: z.boolean(),
-    open_in_new_tab: z.boolean(),
-    page_link: z.object({
-      link_title: z.string(),
-      linkConnection: linkConnectionNodeSchema,
-    }),
-  })
-  .transform((rawData) => {
-    if (!rawData) {
-      return null
-    }
-
-    const linkConnectionData = rawData.page_link.linkConnection
-    const isExternalLink =
-      rawData.is_external_link && rawData.external_link.href
-    const isOriginalLink = linkConnectionData?.originalUrl
-    const externalLink = rawData.external_link
-    const href =
-      isExternalLink || !linkConnectionData
-        ? externalLink.href
-        : linkConnectionData.originalUrl || linkConnectionData.url
-    const title = isExternalLink
-      ? externalLink.title
-      : rawData.page_link.link_title
 
     return {
-      openInNewTab: rawData.open_in_new_tab,
+      href: originalUrl || removeMultipleSlashes(`/${lang}/${url}`),
-      title,
+      isExternal: !!originalUrl,
-      href,
-      isExternal: !!(isExternalLink || isOriginalLink),
     }
   })
 
+const linkWithTitleSchema = z
+  .object({
+    title: z.string(),
+    linkConnection: linkConnectionNodeSchema,
+  })
+  .transform((rawData) => {
+    return rawData.linkConnection
+      ? {
+          title: rawData.title,
+          href: rawData.linkConnection.href,
+          isExternal: rawData.linkConnection.isExternal,
+        }
+      : null
+  })
+
 const cardButtonSchema = z
   .object({
     cta_text: z.string(),
@@ -349,69 +329,74 @@ const cardButtonSchema = z
     if (!rawData) {
       return null
     }
-
     const linkConnectionData = rawData.linkConnection
-    const isExternalLink = !rawData.is_contentstack_link
+    const isContentstackLink = rawData.is_contentstack_link
     const externalLink = rawData.external_link
     const href =
-      isExternalLink || !linkConnectionData
+      isContentstackLink && externalLink.href
         ? externalLink.href
-        : linkConnectionData.originalUrl || linkConnectionData.url
+        : linkConnectionData?.href || ""
-    const title = isExternalLink ? externalLink.title : rawData.cta_text
 
     return {
       openInNewTab: rawData.open_in_new_tab,
-      title,
+      title: rawData.cta_text,
       href,
-      isExternal: !!(isExternalLink || linkConnectionData?.originalUrl),
+      isExternal: !isContentstackLink || linkConnectionData?.isExternal,
     }
   })
 
-const cardSchema = z
+const cardConnectionSchema = z
   .object({
-    heading: z.string(),
+    edges: z.array(
-    body_text: z.string(),
+      z.object({
-    background_image: imageVaultAssetTransformedSchema,
+        node: z.object({
-    has_primary_button: z.boolean(),
+          heading: z.string(),
-    has_secondary_button: z.boolean(),
+          body_text: z.string(),
-    scripted_top_title: z.string(),
+          background_image: imageVaultAssetTransformedSchema,
-    primary_button: cardButtonSchema,
+          has_primary_button: z.boolean(),
-    secondary_button: cardButtonSchema,
+          has_secondary_button: z.boolean(),
+          scripted_top_title: z.string(),
+          primary_button: cardButtonSchema,
+          secondary_button: cardButtonSchema,
+        }),
+      })
+    ),
   })
   .transform((rawData) => {
+    const node = rawData.edges[0]?.node
+    if (!node) {
+      return null
+    }
+
     return {
-      scriptedTopTitle: rawData.scripted_top_title,
+      scriptedTopTitle: node.scripted_top_title,
-      heading: rawData.heading,
+      heading: node.heading,
-      bodyText: rawData.body_text,
+      bodyText: node.body_text,
-      backgroundImage: rawData.background_image,
+      backgroundImage: node.background_image,
-      primaryButton: rawData.has_primary_button ? rawData.primary_button : null,
+      primaryButton: node.has_primary_button ? node.primary_button : null,
-      secondaryButton: rawData.has_secondary_button
+      secondaryButton: node.has_secondary_button ? node.secondary_button : null,
-        ? rawData.secondary_button
-        : null,
     }
   })
 
 const menuItemSchema = z
   .object({
     title: z.string(),
-    link: internalExternalLinkSchema,
+    linkConnection: linkConnectionNodeSchema,
     submenu: z.array(
       z.object({
         title: z.string(),
-        links: z.array(internalExternalLinkSchema),
+        links: z.array(linkWithTitleSchema),
       })
     ),
-    see_all_link: internalExternalLinkSchema,
+    see_all_link: linkWithTitleSchema,
-    cardConnection: z.object({
+    cardConnection: cardConnectionSchema,
-      edges: z.array(z.object({ node: cardSchema })),
-    }),
   })
-  .transform((rawData) => {
+  .transform(({ submenu, linkConnection, cardConnection, see_all_link }) => {
     return {
-      link: rawData.submenu.length ? null : rawData.link,
+      link: submenu.length ? null : linkConnection,
-      seeAllLink: rawData.submenu.length ? rawData.see_all_link : null,
+      seeAllLink: submenu.length ? see_all_link : null,
-      submenu: rawData.submenu,
+      submenu,
-      card: rawData.cardConnection.edges[0]?.node,
+      card: cardConnection,
     }
   })
 
@@ -420,7 +405,7 @@ export const getHeaderSchema = z
     all_header: z.object({
       items: z.array(
         z.object({
-          top_link: internalExternalLinkSchema.optional(),
+          top_link: linkWithTitleSchema,
           menu_items: z.array(menuItemSchema),
         })
       ),

server/routers/contentstack/base/query.ts

@@ -422,3 +422,161 @@ export const baseQueryRouter = router({
       return validatedFooterConfig.data.all_current_footer.items[0]
     }),
 })
+
+const json = {
+  query: { lang: "en" },
+  error: {
+    issues: [
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: ["all_header", "items", 0, "top_link", "link"],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: ["all_header", "items", 0, "menu_items", 0, "link"],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: [
+          "all_header",
+          "items",
+          0,
+          "menu_items",
+          0,
+          "submenu",
+          0,
+          "links",
+          0,
+          "link",
+        ],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: [
+          "all_header",
+          "items",
+          0,
+          "menu_items",
+          0,
+          "submenu",
+          0,
+          "links",
+          1,
+          "link",
+        ],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: [
+          "all_header",
+          "items",
+          0,
+          "menu_items",
+          0,
+          "submenu",
+          1,
+          "links",
+          0,
+          "link",
+        ],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: [
+          "all_header",
+          "items",
+          0,
+          "menu_items",
+          0,
+          "see_all_link",
+          "link",
+        ],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: ["all_header", "items", 0, "menu_items", 1, "link"],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: [
+          "all_header",
+          "items",
+          0,
+          "menu_items",
+          1,
+          "see_all_link",
+          "link",
+        ],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: ["all_header", "items", 0, "menu_items", 2, "link"],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: [
+          "all_header",
+          "items",
+          0,
+          "menu_items",
+          2,
+          "see_all_link",
+          "link",
+        ],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: ["all_header", "items", 0, "menu_items", 3, "link"],
+        message: "Required",
+      },
+      {
+        code: "invalid_type",
+        expected: "object",
+        received: "undefined",
+        path: [
+          "all_header",
+          "items",
+          0,
+          "menu_items",
+          3,
+          "see_all_link",
+          "link",
+        ],
+        message: "Required",
+      },
+    ],
+    name: "ZodError",
+  },
+}