diff --git a/components/JsonToHtml/utils.tsx b/components/JsonToHtml/utils.tsx index d594d4c65..b2a8d838e 100644 --- a/components/JsonToHtml/utils.tsx +++ b/components/JsonToHtml/utils.tsx @@ -113,7 +113,6 @@ export function nodeToHtml( if ("type" in node === false) { return textNodeToHtml(node, fullRenderOptions) } else { - console.log({ NODE: node, EMBEDS: embeds }) if (fullRenderOptions[node.type] !== undefined) { if (node.type === RTETypeEnum.doc) { return null diff --git a/lib/graphql/Fragments/MetaData.graphql b/lib/graphql/Fragments/MetaData.graphql new file mode 100644 index 000000000..9c91793f8 --- /dev/null +++ b/lib/graphql/Fragments/MetaData.graphql @@ -0,0 +1,13 @@ +fragment MetaDataImageConnection on SeoMetadata { + imageConnection { + edges { + node { + dimension { + height + width + } + url(transform: { width: "1200" }) + } + } + } +} diff --git a/lib/graphql/Query/AccountPage/MetaData.graphql b/lib/graphql/Query/AccountPage/MetaData.graphql index f9b6ecfb4..005c99004 100644 --- a/lib/graphql/Query/AccountPage/MetaData.graphql +++ b/lib/graphql/Query/AccountPage/MetaData.graphql @@ -1,11 +1,8 @@ -#import "../../Fragments/Image.graphql" +#import "../../Fragments/MetaData.graphql" #import "../../Fragments/System.graphql" query GetAccountPageMetaData($locale: String!, $uid: String!) { account_page(locale: $locale, uid: $uid) { - system { - ...System - } web { breadcrumbs { title @@ -13,14 +10,11 @@ query GetAccountPageMetaData($locale: String!, $uid: String!) { seo_metadata { description title - imageConnection { - edges { - node { - ...Image - } - } - } + ...MetaDataImageConnection } } + system { + ...System + } } } diff --git a/lib/graphql/Query/CollectionPage/Metadata.graphql b/lib/graphql/Query/CollectionPage/Metadata.graphql index eee395a61..c06a3171b 100644 --- a/lib/graphql/Query/CollectionPage/Metadata.graphql +++ b/lib/graphql/Query/CollectionPage/Metadata.graphql @@ -1,15 +1,8 @@ -#import "../../Fragments/Image.graphql" +#import "../../Fragments/MetaData.graphql" #import "../../Fragments/System.graphql" query GetCollectionPageMetaData($locale: String!, $uid: String!) { collection_page(locale: $locale, uid: $uid) { - header { - heading - preamble - } - system { - ...System - } web { breadcrumbs { title @@ -17,14 +10,16 @@ query GetCollectionPageMetaData($locale: String!, $uid: String!) { seo_metadata { description title - imageConnection { - edges { - node { - ...Image - } - } - } + ...MetaDataImageConnection } } + header { + heading + preamble + } + hero_image + system { + ...System + } } } diff --git a/lib/graphql/Query/ContentPage/Metadata.graphql b/lib/graphql/Query/ContentPage/Metadata.graphql index 4058fd646..7a9e46070 100644 --- a/lib/graphql/Query/ContentPage/Metadata.graphql +++ b/lib/graphql/Query/ContentPage/Metadata.graphql @@ -1,15 +1,8 @@ -#import "../../Fragments/Image.graphql" +#import "../../Fragments/MetaData.graphql" #import "../../Fragments/System.graphql" query GetContentPageMetaData($locale: String!, $uid: String!) { content_page(locale: $locale, uid: $uid) { - header { - heading - preamble - } - system { - ...System - } web { breadcrumbs { title @@ -17,14 +10,25 @@ query GetContentPageMetaData($locale: String!, $uid: String!) { seo_metadata { description title - imageConnection { - edges { - node { - ...Image - } + ...MetaDataImageConnection + } + } + header { + heading + preamble + } + hero_image + blocks { + ... on ContentPageBlocksContent { + content { + content { + json } } } } + system { + ...System + } } } diff --git a/lib/graphql/Query/LoyaltyPage/MetaData.graphql b/lib/graphql/Query/LoyaltyPage/MetaData.graphql index 45ff4161f..f5fb5bc64 100644 --- a/lib/graphql/Query/LoyaltyPage/MetaData.graphql +++ b/lib/graphql/Query/LoyaltyPage/MetaData.graphql @@ -1,28 +1,33 @@ -#import "../../Fragments/Image.graphql" +#import "../../Fragments/MetaData.graphql" #import "../../Fragments/System.graphql" query GetLoyaltyPageMetaData($locale: String!, $uid: String!) { loyalty_page(locale: $locale, uid: $uid) { - heading - preamble - system { - ...System - } web { seo_metadata { description title - imageConnection { - edges { - node { - ...Image - } - } - } + ...MetaDataImageConnection } breadcrumbs { title } } + heading + preamble + hero_image + blocks { + ... on ContentPageBlocksContent { + __typename + content { + content { + json + } + } + } + } + system { + ...System + } } } diff --git a/server/routers/contentstack/metadata/output.ts b/server/routers/contentstack/metadata/output.ts index 6bf5ee05e..e4f580dbb 100644 --- a/server/routers/contentstack/metadata/output.ts +++ b/server/routers/contentstack/metadata/output.ts @@ -1,7 +1,10 @@ import { z } from "zod" +import { tempImageVaultAssetSchema } from "../schemas/imageVault" import { getDescription, getImages, getTitle } from "./utils" +import { RTETypeEnum } from "@/types/rte/enums" + export const rawMetaDataDataSchema = z.object({ web: z.object({ seo_metadata: z @@ -14,6 +17,10 @@ export const rawMetaDataDataSchema = z.object({ z.object({ node: z.object({ url: z.string(), + dimension: z.object({ + width: z.number(), + height: z.number(), + }), }), }) ), @@ -39,6 +46,36 @@ export const rawMetaDataDataSchema = z.object({ }) .optional() .nullable(), + hero_image: tempImageVaultAssetSchema, + blocks: z + .array( + z.object({ + content: z + .object({ + content: z + .object({ + json: z.object({ + children: z.array( + z.object({ + type: z.nativeEnum(RTETypeEnum), + children: z.array( + z.object({ + text: z.string().optional().nullable(), + }) + ), + }) + ), + }), + }) + .optional() + .nullable(), + }) + .optional() + .nullable(), + }) + ) + .optional() + .nullable(), }) export const metaDataSchema = rawMetaDataDataSchema.transform((data) => { diff --git a/server/routers/contentstack/metadata/utils.ts b/server/routers/contentstack/metadata/utils.ts index ce44b0011..360ac296e 100644 --- a/server/routers/contentstack/metadata/utils.ts +++ b/server/routers/contentstack/metadata/utils.ts @@ -1,3 +1,4 @@ +import { RTETypeEnum } from "@/types/rte/enums" import { RawMetaDataSchema } from "@/types/trpc/routers/contentstack/metadata" export const affix = "metadata" @@ -30,15 +31,42 @@ export function getDescription(data: RawMetaDataSchema) { if (data.header?.preamble) { return data.header.preamble } + if (data.blocks?.length) { + const jsonData = data.blocks[0].content?.content?.json + // Finding the first paragraph with text + const firstParagraph = jsonData?.children?.find( + (child) => child.type === RTETypeEnum.p && child.children[0].text + ) + + if (firstParagraph?.children?.length) { + return firstParagraph.children[0].text + } + } return "" } export function getImages(data: RawMetaDataSchema) { - const metaData = data.web.seo_metadata - if (metaData?.imageConnection) { - return metaData.imageConnection.edges.map((edge) => ({ - url: edge.node.url, - })) + const metaDataImages = data.web.seo_metadata?.imageConnection?.edges + const heroImage = data.hero_image + + if (metaDataImages?.length) { + return metaDataImages.map((edge) => { + const { width, height } = edge.node.dimension + return { + url: edge.node.url, + width: 1200, + height: Math.round((1200 * height) / width), + } + }) + } + if (heroImage) { + return [ + { + url: heroImage.url, + width: heroImage.dimensions.width, + height: heroImage.dimensions.height, + }, + ] } return [] } diff --git a/types/trpc/routers/contentstack/metadata.ts b/types/trpc/routers/contentstack/metadata.ts index c152f2e21..d4984103a 100644 --- a/types/trpc/routers/contentstack/metadata.ts +++ b/types/trpc/routers/contentstack/metadata.ts @@ -3,4 +3,4 @@ import { z } from "zod" import { rawMetaDataDataSchema } from "@/server/routers/contentstack/metadata/output" export interface RawMetaDataSchema - extends z.input {} + extends z.output {} diff --git a/utils/generateMetadata.ts b/utils/generateMetadata.ts index db25914a0..fa17da439 100644 --- a/utils/generateMetadata.ts +++ b/utils/generateMetadata.ts @@ -1,5 +1,7 @@ import { serverClient } from "@/lib/trpc/server" export async function generateMetadata() { - return await serverClient().contentstack.metaData.get() + const data = await serverClient().contentstack.metaData.get() + + return data }