diff --git a/client/modules/User/pages/CollectionView.jsx b/client/modules/User/pages/CollectionView.jsx index 39e27fee4e..e52eb2c279 100644 --- a/client/modules/User/pages/CollectionView.jsx +++ b/client/modules/User/pages/CollectionView.jsx @@ -1,92 +1,21 @@ -import PropTypes from 'prop-types'; import React from 'react'; -import { connect } from 'react-redux'; -import { withTranslation } from 'react-i18next'; - +import { useParams } from 'react-router-dom'; import Nav from '../../IDE/components/Header/Nav'; import RootPage from '../../../components/RootPage'; - -import CollectionCreate from '../components/CollectionCreate'; import Collection from '../components/Collection'; -class CollectionView extends React.Component { - static defaultProps = { - user: null - }; - - ownerName() { - if (this.props.params.username) { - return this.props.params.username; - } - - return this.props.user.username; - } - - pageTitle() { - if (this.isCreatePage()) { - return this.props.t('CollectionView.TitleCreate'); - } - - return this.props.t('CollectionView.TitleDefault'); - } - - isOwner() { - return this.props.user.username === this.props.params.username; - } +const CollectionView = () => { + const params = useParams(); - isCreatePage() { - const path = this.props.location.pathname; - return /create$/.test(path); - } - - renderContent() { - if (this.isCreatePage() && this.isOwner()) { - return <CollectionCreate />; - } - - return ( + return ( + <RootPage> + <Nav layout="dashboard" /> <Collection - collectionId={this.props.params.collection_id} - username={this.props.params.username} + collectionId={params.collection_id} + username={params.username} /> - ); - } - - render() { - return ( - <RootPage> - <Nav layout="dashboard" /> - - {this.renderContent()} - </RootPage> - ); - } -} - -function mapStateToProps(state) { - return { - user: state.user - }; -} - -function mapDispatchToProps(dispatch) { - return {}; -} - -CollectionView.propTypes = { - location: PropTypes.shape({ - pathname: PropTypes.string.isRequired - }).isRequired, - params: PropTypes.shape({ - collection_id: PropTypes.string.isRequired, - username: PropTypes.string.isRequired - }).isRequired, - user: PropTypes.shape({ - username: PropTypes.string - }), - t: PropTypes.func.isRequired + </RootPage> + ); }; -export default withTranslation()( - connect(mapStateToProps, mapDispatchToProps)(CollectionView) -); +export default CollectionView;