From 8515a8351a6e007de6acc48058e68587c065e275 Mon Sep 17 00:00:00 2001
From: Farshad <f.bagdeli13@gmail.com>
Date: Wed, 17 Jul 2024 12:47:02 +0200
Subject: [PATCH 1/9] errorRegisterPageHandler Created

---
 src/components/form/errorMessage.js         |  3 +++
 src/errors_handlers/errorRegisterHandler.js |  7 +++++++
 src/pages/register/index.js                 |  4 ++++
 src/service/apiClient.js                    | 10 ++++++++--
 4 files changed, 22 insertions(+), 2 deletions(-)
 create mode 100644 src/components/form/errorMessage.js
 create mode 100644 src/errors_handlers/errorRegisterHandler.js

diff --git a/src/components/form/errorMessage.js b/src/components/form/errorMessage.js
new file mode 100644
index 00000000..ba6f8080
--- /dev/null
+++ b/src/components/form/errorMessage.js
@@ -0,0 +1,3 @@
+const ErrorMessage = ({value, onChange}) => {
+
+}
\ No newline at end of file
diff --git a/src/errors_handlers/errorRegisterHandler.js b/src/errors_handlers/errorRegisterHandler.js
new file mode 100644
index 00000000..07605500
--- /dev/null
+++ b/src/errors_handlers/errorRegisterHandler.js
@@ -0,0 +1,7 @@
+// To handle errors of register page
+
+export function handleRegistrationError(error) {
+  const errorMessage = error.message || "An unknown registration error occurred"
+
+  console.log('Registration error: ', errorMessage)
+}
\ No newline at end of file
diff --git a/src/pages/register/index.js b/src/pages/register/index.js
index 8d0f693d..5d1b6d0b 100644
--- a/src/pages/register/index.js
+++ b/src/pages/register/index.js
@@ -39,7 +39,11 @@ const Register = () => {
 							label={"Password *"}
 							type={"password"}
 						/>
+						<label>
+							your password should be atleast 8 characters,includes numbers and capital letters and also one special character
+						</label>
 					</form>
+					
 					<Button
 						text="Sign up"
 						onClick={() => onRegister(formData.email, formData.password)}
diff --git a/src/service/apiClient.js b/src/service/apiClient.js
index ae4d87cf..d926733d 100644
--- a/src/service/apiClient.js
+++ b/src/service/apiClient.js
@@ -1,3 +1,4 @@
+import { handleRegistrationError } from "../errors_handlers/errorRegisterHandler"
 import { API_URL } from "./constants"
 
 async function login(email, password) {
@@ -5,8 +6,13 @@ async function login(email, password) {
 }
 
 async function register(email, password) {
-    await post('users', { email, password }, false)
-    return await login(email, password)
+    try {
+        await post('users', { email, password }, false)
+        return await login(email, password)
+    } catch (error) {
+        return handleRegistrationError(error)
+    }
+    
 }
 
 async function createProfile(userId, firstName, lastName, githubUrl, bio) {

From 5270caee9a75086f60508a3386766c2ed27c5f36 Mon Sep 17 00:00:00 2001
From: Farshad <f.bagdeli13@gmail.com>
Date: Thu, 18 Jul 2024 08:54:18 +0200
Subject: [PATCH 2/9] feat : showError

---
 src/components/form/errorMessage.js         | 10 +++++--
 src/context/auth.js                         | 30 ++++++++++++---------
 src/errors_handlers/errorRegisterHandler.js |  3 +--
 src/pages/register/index.js                 |  9 +++++--
 4 files changed, 34 insertions(+), 18 deletions(-)

diff --git a/src/components/form/errorMessage.js b/src/components/form/errorMessage.js
index ba6f8080..80ae9373 100644
--- a/src/components/form/errorMessage.js
+++ b/src/components/form/errorMessage.js
@@ -1,3 +1,9 @@
-const ErrorMessage = ({value, onChange}) => {
+const ErrorMessage = ({message}) => {
+  return (
+    <div>
+      {message && <p>{message}</p>}
+    </div>
+  )
+}
 
-}
\ No newline at end of file
+export default ErrorMessage
\ No newline at end of file
diff --git a/src/context/auth.js b/src/context/auth.js
index a7b9462d..c6a10fe6 100644
--- a/src/context/auth.js
+++ b/src/context/auth.js
@@ -41,21 +41,27 @@ const AuthProvider = ({ children }) => {
 		setToken(null)
 	};
 
-    const handleRegister = async (email, password) => {
-        const res = await register(email, password)
-		setToken(res.data.token)
-
-        navigate("/verification")
-    }
+	const handleRegister = async (email, password, setErrors) => {
+		try {
+			if(password.length < 8 || email.length < 5) {
+				throw new Error('password should be more than 8 characters')
+			}
+			const res = await register(email, password, setErrors)
+			setToken(res.data.token)
+			navigate("/verification")
+		} catch (error) {
+			setErrors(error.message)
+		}
+	}
 
-    const handleCreateProfile = async (firstName, lastName, githubUrl, bio) => {
-        const { userId } = jwt_decode(token)
+	const handleCreateProfile = async (firstName, lastName, githubUrl, bio) => {
+			const { userId } = jwt_decode(token)
 
-        await createProfile(userId, firstName, lastName, githubUrl, bio)
+			await createProfile(userId, firstName, lastName, githubUrl, bio)
 
-        localStorage.setItem('token', token)
-        navigate('/')
-    }
+			localStorage.setItem('token', token)
+			navigate('/')
+	}
 
 	const value = {
 		token,
diff --git a/src/errors_handlers/errorRegisterHandler.js b/src/errors_handlers/errorRegisterHandler.js
index 07605500..1e039a9b 100644
--- a/src/errors_handlers/errorRegisterHandler.js
+++ b/src/errors_handlers/errorRegisterHandler.js
@@ -2,6 +2,5 @@
 
 export function handleRegistrationError(error) {
   const errorMessage = error.message || "An unknown registration error occurred"
-
-  console.log('Registration error: ', errorMessage)
+  return errorMessage
 }
\ No newline at end of file
diff --git a/src/pages/register/index.js b/src/pages/register/index.js
index 5d1b6d0b..fd57d320 100644
--- a/src/pages/register/index.js
+++ b/src/pages/register/index.js
@@ -4,16 +4,20 @@ import TextInput from "../../components/form/textInput";
 import useAuth from "../../hooks/useAuth";
 import CredentialsCard from "../../components/credentials";
 import "./register.css";
+import ErrorMessage from "../../components/form/errorMessage";
 
 const Register = () => {
 	const { onRegister } = useAuth();
 	const [formData, setFormData] = useState({ email: "", password: "" });
-
+	const [errors, setErrors] = useState('')
+ 
 	const onChange = (e) => {
 		const { name, value } = e.target;
 		setFormData({ ...formData, [name]: value });
+		setErrors('')
 	};
 
+
 	return (
 		<div className="bg-blue register credentialpage">
 			<CredentialsCard
@@ -39,6 +43,7 @@ const Register = () => {
 							label={"Password *"}
 							type={"password"}
 						/>
+						<ErrorMessage message= {errors}/>
 						<label>
 							your password should be atleast 8 characters,includes numbers and capital letters and also one special character
 						</label>
@@ -46,7 +51,7 @@ const Register = () => {
 					
 					<Button
 						text="Sign up"
-						onClick={() => onRegister(formData.email, formData.password)}
+						onClick={() => onRegister(formData.email, formData.password, setErrors)}
 						classes="green width-full"
 					/>
 				</div>

From f1d0a08a64e7410fcce7446edb312be3dda418fc Mon Sep 17 00:00:00 2001
From: Farshad <f.bagdeli13@gmail.com>
Date: Thu, 18 Jul 2024 12:15:34 +0200
Subject: [PATCH 3/9] feat: email-password-client-side-validation

---
 src/context/auth.js      | 40 ++++++++++++++++++++++++++++++++++++----
 src/service/apiClient.js |  2 +-
 2 files changed, 37 insertions(+), 5 deletions(-)

diff --git a/src/context/auth.js b/src/context/auth.js
index c6a10fe6..b90df66c 100644
--- a/src/context/auth.js
+++ b/src/context/auth.js
@@ -32,7 +32,7 @@ const AuthProvider = ({ children }) => {
 
         localStorage.setItem('token', res.data.token)
 
-		setToken(res.token)
+		setToken(res.data.token)
 		navigate(location.state?.from?.pathname || "/")
 	};
 
@@ -43,10 +43,16 @@ const AuthProvider = ({ children }) => {
 
 	const handleRegister = async (email, password, setErrors) => {
 		try {
-			if(password.length < 8 || email.length < 5) {
-				throw new Error('password should be more than 8 characters')
+			const validatedEmail = validationEmail(email)
+			if(validatedEmail !== true) {
+				throw new Error(validatedEmail)
+			}
+			const validatedPassword = validationPassword(password)
+			if(validatedPassword !== 'ValidPassword') {
+				throw new Error(validatedPassword)
 			}
 			const res = await register(email, password, setErrors)
+			
 			setToken(res.data.token)
 			navigate("/verification")
 		} catch (error) {
@@ -59,7 +65,7 @@ const AuthProvider = ({ children }) => {
 
 			await createProfile(userId, firstName, lastName, githubUrl, bio)
 
-			localStorage.setItem('token', token)
+			// localStorage.setItem('token', token)
 			navigate('/')
 	}
 
@@ -88,8 +94,34 @@ const ProtectedRoute = ({ children }) => {
 			<Navigation />
             <Modal />
 			{children}
+
 		</div>
 	)
 }
+function validationEmail(email) {
+	const errorMessage = "Please enter a valid email"
+	const emptyErrorMessage = "Email is required."
+	if (!email) {
+		return emptyErrorMessage
+	}
+	const pattern = /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$/
+	if(!pattern.test(email)) return errorMessage
+	return true
+}
+
+function validationPassword(password) {
+	const minLength = 8
+	const hasUppercase = /[A-Z]/.test(password)
+	const hasNumber = /\d/.test(password)
+	const hasSpecialCharacter = /[!@#$%^&*(),.?":{}|<>]/.test(password)
+
+	if(password.length < 1) return 'Password is required'
+	if(password.length < minLength) return 'Password should be at least 8 characters long'
+	if(!hasUppercase) return 'Password should have at least one uppercase letter'
+	if(!hasNumber) return 'Password should have at least one number'
+	if(!hasSpecialCharacter) return 'Password should have at least one special character'
+
+	return 'ValidPassword'
+}
 
 export { AuthContext, AuthProvider, ProtectedRoute }
diff --git a/src/service/apiClient.js b/src/service/apiClient.js
index d926733d..42bd29bf 100644
--- a/src/service/apiClient.js
+++ b/src/service/apiClient.js
@@ -5,7 +5,7 @@ async function login(email, password) {
     return await post('login', { email, password }, false)
 }
 
-async function register(email, password) {
+async function register(email, password, setErrors) {
     try {
         await post('users', { email, password }, false)
         return await login(email, password)

From fa68ba38cc25a519485c0668e5ef5cab1733cbcd Mon Sep 17 00:00:00 2001
From: Farshad <f.bagdeli13@gmail.com>
Date: Thu, 18 Jul 2024 15:54:17 +0200
Subject: [PATCH 4/9] feat: errors-for-handleRegister Done

---
 src/context/auth.js                         |  9 +++++++--
 src/errors_handlers/errorRegisterHandler.js |  6 ------
 src/service/apiClient.js                    | 18 +++++++++++++-----
 3 files changed, 20 insertions(+), 13 deletions(-)
 delete mode 100644 src/errors_handlers/errorRegisterHandler.js

diff --git a/src/context/auth.js b/src/context/auth.js
index b90df66c..455028c4 100644
--- a/src/context/auth.js
+++ b/src/context/auth.js
@@ -52,10 +52,14 @@ const AuthProvider = ({ children }) => {
 				throw new Error(validatedPassword)
 			}
 			const res = await register(email, password, setErrors)
-			
+			if (!res.status) {
+				throw new Error(res.error.message)
+			}
 			setToken(res.data.token)
 			navigate("/verification")
+
 		} catch (error) {
+			console.log('here')
 			setErrors(error.message)
 		}
 	}
@@ -116,7 +120,8 @@ function validationPassword(password) {
 	const hasSpecialCharacter = /[!@#$%^&*(),.?":{}|<>]/.test(password)
 
 	if(password.length < 1) return 'Password is required'
-	if(password.length < minLength) return 'Password should be at least 8 characters long'
+	if(password.length < minLength ) return 'Password should be at least 8 characters long'
+	if(password.length > 24) return 'Password should be less than 24 characters'
 	if(!hasUppercase) return 'Password should have at least one uppercase letter'
 	if(!hasNumber) return 'Password should have at least one number'
 	if(!hasSpecialCharacter) return 'Password should have at least one special character'
diff --git a/src/errors_handlers/errorRegisterHandler.js b/src/errors_handlers/errorRegisterHandler.js
deleted file mode 100644
index 1e039a9b..00000000
--- a/src/errors_handlers/errorRegisterHandler.js
+++ /dev/null
@@ -1,6 +0,0 @@
-// To handle errors of register page
-
-export function handleRegistrationError(error) {
-  const errorMessage = error.message || "An unknown registration error occurred"
-  return errorMessage
-}
\ No newline at end of file
diff --git a/src/service/apiClient.js b/src/service/apiClient.js
index 42bd29bf..7ca82546 100644
--- a/src/service/apiClient.js
+++ b/src/service/apiClient.js
@@ -1,18 +1,26 @@
-import { handleRegistrationError } from "../errors_handlers/errorRegisterHandler"
+
 import { API_URL } from "./constants"
 
 async function login(email, password) {
     return await post('login', { email, password }, false)
 }
 
-async function register(email, password, setErrors) {
+async function register(email, password) {
     try {
-        await post('users', { email, password }, false)
+        const res = await post('users', { email, password }, false)
+        if(res.status === 'fail') {
+            throw new Error(res.data.error)
+        }
         return await login(email, password)
     } catch (error) {
-        return handleRegistrationError(error)
+        if(error === 'Email already in use') {
+            return { status : false, error : error}
+        }
+        if ( error === 'Unable to create new user') {
+            return { status : false, error : 'There was an issue creating your account. Please try again later or contact support.'}
+        }
+        return { status : false, error : error}
     }
-    
 }
 
 async function createProfile(userId, firstName, lastName, githubUrl, bio) {

From 9896ebf81180e99293112b8e28f4551106b64287 Mon Sep 17 00:00:00 2001
From: Farshad <f.bagdeli13@gmail.com>
Date: Thu, 18 Jul 2024 16:57:15 +0200
Subject: [PATCH 5/9] feat: login-errors-handler Done

---
 src/context/auth.js      | 23 ++++++++++++++++++-----
 src/pages/login/index.js |  7 +++++--
 src/service/apiClient.js | 10 +++++++++-
 3 files changed, 32 insertions(+), 8 deletions(-)

diff --git a/src/context/auth.js b/src/context/auth.js
index 455028c4..4bbe793a 100644
--- a/src/context/auth.js
+++ b/src/context/auth.js
@@ -23,9 +23,20 @@ const AuthProvider = ({ children }) => {
         }
     }, [location.state?.from?.pathname, navigate])
 
-	const handleLogin = async (email, password) => {
-		const res = await login(email, password)
-
+	const handleLogin = async (email, password, setErrors) => {
+		try {
+			const validatedEmail = validationEmail(email)
+			if(validatedEmail !== true) {
+				throw new Error(validatedEmail)
+			}
+			const validatedPassword = validationPassword(password)
+			if(validatedPassword !== 'ValidPassword') {
+				throw new Error(validatedPassword)
+			}
+			const res = await login(email, password)
+			if(!res.status) {
+				throw new Error(res.error.message)
+			}
         if (!res.data.token) {
             return navigate("/login")
         }
@@ -34,6 +45,9 @@ const AuthProvider = ({ children }) => {
 
 		setToken(res.data.token)
 		navigate(location.state?.from?.pathname || "/")
+		} catch (error) {
+			setErrors(error.message)
+		}
 	};
 
 	const handleLogout = () => {
@@ -59,7 +73,6 @@ const AuthProvider = ({ children }) => {
 			navigate("/verification")
 
 		} catch (error) {
-			console.log('here')
 			setErrors(error.message)
 		}
 	}
@@ -125,8 +138,8 @@ function validationPassword(password) {
 	if(!hasUppercase) return 'Password should have at least one uppercase letter'
 	if(!hasNumber) return 'Password should have at least one number'
 	if(!hasSpecialCharacter) return 'Password should have at least one special character'
-
 	return 'ValidPassword'
 }
 
+
 export { AuthContext, AuthProvider, ProtectedRoute }
diff --git a/src/pages/login/index.js b/src/pages/login/index.js
index 60566866..cf709fe0 100644
--- a/src/pages/login/index.js
+++ b/src/pages/login/index.js
@@ -4,14 +4,16 @@ import TextInput from "../../components/form/textInput";
 import useAuth from "../../hooks/useAuth";
 import CredentialsCard from "../../components/credentials";
 import "./login.css";
+import ErrorMessage from "../../components/form/errorMessage";
 
 const Login = () => {
 	const { onLogin } = useAuth();
 	const [formData, setFormData] = useState({ email: "", password: "" });
-
+	const [errors, setErrors] = useState('')
 	const onChange = (e) => {
 		const { name, value } = e.target;
 		setFormData({ ...formData, [name]: value });
+		setErrors('')
 	};
 
 	return (
@@ -38,10 +40,11 @@ const Login = () => {
 							label={"Password *"}
 							type={"password"}
 						/>
+						<ErrorMessage message= {errors}/>
 					</form>
 					<Button
 						text="Log in"
-						onClick={() => onLogin(formData.email, formData.password)}
+						onClick={() => onLogin(formData.email, formData.password, setErrors)}
 						classes="green width-full"
 					/>
 				</div>
diff --git a/src/service/apiClient.js b/src/service/apiClient.js
index 7ca82546..cec644cf 100644
--- a/src/service/apiClient.js
+++ b/src/service/apiClient.js
@@ -2,7 +2,15 @@
 import { API_URL } from "./constants"
 
 async function login(email, password) {
-    return await post('login', { email, password }, false)
+    try {
+        const res =  await post('login', { email, password }, false)
+        if(res.status !== 'success') {
+            throw new Error(res.data.error)
+        }
+        return res
+    } catch (error) {
+        return { status: false, error : error}
+    }
 }
 
 async function register(email, password) {

From 957b8a6729796231ebef272079bed6d58c86e269 Mon Sep 17 00:00:00 2001
From: Farshad <f.bagdeli13@gmail.com>
Date: Fri, 19 Jul 2024 09:39:10 +0200
Subject: [PATCH 6/9] fix: validated-email-password-changed

---
 src/context/auth.js | 42 ++++++++++++++++++++----------------------
 1 file changed, 20 insertions(+), 22 deletions(-)

diff --git a/src/context/auth.js b/src/context/auth.js
index 4bbe793a..b766b09e 100644
--- a/src/context/auth.js
+++ b/src/context/auth.js
@@ -24,14 +24,18 @@ const AuthProvider = ({ children }) => {
     }, [location.state?.from?.pathname, navigate])
 
 	const handleLogin = async (email, password, setErrors) => {
+
+		const passwordRequirments = 'Password must be at least 8 characters long and include at least one uppercase letter, one number, and one special character.'
+		const emailErrorMessage = "Please enter a valid email"
+
 		try {
 			const validatedEmail = validationEmail(email)
-			if(validatedEmail !== true) {
-				throw new Error(validatedEmail)
+			if(!validatedEmail) {
+				throw new Error(emailErrorMessage)
 			}
 			const validatedPassword = validationPassword(password)
-			if(validatedPassword !== 'ValidPassword') {
-				throw new Error(validatedPassword)
+			if(!validatedPassword) {
+				throw new Error(passwordRequirments)
 			}
 			const res = await login(email, password)
 			if(!res.status) {
@@ -56,14 +60,17 @@ const AuthProvider = ({ children }) => {
 	};
 
 	const handleRegister = async (email, password, setErrors) => {
+		const passwordRequirments = 'Password must be at least 8 characters long and include at least one uppercase letter, one number, and one special character.'
+		const emailErrorMessage = "Please enter a valid email"
+
 		try {
 			const validatedEmail = validationEmail(email)
-			if(validatedEmail !== true) {
-				throw new Error(validatedEmail)
+			if(!validatedEmail) {
+				throw new Error(emailErrorMessage)
 			}
 			const validatedPassword = validationPassword(password)
-			if(validatedPassword !== 'ValidPassword') {
-				throw new Error(validatedPassword)
+			if(!validatedPassword) {
+				throw new Error(passwordRequirments)
 			}
 			const res = await register(email, password, setErrors)
 			if (!res.status) {
@@ -116,14 +123,10 @@ const ProtectedRoute = ({ children }) => {
 	)
 }
 function validationEmail(email) {
-	const errorMessage = "Please enter a valid email"
-	const emptyErrorMessage = "Email is required."
-	if (!email) {
-		return emptyErrorMessage
-	}
+	
 	const pattern = /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$/
-	if(!pattern.test(email)) return errorMessage
-	return true
+	
+	return (!email || !pattern.test(email)) ? false : true
 }
 
 function validationPassword(password) {
@@ -132,13 +135,8 @@ function validationPassword(password) {
 	const hasNumber = /\d/.test(password)
 	const hasSpecialCharacter = /[!@#$%^&*(),.?":{}|<>]/.test(password)
 
-	if(password.length < 1) return 'Password is required'
-	if(password.length < minLength ) return 'Password should be at least 8 characters long'
-	if(password.length > 24) return 'Password should be less than 24 characters'
-	if(!hasUppercase) return 'Password should have at least one uppercase letter'
-	if(!hasNumber) return 'Password should have at least one number'
-	if(!hasSpecialCharacter) return 'Password should have at least one special character'
-	return 'ValidPassword'
+	return (password.length < minLength || !hasUppercase || !hasNumber || !hasSpecialCharacter) ? false : true
+
 }
 
 

From ae889a02c45181f63cc6ddadc947cc51069a0d5c Mon Sep 17 00:00:00 2001
From: Farshad <f.bagdeli13@gmail.com>
Date: Fri, 19 Jul 2024 12:14:21 +0200
Subject: [PATCH 7/9] style: some of the files

---
 src/components/form/errorMessage.js         | 14 ++++++++------
 src/context/auth.js                         |  2 ++
 src/errors_handlers/errorRegisterHandler.js |  6 ++++++
 src/pages/login/index.js                    |  2 +-
 src/pages/register/index.js                 |  4 ----
 5 files changed, 17 insertions(+), 11 deletions(-)
 create mode 100644 src/errors_handlers/errorRegisterHandler.js

diff --git a/src/components/form/errorMessage.js b/src/components/form/errorMessage.js
index 80ae9373..10e27466 100644
--- a/src/components/form/errorMessage.js
+++ b/src/components/form/errorMessage.js
@@ -1,9 +1,11 @@
 const ErrorMessage = ({message}) => {
-  return (
-    <div>
-      {message && <p>{message}</p>}
-    </div>
-  )
+    return (
+      <div className="usermessage">
+        {message && <p>{message}</p>}
+      </div>
+    )
+  
 }
 
-export default ErrorMessage
\ No newline at end of file
+export default ErrorMessage
+
diff --git a/src/context/auth.js b/src/context/auth.js
index b766b09e..389dd6d3 100644
--- a/src/context/auth.js
+++ b/src/context/auth.js
@@ -33,10 +33,12 @@ const AuthProvider = ({ children }) => {
 			if(!validatedEmail) {
 				throw new Error(emailErrorMessage)
 			}
+
 			const validatedPassword = validationPassword(password)
 			if(!validatedPassword) {
 				throw new Error(passwordRequirments)
 			}
+			
 			const res = await login(email, password)
 			if(!res.status) {
 				throw new Error(res.error.message)
diff --git a/src/errors_handlers/errorRegisterHandler.js b/src/errors_handlers/errorRegisterHandler.js
new file mode 100644
index 00000000..1e039a9b
--- /dev/null
+++ b/src/errors_handlers/errorRegisterHandler.js
@@ -0,0 +1,6 @@
+// To handle errors of register page
+
+export function handleRegistrationError(error) {
+  const errorMessage = error.message || "An unknown registration error occurred"
+  return errorMessage
+}
\ No newline at end of file
diff --git a/src/pages/login/index.js b/src/pages/login/index.js
index cf709fe0..0e7af639 100644
--- a/src/pages/login/index.js
+++ b/src/pages/login/index.js
@@ -15,7 +15,7 @@ const Login = () => {
 		setFormData({ ...formData, [name]: value });
 		setErrors('')
 	};
-
+	
 	return (
 		<div className="bg-blue login credentialpage">
 			<CredentialsCard
diff --git a/src/pages/register/index.js b/src/pages/register/index.js
index fd57d320..2d2e290c 100644
--- a/src/pages/register/index.js
+++ b/src/pages/register/index.js
@@ -17,7 +17,6 @@ const Register = () => {
 		setErrors('')
 	};
 
-
 	return (
 		<div className="bg-blue register credentialpage">
 			<CredentialsCard
@@ -44,9 +43,6 @@ const Register = () => {
 							type={"password"}
 						/>
 						<ErrorMessage message= {errors}/>
-						<label>
-							your password should be atleast 8 characters,includes numbers and capital letters and also one special character
-						</label>
 					</form>
 					
 					<Button

From 43bf1f9fc54303bee663389937b506b81ce3090b Mon Sep 17 00:00:00 2001
From: Farshad <f.bagdeli13@gmail.com>
Date: Fri, 19 Jul 2024 16:16:55 +0200
Subject: [PATCH 8/9] refactor

---
 src/context/auth.js                         | 246 ++++++++++----------
 src/errors_handlers/errorRegisterHandler.js |   6 -
 src/utils/errors.js                         |   5 +
 3 files changed, 124 insertions(+), 133 deletions(-)
 delete mode 100644 src/errors_handlers/errorRegisterHandler.js
 create mode 100644 src/utils/errors.js

diff --git a/src/context/auth.js b/src/context/auth.js
index 389dd6d3..a692959b 100644
--- a/src/context/auth.js
+++ b/src/context/auth.js
@@ -5,141 +5,133 @@ import Modal from "../components/modal";
 import Navigation from "../components/navigation";
 import useAuth from "../hooks/useAuth";
 import { createProfile, login, register } from "../service/apiClient";
-import jwt_decode from "jwt-decode"
-
-const AuthContext = createContext()
+import jwt_decode from "jwt-decode";
+import ERR from "../../src/utils/errors.js";
+const AuthContext = createContext();
 
 const AuthProvider = ({ children }) => {
-	const navigate = useNavigate()
-	const location = useLocation()
-	const [token, setToken] = useState(null)
-
-    useEffect(() => {
-        const storedToken = localStorage.getItem('token')
-
-        if (storedToken) {
-            setToken(storedToken)
-            navigate(location.state?.from?.pathname || "/")
-        }
-    }, [location.state?.from?.pathname, navigate])
-
-	const handleLogin = async (email, password, setErrors) => {
-
-		const passwordRequirments = 'Password must be at least 8 characters long and include at least one uppercase letter, one number, and one special character.'
-		const emailErrorMessage = "Please enter a valid email"
-
-		try {
-			const validatedEmail = validationEmail(email)
-			if(!validatedEmail) {
-				throw new Error(emailErrorMessage)
-			}
-
-			const validatedPassword = validationPassword(password)
-			if(!validatedPassword) {
-				throw new Error(passwordRequirments)
-			}
-			
-			const res = await login(email, password)
-			if(!res.status) {
-				throw new Error(res.error.message)
-			}
-        if (!res.data.token) {
-            return navigate("/login")
-        }
-
-        localStorage.setItem('token', res.data.token)
-
-		setToken(res.data.token)
-		navigate(location.state?.from?.pathname || "/")
-		} catch (error) {
-			setErrors(error.message)
-		}
-	};
-
-	const handleLogout = () => {
-        localStorage.removeItem('token')
-		setToken(null)
-	};
-
-	const handleRegister = async (email, password, setErrors) => {
-		const passwordRequirments = 'Password must be at least 8 characters long and include at least one uppercase letter, one number, and one special character.'
-		const emailErrorMessage = "Please enter a valid email"
-
-		try {
-			const validatedEmail = validationEmail(email)
-			if(!validatedEmail) {
-				throw new Error(emailErrorMessage)
-			}
-			const validatedPassword = validationPassword(password)
-			if(!validatedPassword) {
-				throw new Error(passwordRequirments)
-			}
-			const res = await register(email, password, setErrors)
-			if (!res.status) {
-				throw new Error(res.error.message)
-			}
-			setToken(res.data.token)
-			navigate("/verification")
-
-		} catch (error) {
-			setErrors(error.message)
-		}
-	}
-
-	const handleCreateProfile = async (firstName, lastName, githubUrl, bio) => {
-			const { userId } = jwt_decode(token)
-
-			await createProfile(userId, firstName, lastName, githubUrl, bio)
-
-			// localStorage.setItem('token', token)
-			navigate('/')
-	}
-
-	const value = {
-		token,
-		onLogin: handleLogin,
-		onLogout: handleLogout,
-        onRegister: handleRegister,
-        onCreateProfile: handleCreateProfile
-	};
-
-	return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>
+  const navigate = useNavigate();
+  const location = useLocation();
+  const [token, setToken] = useState(null);
+
+  useEffect(() => {
+    const storedToken = localStorage.getItem("token");
+
+    if (storedToken) {
+      setToken(storedToken);
+      navigate(location.state?.from?.pathname || "/");
+    }
+  }, [location.state?.from?.pathname, navigate]);
+
+  const handleLogin = async (email, password, setErrors) => {
+    try {
+      const validatedEmail = validationEmail(email);
+      if (!validatedEmail) {
+        throw new Error(ERR.EMAIL_ERROR_MESSAGE);
+      }
+
+      const validatedPassword = validationPassword(password);
+      if (!validatedPassword) {
+        throw new Error(ERR.PASSWORD_REQUIRMENTS);
+      }
+
+      const res = await login(email, password);
+      if (!res.status) {
+        throw new Error(res.error.message);
+      }
+      if (!res.data.token) {
+        return navigate("/login");
+      }
+
+      localStorage.setItem("token", res.data.token);
+
+      setToken(res.data.token);
+      navigate(location.state?.from?.pathname || "/");
+    } catch (error) {
+      setErrors(error.message);
+    }
+  };
+
+  const handleLogout = () => {
+    localStorage.removeItem("token");
+    setToken(null);
+  };
+
+  const handleRegister = async (email, password, setErrors) => {
+    try {
+      const validatedEmail = validationEmail(email);
+      if (!validatedEmail) {
+        throw new Error(ERR.EMAIL_ERROR_MESSAGE);
+      }
+      const validatedPassword = validationPassword(password);
+      if (!validatedPassword) {
+        throw new Error(ERR.PASSWORD_REQUIRMENTS);
+      }
+      const res = await register(email, password, setErrors);
+      if (!res.status) {
+        throw new Error(res.error.message);
+      }
+      setToken(res.data.token);
+      navigate("/verification");
+    } catch (error) {
+      setErrors(error.message);
+    }
+  };
+
+  const handleCreateProfile = async (firstName, lastName, githubUrl, bio) => {
+    const { userId } = jwt_decode(token);
+
+    await createProfile(userId, firstName, lastName, githubUrl, bio);
+
+    navigate("/");
+  };
+
+  const value = {
+    token,
+    onLogin: handleLogin,
+    onLogout: handleLogout,
+    onRegister: handleRegister,
+    onCreateProfile: handleCreateProfile,
+  };
+
+  return <AuthContext.Provider value={value}>{children}</AuthContext.Provider>;
 };
 
 const ProtectedRoute = ({ children }) => {
-	const { token } = useAuth()
-	const location = useLocation()
-
-	if (!token) {
-		return <Navigate to={"/login"} replace state={{ from: location }} />
-	}
-
-	return (
-		<div className="container">
-			<Header />
-			<Navigation />
-            <Modal />
-			{children}
-
-		</div>
-	)
-}
+  const { token } = useAuth();
+  const location = useLocation();
+
+  if (!token) {
+    return <Navigate to={"/login"} replace state={{ from: location }} />;
+  }
+
+  return (
+    <div className="container">
+      <Header />
+      <Navigation />
+      <Modal />
+      {children}
+    </div>
+  );
+};
 function validationEmail(email) {
-	
-	const pattern = /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$/
-	
-	return (!email || !pattern.test(email)) ? false : true
+  const emailPattern = /^[a-zA-Z0-9_.+-]+@[a-zA-Z0-9-]+\.[a-zA-Z0-9-.]+$/;
+
+  return !email || !emailPattern.test(email) ? false : true;
 }
 
 function validationPassword(password) {
-	const minLength = 8
-	const hasUppercase = /[A-Z]/.test(password)
-	const hasNumber = /\d/.test(password)
-	const hasSpecialCharacter = /[!@#$%^&*(),.?":{}|<>]/.test(password)
-
-	return (password.length < minLength || !hasUppercase || !hasNumber || !hasSpecialCharacter) ? false : true
-
+  const minLength = 8;
+  const hasUppercase = /[A-Z]/.test(password);
+  const hasNumber = /\d/.test(password);
+  const hasSpecialCharacter = /[!@#$%^&*(),.?":{}|<>]/.test(password);
+
+  return password.length < minLength ||
+    !hasUppercase ||
+    !hasNumber ||
+    !hasSpecialCharacter
+    ? false
+    : true;
 }
 
-
-export { AuthContext, AuthProvider, ProtectedRoute }
+export { AuthContext, AuthProvider, ProtectedRoute };
diff --git a/src/errors_handlers/errorRegisterHandler.js b/src/errors_handlers/errorRegisterHandler.js
deleted file mode 100644
index 1e039a9b..00000000
--- a/src/errors_handlers/errorRegisterHandler.js
+++ /dev/null
@@ -1,6 +0,0 @@
-// To handle errors of register page
-
-export function handleRegistrationError(error) {
-  const errorMessage = error.message || "An unknown registration error occurred"
-  return errorMessage
-}
\ No newline at end of file
diff --git a/src/utils/errors.js b/src/utils/errors.js
new file mode 100644
index 00000000..077b0117
--- /dev/null
+++ b/src/utils/errors.js
@@ -0,0 +1,5 @@
+export default {
+  PASSWORD_REQUIRMENTS:
+    "Password must be at least 8 characters long and include at least one uppercase letter, one number, and one special character.",
+  EMAIL_ERROR_MESSAGE: "Please enter a valid email",
+};

From 0f0262c0362fb235eeda4b18d5684c4f335992b7 Mon Sep 17 00:00:00 2001
From: Farshad <f.bagdeli13@gmail.com>
Date: Fri, 19 Jul 2024 16:51:06 +0200
Subject: [PATCH 9/9] refactor-No2

---
 src/pages/login/index.js    | 90 ++++++++++++++++++-----------------
 src/pages/register/index.js | 94 +++++++++++++++++++------------------
 src/service/apiClient.js    |  2 +-
 3 files changed, 95 insertions(+), 91 deletions(-)

diff --git a/src/pages/login/index.js b/src/pages/login/index.js
index 0e7af639..91dcfc0e 100644
--- a/src/pages/login/index.js
+++ b/src/pages/login/index.js
@@ -7,50 +7,52 @@ import "./login.css";
 import ErrorMessage from "../../components/form/errorMessage";
 
 const Login = () => {
-	const { onLogin } = useAuth();
-	const [formData, setFormData] = useState({ email: "", password: "" });
-	const [errors, setErrors] = useState('')
-	const onChange = (e) => {
-		const { name, value } = e.target;
-		setFormData({ ...formData, [name]: value });
-		setErrors('')
-	};
-	
-	return (
-		<div className="bg-blue login credentialpage">
-			<CredentialsCard
-				title="Login"
-				socialLinksTitle="Or log in with"
-				altButtonTitle="Need an account?"
-				altButtonLink="/register"
-				altButtonText="Sign up"
-			>
-				<div className="login-form">
-					<form>
-						<TextInput
-							value={formData.email}
-							onChange={onChange}
-							name="email"
-							label={"Email *"}
-						/>
-						<TextInput
-							value={formData.password}
-							onChange={onChange}
-							name="password"
-							label={"Password *"}
-							type={"password"}
-						/>
-						<ErrorMessage message= {errors}/>
-					</form>
-					<Button
-						text="Log in"
-						onClick={() => onLogin(formData.email, formData.password, setErrors)}
-						classes="green width-full"
-					/>
-				</div>
-			</CredentialsCard>
-		</div>
-	);
+  const { onLogin } = useAuth();
+  const [formData, setFormData] = useState({ email: "", password: "" });
+  const [errors, setErrors] = useState(null);
+  const onChange = (e) => {
+    const { name, value } = e.target;
+    setFormData({ ...formData, [name]: value });
+    setErrors(null);
+  };
+
+  return (
+    <div className="bg-blue login credentialpage">
+      <CredentialsCard
+        title="Login"
+        socialLinksTitle="Or log in with"
+        altButtonTitle="Need an account?"
+        altButtonLink="/register"
+        altButtonText="Sign up"
+      >
+        <div className="login-form">
+          <form>
+            <TextInput
+              value={formData.email}
+              onChange={onChange}
+              name="email"
+              label={"Email *"}
+            />
+            <TextInput
+              value={formData.password}
+              onChange={onChange}
+              name="password"
+              label={"Password *"}
+              type={"password"}
+            />
+            <ErrorMessage message={errors} />
+          </form>
+          <Button
+            text="Log in"
+            onClick={() =>
+              onLogin(formData.email, formData.password, setErrors)
+            }
+            classes="green width-full"
+          />
+        </div>
+      </CredentialsCard>
+    </div>
+  );
 };
 
 export default Login;
diff --git a/src/pages/register/index.js b/src/pages/register/index.js
index 2d2e290c..3bfa0983 100644
--- a/src/pages/register/index.js
+++ b/src/pages/register/index.js
@@ -7,53 +7,55 @@ import "./register.css";
 import ErrorMessage from "../../components/form/errorMessage";
 
 const Register = () => {
-	const { onRegister } = useAuth();
-	const [formData, setFormData] = useState({ email: "", password: "" });
-	const [errors, setErrors] = useState('')
- 
-	const onChange = (e) => {
-		const { name, value } = e.target;
-		setFormData({ ...formData, [name]: value });
-		setErrors('')
-	};
+  const { onRegister } = useAuth();
+  const [formData, setFormData] = useState({ email: "", password: "" });
+  const [errors, setErrors] = useState(null);
 
-	return (
-		<div className="bg-blue register credentialpage">
-			<CredentialsCard
-				title="Register"
-				socialLinksTitle="Or sign up with"
-				altButtonTitle="Already a user?"
-				altButtonLink="/login"
-				altButtonText="Log in"
-			>
-				<div className="register-form">
-					<form>
-						<TextInput
-							value={formData.email}
-							onChange={onChange}
-                            type="email"
-							name="email"
-							label={"Email *"}
-						/>
-						<TextInput
-							value={formData.password}
-							onChange={onChange}
-							name="password"
-							label={"Password *"}
-							type={"password"}
-						/>
-						<ErrorMessage message= {errors}/>
-					</form>
-					
-					<Button
-						text="Sign up"
-						onClick={() => onRegister(formData.email, formData.password, setErrors)}
-						classes="green width-full"
-					/>
-				</div>
-			</CredentialsCard>
-		</div>
-	);
+  const onChange = (e) => {
+    const { name, value } = e.target;
+    setFormData({ ...formData, [name]: value });
+    setErrors(null);
+  };
+
+  return (
+    <div className="bg-blue register credentialpage">
+      <CredentialsCard
+        title="Register"
+        socialLinksTitle="Or sign up with"
+        altButtonTitle="Already a user?"
+        altButtonLink="/login"
+        altButtonText="Log in"
+      >
+        <div className="register-form">
+          <form>
+            <TextInput
+              value={formData.email}
+              onChange={onChange}
+              type="email"
+              name="email"
+              label={"Email *"}
+            />
+            <TextInput
+              value={formData.password}
+              onChange={onChange}
+              name="password"
+              label={"Password *"}
+              type={"password"}
+            />
+            <ErrorMessage message={errors} />
+          </form>
+
+          <Button
+            text="Sign up"
+            onClick={() =>
+              onRegister(formData.email, formData.password, setErrors)
+            }
+            classes="green width-full"
+          />
+        </div>
+      </CredentialsCard>
+    </div>
+  );
 };
 
 export default Register;
diff --git a/src/service/apiClient.js b/src/service/apiClient.js
index cec644cf..4a391a4f 100644
--- a/src/service/apiClient.js
+++ b/src/service/apiClient.js
@@ -19,7 +19,7 @@ async function register(email, password) {
         if(res.status === 'fail') {
             throw new Error(res.data.error)
         }
-        return await login(email, password)
+        return login(email, password)
     } catch (error) {
         if(error === 'Email already in use') {
             return { status : false, error : error}