import React from 'react' ;
import 'bootstrap/dist/css/bootstrap.min.css';

class AddTodoForm extends React.Component {

   render(){
     return(
       <div>
         <div className="add-items d-flex">
           <input className="form-control todo-list-input" id="user_input" value={this.props.formValue}  onChange={this.props.changeNextTodoValue.bind(this)}/>
           <button className="add btn btn-primary font-weight-bold todo-list-add-btn" onClick={this.props.addToList.bind(this)}>Add</button>
           <button className="add btn btn-primary font-weight-bold todo-list-add-btn" onClick={this.props.checkAllToggle.bind(this)}>{this.props.isCheckAll ? 'UncheckAll' : 'checkAll'}</button>
        </div>
       </div>
    )
   }




 }

 export default AddTodoForm