bencripps / react-redux-grid

A React Grid/Tree Component written in the Redux Pattern
http://react-redux-grid.herokuapp.com/
MIT License
444 stars 63 forks source link

Usage with redux-freeze #201

Open ChrisBirkett opened 6 years ago

ChrisBirkett commented 6 years ago

We love the look of this grid and are keen to use it to display data from our Redux state, so the contents of the grid change as the state updates.

The issue is... We use redux-freeze to prevent state mutation. Since the elements of our data array are not extensible, we have to add _key ourselves to prevent this error:

getData.js:68 Uncaught TypeError: Cannot add property_key, object is not extensible at getData.js:68 at Array.forEach (<anonymous>) at setKeysInData (getData.js:67) at setData (datasource.js:45) at handleActions.js:31 at combination (combineReducers.js:133) at reducers (index.js:55) at computeNextEntry (<anonymous>:2:27469) at recomputeStates (<anonymous>:2:27769) at <anonymous>:2:31382

I'm fine with that, but then if I try to sort by clicking a column header, I get:

GridActions.js:195 Uncaught TypeError: Cannot add property sortDirection, object is not extensible at GridActions.js:195 at Array.map (<anonymous>) at setSortDirection (GridActions.js:188) at handleSort (Column.js:207) at FixedHeader.handleColumnClick (Column.js:257) at HTMLUnknownElement.boundFunc (ReactErrorUtils.js:63) at Object.ReactErrorUtils.invokeGuardedCallback (ReactErrorUtils.js:69) at executeDispatch (EventPluginUtils.js:83) at Object.executeDispatchesInOrder (EventPluginUtils.js:106) at executeDispatchesAndRelease (EventPluginHub.js:41)

Presumably the disallowed state mutation here is within the grid's own state. I can only get it to work by taking the redux-freeze middleware out of the store. Any ideas how I could keep the store frozen? Would I need a second store dedicated to the grid?

bencripps commented 6 years ago

Yeah, grid assumes that data is either a native JS object, or an immutable object. It doesn't know how to retrieve data from a redux-freeze object. PR's welcome!

The only place we would need to handle the retrieval of data inside the redux-freeze object should be in the stateGetter util.

ChrisBirkett commented 6 years ago

Cool - if we work on this I will certainly send a PR. Cheers!