Fixed bug in contact component

Changed all field values to required
Added regex to make sure a valid email address is provided before sending the message

Author: coolsyntax

src/components/Contact.jsx

@@ -30,9 +30,19 @@ const Contact = () => {
       [name]: value,
     });
   };
+  const isValidEmail = (email) => {
+      const emailRegex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
+      return emailRegex.test(email);
+  };
 
   const handleSubmit = (e) => {
     e.preventDefault();
+
+    if(!isValidEmail(form.email)){
+        alert("Please enter a valid email address.");
+        return;
+    }
+
     setLoading(true);
 
     emailjs
@@ -93,6 +103,7 @@ const Contact = () => {
               onChange={handleChange}
               placeholder="What's your good name?"
               className='bg-tertiary py-4 px-6 placeholder:text-secondary text-white rounded-lg outline-none border-none font-medium'
+              required
             />
           </label>
           <label className='flex flex-col'>
@@ -104,6 +115,7 @@ const Contact = () => {
               onChange={handleChange}
               placeholder="What's your web address?"
               className='bg-tertiary py-4 px-6 placeholder:text-secondary text-white rounded-lg outline-none border-none font-medium'
+              required
             />
           </label>
           <label className='flex flex-col'>
@@ -115,6 +127,7 @@ const Contact = () => {
               onChange={handleChange}
               placeholder='What you want to say?'
               className='bg-tertiary py-4 px-6 placeholder:text-secondary text-white rounded-lg outline-none border-none font-medium'
+              required
             />
           </label>
 
@@ -137,4 +150,4 @@ const Contact = () => {
   );
 };
 
-export default SectionWrapper(Contact, "contact");
+export default SectionWrapper(Contact, "contact");