Logical Error in "prepare callback" example.

[zaladeokin]

Redux Essentials -> Using Redux data

There is a logical error in the features/posts/postsSlice.ts example of "preparing payload" section of Part 4: Using Redux Data tutorial. The prepare callback function should receive only one parameter—the action object from the action creator. However, the example incorrectly passes two arguments, causing an error.

Below are my suggested solutions to fix this bug:

#Solution 1:

interface PrepareArgument {
  title: string;
  content: string;
}

const postsSlice = createSlice({
  name: 'posts',
  initialState,
  reducers: {
    postAdded: {
      reducer(state, action: PayloadAction<Post>) {
        state.push(action.payload)
      },
      prepare({title, content}: PrepareArgument) {
        return {
          payload: { id: nanoid(), title, content }
        }
      }
    }
    // other reducers here
  }
})

##Solution 2:

interface PrepareArgument {
  title: string;
  content: string;
}

const postsSlice = createSlice({
  name: 'posts',
  initialState,
  reducers: {
    postAdded: {
      reducer(state, action: PayloadAction<Post>) {
        state.push(action.payload)
      },
      prepare(postActionObj: PrepareArgument) {
        return {
          payload: { ...postActionObj, id: nanoid()}
        }
      }
    }
    // other reducers here
  }
})