web/apps/scandic-web/components/DeprecatedJsonToHtml/utils.tsx

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
): 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))
}