diff --git a/components/Current/Header/index.tsx b/components/Current/Header/index.tsx index d93da4174..691af4548 100644 --- a/components/Current/Header/index.tsx +++ b/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) { diff --git a/lib/graphql/Query/Header.graphql b/lib/graphql/Query/Header.graphql index 3e42192be..32a9d686d 100644 --- a/lib/graphql/Query/Header.graphql +++ b/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 { - ...InternalOrExternalLink + linkConnection { + 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 { diff --git a/server/routers/contentstack/base/output.ts b/server/routers/contentstack/base/output.ts index 8399dd078..2fb6348ab 100644 --- a/server/routers/contentstack/base/output.ts +++ b/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, - title, - href, - isExternal: !!(isExternalLink || isOriginalLink), + href: originalUrl || removeMultipleSlashes(`/${lang}/${url}`), + isExternal: !!originalUrl, } }) +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 - const title = isExternalLink ? externalLink.title : rawData.cta_text + : linkConnectionData?.href || "" 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(), - body_text: z.string(), - background_image: imageVaultAssetTransformedSchema, - has_primary_button: z.boolean(), - has_secondary_button: z.boolean(), - scripted_top_title: z.string(), - primary_button: cardButtonSchema, - secondary_button: cardButtonSchema, + edges: z.array( + z.object({ + node: z.object({ + heading: z.string(), + body_text: z.string(), + background_image: imageVaultAssetTransformedSchema, + has_primary_button: z.boolean(), + 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, - heading: rawData.heading, - bodyText: rawData.body_text, - backgroundImage: rawData.background_image, - primaryButton: rawData.has_primary_button ? rawData.primary_button : null, - secondaryButton: rawData.has_secondary_button - ? rawData.secondary_button - : null, + scriptedTopTitle: node.scripted_top_title, + heading: node.heading, + bodyText: node.body_text, + backgroundImage: node.background_image, + primaryButton: node.has_primary_button ? node.primary_button : null, + secondaryButton: node.has_secondary_button ? node.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, - cardConnection: z.object({ - edges: z.array(z.object({ node: cardSchema })), - }), + see_all_link: linkWithTitleSchema, + cardConnection: cardConnectionSchema, }) - .transform((rawData) => { + .transform(({ submenu, linkConnection, cardConnection, see_all_link }) => { return { - link: rawData.submenu.length ? null : rawData.link, - seeAllLink: rawData.submenu.length ? rawData.see_all_link : null, - submenu: rawData.submenu, - card: rawData.cardConnection.edges[0]?.node, + link: submenu.length ? null : linkConnection, + seeAllLink: submenu.length ? see_all_link : null, + submenu, + 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), }) ), diff --git a/server/routers/contentstack/base/query.ts b/server/routers/contentstack/base/query.ts index feaf01e15..1eaa60824 100644 --- a/server/routers/contentstack/base/query.ts +++ b/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", + }, +}