Redux: How can i update only name in category object in reducer

[chienvuhoang]

I have a object below:

categoryDetail: {
        isFetching: false,
        category: {
            id: '',
            name: '',
            publish: '',
            time_create: '',
            attributes: []
        }
    }

How can i update only name in category object in reducer.
I'm trying use return {...state, category: {name: cateName}}; and I get result:

categoryDetail: {
        isFetching: false,
        category: {
            name: ''
        }
    }

Please tell me how to update only name in category object and keeping all fields.
Thanks so much.

[mxstbr]

This will fix the issue:

return {
  ...state,
  category: {
    ...state.category,
    name: cateName
  }
}

I think this might be a case for using reducer composition and having a separate categoryReducer, see this and the following lessons of Dan's redux course for information on what that means and how to do it!

[chienvuhoang]

Thanks so much @mxstbr for help :)

[chienvuhoang]

Hi @mxstbr ,
I set it but i get error :

Uncaught ReferenceError: category is not defined

[mxstbr]

Ah sorry, I had a typo, my bad! :blush: should be:

return {
  ...state,
  category: {
    ...state.category,
    name: cateName
  }
}

Fixed above!

[chienvuhoang]

yeah, it work!!!. Thanks @mxstbr. Have a nice day. :)

[mxstbr]

Awesome, glad to hear! Sorry for the typo again!

[Koleok]

@chienvuhoang Could be a great time to look into lenses if you often have to write code with deeply nested object spreads. See ramda's lensPath and set.

with lenses you could write something like

const catNameLens = lensProp(['category', 'name'])
return set(catNameLens, cateName, state)

[chienvuhoang]

Thanks @Koleok