currencyReducer.js

// Reducers are used to create state machines.
//They take a state and action as input and return final state as output



const INIT_STATE = {
  loading: false,  //whether app is currently loading
  activeSubscription: [], //list of current subscriptions
  availableCountries:[] //list of available countries
}

//limiting max number of subscriptions to 4
const maxSubscriptionAtaTime = 4;
export default (state = INIT_STATE, action) => {
 switch (action.type) {
   case 'INIT_GET_CURRENCY_NAME_REQUEST':
    return {
      ...state, //this is returning a new state using the object spread operator https://redux.js.org/recipes/using-object-spread-operator
      loading: true
    }
   case 'GET_CURRENCY_PAIR':{

      //If currency is part of supported currencypairs update list of active subscriptions and countries
      const currencySupported = action.payload;
      const activeSubscription = [];
      const availableCountries = [];
      if(Array.isArray(currencySupported)) {
        currencySupported.forEach((data, i)=>{
          availableCountries.push(data.currency_name)
          if(i < maxSubscriptionAtaTime)
            activeSubscription.push(data.currency_name);
        })
      }
      return {
        ...state,
        availableCountries,
        activeSubscription,
        loading: false
      }
   }
  //modify the list of active subscriptions
  case 'COUNTRY_CHANGE': {
    const activeSubscription = JSON.parse(JSON.stringify(state.activeSubscription)); // prevent mutation make clone
    if(action.cardPosition === undefined || action.code === undefined) return state;
    activeSubscription[action.cardPosition] = action.code;
    return {
      ...state,
      activeSubscription
    }
  }
  default:
   return state
 }
}