import React, { useState } from 'react'

import { Button, Modal, Form, } from 'react-bootstrap';

export default function AddUser({AddUser, handleClose, pegarUsuarios}) {

const [nome, setNome]=useState('');
const [email, setEmail]=useState('');
const [senha, setSenha]=useState('');

const handleSubmit = async (e) => {

e.preventDefault();
const novoUsuario = {
name:nome,
email:email,
password:senha
};
await AddUser(novoUsuario);
setNome('');
setEmail('');
setSenha('');
handleClose();
}
return (
<Modal show={true} onHide={handleClose}>
<Modal.Header closeButton>
<Modal.Title>
Adicionar Usuario
</Modal.Title>
</Modal.Header>
<Modal.Body>
<Form onSubmit={handleSubmit}>
<Form.Group>
<Form.Label>
Nome:
</Form.Label>
<Form.Control
type="text"
value={nome}
onChange={(valor) =>setNome(valor.target.value)}
required

/>
</Form.Group>
<Form.Group>
<Form.Label>
Email:
</Form.Label>
<Form.Control
type="email"
value={email}
onChange={(valor) =>setEmail(valor.target.value)}
required
/>
</Form.Group>
<Form.Group>
<Form.Label>
Senha:
</Form.Label>
<Form.Control
type="password"
 value={nome}
onChange={(valor) =>setSenha(valor.target.value)}
required

/>
</Form.Group>
<Button variant="primary" type="submit">
Adicionar novo usuario
</Button>
</Form>
</Modal.Body>
</Modal>
)
}