fix: fix problems with React keys

Author: piotrzaborow

package-lock.json

@@ -40,9 +40,11 @@ const blocksToReactComponents = (
 ) => {
 	const remappedContent = remapContent(blockList)
 
-	return remappedContent.map((block: IBlock) => {
-		return blockRenderer(block, renderers)
-	})
+	return React.Children.toArray(
+		remappedContent.map((block: IBlock) => {
+			return blockRenderer(block, renderers)
+		})
+	)
 }
 
 export default blocksToReactComponents

src/blocksToReactComponents.tsx

@@ -2,13 +2,15 @@ import React from "react"
 import { IRichText } from "./UtilsInterfaces"
 
 const TextRenderer = (text: Array<IRichText>) => {
-	return text.map((textItem) => {
-		if (textItem.href) {
-			return <a href={textItem.href}>{textItem.text.content}</a>
-		} else {
-			return <span> {textItem.text.content}</span>
-		}
-	})
+	return React.Children.toArray(
+		text.map((textItem) => {
+			if (textItem.href) {
+				return <a href={textItem.href}>{textItem.text.content}</a>
+			} else {
+				return <span> {textItem.text.content}</span>
+			}
+		})
+	)
 }
 
 export default TextRenderer

src/utils/TextRenderer.tsx

@@ -1,8 +1,7 @@
-import { appendKeyToElement } from "./appendKeyToElement"
 import { IBlock, RenderNode } from "./UtilsInterfaces"
 
 const blockRenderer = (block: IBlock, renderers?: RenderNode) => {
-	return appendKeyToElement(renderers[block.type](block), block.id)
+	return renderers[block.type](block)
 }
 
 export default blockRenderer