|
1 |
| -import PropTypes from 'prop-types'; |
2 | 1 | import React from 'react';
|
3 |
| -import { connect } from 'react-redux'; |
4 |
| -import { withTranslation } from 'react-i18next'; |
5 |
| - |
| 2 | +import { useParams } from 'react-router-dom'; |
6 | 3 | import Nav from '../../IDE/components/Header/Nav';
|
7 | 4 | import RootPage from '../../../components/RootPage';
|
8 |
| - |
9 |
| -import CollectionCreate from '../components/CollectionCreate'; |
10 | 5 | import Collection from '../components/Collection';
|
11 | 6 |
|
12 |
| -class CollectionView extends React.Component { |
13 |
| - static defaultProps = { |
14 |
| - user: null |
15 |
| - }; |
16 |
| - |
17 |
| - ownerName() { |
18 |
| - if (this.props.params.username) { |
19 |
| - return this.props.params.username; |
20 |
| - } |
21 |
| - |
22 |
| - return this.props.user.username; |
23 |
| - } |
24 |
| - |
25 |
| - pageTitle() { |
26 |
| - if (this.isCreatePage()) { |
27 |
| - return this.props.t('CollectionView.TitleCreate'); |
28 |
| - } |
29 |
| - |
30 |
| - return this.props.t('CollectionView.TitleDefault'); |
31 |
| - } |
32 |
| - |
33 |
| - isOwner() { |
34 |
| - return this.props.user.username === this.props.params.username; |
35 |
| - } |
| 7 | +const CollectionView = () => { |
| 8 | + const params = useParams(); |
36 | 9 |
|
37 |
| - isCreatePage() { |
38 |
| - const path = this.props.location.pathname; |
39 |
| - return /create$/.test(path); |
40 |
| - } |
41 |
| - |
42 |
| - renderContent() { |
43 |
| - if (this.isCreatePage() && this.isOwner()) { |
44 |
| - return <CollectionCreate />; |
45 |
| - } |
46 |
| - |
47 |
| - return ( |
| 10 | + return ( |
| 11 | + <RootPage> |
| 12 | + <Nav layout="dashboard" /> |
48 | 13 | <Collection
|
49 |
| - collectionId={this.props.params.collection_id} |
50 |
| - username={this.props.params.username} |
| 14 | + collectionId={params.collection_id} |
| 15 | + username={params.username} |
51 | 16 | />
|
52 |
| - ); |
53 |
| - } |
54 |
| - |
55 |
| - render() { |
56 |
| - return ( |
57 |
| - <RootPage> |
58 |
| - <Nav layout="dashboard" /> |
59 |
| - |
60 |
| - {this.renderContent()} |
61 |
| - </RootPage> |
62 |
| - ); |
63 |
| - } |
64 |
| -} |
65 |
| - |
66 |
| -function mapStateToProps(state) { |
67 |
| - return { |
68 |
| - user: state.user |
69 |
| - }; |
70 |
| -} |
71 |
| - |
72 |
| -function mapDispatchToProps(dispatch) { |
73 |
| - return {}; |
74 |
| -} |
75 |
| - |
76 |
| -CollectionView.propTypes = { |
77 |
| - location: PropTypes.shape({ |
78 |
| - pathname: PropTypes.string.isRequired |
79 |
| - }).isRequired, |
80 |
| - params: PropTypes.shape({ |
81 |
| - collection_id: PropTypes.string.isRequired, |
82 |
| - username: PropTypes.string.isRequired |
83 |
| - }).isRequired, |
84 |
| - user: PropTypes.shape({ |
85 |
| - username: PropTypes.string |
86 |
| - }), |
87 |
| - t: PropTypes.func.isRequired |
| 17 | + </RootPage> |
| 18 | + ); |
88 | 19 | };
|
89 | 20 |
|
90 |
| -export default withTranslation()( |
91 |
| - connect(mapStateToProps, mapDispatchToProps)(CollectionView) |
92 |
| -); |
| 21 | +export default CollectionView; |
0 commit comments