Recruiter login r- fix bugs and add recaptcha (#272)

* fix the headings of the Job Table in Recruiter View (#267)

* Revert "Add Sentry integration for error tracking and monitoring" (#251)

* Revert "Add Sentry integration for error tracking and monitoring (#244)"

This reverts commit 5a603ee.

* fix the headings of the Job Table in Recruiter View (#267)

---------

Co-authored-by: Jai Pannu <142983705+JaiPannu-IITI@users.noreply.github.com>
Co-authored-by: Harsh Soni <98403303+SoniHarsh1@users.noreply.github.com>

* make login components robust

* fixed bugs in login and add recaptcha

* remove redundant status check for rate limiting in login component

---------

Co-authored-by: Harsh Soni <98403303+SoniHarsh1@users.noreply.github.com>
Co-authored-by: Jai Pannu <142983705+JaiPannu-IITI@users.noreply.github.com>
Co-authored-by: Web Team <95338452+web-team-iiti@users.noreply.github.com>

Author: 4 people

src/components/loginForms/loginWithEmail.tsx

@@ -1,64 +1,73 @@
-import React from "react";
+"use client";
+
+import React, { useRef, useState } from "react";
 import { Button } from "@/components/ui/button";
-import { Mail, Send } from "lucide-react";
+import { Send } from "lucide-react";
 import toast from "react-hot-toast";
 import { loginWithEmail } from "@/helpers/api";
 import { handleApiError } from "@/utils/errorHandling";
+import ReCAPTCHA from "react-google-recaptcha";
+
+export const LoginWithEmail = ({ email }: { email: string }) => {
+  const [captchaToken, setCaptchaToken] = useState<string>("");
+  const [loading, setLoading] = useState(false);
+  const recaptchaRef = useRef<ReCAPTCHA | null>(null);
 
-export const LoginWithEmail = (params: { email: string }) => {
   const onClick = async () => {
     try {
-      const { email } = params;
-
       if (!email || !email.includes("@")) {
         toast.error("Please enter a valid email address");
         return;
       }
 
-      console.log(email);
-      const response = await loginWithEmail(email);
+      if (!captchaToken) {
+        toast.error("Please complete the captcha");
+        return;
+      }
+
+      setLoading(true);
+      const response = await loginWithEmail(email, captchaToken);
 
-      if (response) {
+      console.log("Login response:", response);
+
+      if (
+        response?.statusCode === 429 ||
+        response?.message?.includes("Too Many Requests")
+      ) {
+        toast.error("Too many requests. Please wait and try again.");
+      } else if (response.success) {
         toast.success("Login link sent to your email!");
       } else {
         toast.error("Unable to send login link. Please try again.");
       }
 
       return response;
     } catch (error: any) {
-      console.error("Login email error:", error);
-
-      // Handle rate limiting specifically
-      if (
-        error?.response?.status === 429 ||
-        error?.status === 429 ||
-        error?.statusCode === 429
-      ) {
-        toast.error(
-          "Too many requests. Please wait a moment before trying again.",
-        );
-      } else if (
-        error?.response?.data?.message?.includes("Too Many Requests") ||
-        error?.message?.includes("Too Many Requests")
-      ) {
-        toast.error(
-          "Too many requests. Please wait a moment before trying again.",
-        );
-      } else {
-        toast.error("An error occurred while sending the email");
-      }
+      handleApiError(error, "An error occurred while sending the email");
       return false;
+    } finally {
+      setLoading(false);
+      setCaptchaToken("");
+      recaptchaRef.current?.reset();
     }
   };
 
   return (
-    <Button
-      onClick={onClick}
-      className="w-full h-12 bg-slate-700 hover:bg-slate-800 text-white font-medium rounded-lg transition-colors duration-200"
-      disabled={!params.email || !params.email.includes("@")}
-    >
-      <Send className="mr-2 h-4 w-4" />
-      Send Login Link
-    </Button>
+    <div className="space-y-4">
+      <ReCAPTCHA
+        ref={recaptchaRef}
+        sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_SITE_KEY || ""}
+        onChange={(token) => setCaptchaToken(token || "")}
+      />
+
+      <Button
+        onClick={onClick}
+        disabled={!email || !email.includes("@") || !captchaToken || loading}
+        className="w-full h-12 bg-slate-700 hover:bg-slate-800 text-white font-medium rounded-lg transition-colors duration-200"
+      >
+        <Send className="mr-2 h-4 w-4" />
+        {loading ? "Sending..." : "Send Login Link"}
+      </Button>
+    </div>
   );
 };

src/helpers/api.ts

@@ -84,7 +84,7 @@ export const apiCall = async (
   const res = await fetch(requestUrl, req);
   if (method === "GET" || recieveResponse) {
     if (res.ok) return await res.json();
-    else throw new Error("Cannot fetch");
+    else return res.json();
   } else return res.ok;
 };
 
@@ -600,11 +600,12 @@ export const deleteEvent = async (jobId: string, eventId: string) => {
   }
 };
 
-export const loginWithEmail = async (email: string) => {
+export const loginWithEmail = async (email: string, token: string) => {
   return apiCall("/auth/passwordless", {
     method: "POST",
-    body: { email },
+    body: { email, token },
     isAuth: false,
+    recieveResponse: true,
   });
 };