En primer lugar, prefiero que uses un componente funcional. Para mostrar toast_modal puedes usar un estado. Luego usa este estado a cambio.

 import {useState} from 'react'; import emailjs from 'emailjs-com'; const NameForm = () => { const [showModal,setShowModal] = useState(false); const sendEmail = (e) => { e.preventDefault(); emailjs.sendForm('service_ID', 'template_ID', e.target, 'user_ID') .then((result) => { console.log(result.text); setShowModal(true); }, (error) => { console.log(error.text); }); e.target.reset(); } return ( <div> <h1 className="text-center text-md-left mb-3">Get in Touch</h1> <form className="contact-form" onSubmit={sendEmail}> <div className="form-group mb-0 py-3"> <textarea className="form-control custom--fields-mod text-the-primary" id="message" rows="3" placeholder="Message *" name="message" required></textarea> </div> <div className="form-group row py-2 mb-0"> <div className="col-md-6 text-center text-md-left py-2 py-md-0"> <input className="buttons-width float-md-right btn btn-dark-moderate-orange rounded-0" type="submit" value="SEND MESSAGE" /> </div> </div> </form> {showModal && ( <div className="modal fade show d-block" tabIndex={-1}> <div className="modal-dialog modal-dialog-centered modal-dialog-scrollable"> <div className="modal-content bg-white border border-the-primary"> <div className="modal-body text-center py-4"> <p>We've received your inquiry, we'll get back to you as soon as possible. Thank you!"</p> <button type="button" onClick={() => setShowModal(false)} className="btn btn-dark-moderate-orange px-5" data-dismiss="modal">Close</button> </div> </div> </div> </div> )} </div> ); } export default NameForm;