Redux Road

[shaban43]

I’m not sure whats wrong with my code

const initialWagonState = {
supplies: 100,
distance: 0,
days: 0
}

const wagonReducer = (state = initialWagonState, action) => {
switch(action.type) {
case ‘gather’: {
return {
…state,
supplies: state.supplies + 15,
days: state.days + 1
}
}

case ‘travel’: {
return {
…state,
supplies: state.supplies - (20 * action.payload),
distance: state.distance + (10 * action.payload),
days: state.days + action.payload
}
}

  case 'tippedWagon': {
    return {
      ...state,
      supplies: state.supplies - 30,
      distance: state.distance,
      days: state.days + 1
     }
  }



  default: { 
    return state; 
    }
}

};

let wagon = wagonReducer(undefined, {});
wagon = wagonReducer(wagon, {type:‘travel’, payLoad: 1})
console.log(wagon);
wagon = wagonReducer(wagon, {type:‘gather’})
console.log(wagon);
wagon = wagonReducer(wagon, {type:‘tippedWagon’})
console.log(wagon);
wagon = wagonReducer(wagon, {type:‘travel’, payLoad: 3})
console.log(wagon);

OUTPUT
{ supplies: NaN, distance: NaN, days: NaN }
{ supplies: NaN, distance: NaN, days: NaN }
{ supplies: NaN, distance: NaN, days: NaN }
{ supplies: NaN, distance: NaN, days: NaN }

Can anyone help

[mtrtmk]

In your cases, you have action.payload

// For example
supplies: state.supplies - (20 * action.payload),

whereas in your function call you have payLoad instead of payload.

// For example
wagon = wagonReducer(wagon, {type:'travel', payLoad: 1})