diff --git a/components/JsonToHtml/renderOptions.tsx b/components/JsonToHtml/renderOptions.tsx
index 862d8bc1b..4b9a8d308 100644
--- a/components/JsonToHtml/renderOptions.tsx
+++ b/components/JsonToHtml/renderOptions.tsx
@@ -2,6 +2,7 @@ import Image from "@/components/Image"
import Link from "@/components/TempDesignSystem/Link"
import { insertResponseToImageVaultAsset } from "@/utils/imageVault"
+import { OpenInNewSmallIcon } from "../Icons"
import ImageContainer from "../ImageContainer"
import Divider from "../TempDesignSystem/Divider"
import Table from "../TempDesignSystem/Table"
@@ -341,25 +342,49 @@ export const renderOptions: RenderOptions = {
if ("attrs" in node) {
const type = node.attrs.type
if (type === RTEItemTypeEnum.asset) {
- const image = embeds?.[node?.attrs?.["asset-uid"]]
- if (image?.node.__typename === ContentEnum.blocks.SysAsset) {
- if (image.node.url) {
- const alt = image?.node?.title ?? node.attrs.alt
- const props = extractPossibleAttributes(node.attrs)
- props.className = styles.image
- return (
-
-
-
- )
+ const imageTypeRegex = /^image\//
+ const isImage = imageTypeRegex.test(node.attrs["asset-type"])
+ if (isImage) {
+ const image = embeds?.[node?.attrs?.["asset-uid"]]
+ if (image?.node.__typename === ContentEnum.blocks.SysAsset) {
+ if (image.node.url) {
+ const alt = image?.node?.title ?? node.attrs.alt
+ const props = extractPossibleAttributes(node.attrs)
+ props.className = styles.image
+ return (
+
+
+
+ )
+ }
}
+ } else if (node.attrs["display-type"] === "link" && node.attrs.href) {
+ return (
+
+ {next(
+ // Sometimes editors happen to nest a reference inside a link and vice versa.
+ // In that case use the outermost link, i.e. ignore nested links.
+ node.children.flatMap(noNestedLinksOrReferences),
+ embeds,
+ fullRenderOptions
+ )}
+
+
+ )
}
} else if (type === RTEItemTypeEnum.entry) {
const entry = embeds?.[node?.attrs?.["entry-uid"]]
@@ -375,11 +400,17 @@ export const renderOptions: RenderOptions = {
}
return null
} else if (
- entry?.node.__typename === ContentEnum.blocks.LoyaltyPage ||
- entry?.node.__typename === ContentEnum.blocks.ContentPage ||
entry?.node.__typename === ContentEnum.blocks.AccountPage ||
entry?.node.__typename === ContentEnum.blocks.CollectionPage ||
- entry?.node.__typename === ContentEnum.blocks.HotelPage
+ entry?.node.__typename === ContentEnum.blocks.ContentPage ||
+ entry?.node.__typename === ContentEnum.blocks.DestinationCityPage ||
+ entry?.node.__typename ===
+ ContentEnum.blocks.DestinationCountryPage ||
+ entry?.node.__typename ===
+ ContentEnum.blocks.DestinationOverviewPage ||
+ entry?.node.__typename === ContentEnum.blocks.HotelPage ||
+ entry?.node.__typename === ContentEnum.blocks.LoyaltyPage ||
+ entry?.node.__typename === ContentEnum.blocks.StartPage
) {
// If entry is not an ImageContainer, it is a page and we return it as a link
const props = extractPossibleAttributes(node.attrs)
diff --git a/lib/graphql/Fragments/Blocks/Content.graphql b/lib/graphql/Fragments/Blocks/Content.graphql
index 9c62f9425..c77fdc589 100644
--- a/lib/graphql/Fragments/Blocks/Content.graphql
+++ b/lib/graphql/Fragments/Blocks/Content.graphql
@@ -28,6 +28,7 @@ fragment Content_ContentPage on ContentPageBlocksContent {
edges {
node {
__typename
+ ...Image
...ImageContainer
...AccountPageLink
...CollectionPageLink
diff --git a/lib/graphql/Fragments/Image.graphql b/lib/graphql/Fragments/Image.graphql
index 89d7c4057..5e9271a90 100644
--- a/lib/graphql/Fragments/Image.graphql
+++ b/lib/graphql/Fragments/Image.graphql
@@ -1,4 +1,5 @@
fragment Image on SysAsset {
+ content_type
description
dimension {
height
diff --git a/server/routers/contentstack/schemas/blocks/image.ts b/server/routers/contentstack/schemas/blocks/image.ts
index a2c3e74b3..113564a46 100644
--- a/server/routers/contentstack/schemas/blocks/image.ts
+++ b/server/routers/contentstack/schemas/blocks/image.ts
@@ -4,11 +4,14 @@ import { ContentEnum } from "@/types/enums/content"
export const imageSchema = z.object({
__typename: z.literal(ContentEnum.blocks.SysAsset),
- description: z.string().optional(),
- dimension: z.object({
- height: z.number(),
- width: z.number(),
- }),
+ content_type: z.string(),
+ description: z.string().nullable().optional(),
+ dimension: z
+ .object({
+ height: z.number(),
+ width: z.number(),
+ })
+ .nullable(),
metadata: z.any(), // JSON
// system for SysAssets is not the same type
// as for all other types eventhough they have