redux - how to store and update a key/value pair

Question

I am using redux wth reactjs.

I want to store simple key/value pairs but can't get the reducer syntax right.

In this case each key/value pair will hold a connection to an external system.

Is this the right way to do it? I'm at the beginning with redux so it's a bit of mystery.

export default (state = {}, action) => {
  switch(action.type) {
    case 'addConnection':
      return    {
        connections: {
          ...state.connections, {
          action.compositeKey: action.connection
        }
      }

    default:
      return state
  }
}

Answer 1

This worked for me:

export default (state = {}, action) => {
  switch(action.type) {
    case 'addConnection':
      return {
        ...state,
        connections: {
          ...state.connections,
          [action.compositeKey]: action.connection
        }
      }
    default:
      return state
  }
}

From the docs:

https://redux.js.org/recipes/structuring-reducers/immutable-update-patterns#correct-approach-copying-all-levels-of-nested-data