1. GoogleAuth Done

2. Login with email for recruiter

src/components/loginForms/loginForm.tsx

@@ -8,6 +8,7 @@ import { useRouter } from "next/navigation";
 import Cookies from "js-cookie";
 import { jwtDecode } from "jwt-decode";
 import GoogleLogin from "./googleLogin";
+import { LoginWithEmail } from "@/components/loginForms/loginWithEmail";
 
 const LoginForm = () => {
   const [email, setemail] = useState<String | null>(null);
@@ -20,42 +21,44 @@ const LoginForm = () => {
           <div className="bg-white p-4 px-4 md:p-8 rounded-md">
             <div className="w-full">
               <div className="lg:col-span-2 w-full">
-                <div className="my-2 w-full">
-                  <div className="md:col-span-5">
-                    <input
-                      type="text"
-                      name="email"
-                      id="email"
-                      className="h-10 border mt-1 rounded px-4 w-full bg-gray-50"
-                      placeholder="[email protected]"
-                      required={true}
-                      onChange={(e) => {
-                        setemail(e?.target?.value);
-                      }}
-                    />
-                  </div>
-                  <div className="md:col-span-5">
-                    <select
-                      name="role"
-                      id="role"
-                      className="h-10 border mt-1 rounded px-4 w-full bg-gray-50"
-                      required={true}
-                      onChange={(e) => {
-                        setrole(e?.target?.value);
-                      }}
-                    >
-                      <option>Student</option>
-                      <option>Faculty</option>
-                      <option>Recruiter</option>
-                      <option>Manager</option>
-                      <option>Admin</option>
-                    </select>
+                <div className="my-2 w-full h-max">
+                  <div className="mb-4">
+                    <div className="md:col-span-5">
+                      <input
+                        type="text"
+                        name="email"
+                        id="email"
+                        className="h-10 border mt-1 rounded px-4 w-full bg-gray-50"
+                        placeholder="[email protected]"
+                        required={true}
+                        onChange={(e) => {
+                          setemail(e?.target?.value);
+                        }}
+                      />
+                    </div>
+                    <div className="md:col-span-5">
+                      <select
+                        name="role"
+                        id="role"
+                        className="h-10 border mt-1 rounded px-4 w-full bg-gray-50"
+                        required={true}
+                        onChange={(e) => {
+                          setrole(e?.target?.value);
+                        }}
+                      >
+                        <option>Student</option>
+                        <option>Faculty</option>
+                        <option>Recruiter</option>
+                        <option>Manager</option>
+                        <option>Admin</option>
+                      </select>
+                    </div>
                   </div>
 
                   <div className="md:col-span-5 text-right">
-                    <div className="items-center flex justify-center flex-col">
+                    <div className="items-center flex justify-center flex-col gap-4">
                       <button
-                        className="bg-blue-500 my-5 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
+                        className="bg-blue-500 hover:bg-blue-700 text-white font-bold py-2 px-4 rounded"
                         onClick={() => {
                           if (email == null || email.length == 0) {
                             toast.error("Email is Required");
@@ -94,6 +97,7 @@ const LoginForm = () => {
                       >
                         Request Access
                       </button>
+                      <LoginWithEmail email={email} />
                       <GoogleLogin />
                     </div>
                   </div>

src/components/loginForms/loginWithEmail.tsx

@@ -0,0 +1,37 @@
+import React from "react";
+import { url } from "../../helpers/api";
+import LockImg from "@/../public/icons/lock.svg";
+import toast from "react-hot-toast";
+
+export const LoginWithEmail = (params: { email: String }) => {
+  const onClick = async () => {
+    const res = await fetch(url("/auth/passwordless"), {
+      method: "POST",
+      cache: "no-store",
+      headers: {
+        "Content-type": "application/json",
+      },
+      body: JSON.stringify({ email: params.email }),
+    });
+    console.log(res);
+    const resOk = res.ok;
+    if (resOk) toast.success("Email Has Been Sent");
+    return resOk;
+  };
+
+  return (
+    <>
+      <div>
+        <button
+          className="bg-white h-2rem px-4 py-2 flex items-center border-2 border-gray-200 rounded-xl hover:shadow-inner transition-shadow"
+          onClick={onClick}
+        >
+          <span>
+            <img src={LockImg.src} className="h-8 mr-1" alt="" />
+          </span>
+          Login With Email
+        </button>
+      </div>
+    </>
+  );
+};

src/middleware.ts

@@ -14,34 +14,7 @@ const recruiterRoutes = ["/recruiter/jaf", "/recruiter/prevjaf"];
 
 export function middleware(request: NextRequest) {
   const userCookie = request.cookies.get("user");
-
-  // GoogleAuth in backend sends cookie in the format:
-  // { name: 'user', value: 'j:{"id":"4105818e-a203-4e35-ae7f-8881a4caf804","email":"someEmail","role":"STUDENT","studentId":"de42afd4-36b7-42d5-8ddf-1ea174d00c9f"}' }
-  // Removing the 'j:' prefix from the value
-  let parsedUserCookie;
-  if (userCookie && userCookie.value.startsWith("j:")) {
-    parsedUserCookie = userCookie.value.substring(2);
-  } else if (userCookie) {
-    parsedUserCookie = userCookie.value;
-  }
-
-  let user;
-  try {
-    user = parsedUserCookie ? JSON.parse(parsedUserCookie) : null;
-  } catch (e) {
-    console.error("Error parsing JSON:", e);
-  }
-
-  const response = NextResponse.next();
-
-  if (userCookie && userCookie.value.startsWith("j:")) {
-    response.cookies.set({
-      name: "user",
-      value: parsedUserCookie,
-      maxAge: 60 * 60 * 24 * 7, // 7 days in seconds
-      path: "/",
-    });
-  }
+  const user = userCookie ? JSON.parse(userCookie.value) : null;
 
   if (
     user?.role !== "ADMIN" &&
@@ -57,10 +30,11 @@ export function middleware(request: NextRequest) {
   }
   if (
     user?.role !== "RECRUITER" &&
-    recruiterRoutes.includes(request.nextUrl.pathname)
+    recruiterRoutes.includes(request.nextUrl.pathname) &&
+    request.url.includes("/recruiter")
   ) {
     return NextResponse.redirect(new URL("/login", request.url));
   }
 
-  return response;
+  return NextResponse.next();
 }