diff --git a/src/containers/node/NodeLayout/index.tsx b/src/containers/node/NodeLayout/index.tsx index 2bf31e50..ca16655e 100644 --- a/src/containers/node/NodeLayout/index.tsx +++ b/src/containers/node/NodeLayout/index.tsx @@ -1,36 +1,28 @@ -import React, { - FC, - createElement, - useEffect, - useCallback, - useState, - useMemo, - memo -} from "react"; -import { RouteComponentProps } from "react-router"; -import { connect } from "react-redux"; -import { canEditNode, canLikeNode, canStarNode } from "~/utils/node"; -import { selectNode } from "~/redux/node/selectors"; -import { Card } from "~/components/containers/Card"; +import React, { FC, createElement, useEffect, useCallback, useState, useMemo, memo } from 'react'; +import { RouteComponentProps } from 'react-router'; +import { connect } from 'react-redux'; +import { canEditNode, canLikeNode, canStarNode } from '~/utils/node'; +import { selectNode } from '~/redux/node/selectors'; +import { Card } from '~/components/containers/Card'; -import { NodePanel } from "~/components/node/NodePanel"; -import { Group } from "~/components/containers/Group"; -import { Padder } from "~/components/containers/Padder"; -import { NodeNoComments } from "~/components/node/NodeNoComments"; -import { NodeRelated } from "~/components/node/NodeRelated"; -import * as styles from "./styles.scss"; -import { NodeComments } from "~/components/node/NodeComments"; -import { NodeTags } from "~/components/node/NodeTags"; -import { NODE_COMPONENTS, NODE_INLINES } from "~/redux/node/constants"; -import * as NODE_ACTIONS from "~/redux/node/actions"; -import { CommentForm } from "~/components/node/CommentForm"; -import { selectUser } from "~/redux/auth/selectors"; -import pick from "ramda/es/pick"; -import { NodeRelatedPlaceholder } from "~/components/node/NodeRelated/placeholder"; +import { NodePanel } from '~/components/node/NodePanel'; +import { Group } from '~/components/containers/Group'; +import { Padder } from '~/components/containers/Padder'; +import { NodeNoComments } from '~/components/node/NodeNoComments'; +import { NodeRelated } from '~/components/node/NodeRelated'; +import * as styles from './styles.scss'; +import { NodeComments } from '~/components/node/NodeComments'; +import { NodeTags } from '~/components/node/NodeTags'; +import { NODE_COMPONENTS, NODE_INLINES } from '~/redux/node/constants'; +import * as NODE_ACTIONS from '~/redux/node/actions'; +import { CommentForm } from '~/components/node/CommentForm'; +import { selectUser } from '~/redux/auth/selectors'; +import pick from 'ramda/es/pick'; +import { NodeRelatedPlaceholder } from '~/components/node/NodeRelated/placeholder'; const mapStateToProps = state => ({ node: selectNode(state), - user: selectUser(state) + user: selectUser(state), }); const mapDispatchToProps = { @@ -39,7 +31,7 @@ const mapDispatchToProps = { nodeSetCoverImage: NODE_ACTIONS.nodeSetCoverImage, nodeEdit: NODE_ACTIONS.nodeEdit, nodeLike: NODE_ACTIONS.nodeLike, - nodeStar: NODE_ACTIONS.nodeStar + nodeStar: NODE_ACTIONS.nodeStar, }; type IProps = ReturnType & @@ -49,15 +41,9 @@ type IProps = ReturnType & const NodeLayoutUnconnected: FC = memo( ({ match: { - params: { id } - }, - node: { - is_loading, - is_loading_comments, - comments = [], - current: node, - related + params: { id }, }, + node: { is_loading, is_loading_comments, comments = [], current: node, related }, user, user: { is_user }, nodeGotoNode, @@ -65,7 +51,7 @@ const NodeLayoutUnconnected: FC = memo( nodeEdit, nodeLike, nodeStar, - nodeSetCoverImage + nodeSetCoverImage, }) => { // const is_loading = true; @@ -104,11 +90,10 @@ const NodeLayoutUnconnected: FC = memo( return ( - {block && - createElement(block, { node, is_loading, updateLayout, layout })} + {block && createElement(block, { node, is_loading, updateLayout, layout })} = memo( node, is_loading, updateLayout, - layout + layout, })} )} - {is_loading || - is_loading_comments || - (!comments.length && !inline_block) ? ( - + {is_loading || is_loading_comments || (!comments.length && !inline_block) ? ( + ) : ( )} @@ -150,11 +131,7 @@ const NodeLayoutUnconnected: FC = memo(
{!is_loading && ( - + )} {is_loading && } @@ -162,20 +139,15 @@ const NodeLayoutUnconnected: FC = memo( {!is_loading && related && related.albums && - Object.keys(related.albums).map(album => ( - - ))} + Object.keys(related.albums) + .filter(album => related.albums[album].length > 0) + .map(album => ( + + ))} - {!is_loading && - related && - related.similar && - related.similar.length > 0 && ( - - )} + {!is_loading && related && related.similar && related.similar.length > 0 && ( + + )}