fix(richtext-lexical): various html converter fixes (#6544)

payloadcms · May 29, 2024 · 4a51f4d · 4a51f4d
2 parents 33d5312 + 2c283bc
commit 4a51f4d
Show file tree

Hide file tree

Showing 3 changed files with 32 additions and 5 deletions.
diff --git a/packages/richtext-lexical/src/field/features/converters/html/field/index.ts b/packages/richtext-lexical/src/field/features/converters/html/field/index.ts
@@ -28,12 +28,12 @@ export const consolidateHTMLConverters = ({
   editorConfig,
 }: {
   editorConfig: SanitizedServerEditorConfig
-}) => {
+}): HTMLConverter[] => {
   const htmlConverterFeature = editorConfig.resolvedFeatureMap.get('htmlConverter')
   const htmlConverterFeatureProps: HTMLConverterFeatureProps =
     htmlConverterFeature?.serverFeatureProps
 
-  const defaultConvertersWithConvertersFromFeatures = defaultHTMLConverters
+  const defaultConvertersWithConvertersFromFeatures = [...defaultHTMLConverters]
 
   for (const converter of editorConfig.features.converters.html) {
     defaultConvertersWithConvertersFromFeatures.push(converter)
@@ -48,7 +48,33 @@ export const consolidateHTMLConverters = ({
       : (htmlConverterFeatureProps?.converters as HTMLConverter[]) ||
         defaultConvertersWithConvertersFromFeatures
 
-  return finalConverters
+  // filter converters by nodeTypes. The last converter in the list wins. If there are multiple converters for the same nodeType, the last one will be used and the node types will be removed from
+  // previous converters. If previous converters do not have any nodeTypes left, they will be removed from the list.
+  // This guarantees that user-added converters which are added after the default ones will always have precedence
+  const foundNodeTypes: string[] = []
+  const filteredConverters: HTMLConverter[] = []
+  for (const converter of finalConverters.reverse()) {
+    if (!converter.nodeTypes?.length) {
+      continue
+    }
+    const newConverter: HTMLConverter = {
+      converter: converter.converter,
+      nodeTypes: [...converter.nodeTypes],
+    }
+    newConverter.nodeTypes = newConverter.nodeTypes.filter((nodeType) => {
+      if (foundNodeTypes.includes(nodeType)) {
+        return false
+      }
+      foundNodeTypes.push(nodeType)
+      return true
+    })
+
+    if (newConverter.nodeTypes.length) {
+      filteredConverters.push(newConverter)
+    }
+  }
+
+  return filteredConverters
 }
 
 export const lexicalHTML: (

diff --git a/packages/richtext-lexical/src/field/features/link/feature.server.ts b/packages/richtext-lexical/src/field/features/link/feature.server.ts
@@ -169,13 +169,14 @@ export const LinkFeature: FeatureProviderProviderServer<LinkFeatureServerProps,
                   })
 
                   const rel: string = node.fields.newTab ? ' rel="noopener noreferrer"' : ''
+                  const target: string = node.fields.newTab ? ' target="_blank"' : ''
 
                   const href: string =
                     node.fields.linkType === 'custom'
                       ? node.fields.url
                       : (node.fields.doc?.value as string)
 
-                  return `<a href="${href}"${rel}>${childrenText}</a>`
+                  return `<a href="${href}"${target}${rel}>${childrenText}</a>`
                 },
                 nodeTypes: [LinkNode.getType()],
               },

diff --git a/packages/richtext-lexical/src/field/features/lists/orderedList/feature.server.ts b/packages/richtext-lexical/src/field/features/lists/orderedList/feature.server.ts
@@ -15,7 +15,7 @@ export const OrderedListFeature: FeatureProviderProviderServer<undefined, undefi
         ClientComponent: OrderedListFeatureClientComponent,
         i18n,
         markdownTransformers: [ORDERED_LIST],
-        nodes: featureProviderMap.has('unorderedlist')
+        nodes: featureProviderMap.has('unorderedList')
           ? []
           : [
               createNode({