delete (gallery-)project

src/components/Project/Project.js

@@ -3,7 +3,7 @@ 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 { clearMessages, returnErrors } from '../../actions/messageActions';
 
 import axios from 'axios';
 import { createNameId } from 'mnemonic-id';
@@ -18,6 +18,7 @@ import CircularProgress from '@material-ui/core/CircularProgress';
 class Project extends Component {
 
   componentDidMount() {
+    this.props.resetProject();
     this.getProject();
   }
 
@@ -31,8 +32,13 @@ class Project extends Component {
     }
     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.type!=='share'){
+          this.props.returnErrors('', 404, 'GET_PROJECT_FAIL');
+          this.props.history.push(`/${this.props.type}`);
+        } else {
+          this.props.history.push('/');
+          this.props.returnErrors('', 404, 'GET_SHARE_FAIL');
+        }
       }
       if(this.props.message.id === 'GET_PROJECT_SUCCESS'){
         this.props.workspaceName(this.props.project.title);
@@ -43,9 +49,6 @@ class Project extends Component {
   componentWillUnmount() {
     this.props.resetProject();
     this.props.workspaceName(null);
-    if(this.props.message.msg){
-      this.props.clearMessages();
-    }
   }
 
   getProject = () => {
@@ -77,6 +80,7 @@ Project.propTypes = {
   getProject: PropTypes.func.isRequired,
   resetProject: PropTypes.func.isRequired,
   clearMessages: PropTypes.func.isRequired,
+  returnErrors: PropTypes.func.isRequired,
   project: PropTypes.object.isRequired,
   type: PropTypes.string.isRequired,
   message: PropTypes.object.isRequired,
@@ -90,4 +94,4 @@ const mapStateToProps = state => ({
   message: state.message
 });
 
-export default connect(mapStateToProps, { workspaceName, getProject, resetProject, clearMessages })(Project);
+export default connect(mapStateToProps, { workspaceName, getProject, resetProject, clearMessages, returnErrors })(Project);

src/components/Project/ProjectHome.js

@@ -2,36 +2,60 @@ import React, { Component } from 'react';
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { getProjects, resetProject } from '../../actions/projectActions';
+import { clearMessages } from '../../actions/messageActions';
 
 import axios from 'axios';
 import { Link } from 'react-router-dom';
 
 import Breadcrumbs from '../Breadcrumbs';
 import BlocklyWindow from '../Blockly/BlocklyWindow';
+import Snackbar from '../Snackbar';
 
 import Grid from '@material-ui/core/Grid';
 import Paper from '@material-ui/core/Paper';
 import Divider from '@material-ui/core/Divider';
 import Typography from '@material-ui/core/Typography';
+import Backdrop from '@material-ui/core/Backdrop';
+import CircularProgress from '@material-ui/core/CircularProgress';
 
 
 class ProjectHome extends Component {
 
+  state = {
+    snackbar: false,
+    type: '',
+    key: '',
+    message: ''
+  }
+
   componentDidMount() {
-    this.props.getProjects(this.props.match.path.replace('/',''));
+    var type = this.props.match.path.replace('/','');
+    this.props.getProjects(type);
+    if(this.props.message){
+      if(this.props.message.id === 'PROJECT_DELETE_SUCCESS'){
+        this.setState({ snackbar: true, key: Date.now(), message: `Dein Projekt wurde erfolgreich gelöscht.`, type: 'success' });
+      }
+      else if(this.props.message.id === 'GALLERY_DELETE_SUCCESS'){
+        this.setState({ snackbar: true, key: Date.now(), message: `Dein Galerie-Projekt wurde erfolgreich gelöscht.`, type: 'success' });
+      }
+      else if(this.props.message.id === 'GET_PROJECT_FAIL'){
+        this.setState({ snackbar: true, key: Date.now(), message: `Dein angefragtes ${type === 'gallery' ? 'Galerie-':''}Projekt konnte nicht gefunden werden.`, type: 'error' });
+      }
+    }
   }
 
   componentDidUpdate(props) {
     if(props.match.path !== this.props.match.path){
+      this.setState({snackbar: false});
       this.props.getProjects(this.props.match.path.replace('/',''));
     }
   }
 
   componentWillUnmount() {
     this.props.resetProject();
+    this.props.clearMessages();
   }
 
-
   render() {
     var data = this.props.match.path === '/project' ? 'Projekte' : 'Galerie';
     return (
@@ -39,7 +63,11 @@ class ProjectHome extends Component {
         <Breadcrumbs content={[{ link: this.props.match.path, title: data }]} />
 
         <h1>{data}</h1>
-        {this.props.progress ? null :
+        {this.props.progress ?
+          <Backdrop open invisible>
+            <CircularProgress color="primary" />
+          </Backdrop>
+        :
         <Grid container spacing={2}>
           {this.props.projects.map((project, i) => {
             return (
@@ -60,6 +88,12 @@ class ProjectHome extends Component {
             )
           })}
         </Grid>}
+        <Snackbar
+          open={this.state.snackbar}
+          message={this.state.message}
+          type={this.state.type}
+          key={this.state.key}
+        />
       </div>
     );
   };
@@ -68,14 +102,17 @@ class ProjectHome extends Component {
 ProjectHome.propTypes = {
   getProjects: PropTypes.func.isRequired,
   resetProject: PropTypes.func.isRequired,
+  clearMessages: PropTypes.func.isRequired,
   projects: PropTypes.array.isRequired,
-  progress: PropTypes.bool.isRequired
+  progress: PropTypes.bool.isRequired,
+  message: PropTypes.object.isRequired
 };
 
 const mapStateToProps = state => ({
   projects: state.project.projects,
-  progress: state.project.progress
+  progress: state.project.progress,
+  message: state.message
 });
 
 
-export default connect(mapStateToProps, { getProjects, resetProject })(ProjectHome);
+export default connect(mapStateToProps, { getProjects, resetProject, clearMessages })(ProjectHome);