Object dispatched to Redux store (with Immer) is frozen and is now readonly - React

122 Views Asked by At

Immer freezes the redux store to make the data immutable. As a result, I'm seeing the following issue:

I dispatch an object that (can be) rather large with other Objects nested in it to the redux store.

const object = {...all kinds of stuff in here.)

The reducer adds it to the store

this.draftState.object = object

In the file, after the dispatch, I try to modify the object that was sent in the dispatch

object.asdf = 'asdf'

This gives a runtime error since Immer freezes the object passed to the reducer.

Unfortunately, I haven't been able to find anything about this online.

Obviously we can use the spread operator to modify the existing object or do the spread inside of the reducer but I'm trying to figure out a way of avoiding this issue during compile time.

Has anyone ran into this before or know if it's possible to create a lint rule to catch variables being modified after being dispatched?

Is there a pattern of some kind that I'm missing?

Any comments / help greatly appreciated

0

There are 0 best solutions below