diff --git a/src/components/node/NodeBottomBlock/index.tsx b/src/components/node/NodeBottomBlock/index.tsx index f084a92a..3739d71d 100644 --- a/src/components/node/NodeBottomBlock/index.tsx +++ b/src/components/node/NodeBottomBlock/index.tsx @@ -6,53 +6,19 @@ 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, IFile, INode, ITag } 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'; +import { useNodeContext } from '~/utils/providers/NodeProvider'; interface IProps { - node: INode; - user: IUser; isUser: boolean; - canEdit: boolean; - isLoading: boolean; commentsOrder: 'ASC' | 'DESC'; - comments: IComment[]; - commentsCount: number; - isLoadingComments: boolean; - related: INodeRelated; - lastSeenCurrent?: string; - onShowImageModal: (images: IFile[], index: number) => void; - onLoadMoreComments: () => void; - onDeleteComment: (id: IComment['id'], isLocked: boolean) => void; - onTagsChange: (tags: string[]) => void; - onTagClick: (tag: Partial) => void; - onTagDelete: (id: ITag['ID']) => void; } -const NodeBottomBlock: FC = ({ - node, - user, - canEdit, - isLoading, - isUser, - isLoadingComments, - comments, - commentsCount, - commentsOrder, - related, - lastSeenCurrent, - onLoadMoreComments, - onDeleteComment, - onShowImageModal, - onTagsChange, - onTagClick, - onTagDelete, -}) => { +const NodeBottomBlock: FC = ({ commentsOrder }) => { + const { node, related, isUser, isLoading } = useNodeContext(); const { inline } = useNodeBlocks(node, isLoading); if (node.deleted_at) { @@ -66,19 +32,7 @@ const NodeBottomBlock: FC = ({ {inline &&
{inline}
} - + {isUser && !isLoading && }
@@ -89,16 +43,9 @@ const NodeBottomBlock: FC = ({
+
- +
diff --git a/src/components/node/NodeCommentsBlock/index.tsx b/src/components/node/NodeCommentsBlock/index.tsx index b2c7dff5..853a2660 100644 --- a/src/components/node/NodeCommentsBlock/index.tsx +++ b/src/components/node/NodeCommentsBlock/index.tsx @@ -1,40 +1,30 @@ import React, { FC } from 'react'; import { NodeNoComments } from '~/components/node/NodeNoComments'; import { NodeComments } from '~/components/node/NodeComments'; -import { IComment, IFile, INode } from '~/redux/types'; import { useNodeBlocks } from '~/utils/hooks/node/useNodeBlocks'; -import { IUser } from '~/redux/auth/types'; +import { useCommentContext } from '~/utils/providers/CommentProvider'; interface IProps { order: 'ASC' | 'DESC'; - node: INode; - user: IUser; - comments: IComment[]; - count: number; - lastSeenCurrent?: string; - isLoading: boolean; - isLoadingComments: boolean; - onShowImageModal: (images: IFile[], index: number) => void; - onLoadMoreComments: () => void; - onDeleteComment: (id: IComment['id'], isLocked: boolean) => void; } -const NodeCommentsBlock: FC = ({ - node, - user, - comments, - count, - lastSeenCurrent, - isLoading, - isLoadingComments, - onLoadMoreComments, - onDeleteComment, - onShowImageModal, -}) => { - const { inline } = useNodeBlocks(node, isLoading); +const NodeCommentsBlock: FC = () => { + const { + node, + user, + comments, + count, + lastSeenCurrent, + isLoadingNode, + isLoadingComments, + onLoadMoreComments, + onDeleteComment, + onShowImageModal, + } = useCommentContext(); + const { inline } = useNodeBlocks(node, isLoadingNode); - return isLoading || isLoadingComments || (!comments.length && !inline) ? ( - + return isLoadingNode || isLoadingComments || (!comments.length && !inline) ? ( + ) : ( void; - onTagClick: (tag: Partial) => void; - onTagDelete: (id: ITag['ID']) => void; -} +interface IProps {} + +const NodeTagsBlock: FC = ({}) => { + const { + tags, + canAppend, + canDelete, + isLoading, + onChange, + onTagClick, + onTagDelete, + } = useTagContext(); -const NodeTagsBlock: FC = ({ - tags, - canAppend, - canDelete, - isLoading, - onChange, - onTagClick, - onTagDelete, -}) => { if (isLoading) { return null; } diff --git a/src/layouts/NodeLayout/index.tsx b/src/layouts/NodeLayout/index.tsx index 576f40ce..849ac5cc 100644 --- a/src/layouts/NodeLayout/index.tsx +++ b/src/layouts/NodeLayout/index.tsx @@ -12,52 +12,18 @@ import { NodeBottomBlock } from '~/components/node/NodeBottomBlock'; import { useNodeCoverImage } from '~/utils/hooks/node/useNodeCoverImage'; import { URLS } from '~/constants/urls'; import { EditorEditDialog } from '~/containers/dialogs/EditorEditDialog'; -import { useNodePermissions } from '~/utils/hooks/node/useNodePermissions'; -import { IComment, IFile, INode, ITag } from '~/redux/types'; -import { INodeRelated } from '~/redux/node/types'; import styles from './styles.module.scss'; -import { IUser } from '~/redux/auth/types'; +import { useNodeContext } from '~/utils/providers/NodeProvider'; -type IProps = { - node: INode; - user: IUser; - lastSeenCurrent?: string; - related: INodeRelated; - comments: IComment[]; - commentsCount: number; - isUser: boolean; - isLoading: boolean; - isLoadingComments: boolean; - onShowImageModal: (images: IFile[], index: number) => void; - onLoadMoreComments: () => void; - onDeleteComment: (id: IComment['id'], isLocked: boolean) => void; - onTagsChange: (tags: string[]) => void; - onTagClick: (tag: Partial) => void; - onTagDelete: (id: ITag['ID']) => void; -}; +type IProps = {}; + +const NodeLayout: FC = () => { + const { node, isUser, isLoading } = useNodeContext(); -const NodeLayout: FC = ({ - node, - user, - comments, - commentsCount, - related, - lastSeenCurrent, - isUser, - isLoading, - isLoadingComments, - onLoadMoreComments, - onDeleteComment, - onShowImageModal, - onTagsChange, - onTagClick, - onTagDelete, -}) => { useNodeCoverImage(node); const { head, block } = useNodeBlocks(node, isLoading); - const [canEdit] = useNodePermissions(node); return (
@@ -71,25 +37,7 @@ const NodeLayout: FC = ({
- +