import { Modal } from 'react_modal_library';

const Form = () => {

  const [ isOpen, setIsOpen ] = useState(false);
  const openModal = () => setIsOpen(true);
  const closeModal = () => setIsOpen(false);
  
  const handleSubmit = (e) => {
    e.preventDefault();
    openModal();
   };

  return (
    <div className='Form'>
      <form method='post'>
        <div>
          <label htmlFor='firstName'>First Name</label>
          <input aria-required="true" type='text' id='firstName' name='firstName' onChange={(e) => setFirstname(e.target.value)} required value={firstname} />
        </div>
      </form>
      <button type='submit' id='saveButton' onClick={(e) => handleSubmit(e)}>Save</button>
      {isOpen && <Modal text='Employee created' close={closeModal} />}
    </div>
  );
}

export default Form;