#35 refactored node layout

src/utils/hooks/node/useNodeBlocks.ts

@@ -0,0 +1,34 @@
+import { INode } from '~/redux/types';
+import { createElement, FC, useCallback, useMemo } from 'react';
+import { isNil, prop } from 'ramda';
+import { INodeComponentProps, NODE_COMPONENTS, NODE_HEADS, NODE_INLINES } from '~/redux/node/constants';
+
+// useNodeBlocks returns head, block and inline blocks of node
+export const useNodeBlocks = (node: INode, isLoading: boolean) => {
+  const createNodeBlock = useCallback(
+    (block?: FC<INodeComponentProps>) =>
+      !isNil(block) &&
+      createElement(block, {
+        node,
+        isLoading,
+      }),
+    [node, isLoading]
+  );
+
+  const head = useMemo(
+    () => createNodeBlock(node?.type ? prop(node?.type, NODE_HEADS) : undefined),
+    [node, createNodeBlock]
+  );
+
+  const block = useMemo(
+    () => createNodeBlock(node?.type ? prop(node?.type, NODE_COMPONENTS) : undefined),
+    [node, createNodeBlock]
+  );
+
+  const inline = useMemo(
+    () => createNodeBlock(node?.type ? prop(node?.type, NODE_INLINES) : undefined),
+    [node, createNodeBlock]
+  );
+
+  return { head, block, inline };
+};