p5.js-web-editor/client/modules/User/pages/CollectionView.jsx

96 lines
2 KiB
React
Raw Normal View History

2019-07-09 16:24:09 +00:00
import PropTypes from 'prop-types';
import React from 'react';
import { connect } from 'react-redux';
import { withTranslation } from 'react-i18next';
2019-09-25 17:20:49 +00:00
import Nav from '../../../components/Nav';
2019-07-09 16:24:09 +00:00
import CollectionCreate from '../components/CollectionCreate';
2019-09-08 16:54:49 +00:00
import Collection from '../components/Collection';
2019-07-09 16:24:09 +00:00
class CollectionView extends React.Component {
static defaultProps = {
user: null,
};
componentDidMount() {
document.body.className = this.props.theme;
}
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');
2019-07-09 16:24:09 +00:00
}
return this.props.t('CollectionView.TitleDefault');
2019-07-09 16:24:09 +00:00
}
isOwner() {
return this.props.user.username === this.props.params.username;
}
isCreatePage() {
const path = this.props.location.pathname;
return /create$/.test(path);
}
renderContent() {
if (this.isCreatePage() && this.isOwner()) {
return <CollectionCreate />;
}
2019-09-08 16:54:49 +00:00
return (
<Collection
collectionId={this.props.params.collection_id}
username={this.props.params.username}
/>
);
2019-07-09 16:24:09 +00:00
}
render() {
return (
<div className="dashboard">
<Nav layout="dashboard" />
2019-07-09 16:24:09 +00:00
2019-09-08 16:54:49 +00:00
{this.renderContent()}
2019-07-09 16:24:09 +00:00
</div>
);
}
}
function mapStateToProps(state) {
return {
user: state.user,
theme: state.preferences.theme
};
}
function mapDispatchToProps(dispatch) {
return {};
2019-07-09 16:24:09 +00:00
}
CollectionView.propTypes = {
location: PropTypes.shape({
pathname: PropTypes.string.isRequired,
}).isRequired,
params: PropTypes.shape({
2019-09-08 16:54:49 +00:00
collection_id: PropTypes.string.isRequired,
2019-07-09 16:24:09 +00:00
username: PropTypes.string.isRequired,
}).isRequired,
theme: PropTypes.string.isRequired,
user: PropTypes.shape({
username: PropTypes.string,
2019-07-09 16:24:09 +00:00
}),
t: PropTypes.func.isRequired
2019-07-09 16:24:09 +00:00
};
export default withTranslation()(connect(mapStateToProps, mapDispatchToProps)(CollectionView));