feat(SW-66, SW-348): search functionality and ui

components/DeprecatedJsonToHtml/utils.tsx

@@ -0,0 +1,138 @@
+import { renderOptions } from "./renderOptions"
+
+import type { EmbedByUid } from "@/types/components/deprecatedjsontohtml"
+import type { Embeds } from "@/types/requests/embeds"
+import type { Node } from "@/types/requests/utils/edges"
+import {
+  AvailableParagraphFormatEnum,
+  AvailableULFormatEnum,
+  RTETypeEnum,
+} from "@/types/rte/enums"
+import type {
+  RTENode,
+  RTERenderOptionComponent,
+  RTETextNode,
+} from "@/types/rte/node"
+import { RTEMarkType, RTERenderMark } 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
+    return {
+      ...nodeToHtml(node, embeds, fullRenderOptions),
+      key: `child-rte-${i}`,
+    }
+  })
+}
+
+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))
+}