removing workspace from Redux

src/actions/types.js

@@ -1,6 +1,5 @@
 export const NEW_CODE = 'NEW_CODE';
 export const CHANGE_WORKSPACE = 'CHANGE_WORKSPACE';
-export const NEW_WORKSPACE = 'NEW_WORKSPACE';
 export const CREATE_BLOCK = 'CREATE_BLOCK';
 export const MOVE_BLOCK = 'MOVE_BLOCK';
 export const CHANGE_BLOCK = 'CHANGE_BLOCK';

src/actions/workspaceActions.js

@@ -1,4 +1,4 @@
-import { NEW_CODE, CHANGE_WORKSPACE, NEW_WORKSPACE, CREATE_BLOCK, MOVE_BLOCK, CHANGE_BLOCK, DELETE_BLOCK, CLEAR_STATS } from './types';
+import { NEW_CODE, CHANGE_WORKSPACE, CREATE_BLOCK, MOVE_BLOCK, CHANGE_BLOCK, DELETE_BLOCK, CLEAR_STATS } from './types';
 
 import * as Blockly from 'blockly/core';
 
@@ -8,22 +8,12 @@ export const workspaceChange = () => (dispatch) => {
   })
 }
 
-export const initWorkspace = (workspace) => (dispatch) => {
-  dispatch({
-    type: NEW_WORKSPACE,
-    payload: workspace
-  });
-}
 
 export const onChangeWorkspace = (event) => (dispatch, getState) => {
-    const workspace = Blockly.getMainWorkspace();
-    dispatch({
-      type: NEW_WORKSPACE,
-      payload: workspace
-    });
     dispatch({
       type: CHANGE_WORKSPACE,
     })
+    const workspace = Blockly.getMainWorkspace();
     var code = getState().workspace.code;
     code.arduino = Blockly.Arduino.workspaceToCode(workspace);
     var xmlDom = Blockly.Xml.workspaceToDom(workspace);
@@ -78,11 +68,3 @@ export const clearStats = () => (dispatch) => {
     payload: stats
   });
 };
-
-
-export const setWorkspace = (workspace) => (dispatch, getState) => {
-  dispatch({
-    type: NEW_WORKSPACE,
-    payload: {new: workspace, old: getState().workspace.new}
-  });
-};

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){
+    const workspace = Blockly.getMainWorkspace();
-      this.props.workspace.clear();
+    workspace.clear();
-      this.props.workspace.options.maxBlocks = Infinity;
+    workspace.options.maxBlocks = Infinity;
-      this.props.workspaceChange();
+    this.props.workspaceChange();
-      this.props.clearStats();
+    this.props.clearStats();
-    }
-    else {
-      alert()
-    }
   }
 
   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();
+    const workspace = Blockly.getMainWorkspace();
-    this.props.initWorkspace(workspace);
     workspace.addChangeListener((event) => {
       this.props.onChangeWorkspace(event);
     });
@@ -72,22 +70,9 @@ class Home extends React.Component {
   };
 }
 
-WorkspaceStats.propTypes = {
+Home.propTypes = {
-  workspace: PropTypes.object.isRequired,
+  onChangeWorkspace: PropTypes.func.isRequired
-  create: PropTypes.number.isRequired,
-  change: PropTypes.number.isRequired,
-  delete: PropTypes.number.isRequired,
-  move: PropTypes.number.isRequired,
-  worskpaceChange: PropTypes.number.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,

src/reducers/workspaceReducer.js

@@ -1,4 +1,4 @@
-import { CHANGE_WORKSPACE, NEW_CODE, NEW_WORKSPACE, CREATE_BLOCK, MOVE_BLOCK, CHANGE_BLOCK, DELETE_BLOCK, CLEAR_STATS } from '../actions/types';
+import { CHANGE_WORKSPACE, NEW_CODE, CREATE_BLOCK, MOVE_BLOCK, CHANGE_BLOCK, DELETE_BLOCK, CLEAR_STATS } from '../actions/types';
 
 
 const initialState = {
@@ -6,7 +6,6 @@ const initialState = {
     arduino: '',
     xml: ''
   },
-  workspace: null,
   stats: {
     create: 0,
     change: 0,
@@ -28,11 +27,6 @@ export default function(state = initialState, action){
         ...state,
         change: state.change += 1
       };
-    case NEW_WORKSPACE:
-      return {
-        ...state,
-        workspace: action.payload
-      };
     case CREATE_BLOCK:
     case MOVE_BLOCK:
     case CHANGE_BLOCK: