fixed nod big

src/SubblocksEdit.jsx

@@ -1,18 +1,18 @@
-import React, { Component } from 'react'
-import PropTypes from 'prop-types'
-import move from 'lodash-move'
-import { isEqual } from 'lodash'
-import { defineMessages } from 'react-intl'
-import { Button } from 'semantic-ui-react'
+import React, { Component } from 'react';
+import PropTypes from 'prop-types';
+import move from 'lodash-move';
+import { isEqual } from 'lodash';
+import { defineMessages } from 'react-intl';
+import { Button } from 'semantic-ui-react';
 
-import './volto-subblocks.css'
+import './volto-subblocks.css';
 
 const messages = defineMessages({
   addBlock: {
     id: 'Add block',
     defaultMessage: 'Add block',
   },
-})
+});
 
 class SubblocksEdit extends Component {
   /**
@@ -34,37 +34,37 @@ class SubblocksEdit extends Component {
     onSelectBlock: PropTypes.func.isRequired,
     openObjectBrowser: PropTypes.func.isRequired,
     pathname: PropTypes.string.isRequired,
-  }
+  };
 
   constructor(props) {
-    super(props)
-    let subblocks = []
+    super(props);
+    let subblocks = [];
 
     if (!__SERVER__) {
       if (props.data && props.data.subblocks) {
-        subblocks = props.data.subblocks
+        subblocks = props.data.subblocks;
       }
     }
 
-    this.state = { subblocks }
+    this.state = { subblocks };
   }
 
   state = {
     subblocks: [],
     subIndexSelected: 0,
-  }
+  };
 
   /**
    * Component will receive props
    * @method componentDidMount
    * @returns {undefined}
    */
   componentDidMount() {
-    if (this.props.selected) {
-      this.node.focus()
+    if (this.props.selected && this.node) {
+      this.node.focus();
     }
     if (this.state.subblocks.length === 0) {
-      this.addSubblock()
+      this.addSubblock();
     }
   }
 
@@ -75,7 +75,7 @@ class SubblocksEdit extends Component {
    */
   componentWillUnmount() {
     if (this.props.selected && this.node) {
-      this.node.focus()
+      this.node.focus();
     }
   }
 
@@ -87,19 +87,19 @@ class SubblocksEdit extends Component {
    */
   onChangeSubblocks = (subblockIndex, subblock) => {
     if (!isEqual(subblock, this.state.subblocks[subblockIndex])) {
-      var subblocks = this.state.subblocks
+      var subblocks = this.state.subblocks;
 
-      subblocks[subblockIndex] = subblock
+      subblocks[subblockIndex] = subblock;
 
       this.props.onChangeBlock(this.props.block, {
         ...this.props.data,
         subblocks: subblocks,
         lastChange: new Date().getTime(),
-      })
+      });
 
-      this.setState({ subblocks })
+      this.setState({ subblocks });
     }
-  }
+  };
 
   /**
    * Move block handler
@@ -109,42 +109,42 @@ class SubblocksEdit extends Component {
    * @returns {undefined}
    */
   onMoveSubblock = (dragIndex, hoverIndex) => {
-    const subblocks = move(this.props.data.subblocks, dragIndex, hoverIndex)
+    const subblocks = move(this.props.data.subblocks, dragIndex, hoverIndex);
 
     this.props.onChangeBlock(this.props.block, {
       ...this.props.data,
       subblocks: subblocks,
-    })
+    });
 
-    this.setState({ subblocks })
-  }
+    this.setState({ subblocks });
+  };
 
   addSubblock = () => {
-    var s = this.state.subblocks
-    var id = new Date().getTime().toString()
-    var newBlock = { id: id }
-    s.push({})
+    var s = this.state.subblocks;
+    var id = new Date().getTime().toString();
+    var newBlock = { id: id };
+    s.push({});
     this.setState({
       subblocks: s,
-    })
-    var index = this.state.subblocks.length - 1
-    this.onChangeSubblocks(index, newBlock)
-    this.onSubblockChangeFocus(index)
-  }
+    });
+    var index = this.state.subblocks.length - 1;
+    this.onChangeSubblocks(index, newBlock);
+    this.onSubblockChangeFocus(index);
+  };
 
   onSubblockChangeFocus = (index) => {
-    this.setState({ subIndexSelected: index })
-  }
+    this.setState({ subIndexSelected: index });
+  };
 
   deleteSubblock = (index) => {
-    var sbb = this.state.subblocks
-    var subblocks = [...sbb.slice(0, index), ...sbb.slice(index + 1)]
-    this.setState({ subblocks })
+    var sbb = this.state.subblocks;
+    var subblocks = [...sbb.slice(0, index), ...sbb.slice(index + 1)];
+    this.setState({ subblocks });
     this.props.onChangeBlock(this.props.block, {
       ...this.props.data,
       subblocks: subblocks,
-    })
-  }
+    });
+  };
 
   renderAddBlockButton = (title) => {
     return (
@@ -153,12 +153,12 @@ class SubblocksEdit extends Component {
           {title ? title : this.props.intl.formatMessage(messages.addBlock)}
         </Button>
       )
-    )
-  }
+    );
+  };
 
   isSubblockSelected = (subindex) => {
-    return this.props.selected && this.state.subIndexSelected === subindex
-  }
+    return this.props.selected && this.state.subIndexSelected === subindex;
+  };
 
   subblockProps = {
     block: this.props.block,
@@ -167,7 +167,7 @@ class SubblocksEdit extends Component {
     onMoveSubblock: this.onMoveSubblock,
     onDelete: this.deleteSubblock,
     nblock: this.state.subblocks.length,
-  }
+  };
 }
 
-export default SubblocksEdit
+export default SubblocksEdit;

src/SubblocksWrapper.jsx

@@ -1,17 +1,17 @@
-import React from 'react'
-import cx from 'classnames'
+import React from 'react';
+import cx from 'classnames';
 
 const SubblocksWrapper = ({ className, children, node }) => {
   return (
     <div
       className={cx('volto-subblocks-wrapper', className)}
       ref={(_node) => {
-        node = _node
+        node = _node;
       }}
     >
       {children}
     </div>
-  )
-}
+  );
+};
 
-export default SubblocksWrapper
+export default SubblocksWrapper;