text: import React, {useState} from "react";
  import {Button, NavLink} from "react-bootstrap";
  import {Modal} from "react-bootstrap";
  import {SignUpForm} from "./SignUpForm";
  
  
  export const SignUpModal = () => {
  	const [show, setShow] = useState(false);
  
  	const handleClose = () => setShow(false);
  	const handleShow = () => setShow(true);
  
  	return (
  		<>
  			<NavLink variant="primary" onClick={handleShow}>
  				Sign Up
  			</NavLink>
  
  			<Modal show={show} onHide={handleClose}>
  				<Modal.Header closeButton>
  					<Modal.Title>Sign Up</Modal.Title>
  				</Modal.Header>
  				<Modal.Body>
  					<SignUpForm/>
  				</Modal.Body>
  				<Modal.Footer>
  					<Button variant="secondary" onClick={handleClose}>
  						Close
  					</Button>
  					<Button variant="primary" onClick={handleClose}>
  						Save Changes
  					</Button>
  				</Modal.Footer>
  			</Modal>
  		</>
  	);
  }