Elep

import React from 'react';
import questionWrapper from '../../HOC/QuestionWrapper';

const index = (props) => {
    
    return (
        <form onSubmit={props.handleSubmit}>
            <div className="question">
                <h3 className="question-text">3. Share three alternative uses for a pen</h3>
              <div className="form-group">
                <label htmlFor="penone">Use Case 1</label>
                <input onBlur={props.postAnswer} type="text" name="penone" className="input" onChange={props.handleChange} value={props.inputs.penone || ""} />
              </div>
              <div className="form-group">
                <label htmlFor="penone">Use Case 2</label>
                <input onBlur={props.postAnswer} type="text" name="pentwo" className="input" onChange={props.handleChange} value={props.inputs.pentwo || ""} />
              </div>
              <div className="form-group">
                <label htmlFor="penone">Use Case 3</label>
                <input onBlur={props.postAnswer} type="text" name="penthree" className="input" onChange={props.handleChange} value={props.inputs.penthree || ""} />
              </div>
            </div>
            <div className="pagination">
                <button type="button" className="btn btn-warning" onClick={(e) => props.next(e, 'prev')}>Previous</button>
                <button type="submit" className="btn btn-success" onClick={(e) => props.next(e, 'next')}>Next</button>
            </div>
        </form>
    )
}

export default questionWrapper(index)