Redux-toolkit: Eslint error when moving to Redux Toolkit

[javierguzman]

Hello all!

I have started to port a project I started few months ago so I can use Redux Toolkit. It seems to work the functionality I have ported, however, I get a bunch of Eslint errors saying: 'Assigment to property of function parameter 'state''. This is because I have reducers as the following one:

const authSlice = createSlice({
  name: 'auth',
  initialState,
  reducers: {
    loginUserError(state, action) {
      state.correctLogin = false;
      state.user = null;
      state.errorMessage = action.payload;
    },

Am I implementing the reducer correctly? Meaning with Immer and being an object, not an array. If so, is this expected? I am just not sure if this is how it should be done when using objects as states as the examples I have seen of Redux Toolkit all are arrays as state.

Thank you in advance and regards.
Javier Guzman

[markerikson]

That would be because you have a specific ESLint rule enabled that's warning you about that. Redux Toolkit has no associated ESLint rules, and CRA doesn't have rules like that included, so it's going to be something that's been specifically turned on for your project.

Given that Immer specifically enables you to "mutate" the state argument, yes, you should almost definitely disable that rule.

Also not sure why you're saying most Redux Toolkit examples are arrays - the docs should show several examples of working with objects too.

[javierguzman]

Thank you for the answer Mark. This is coming from Eslint Airbnb configuration which I believe is one of the most used. Knowing now that I modify ok the state, I will disable the rule for all the redux files.