diff --git a/src/components/theme/View/TabsChildView.jsx b/src/components/theme/View/TabsChildView.jsx new file mode 100644 index 00000000..51abc713 --- /dev/null +++ b/src/components/theme/View/TabsChildView.jsx @@ -0,0 +1,147 @@ +/** + * Document view component. + * @module components/theme/View/DefaultView + */ + +import React, { Component } from 'react'; +import PropTypes from 'prop-types'; +import { Helmet } from '@plone/volto/helpers'; +import { compose } from 'redux'; +import { defineMessages, injectIntl } from 'react-intl'; + +import { map } from 'lodash'; +import { connect } from 'react-redux'; +import { Link } from 'react-router-dom'; + +import { blocks } from '~/config'; +import { + getBlocksFieldname, + getBlocksLayoutFieldname, + hasBlocksData, +} from '@plone/volto/helpers'; +import { flattenToAppURL } from '@plone/volto/helpers'; + +const messages = defineMessages({ + unknownBlock: { + id: 'Unknown Block', + defaultMessage: 'Unknown Block {block}', + }, +}); + +class DefaultView extends Component { + constructor(props) { + super(props); + // this.renderTabs = this.renderTabs.bind(this); + this.state = { + tabs: null, + }; + } + + static defaultProps = { + parent: null, + }; + static propTypes = { + tabs: PropTypes.array, + content: PropTypes.shape({ + title: PropTypes.string, + description: PropTypes.string, + text: PropTypes.shape({ + data: PropTypes.string, + }), + }).isRequired, + localNavigation: PropTypes.any, + }; + + // componentWillReceiveProps(nextProps) { + // console.log('herere', nextProps.parent, this.props.parent); + // if (nextProps.parent && nextProps.parent.id !== this.props.parent?.id) { + + // const pathArr = nextProps.location.pathname.split('/'); + // pathArr.length = 4; + // const path = pathArr.join('/'); + // const tabsItems = nextProps.parent.items.map(i => { + // return { + // url: `${path}/${i.id}`, + // title: i.title, + // '@type': i['@type'], + // }; + // }); + // this.props.setFolderTabs(tabsItems); + // } + // } + + computeFolderTabs = siblings => { + const tabsItems = siblings && siblings.items.map(i => { + return { + url: flattenToAppURL(i.url), + title: i.name, + }; + }); + return tabsItems; + }; + + render() { + const content = this.props.content; + const intl = this.props.intl; + const blocksFieldname = getBlocksFieldname(content); + const blocksLayoutFieldname = getBlocksLayoutFieldname(content); + const tabs = this.computeFolderTabs(content['@components'].siblings); + console.log('section tabs', this.props.sectionTabs) + return ( + hasBlocksData(content) && ( +
+ {tabs && tabs.length ? ( + + ) : ( + '' + )} + + {map(content[blocksLayoutFieldname].items, block => { + const Block = + blocks.blocksConfig[ + (content[blocksFieldname]?.[block]?.['@type']) + ]?.['view'] || null; + return Block !== null ? ( + + ) : ( +
+ {intl.formatMessage(messages.unknownBlock, { + block: content[blocksFieldname]?.[block]?.['@type'], + })} +
+ ); + })} +
+ ) + ); + } +} + +export default compose( + injectIntl, + connect((state, props) => ({ + pathname: props.location.pathname, + content: + state.prefetch?.[state.router.location.pathname] || state.content.data, + sectionTabs: state.section_tabs + }),mapDispatchToProps), +)(DefaultView); \ No newline at end of file diff --git a/src/localconfig.js b/src/localconfig.js index eaa28481..e67ccb7c 100644 --- a/src/localconfig.js +++ b/src/localconfig.js @@ -1,6 +1,7 @@ import TabsView from '~/components/theme/View/TabsView'; import RedirectView from '~/components/theme/View/RedirectView'; +import TabsChildView from '~/components/theme/View/TabsChildView'; import ChildrenListView from '~/components/manage/Blocks/DetailedLink/View'; import ChildrenListEdit from '~/components/manage/Blocks/DetailedLink/Edit'; @@ -12,6 +13,8 @@ console.log('config', config) layoutViews: { ...config.views.layoutViews, tabs_view: TabsView, + tabs_child_view: TabsChildView, + redirect_view: RedirectView, },