class List extends Component {
  render() {

    //code
  }
  return(
    <Aux>
      <Button
        type="button"
        click={() => this.props.addNew(data)}
        btnType="add" >
        Add
      </Button>
      <Button
        type="button"
        click={() => this.props.deleteB(id, type)}
        btnType="Delete" >
        Delete
      </Button>
      <Button
        type="button"
        click={() => this.props.editStart(id)}
        btnType="edit" >
        Edit
      </Button>
      <Button
        type="button"
        click={() => this.props.editSave(data, type)}
        btnType="save" >
        save
      </Button>
    </Aux>
  )
}

const mapStateToProps = state => {
    return {
        editing: state.list.editing
    };
};

const mapDispatchtoProps = dispatch => {
  return {
    deleteB: (id, type) => {dispatch(actions.deleteB(id, type))},
    editStart: (id) => {dispatch(actions.editStart(id))},
    editSave: (data, type) => {dispatch(actions.editSave(data, type))},
    addNew: (data) => dispatch(actions.addNew(data))
  };
};

export default connect(mapStateToProps, mapDispatchtoProps)(List);

const addNew = ( state, action ) => {
  //immutable state
  //add new
  //return updated state
};

const deleteB = ( state, action ) => {
  //immutable state
  //delete
  //return updated state
};

const editStart = ( state, action ) => {
  //immutable state
  //update editing to true
  //return updated state
};

const editSave = ( state, action ) => {
  //immutable state
  if(action.type === state.editing.type) {
    //update object with user data
  } else {
    //delete old data same code of deleteB
    //add data user like addNew
    //update editing to false
  }
  //return updated state
};

const reducer = ( state = initialState, action ) => {
  //switch case
};

export default reducer;