From c98ac8b5977cac5422680989223625a4a3e79ec1 Mon Sep 17 00:00:00 2001
From: Fedor Katurov <gotham48@gmail.com>
Date: Wed, 24 Feb 2021 16:40:37 +0700
Subject: [PATCH] added markdown to text node

---
 .../comment/CommentTextBlock/index.tsx        |  6 ++--
 src/components/node/NodeTextBlock/index.tsx   | 29 ++++++++++++-------
 src/styles/common/markdown.module.scss        |  1 +
 3 files changed, 23 insertions(+), 13 deletions(-)

diff --git a/src/components/comment/CommentTextBlock/index.tsx b/src/components/comment/CommentTextBlock/index.tsx
index 09a7e286..674c7269 100644
--- a/src/components/comment/CommentTextBlock/index.tsx
+++ b/src/components/comment/CommentTextBlock/index.tsx
@@ -1,4 +1,4 @@
-import React, { FC } from 'react';
+import React, { FC, useMemo } from 'react';
 import { ICommentBlockProps } from '~/constants/comment';
 import styles from './styles.module.scss';
 import classNames from 'classnames';
@@ -8,11 +8,13 @@ import { formatText } from '~/utils/dom';
 interface IProps extends ICommentBlockProps {}
 
 const CommentTextBlock: FC<IProps> = ({ block }) => {
+  const content = useMemo(() => formatText(block.content), [block.content]);
+
   return (
     <div
       className={classNames(styles.text, markdown.wrapper)}
       dangerouslySetInnerHTML={{
-        __html: formatText(block.content),
+        __html: content,
       }}
     />
   );
diff --git a/src/components/node/NodeTextBlock/index.tsx b/src/components/node/NodeTextBlock/index.tsx
index 25f1c2b2..042b1bd7 100644
--- a/src/components/node/NodeTextBlock/index.tsx
+++ b/src/components/node/NodeTextBlock/index.tsx
@@ -1,19 +1,26 @@
-import React, { FC } from 'react';
-import { INode } from '~/redux/types';
+import React, { FC, useMemo } from 'react';
 import { path } from 'ramda';
 import { formatTextParagraphs } from '~/utils/dom';
-import styles from './styles.module.scss';
 import { INodeComponentProps } from '~/redux/node/constants';
+import classNames from 'classnames';
+import styles from './styles.module.scss';
+import markdown from '~/styles/common/markdown.module.scss';
 
 interface IProps extends INodeComponentProps {}
 
-const NodeTextBlock: FC<IProps> = ({ node }) => (
-  <div
-    className={styles.text}
-    dangerouslySetInnerHTML={{
-      __html: formatTextParagraphs(path(['blocks', 0, 'text'], node)),
-    }}
-  />
-);
+const NodeTextBlock: FC<IProps> = ({ node }) => {
+  const content = useMemo(() => formatTextParagraphs(path(['blocks', 0, 'text'], node)), [
+    node.blocks,
+  ]);
+
+  return (
+    <div
+      className={classNames(styles.text, markdown.wrapper)}
+      dangerouslySetInnerHTML={{
+        __html: content,
+      }}
+    />
+  );
+};
 
 export { NodeTextBlock };
diff --git a/src/styles/common/markdown.module.scss b/src/styles/common/markdown.module.scss
index 024ab1e4..15b3d015 100644
--- a/src/styles/common/markdown.module.scss
+++ b/src/styles/common/markdown.module.scss
@@ -29,6 +29,7 @@
     color: white;
     font-weight: 800;
     line-height: 1.2em;
+    margin-bottom: $gap;
   }
 
   h1 {