import React from 'react'
import { Field, reduxForm } from 'redux-form';

import './settings-form.scss';

import { customInput } from "../customFields/customInput/customInput";

let SettingsForm = props => {
    //const { handleSubmit, postCheckInSubmit } = props;
    const { handleSubmit, initialValues } = props;
    console.log('initialValues',initialValues);
    console.log(props)

    const onChangeValue = e => {
        console.log(e.target.value);
    }

    const submit = value => {
        console.log(value);        
        //postCheckInSubmit(value);
    };

    return (
        <form className="form" onSubmit={handleSubmit(submit)}>
            <div>
                {/*<label htmlFor="name">Name</label>*/}
                {/*<input name="name" type="text" id="name" value={userInfo.name}/>*/}
                <Field name="name" component={customInput} id="name" label="Name" onChange={onChangeValue}/>
            </div>
            <div>
                {/*<label htmlFor="phone">Phone</label>*/}
                <Field name="phone" component={customInput} type="phone" id="phone" label="Phone" onChange={onChangeValue}/>
            </div>
            {/*<div>
                <label htmlFor="email">E-mail</label>
                <Field name="email" component="input" type="email" id="email"/>
            </div>
            <div>
                <label htmlFor="password">Password</label>
                <Field name="password" component="input" type="text" id="password"/>
            </div>
            <div>
                <label htmlFor="confirmPassword">Confirm Password</label>
                <Field name="confirmPassword" component="input" type="text" id="confirmPassword"/>
            </div>*/}
            
            <button type="submit" className="btn">Save</button>
        </form>
        )
};

SettingsForm = reduxForm({
    form: 'settings'
})(SettingsForm)

export default SettingsForm