refactored node comments to component

src/components/node/NodeBottomBlock/index.tsx

@@ -6,16 +6,18 @@ import { NodeCommentsBlock } from '~/components/node/NodeCommentsBlock';
 import { NodeCommentForm } from '~/components/node/NodeCommentForm';
 import { NodeRelatedBlock } from '~/components/node/NodeRelatedBlock';
 import { useNodeBlocks } from '~/utils/hooks/node/useNodeBlocks';
-import { IComment, INode } from '~/redux/types';
-import { useUser } from '~/utils/hooks/user/userUser';
+import { IComment, IFile, INode } from '~/redux/types';
 import { NodeTagsBlock } from '~/components/node/NodeTagsBlock';
 import { INodeRelated } from '~/redux/node/types';
 import StickyBox from 'react-sticky-box/dist/esnext';
 import styles from './styles.module.scss';
 import { NodeAuthorBlock } from '~/components/node/NodeAuthorBlock';
+import { IUser } from '~/redux/auth/types';
 
 interface IProps {
   node: INode;
+  user: IUser;
+  isUser: boolean;
   canEdit: boolean;
   isLoading: boolean;
   commentsOrder: 'ASC' | 'DESC';
@@ -24,21 +26,28 @@ interface IProps {
   isLoadingComments: boolean;
   related: INodeRelated;
   lastSeenCurrent?: string;
+  onShowImageModal: (images: IFile[], index: number) => void;
+  onLoadMoreComments: () => void;
+  onDeleteComment: (id: IComment['id'], isLocked: boolean) => void;
 }
 
 const NodeBottomBlock: FC<IProps> = ({
   node,
+  user,
   canEdit,
   isLoading,
+  isUser,
   isLoadingComments,
   comments,
   commentsCount,
   commentsOrder,
   related,
   lastSeenCurrent,
+  onLoadMoreComments,
+  onDeleteComment,
+  onShowImageModal,
 }) => {
   const { inline } = useNodeBlocks(node, isLoading);
-  const { is_user } = useUser();
 
   if (node.deleted_at) {
     return <NodeDeletedBadge />;
@@ -58,17 +67,21 @@ const NodeBottomBlock: FC<IProps> = ({
               comments={comments}
               count={commentsCount}
               order={commentsOrder}
+              user={user}
               node={node}
+              onShowImageModal={onShowImageModal}
+              onLoadMoreComments={onLoadMoreComments}
+              onDeleteComment={onDeleteComment}
             />
 
-            {is_user && !isLoading && <NodeCommentForm nodeId={node.id} />}
+            {isUser && !isLoading && <NodeCommentForm nodeId={node.id} />}
           </Group>
 
           <div className={styles.panel}>
             <StickyBox className={styles.sticky} offsetTop={72}>
               <div className={styles.left}>
                 <div className={styles.left_item}>
-                  <NodeAuthorBlock node={node} />
+                  <NodeAuthorBlock user={node?.user} />
                 </div>
                 <div className={styles.left_item}>
                   <NodeTagsBlock node={node} canEdit={canEdit} isLoading={isLoading} />