From 1819f5d0d7a8b7c05fa171c465619317081e544a Mon Sep 17 00:00:00 2001
From: Son-OfAnton <admasterefe00@gmail.com>
Date: Thu, 31 Aug 2023 15:55:53 +0300
Subject: [PATCH] fix(AAiT.web.1): Fixed multiple toast in auth

---
 .../group-1/components/signin/SigninForm.tsx  | 24 +++++++++++--------
 .../group-1/components/signup/SignupForm.tsx  | 22 +++++++++++++----
 2 files changed, 31 insertions(+), 15 deletions(-)

diff --git a/aait/web/group-1/components/signin/SigninForm.tsx b/aait/web/group-1/components/signin/SigninForm.tsx
index 226bd4f8d..8c132287e 100644
--- a/aait/web/group-1/components/signin/SigninForm.tsx
+++ b/aait/web/group-1/components/signin/SigninForm.tsx
@@ -1,6 +1,6 @@
 "use client";
 
-import { ChangeEvent, useState } from "react";
+import { ChangeEvent, useEffect, useState } from "react";
 import { useLoginMutation } from "@/store/auth/authApi";
 
 import TextField from "../signup/TextField";
@@ -26,15 +26,10 @@ const SignInForm = () => {
     const { name, value } = e.target;
     setCredentials((prevData) => ({ ...prevData, [name]: value }));
   };
-
-  const handleSignin = async (e) => {
-    e.preventDefault();
-    if (!credentials.email || !credentials.password) {
-      toast.error("Please fill all fields");
-    }
-    const response = await login(credentials);
+  
+  useEffect(() => {
     if (isSuccess) {
-      localStorage.setItem("user", JSON.stringify(response));
+      localStorage.setItem("user", JSON.stringify(data));
       toast.success("Signed in successfully");
       router.push("/");
     }
@@ -46,6 +41,15 @@ const SignInForm = () => {
         toast.error(errMsg || 'Unable to signin');
       }
     }
+  }, [isError, isSuccess, data, error])
+
+  const handleSignin = async (e) => {
+    e.preventDefault();
+    if (!credentials.email || !credentials.password) {
+      toast.error("Please fill all fields");
+      return
+    }
+    login(credentials);
   };
 
   return (
@@ -62,7 +66,7 @@ const SignInForm = () => {
           id={field[1]}
           placeholder={field[2]}
           value={credentials[field[1]]}
-          onChange={handleInputChange}
+          onChange={(e) => handleInputChange(e)}
         />
       ))}
       <button
diff --git a/aait/web/group-1/components/signup/SignupForm.tsx b/aait/web/group-1/components/signup/SignupForm.tsx
index 0fd1affae..7f78f35aa 100644
--- a/aait/web/group-1/components/signup/SignupForm.tsx
+++ b/aait/web/group-1/components/signup/SignupForm.tsx
@@ -1,10 +1,11 @@
 "use client"
 
-import { ChangeEvent, useState } from "react"
+import { ChangeEvent, useState, useEffect } from "react"
 import { useRegisterMutation } from "@/store/auth/authApi"
 
 import TextField from "./TextField"
 import { toast } from 'react-toastify'
+import { useRouter } from "next/navigation"
 
 const fieldInfo: Array<Array<string>> = [
   ["text", "name", "Full Name"], 
@@ -14,6 +15,7 @@ const fieldInfo: Array<Array<string>> = [
                                             
 
 const SignupForm = () => {
+  const router = useRouter()
   const [register, { isLoading, isError, isSuccess, error }] = useRegisterMutation()
   const [credentials, setCredentials] = useState({
     name: "",
@@ -21,18 +23,30 @@ const SignupForm = () => {
     password: "",
   })
 
+  useEffect(() => {
+    if (isError) {
+      toast.error('Unable to signup')
+    }
+    if(isSuccess) {
+      toast.success('Signed up successfully')
+      router.push('/signin')
+    }
+  }, [isError, isSuccess])
+
+  
   const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {
     const { name, value } = e.target
     setCredentials((prevData) => ({...prevData, [name]: value}))
   }
-
+  
   const handleSignup = () => {
     if(!credentials.name || !credentials.email || !credentials.password) {
       toast.error("Please fill all fields")
+      return
     }
     register(credentials)
   }
-
+  
   return (
     <div className="flex flex-col text-left gap-3.5 bg-white text-white border rounded-lg p-10 w-96">
       <h2 className="text-form-gray-primary font-semibold text-3xl">Sign up</h2>
@@ -56,8 +70,6 @@ const SignupForm = () => {
       >
         {isLoading ? 'Signing up...' : 'Sign up'}
       </button>
-      {isError && toast.error('Unable to signin')}
-      {isSuccess && toast.success('Signed up successfully')}
     </div>
   )
 }