How to update certain key values in an object nested in the redux state

Question

I have the following data :

Project : {id:10,
           requirements: [{id:1,
                           title:test},
                          {id:2,
                            title:test2}]
          }

and

action.payload : {id:1,
                  title:changed_title}

What i wish to update the requirement object of id:1 within my redux reducer.

Heres what i have so far but it doesn't seem to be working and its super messy:

  case 'requirements_update': return (updateObject(state, project: {...state.project , requirements: state.project.requirements.filter(requirement => 
                                                                                                                                            {if(requirement.requirement_id === action.payload.requirement_id)
                                                                                                                                                
                                                                                                                                            return(action.payload) }
                                                                                                                                            })}))

please see: https://stackoverflow.com/questions/32135779/updating-nested-data-in-redux-store — thedude, Jul 12 '20 at 09:07

score 0 · Answer 1 · answered Jul 12 '20 at 09:11

0

You can use map and id check to update project

project : state.project.map(project => project.id === payload.id ? payload : project)

answered Jul 12 '20 at 09:11

Çağatay Sel

801
7
14

score 0 · Answer 2 · answered Jul 12 '20 at 09:21

The double spreading at the bottom is to merge current requirement properties with action payload, (action payload properties will have priority since they will override existing ones)

case 'requirements_update':
  return {...state, state.project: {...state.project , requirements: state.project.requirements.map(requirement => {
    if (requirement.id === action.payload.id) {
      return {...requirement, ...action.payload}
    } else {
      return requirement
    }
  }}}

How to update certain key values in an object nested in the redux state

2 Answers2