From 5685412034643c2dcb5a4a3b7f26164c896653db Mon Sep 17 00:00:00 2001
From: Tiberiu Ichim <tiberiu.ichim@gmail.com>
Date: Tue, 22 Sep 2020 07:24:34 +0300
Subject: [PATCH] Add story about blocksState

---
 src/ColumnsBlock/ColumnsBlockEdit.jsx | 8 +++++++-
 src/ColumnsBlock/ColumnsBlockView.jsx | 4 ++--
 2 files changed, 9 insertions(+), 3 deletions(-)

diff --git a/src/ColumnsBlock/ColumnsBlockEdit.jsx b/src/ColumnsBlock/ColumnsBlockEdit.jsx
index 8632185..01a90c4 100644
--- a/src/ColumnsBlock/ColumnsBlockEdit.jsx
+++ b/src/ColumnsBlock/ColumnsBlockEdit.jsx
@@ -32,7 +32,11 @@ class ColumnsBlockEdit extends React.Component {
     // }
     // volto-slate needs to be neutral, to work in the main Volto form, but
     // also these types of subforms, so it should continue to use batched
-    // onChangeField, as that works fine.
+    // onChangeField, as that works fine. So volto-columns-block needs that
+    // blockState trick to overcome this. If there would be a onChangeBlocks or
+    // onChangeFormData in Volto core, then BlocksForm could match that API
+    // and this wouldn't be needed (together with the unstable_batchedUpdates
+    // calls.
     this.blocksState = {};
   }
 
@@ -46,6 +50,8 @@ class ColumnsBlockEdit extends React.Component {
       selected,
     } = this.props;
 
+    // TODO: need to reinitialize with empty data, there's a bug when trying to
+    // add a new column and the column block has just been created
     const { coldata = empty() } = data;
     const columnList = getColumns(coldata);
 
diff --git a/src/ColumnsBlock/ColumnsBlockView.jsx b/src/ColumnsBlock/ColumnsBlockView.jsx
index b01bb7c..51288f9 100644
--- a/src/ColumnsBlock/ColumnsBlockView.jsx
+++ b/src/ColumnsBlock/ColumnsBlockView.jsx
@@ -1,9 +1,9 @@
 import React from 'react';
 import { Grid } from 'semantic-ui-react';
-// import { renderBlocks } from '@plone/volto/helpers';
-import { getColumns, empty } from './utils';
 import { RenderBlocks } from '@plone/volto/components';
 
+import { getColumns, empty } from './utils';
+
 const ColumnsBlockView = (props) => {
   const { coldata = empty(), block_title } = props.data;
   const columnList = getColumns(coldata);