Redux reducer with Immutable

Question

I want to add a post to an array of posts in the reducer. Normally I would just do this:

CREATE_NEW__POST_SUCCESS: {
    return {
        ...state,
        fetchingPosts: false,
        error: null,
        posts: [...state.posts, ...action.payload],
        };

However my current project requires me to use Immutable.js With Immutable the state is set with .set() or .merge() or .update()

case CREATE_NEW_POST_SUCCESS: {
    return state
        .set('fetchingPosts', false)
        .set('posts', action.payload)
        .set('postsError', null);

This overwrites the whole array of posts with just one post object. I tried lots of things like

 .set('posts' ,[...state.posts, ...action.payload])

But no joy

Have toy tried doing this `.set('posts', [...state.posts, ...action.payload])`? Or using the `merge` method to add to the posts? — thefallen, Apr 01 '19 at 10:53

score 1 · Answer 1 · answered Apr 01 '19 at 11:00

1

You can use updateIn similarly to the answer here.

case CREATE_NEW_POST_SUCCESS: {
    return state
        .set('fetchingPosts', false)
        .updateIn(['posts'], posts => posts.push(action.payload))
        .set('postsError', null);

answered Apr 01 '19 at 11:00

Moti Azu

5,392
1
23
32

this looks perfect, thank you. Still can't get it to work for some reason.I'll keep looking around for what I am doing wrong – jojojohn Apr 01 '19 at 11:42

score 0 · Answer 2 · answered Apr 01 '19 at 10:59

0

I think state.merge() and concat() could work here:

case CREATE_NEW_POST_SUCCESS: {
    return state.merge({
        fetchingPosts: false,
        posts: state.get('posts').concat(action.payload),
        postError: null,
    })
}

answered Apr 01 '19 at 10:59

Nandito

11
1

Redux reducer with Immutable

2 Answers2