redux-toolkitcreateSliceintermediate

Nested State with Immer

📖 Usage Example

reducers: {
  setTheme: (state, action) => {
    state.user.preferences.theme = action.payload
  },
}

Immer lets you write deeply nested mutations naturally — no need to spread every level of the state tree.

Immer handles deeply nested state mutations transparently. You can assign to nested properties just like plain JavaScript.

Challenge: Create a profile slice with nested user.preferences.theme and write reducers to update the name and theme.

profileSlice.reducer(undefined, setTheme('dark'))
// → { user: { name: '', preferences: { theme: 'dark' } } }

💡 Hints (3)

• Immer works at any nesting depth: `state.user.preferences.theme = action.payload` is safe.
• Only the properties you touch are updated — the rest of the state is preserved.
• You don't need to spread nested objects — Immer handles structural sharing automatically.

20/22