import React, { useState } from 'react'; import PropTypes from 'prop-types'; import Icon from './Icon'; import Modal from './Modal'; import Button from './Button'; import Input from './Input'; import { useFormState } from 'react-use-form-state'; import { me, facebookLink, vkLink } from '../api'; function LoginButton({ onAuth, title }) { const [open, setOpen] = useState(false); const [formState, { text, password }] = useFormState(); let onToggle = (event) => { if (event) { event.preventDefault(); } setOpen(!open); } let onSubmit = (event) => { event.preventDefault(); me(formState.values.username, formState.values.password) .then(response => { onToggle(); onAuth(response); } ).catch(ex => { console.log(ex); }); } return ( <> {title}

Please, introduce yourself:

Log in Log in

Already registered?



); } LoginButton.propTypes = { title: PropTypes.string.isRequired, onAuth: PropTypes.func.isRequired }; const socialButtonsStyle = { display: 'flex', justifyContent: 'space-evenly', padding: '4px' }; const facebookButtonStyle = { color: '#fff', padding: '2px 14px', background: '#3b5998' }; const vkButtonStyle = { color: '#fff', padding: '2px 14px', background: '#4c75a3' }; export default LoginButton;