Calling onCommit in DataEditor right before unmounting causes 2 changes in grid the first time

[ysfaran]

Bug or Feature?

Bug (might relate to #127)

Steps to reproduce

1. Add a custom DataEditor using dataEditor prop
2. Call onCommit of custom DataEditor before unmounting (using return value of useEffect)
3. Start editing a cell with custom DataEditor by clicking on it and starting to type (no double click)
4. Enter some value and click outside of cell (no enter, tab ..)

Expected Commited value is displayed in cell

Actual Cell is blank

Codesandbox

Observations

This is happening only the first time the cell was edited. Repeating step 3. and 4. again will work everytime afterwards.

When the bug occures two changes are triggered: one with the correct value, the other with an empty value. This means the correct value is right away overritten, thus the cell is blank in the end. You can also see this in the console in the GIF.

Also setting the initial state of DataCell (src/DataCell.js) to have committed: true this error is not happening and the rest also just works fine (as far as i tested it at least):

this.state = {updated: false, reverting: false, value: '', committing: false}
// to
this.state = {updated: false, reverting: false, value: '', committing: true}

The first and correct change is triggered in the handleCommit function, while the second and wrong change is triggered by componentDidUpdate because the committing flag is false (althouh it should be true