94 lines
2.9 KiB
JavaScript
94 lines
2.9 KiB
JavaScript
import React, { Component } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { connect } from 'react-redux';
|
|
import { workspaceName } from '../../actions/workspaceActions';
|
|
import { getProject, resetProject } from '../../actions/projectActions';
|
|
import { clearMessages } from '../../actions/messageActions';
|
|
|
|
import axios from 'axios';
|
|
import { createNameId } from 'mnemonic-id';
|
|
|
|
import Home from '../Home';
|
|
import Breadcrumbs from '../Breadcrumbs';
|
|
|
|
import Backdrop from '@material-ui/core/Backdrop';
|
|
import CircularProgress from '@material-ui/core/CircularProgress';
|
|
|
|
|
|
class Project extends Component {
|
|
|
|
componentDidMount() {
|
|
this.getProject();
|
|
}
|
|
|
|
componentDidUpdate(props) {
|
|
if(props.location.path !== this.props.location.path ||
|
|
props.match.params[`${this.props.type}Id`] !== this.props.match.params[`${this.props.type}Id`]){
|
|
if(this.props.message.msg){
|
|
this.props.clearMessages();
|
|
}
|
|
this.getProject();
|
|
}
|
|
if(this.props.message !== props.message){
|
|
if(this.props.message.id === 'PROJECT_EMPTY' || this.props.message.id === 'GET_PROJECT_FAIL'){
|
|
this.props.workspaceName(createNameId());
|
|
this.props.history.push('/');
|
|
}
|
|
if(this.props.message.id === 'GET_PROJECT_SUCCESS'){
|
|
this.props.workspaceName(this.props.project.title);
|
|
}
|
|
}
|
|
}
|
|
|
|
componentWillUnmount() {
|
|
this.props.resetProject();
|
|
this.props.workspaceName(null);
|
|
if(this.props.message.msg){
|
|
this.props.clearMessages();
|
|
}
|
|
}
|
|
|
|
getProject = () => {
|
|
var param = this.props.match.params.shareId ? 'share' : this.props.match.params.galleryId ? 'gallery' : 'project';
|
|
var id = this.props.match.params[`${param}Id`];
|
|
this.props.getProject(param, id);
|
|
}
|
|
|
|
render() {
|
|
var data = this.props.type === 'project' ? 'Projekte' : 'Galerie';
|
|
return (
|
|
this.props.progress ?
|
|
<Backdrop open invisible>
|
|
<CircularProgress color="primary" />
|
|
</Backdrop>
|
|
: this.props.project ?
|
|
<div>
|
|
{this.props.type !== 'share' ?
|
|
<Breadcrumbs content={[{ link: `/${this.props.type}`, title: data },{ link: this.props.location.path, title: this.props.project.title }]} />
|
|
: null}
|
|
<Home project={this.props.project.xml}/>
|
|
</div> : null
|
|
);
|
|
};
|
|
}
|
|
|
|
Project.propTypes = {
|
|
workspaceName: PropTypes.func.isRequired,
|
|
getProject: PropTypes.func.isRequired,
|
|
resetProject: PropTypes.func.isRequired,
|
|
clearMessages: PropTypes.func.isRequired,
|
|
project: PropTypes.object.isRequired,
|
|
type: PropTypes.string.isRequired,
|
|
message: PropTypes.object.isRequired,
|
|
progress: PropTypes.bool.isRequired
|
|
};
|
|
|
|
const mapStateToProps = state => ({
|
|
project: state.project.projects[0],
|
|
progress: state.project.progress,
|
|
type: state.project.type,
|
|
message: state.message
|
|
});
|
|
|
|
export default connect(mapStateToProps, { workspaceName, getProject, resetProject, clearMessages })(Project);
|