removing workspace from Redux

src/components/ClearWorkspace.js

@@ -3,6 +3,8 @@ import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
 import { clearStats, workspaceChange } from '../actions/workspaceActions';
 
+import * as Blockly from 'blockly/core';
+
 import ListItem from '@material-ui/core/ListItem';
 import ListItemIcon from '@material-ui/core/ListItemIcon';
 import ListItemText from '@material-ui/core/ListItemText';
@@ -13,15 +15,11 @@ import { FontAwesomeIcon } from "@fortawesome/react-fontawesome";
 class ClearWorkspace extends Component {
 
   clearWorkspace = () => {
-    if(this.props.workspace){
-      this.props.workspace.clear();
-      this.props.workspace.options.maxBlocks = Infinity;
-      this.props.workspaceChange();
-      this.props.clearStats();
-    }
-    else {
-      alert()
-    }
+    const workspace = Blockly.getMainWorkspace();
+    workspace.clear();
+    workspace.options.maxBlocks = Infinity;
+    this.props.workspaceChange();
+    this.props.clearStats();
   }
 
   render() {
@@ -35,13 +33,9 @@ class ClearWorkspace extends Component {
 }
 
 ClearWorkspace.propTypes = {
-  workspace: PropTypes.object.isRequired,
   clearStats: PropTypes.func.isRequired,
   workspaceChange: PropTypes.func.isRequired
 };
 
-const mapStateToProps = state => ({
-  workspace: state.workspace.workspace
-});
 
-export default connect(mapStateToProps, { clearStats, workspaceChange })(ClearWorkspace);
+export default connect(null, { clearStats, workspaceChange })(ClearWorkspace);

src/components/Home.js

@@ -1,8 +1,7 @@
 import React, { Component } from 'react';
-
 import PropTypes from 'prop-types';
 import { connect } from 'react-redux';
-import { onChangeWorkspace, initWorkspace } from '../actions/workspaceActions';
+import { onChangeWorkspace } from '../actions/workspaceActions';
 
 import WorkspaceStats from './WorkspaceStats';
 import WorkspaceFunc from './WorkspaceFunc';
@@ -16,7 +15,7 @@ import './Blockly/blocks/index';
 import './Blockly/generator/index';
 
 
-class Home extends React.Component {
+class Home extends Component {
   constructor(props) {
     super(props);
 
@@ -24,8 +23,7 @@ class Home extends React.Component {
   }
 
   componentDidMount() {
-    let workspace = Blockly.getMainWorkspace();
-    this.props.initWorkspace(workspace);
+    const workspace = Blockly.getMainWorkspace();
     workspace.addChangeListener((event) => {
       this.props.onChangeWorkspace(event);
     });
@@ -72,22 +70,9 @@ class Home extends React.Component {
   };
 }
 
-WorkspaceStats.propTypes = {
-  workspace: PropTypes.object.isRequired,
-  create: PropTypes.number.isRequired,
-  change: PropTypes.number.isRequired,
-  delete: PropTypes.number.isRequired,
-  move: PropTypes.number.isRequired,
-  worskpaceChange: PropTypes.number.isRequired
+Home.propTypes = {
+  onChangeWorkspace: PropTypes.func.isRequired
 };
 
-const mapStateToProps = state => ({
-  workspace: state.workspace.workspace,
-  create: state.workspace.stats.create,
-  change: state.workspace.stats.change,
-  delete: state.workspace.stats.delete,
-  move: state.workspace.stats.move,
-  worskpaceChange: state.workspace.change
-});
 
-export default connect(null, { onChangeWorkspace, initWorkspace })(Home);
+export default connect(null, { onChangeWorkspace })(Home);

src/components/MaxBlocks.js

@@ -43,4 +43,8 @@ class MaxBlocks extends Component {
   };
 }
 
+MaxBlocks.propTypes = {
+  workspaceChange: PropTypes.func.isRequired
+};
+
 export default connect(null, { workspaceChange })(MaxBlocks);

src/components/WorkspaceStats.js

@@ -24,13 +24,14 @@ const styles = (theme) => ({
 class WorkspaceStats extends Component {
 
   render() {
-    const remainingBlocksInfinity = this.props.workspace ? this.props.workspace.remainingCapacity() !== Infinity : null;
+    const workspace = Blockly.getMainWorkspace();
+    const remainingBlocksInfinity = workspace ? workspace.remainingCapacity() !== Infinity : null;
     return (
       <div style={{marginBottom: '20px'}}>
         <Tooltip title="Anzahl aktueller Blöcke" style={{marginLeft: 0}} className={this.props.classes.stats}>
           <div>
             <FontAwesomeIcon icon={faPuzzlePiece} />
-            <Typography style={{display: 'inline'}}> {this.props.workspace ? this.props.workspace.getAllBlocks().length : 0}</Typography>
+            <Typography style={{display: 'inline'}}> {workspace ? workspace.getAllBlocks().length : 0}</Typography>
           </div>
         </Tooltip>
         <Tooltip title="Anzahl neuer Blöcke" className={this.props.classes.stats}>
@@ -63,7 +64,7 @@ class WorkspaceStats extends Component {
         </Tooltip>
         {remainingBlocksInfinity ?
           <Tooltip title="verbleibende Blöcke" className={this.props.classes.stats}>
-            <Typography style={{display: 'inline'}}>{this.props.workspace.remainingCapacity()} verbleibende Blöcke</Typography>
+            <Typography style={{display: 'inline'}}>{workspace.remainingCapacity()} verbleibende Blöcke</Typography>
           </Tooltip> : null}
       </div>
     );
@@ -71,7 +72,6 @@ class WorkspaceStats extends Component {
 }
 
 WorkspaceStats.propTypes = {
-  workspace: PropTypes.object.isRequired,
   create: PropTypes.number.isRequired,
   change: PropTypes.number.isRequired,
   delete: PropTypes.number.isRequired,
@@ -80,7 +80,6 @@ WorkspaceStats.propTypes = {
 };
 
 const mapStateToProps = state => ({
-  workspace: state.workspace.workspace,
   create: state.workspace.stats.create,
   change: state.workspace.stats.change,
   delete: state.workspace.stats.delete,