Material-table: crash in componentWillReceiveProps when changing data shape while sorted

[tlambert03]

Describe the bug
This is perhaps an overly-specific use-case, but a bug nonetheless...
I have a table with a free action button that transposes the data in the table: on clicking the action button, it recalculates the rows and headers data which are stored in the parent state, and delivers it to the MaterialTable component. Everything works fine until I sort one of the last columns in the table. If the number of columns in the pre-transposed table is greater than the number of post-transposed columns, and if the "currently sorted" column no longer exists after transpose, then the sortList method in data-manager.js fails in UNSAFE_componentWillReceiveProps because there is no longer a column there, and the component crashes at line 421 below

https://github.com/mbrn/material-table/blob/695f95c3b3c8fa70cc3e2fe56e7d649b2eae0ca6/src/utils/data-manager.js#L417-L421

TypeError: Cannot read property 'customSort' of undefined
  at sortList(./node_modules/material-table/dist/utils/data-manager.js:633:1)
  at sortData(./node_modules/material-table/dist/utils/data-manager.js:886:1)
  at getRenderState(./node_modules/material-table/dist/utils/data-manager.js:134:1)
  at UNSAFE_componentWillReceiveProps(./node_modules/material-table/dist/material-table.js:424:1)

If I wrap the table in an Error boundary and force it to rerender, it works fine.

To Reproduce
https://codesandbox.io/s/zen-moser-b802x

(note, the console error is not very informative there as it is trumped by an apparent error in react-beautiful-dnd)

Expected behavior
deriving state from props should not crash the component, even if the shape of the props.data and props.columns has changed

Desktop (please complete the following information):

• Browser : Chrome
  
  
  
  • react version 16.8.6
  
  
  • material-table version 1.40.1
  
  

[tlambert03]

Probably also worth referencing issue https://github.com/mbrn/material-table/issues/697 here...
Seems like one reasonable solution, without having to muck with the sorting behavior in willReceiveProps, would be to set defaultSort on the first column (or at least a column that still exists) when changing the data in the table... then sortList would not be looking for a column that no longer exists

[alimirzaei]

In case of changing data, you can pass a new key to the component. Here is the sandbox which is working:
https://codesandbox.io/s/broken-glitter-n3fs2

[Domino987]

Is this still an issue since UNSAFE_componentWillReceiveProps has been removed?

[janderson215]

In case of changing data, you can pass a new key to the component. Here is the sandbox which is working:
https://codesandbox.io/s/broken-glitter-n3fs2

I had this exact issue and @alimirzaei's suggestion fixed it. Is there any harm in autogenerating the key property behind the scenes so the issue can be non-existent for devs utilizing this wonderful library?

[Domino987]

Can you create a PR addressing this issue? That would help us a lot. Thank you !

[stale[bot]]

This issue has been automatically marked as stale because it has not had recent activity. It will be closed if no further activity occurs. Thank you for your contributions. You can reopen it if it required.