From 6d0a22707cf802c01049b69d9b89df59c1def5fc Mon Sep 17 00:00:00 2001
From: Fedor Katurov <gotham48@gmail.com>
Date: Thu, 17 Oct 2019 16:34:41 +0700
Subject: [PATCH] better text formatting

---
 src/components/node/NodeTextBlock/index.tsx   |  4 +--
 src/components/node/NodeTextBlock/styles.scss |  2 ++
 src/utils/dom.ts                              | 26 +++++++++++--------
 3 files changed, 19 insertions(+), 13 deletions(-)

diff --git a/src/components/node/NodeTextBlock/index.tsx b/src/components/node/NodeTextBlock/index.tsx
index 8b053775..adb38d73 100644
--- a/src/components/node/NodeTextBlock/index.tsx
+++ b/src/components/node/NodeTextBlock/index.tsx
@@ -1,7 +1,7 @@
 import React, { FC } from 'react';
 import { INode } from '~/redux/types';
 import path from 'ramda/es/path';
-import { formatCommentText } from '~/utils/dom';
+import { formatText } from '~/utils/dom';
 import * as styles from './styles.scss';
 
 interface IProps {
@@ -12,7 +12,7 @@ const NodeTextBlock: FC<IProps> = ({ node }) => (
   <div
     className={styles.text}
     dangerouslySetInnerHTML={{
-      __html: formatCommentText(null, path(['blocks', 0, 'text'], node)),
+      __html: formatText(path(['blocks', 0, 'text'], node)),
     }}
   />
 );
diff --git a/src/components/node/NodeTextBlock/styles.scss b/src/components/node/NodeTextBlock/styles.scss
index 8bcd3b80..9acebdf6 100644
--- a/src/components/node/NodeTextBlock/styles.scss
+++ b/src/components/node/NodeTextBlock/styles.scss
@@ -7,5 +7,7 @@
 
   p {
     margin: $gap 0;
+    font-size: 18px;
+    line-height: 24px;
   }
 }
diff --git a/src/utils/dom.ts b/src/utils/dom.ts
index 15d122f2..155bdb66 100644
--- a/src/utils/dom.ts
+++ b/src/utils/dom.ts
@@ -67,10 +67,8 @@ export const getURL = (file: Partial<IFile>) => {
 export const getImageSize = (file: IFile, size?: string): string => getURL(file);
 // `${process.env.API_HOST}${image}`.replace('{size}', size);
 
-export const formatCommentText = (author, text: string) => {
-  if (!text) return '';
-
-  return text
+export const formatText = (text: string): string =>
+  text
     .replace(/(\n{2,})/gi, '\n')
     .replace(/</g, '&lt;')
     .replace(/>/g, '&gt;')
@@ -78,15 +76,21 @@ export const formatCommentText = (author, text: string) => {
     .replace(/(\/\/[^\n]+)/gim, '<span class="grey">$1</span>')
     .replace(/:\|--\|/gim, '://')
     .split('\n')
-    .map((el, index) =>
-      index === 0
-        ? `${author ? `<p><b class="comment-author">${author}: </b>` : ''}${el}</p>`
-        : `<p>${el}</p>`
-    )
+    .map(el => `<p>${el}</p>`)
+    // .map((el, index) =>
+    //   index === 0
+    //     ? `${author ? `<p><b class="comment-author">${author}: </b>` : ''}${el}</p>`
+    //     : `<p>${el}</p>`
+    // )
     .join('');
-};
 
-// .replace(/\/\*(\*(?!\/)|[^*])*\*\//igm, '');
+export const formatCommentText = (author: string, text: string): string =>
+  text
+    ? formatText(text).replace(
+        /^<p>/,
+        author ? `<p><b class="comment-author">${author}: </b></p>` : '<p>'
+      )
+    : '';
 
 export const getPrettyDate = (date: string): string =>
   formatDistanceToNow(new Date(date), { locale: ru, includeSeconds: true, addSuffix: true });