+
+
+
+
+
+ );
+};
+
+export default Login;
diff --git a/client/src/Components/Auth/Signup.jsx b/client/src/Components/Auth/Signup.jsx
index 67eb3ac..20bab3c 100644
--- a/client/src/Components/Auth/Signup.jsx
+++ b/client/src/Components/Auth/Signup.jsx
@@ -1,228 +1,263 @@
-import React, { useState, useContext } from "react";
-import { Link, useNavigate } from "react-router-dom";
-import axios from "axios";
-import Cookies from "universal-cookie";
-import { AuthContext } from "./AuthContext";
-import BackToTopButton from "../BackToTopButton";
-import userImg from "../../assets/images/user.webp";
-import { toast } from "react-toastify";
-import gsap from 'gsap';
-import { useGSAP } from '@gsap/react';
-
-
-const Signup = () => {
- const cookies = new Cookies();
- const { login } = useContext(AuthContext);
- const navigate = useNavigate();
- const [inputValue, setInputValue] = useState({
- email: "",
- password: "",
- username: "",
- });
- const { email, password, username } = inputValue;
-
- const [role, setRole] = useState("student");
- const togglePasswordVisibility = () => {
- setInputValue(prevState => ({
- ...prevState,
- showPassword: !prevState.showPassword,
- }));
- };
-
- const handleOnChange = (e) => {
- const { name, value } = e.target;
- setInputValue({
- ...inputValue,
- [name]: value,
- });
- };
-
-
-
- const handleSubmit = async (e) => {
- e.preventDefault();
- const emailRegex = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i;
- const passwordRegex = /^(?=.*[A-Z])(?=.*[!@#$%^&*])(?=.{8,12})/;
-
- if (!emailRegex.test(email)) {
- toast.error("Invalid email format");
- return;
- }
-
- if (!passwordRegex.test(password)) {
- toast.error("Invalid password");
- return;
- }
-
- try {
- const response = await axios.post(
- `${import.meta.env.VITE_API_URL}/auth/signup`,
- {
- ...inputValue,
- role: role,
- },
- {
- withCredentials: true,
- }
- );
-
- if (response) {
- console.log(response.data.token);
- cookies.set("TOKEN", response.data.token, {
- path: "/",
- });
- }
- console.log(cookies.get("TOKEN"));
-
- const { success, message } = response.data;
- if (success) {
- login(response.data.token);
- cookies.set("TOKEN", response.data.token, {
- path: "/",
- });
- navigate("/Home");
- } else {
- if (response.status === 409) {
- toast.error("This email id already exists, please either login or use another email id");
- } else {
- toast.error(message); // Display error message from server
- }
- }
- } catch (error) {
- toast.error("Signup Failed, Please try again");
- console.log(error);
- }
- };
-
- useGSAP(()=>{
- const tl = gsap.timeline();
- tl.from('.text-signup',{
- duration: 1,
- opacity: 0,
- y: 100,
- ease: 'power3.out'
- })
- tl.from('.form-signup',{
- duration: 1,
- opacity: 0,
- y: 100,
- ease: 'power3.out'
- })
- })
-
- return (
-
-
-
-
- );
-};
-
+import React, { useState, useContext } from "react";
+import { Link, useNavigate } from "react-router-dom";
+import axios from "axios";
+import Cookies from "universal-cookie";
+import { AuthContext } from "./AuthContext";
+import BackToTopButton from "../BackToTopButton";
+import userImg from "../../assets/images/login1.png";
+import { toast } from "react-toastify";
+import gsap from 'gsap';
+import { useGSAP } from '@gsap/react';
+
+
+const Signup = () => {
+ const cookies = new Cookies();
+ const { login } = useContext(AuthContext);
+ const navigate = useNavigate();
+ const [inputValue, setInputValue] = useState({
+ email: "",
+ password: "",
+ username: "",
+ });
+ const { email, password, username } = inputValue;
+
+ const [role, setRole] = useState("student");
+ const togglePasswordVisibility = () => {
+ setInputValue(prevState => ({
+ ...prevState,
+ showPassword: !prevState.showPassword,
+ }));
+ };
+
+ const handleOnChange = (e) => {
+ const { name, value } = e.target;
+ setInputValue({
+ ...inputValue,
+ [name]: value,
+ });
+ };
+
+
+
+ const handleSubmit = async (e) => {
+ e.preventDefault();
+ const emailRegex = /^[A-Z0-9._%+-]+@[A-Z0-9.-]+\.[A-Z]{2,}$/i;
+ const passwordRegex = /^(?=.*[A-Z])(?=.*[!@#$%^&*])(?=.{8,12})/;
+
+ if (!emailRegex.test(email)) {
+ toast.error("Invalid email format");
+ return;
+ }
+
+ if (!passwordRegex.test(password)) {
+ toast.error("Invalid password");
+ return;
+ }
+
+ try {
+ const response = await axios.post(
+ `${import.meta.env.VITE_API_URL}/auth/signup`,
+ {
+ ...inputValue,
+ role: role,
+ },
+ {
+ withCredentials: true,
+ }
+ );
+
+ if (response) {
+ console.log(response.data.token);
+ cookies.set("TOKEN", response.data.token, {
+ path: "/",
+ });
+ }
+ console.log(cookies.get("TOKEN"));
+
+ const { success, message } = response.data;
+ if (success) {
+ login(response.data.token);
+ cookies.set("TOKEN", response.data.token, {
+ path: "/",
+ });
+ navigate("/Home");
+ } else {
+ if (response.status === 409) {
+ toast.error("This email id already exists, please either login or use another email id");
+ } else {
+ toast.error(message); // Display error message from server
+ }
+ }
+ } catch (error) {
+ toast.error("Signup Failed, Please try again");
+ console.log(error);
+ }
+ };
+ const customStyles = {
+ student: {
+ backgroundColor: 'rgb(17 24 39)',
+ },
+ default: {
+ backgroundColor: 'transparent',
+ },
+ };
+ useGSAP(()=>{
+ const tl = gsap.timeline();
+ tl.from('.text-signup',{
+ duration: 1,
+ opacity: 0,
+ y: 100,
+ delay: 0.5,
+ ease: 'power3.out',
+ stagger: {
+ amount: 0.5,
+ },
+ })
+ tl.from('.form-signup',{
+ duration: 1,
+ opacity: 0,
+ y: 100,
+ ease: 'power3.out'
+ })
+ })
+
+ return (
+
+ {/*
*/}
+
+
+
+
+
+
+
+ {/*
Create Account
*/}
+
+ Create Your Account
+
+
+
+
+
+ );
+};
+
export default Signup;
\ No newline at end of file
diff --git a/client/src/assets/images/login1.png b/client/src/assets/images/login1.png
new file mode 100644
index 0000000..39a105d
Binary files /dev/null and b/client/src/assets/images/login1.png differ