aohua / redux-state-sync

A lightweight middleware to sync your redux state across browser tabs
MIT License
235 stars 28 forks source link

Configuration with redux-toolkit #124

Open michaelkoelle opened 2 years ago

michaelkoelle commented 2 years ago

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

aohua commented 2 years ago

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

untitledlt commented 2 years ago

@aohua any updates on this?

michaelkoelle commented 2 years ago

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!

yqkqknct commented 1 year ago

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 ).