reactjsreduximmutable.jssaga

Is there a way to set and push at the same time in a Redux action?


case 'MODIFY_NODES': {

    if (action.payload.nodes) {
        for (const node of action.payload.nodes) {
            const setNodes = action.payload.nodes.filter(n => state.findIndex((item) => item.get('id') == n.id) )
            const pushNodes = action.payload.nodes.filter(n => state.findIndex((item) => item.get('id') != n.id) )
            if (setNodes.length > 0) {
                return state.set(index, fromJS(node, toImmutableFunction)) 
            }
            if (pushNodes.length > 0) {
                return state.push(fromJS(pushNodes, toImmutableFunction))
            }
            
        }
    }
    return state

}

I need to call set and push on a set of elements, but I can't do both since I need to return something once. Is there a hack around this? I am trying to figure out what can be done, but I can't think of anything. I am thinking I need to call a saga function and then make two different calls after splitting the payload there. Is there a better way?


Solution

  • Please note that this is generally a very old style of Redux and the official recommendation would be not to use immutablejs any more since around 2019 - please read Why Redux Toolkit is how to write Redux today.

    It would be probably something along these lines:

    const setNodes = action.payload.nodes.filter(n => state.findIndex((item) => item.get('id') == n.id) )
    const pushNodes = action.payload.nodes.filter(n => state.findIndex((item) => item.get('id') != n.id) )
    
    let intermediateState = state;
    for (const node of setNodes) {
      intermediateState = intermediateState.set(index, fromJS(node, toImmutableFunction)) 
    }
    for (const node of pushNodes) {
      intermediateState = intermediateState.push(fromJS(pushNodes, toImmutableFunction))
    }
    return intermediateState