aohua/redux-state-sync

Configuration with redux-toolkit

Opened this issue · 4 comments

How do i configure immutability with redux-toolkit which uses ImmerJS?

aohua commented

Hi @koellemichael, I haven't tried using redux-state-sync with ImmerJS yet, will try setup an example when I got time. PR is welcome, if you wanna try setup an example for redux-toolkit

@aohua any updates on this?

I found a workaround for now. I think it might actually be a problem on the redux-toolkit side. Somehow redux-toolkit uses the wrong identifier if the reducers are written like this:

reducers: {
    booksAddOne: adapter.addOne,
    ...
  },

I also tried to specify the identifier using the selectId option in the adapter, but still didn't work. However, if you extract the state and action and pass it explicitly it works:

reducers: {
    booksAddOne: (state, action) => adapter.addOne(state, action.payload),
    ...
  },

Hope that it works for you, too!

I found a workaround for now. I think it might actually be a problem on the redux-toolkit side. Somehow redux-toolkit uses the wrong identifier if the reducers are written like this:

reducers: {
    booksAddOne: adapter.addOne,
    ...
  },

I also tried to specify the identifier using the selectId option in the adapter, but still didn't work. However, if you extract the state and action and pass it explicitly it works:

reducers: {
    booksAddOne: (state, action) => adapter.addOne(state, action.payload),
    ...
  },

Hope that it works for you, too!

For anyone who came across this, this is due to redux toolkit's adapter checking whether the action is FSA or not (https://github.com/reduxjs/redux-toolkit/blob/e45425128d3c3168c7daa71e5f38f5151234cb8d/packages/toolkit/src/entities/state_adapter.ts#L34 ).