Merge pull request #252 from harshbhar0629/BUG/Input-Validations

Bug: Input validations in forms
Vin205 · Oct 13, 2024 · d94fd90 · d94fd90
2 parents 33dde23 + 924f6a7
commit d94fd90
Show file tree

Hide file tree

Showing 4 changed files with 18 additions and 0 deletions.
diff --git a/frontend/package.json b/frontend/package.json
@@ -22,6 +22,7 @@
     "react-bootstrap": "^2.10.5",
     "react-dom": "^18.3.1",
     "react-firebase-hooks": "^5.1.1",
+    "react-hot-toast": "^2.4.1",
     "react-icon": "^1.0.0",
     "react-icons": "^5.3.0",
     "react-native-linear-gradient": "^2.8.3",

diff --git a/frontend/src/components/Login/Login.js b/frontend/src/components/Login/Login.js
@@ -2,8 +2,10 @@ import React, { useState, useEffect } from "react";
 import { useNavigate, Link } from "react-router-dom";
 import { useSignInWithEmailAndPassword } from "react-firebase-hooks/auth";
 import { auth } from "../Firebase/firebase";
+import toast from "react-hot-toast";
 import Footer from "../Footer/Footer";
 
+
 // LoginHeader Component
 const LoginHeader = () => (
   <h2 className="text-center mb-4">Login</h2>
@@ -66,6 +68,7 @@ const LoginFooter = ({ navigate }) => (
 );
 
 function Login() {
+  const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
   const [showPassword, setShowPassword] = useState(false);
@@ -74,6 +77,10 @@ function Login() {
 
   const handleLogin = async (e) => {
     e.preventDefault();
+    if (!regex.test(email)) {
+      toast.error("Invalid Email");
+      return;
+    }
     await signInWithEmailAndPassword(email, password);
   };
 

diff --git a/frontend/src/components/Signup/Signup.js b/frontend/src/components/Signup/Signup.js
@@ -4,9 +4,12 @@ import { useNavigate } from "react-router-dom";
 import { useCreateUserWithEmailAndPassword } from "react-firebase-hooks/auth";
 import { auth } from "../Firebase/firebase"; // Import Firebase auth
 import { registerValidation } from "../../validations/validation";
+import toast from "react-hot-toast";
 import Footer from "../Footer/Footer.js";
 
+
 function Signup() {
+  const regex = /^[^\s@]+@[^\s@]+\.[^\s@]+$/;
   const [email, setEmail] = useState("");
   const [password, setPassword] = useState("");
   const [confirmPassword, setConfirmPassword] = useState("");
@@ -40,6 +43,11 @@ function Signup() {
   const handleSignup = async (e) => {
     e.preventDefault();
 
+    if (!regex.test(email)) {
+      toast.error("Invalid email");
+      return;
+    }
+
     try {
       await registerValidation.validate(
         { email, password, confirmPassword },

diff --git a/frontend/src/index.js b/frontend/src/index.js
@@ -5,13 +5,15 @@ import ReactDOM from 'react-dom';
 import App from './App';
 import reportWebVitals from './reportWebVitals';
 import { BrowserRouter } from 'react-router-dom';
+import { Toaster } from "react-hot-toast";
 
 
 const root = document.getElementById('root');
 ReactDOM.render(
   <React.StrictMode>
     <BrowserRouter>
       <App />
+      <Toaster />
     </BrowserRouter>
   </React.StrictMode>,
   root