Files
web/apps/scandic-web/components/DeprecatedJsonToHtml/utils.tsx
Anton Gunnarsson 5a86cbaafe Merged in chore/update-eslint-configs (pull request #2812)
chore: Extend eslint configs from @typescript-eslint/recommended

* Change to typescript recommended in scandic-web

* Remove comment

* Change to recommended ts config in partner-sas

* Change to recommended ts lint config in booking-flow


Approved-by: Linus Flood
2025-09-17 07:55:11 +00:00

151 lines
3.8 KiB
TypeScript

import { cloneElement } from "react"
import {
AvailableParagraphFormatEnum,
AvailableULFormatEnum,
RTETypeEnum,
} from "@scandic-hotels/trpc/types/RTEenums"
import { renderOptions } from "./renderOptions"
import type { Node } from "@scandic-hotels/trpc/types/edges"
import type { EmbedByUid } from "@/types/components/deprecatedjsontohtml"
import type { Embeds } from "@/types/requests/embeds"
import {
RTEMarkType,
type RTENode,
type RTERenderMark,
type RTERenderOptionComponent,
type RTETextNode,
} from "@/types/rte/node"
import type { RenderOptions } from "@/types/rte/option"
export function groupEmbedsByUid(embedsArray: Node<Embeds>[]) {
const embedsByUid = embedsArray.reduce<EmbedByUid>((acc, embed) => {
if (embed.node.system?.uid) {
acc[embed.node.system.uid] = embed
}
return acc
}, {})
return embedsByUid
}
export function nodeChildrenToHtml(
nodes: RTENode[],
embeds: EmbedByUid,
fullRenderOptions: RenderOptions
// eslint-disable-next-line @typescript-eslint/no-explicit-any
): any {
return nodes
.map((node, i) => {
// This function either returns a JSX element or null
const element = nodeToHtml(node, embeds, fullRenderOptions)
if (!element) {
return null
}
return cloneElement(element, {
key: `child-rte-${i}`,
})
})
.filter(Boolean)
}
export function textNodeToHtml(
node: RTETextNode,
fullRenderOptions: RenderOptions
) {
let text = <>{node.text}</>
if (node.classname || node.id) {
text = (fullRenderOptions[RTEMarkType.classnameOrId] as RTERenderMark)(
text,
node.classname,
node.id
)
}
if (node.break) {
text = (fullRenderOptions[RTEMarkType.break] as RTERenderMark)(text)
}
if (node.superscript) {
text = (fullRenderOptions[RTEMarkType.superscript] as RTERenderMark)(text)
}
if (node.subscript) {
text = (fullRenderOptions[RTEMarkType.subscript] as RTERenderMark)(text)
}
if (node.inlineCode) {
text = (fullRenderOptions[RTEMarkType.inlineCode] as RTERenderMark)(text)
}
if (node.strikethrough) {
text = (fullRenderOptions[RTEMarkType.strikethrough] as RTERenderMark)(text)
}
if (node.underline) {
text = (fullRenderOptions[RTEMarkType.underline] as RTERenderMark)(text)
}
if (node.italic) {
text = (fullRenderOptions[RTEMarkType.italic] as RTERenderMark)(text)
}
if (node.bold) {
text = (fullRenderOptions[RTEMarkType.bold] as RTERenderMark)(text)
}
return text
}
function next(
nodes: RTENode[],
embeds: EmbedByUid,
fullRenderOptions: RenderOptions
) {
return nodeChildrenToHtml(nodes, embeds, fullRenderOptions)
}
export function hasAvailableParagraphFormat(className?: string) {
if (!className) {
return false
}
return Object.keys(AvailableParagraphFormatEnum).includes(className)
}
export function hasAvailableULFormat(className?: string) {
if (!className) {
return false
}
return Object.keys(AvailableULFormatEnum).includes(className)
}
export function nodeToHtml(
node: RTENode,
embeds: EmbedByUid,
fullRenderOptions: RenderOptions
) {
if ("type" in node === false) {
return textNodeToHtml(node, fullRenderOptions)
} else {
if (fullRenderOptions[node.type] !== undefined) {
if (node.type === RTETypeEnum.doc) {
return null
}
return (fullRenderOptions[node.type] as RTERenderOptionComponent)(
node,
embeds,
next,
fullRenderOptions
)
} else {
return next(node.children, embeds, fullRenderOptions)
}
}
}
export function nodesToHtml(
nodes: RTENode[],
embedsArray: Node<Embeds>[],
overrideRenderOptions: RenderOptions
) {
const embeds = groupEmbedsByUid(embedsArray)
const fullRenderOptions = { ...renderOptions, ...overrideRenderOptions }
return nodes.map((node) => nodeToHtml(node, embeds, fullRenderOptions))
}