displaying text

src/components/node/NodeImageSlideBlock/index.tsx

@@ -1,15 +1,4 @@
-import React, {
-  FC,
-  useMemo,
-  useState,
-  useEffect,
-  RefObject,
-  LegacyRef,
-  useRef,
-  useCallback,
-  MouseEventHandler,
-  TouchEventHandler,
-} from 'react';
+import React, { FC, useMemo, useState, useEffect, useRef, useCallback } from 'react';
 import { ImageSwitcher } from '../ImageSwitcher';
 import * as styles from './styles.scss';
 import { INode } from '~/redux/types';

src/components/node/NodeTextBlock/index.tsx

@@ -0,0 +1,20 @@
+import React, { FC } from 'react';
+import { INode } from '~/redux/types';
+import path from 'ramda/es/path';
+import { formatCommentText } from '~/utils/dom';
+import * as styles from './styles.scss';
+
+interface IProps {
+  node: INode;
+}
+
+const NodeTextBlock: FC<IProps> = ({ node }) => (
+  <div
+    className={styles.text}
+    dangerouslySetInnerHTML={{
+      __html: formatCommentText(null, path(['blocks', 0, 'text'], node)),
+    }}
+  />
+);
+
+export { NodeTextBlock };

src/components/node/NodeTextBlock/styles.scss

@@ -0,0 +1,11 @@
+.text {
+  @include outer_shadow();
+
+  background: $content_bg;
+  padding: $gap;
+  border-radius: $radius;
+
+  p {
+    margin: $gap / 2 0;
+  }
+}