import React, { Component } from 'react';
import PropTypes from 'prop-types';

class AddNumberComponent extends Component {
    state = {
        numero: 0,
    }

    addNumber = () => this.setState({ numero: this.state.numero + 1})

    multiplyNumberBy2 = () => {
      const { numero } = this.state;
      return numero * 2;
    }

    render(){
    const { numero } = this.state;
    const { getCurrentNumber } = this.props;
    return(
        <div>
            <p style={{ color: 'black'}}>{numero}</p>
            <button
                type="button"
                onClick={this.addNumber}
                >
                Click
            </button>
            <p>Numero * 2: {this.multiplyNumberBy2()}</p>

            <button
                type="button"
                onClick={()=> getCurrentNumber(numero, "hola papá")}
                >
                Enviar numero al padre
            </button>
        </div>
    );
    }
}

AddNumberComponent.propTypes = {
    getCurrentNumber: PropTypes.func.isRequired,
};

export default AddNumberComponent;