import './style/RouteLayout.scss'
import React from 'react';
import Form, { Fields }  from 'sbx-react-form';

import {Provider, Store, History} from 'sbx-react-core';


import {login} from 'actions/Profile'

export default class RouteLayout extends React.Component {
    render() {
        let {children} = this.props;

        return <div className="routeContainer">
            <div className="login__header">
                <h3>Login</h3>
            </div>
            <hr/>
            <Form onSubmit={(data)=>{
                data.projectId = __config.projectId;
                login(data);
            }}>
                <Fields.input
                    name="login"
                    label="Login:"
                    validate={{
                        isRequired: {
                            error: "Field must be required"
                        }
                    }}
                />
                <Fields.input
                    name="password"
                    label="password"
                    type="password"
                    placeholder="Your password"
                    validate={{
                        isRequired: {
                            error: "Field must be required"
                        }
                    }}
                />
                <hr/>
                <button className="btn btn-primary btn-block">
                    Submit
                </button>
            </Form>
        </div>
    }
}