From 89925a6af92e1b4f8a804d94c8ba73ab86610b44 Mon Sep 17 00:00:00 2001
From: victorAnumudu <anumuduchukwuebuka@gmail.com>
Date: Mon, 16 Oct 2023 01:18:48 +0100
Subject: [PATCH] added google recaptcha

---
 .env                                          |  5 +++-
 .env.development                              |  5 +++-
 .env.production                               |  3 ++
 .../AuthPages/ForgotPassword/index.jsx        | 29 +++++++++++++++----
 4 files changed, 34 insertions(+), 8 deletions(-)

diff --git a/.env b/.env
index fecdc53..b6ed7ab 100644
--- a/.env
+++ b/.env
@@ -87,4 +87,7 @@ REACT_APP_MAX_FAMILY_MEMBERS=8
 REACT_APP_SHOW_OFFER_GROUP_JOB=0
 
 #UPLOAD PROFILE PICTURE
-REACT_APP_SHOW_UPLOAD_PROFILE_PICTURE=0
\ No newline at end of file
+REACT_APP_SHOW_UPLOAD_PROFILE_PICTURE=0
+
+#GOOGLE RECAPTCHA SITEKEY
+REACT_APP_GOOGLE_RECAPTCHA_SITEKEY=6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI
\ No newline at end of file
diff --git a/.env.development b/.env.development
index 06d93bd..48674d3 100644
--- a/.env.development
+++ b/.env.development
@@ -55,4 +55,7 @@ REACT_APP_MAX_FAMILY_MEMBERS=8
 REACT_APP_SHOW_OFFER_GROUP_JOB=0
 
 #UPLOAD PROFILE PICTURE
-REACT_APP_SHOW_UPLOAD_PROFILE_PICTURE=0
\ No newline at end of file
+REACT_APP_SHOW_UPLOAD_PROFILE_PICTURE=0
+
+#GOOGLE RECAPTCHA SITEKEY
+REACT_APP_GOOGLE_RECAPTCHA_SITEKEY=6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI
\ No newline at end of file
diff --git a/.env.production b/.env.production
index efbfa10..c082fe6 100644
--- a/.env.production
+++ b/.env.production
@@ -62,3 +62,6 @@ REACT_APP_SHOW_OFFER_GROUP_JOB=0
 
 #UPLOAD PROFILE PICTURE
 REACT_APP_SHOW_UPLOAD_PROFILE_PICTURE=0
+
+#GOOGLE RECAPTCHA SITEKEY
+REACT_APP_GOOGLE_RECAPTCHA_SITEKEY=6LeIxAcTAAAAAJcZVRqyHh71UMIEGNQ_MXjiZKhI
diff --git a/src/components/AuthPages/ForgotPassword/index.jsx b/src/components/AuthPages/ForgotPassword/index.jsx
index 0eb7772..21666fe 100644
--- a/src/components/AuthPages/ForgotPassword/index.jsx
+++ b/src/components/AuthPages/ForgotPassword/index.jsx
@@ -7,6 +7,8 @@ import AuthLayout from "../AuthLayout";
 import EmailValidator from "../../../lib/EmailValidator";
 import ForgetPwdResponse from "../ForgetPwdResponse";
 
+import ReCAPTCHA from "react-google-recaptcha";
+
 export default function ForgotPassword() {
   const [checked, setValue] = useState(false);
   const [resetLoading, setResetLoading] = useState(false);
@@ -22,9 +24,18 @@ export default function ForgotPassword() {
     setMail(e?.target.value);
   };
 
-  const humanChecker = () => {
-    setValue(!checked);
-  };
+  // const humanChecker = () => {
+  //   setValue(!checked);
+  // };
+
+  function humanChecker(value) {
+    // console.log("Captcha value:", value);
+    if(value){
+      setValue(true)
+    }else{
+      setValue(false)
+    }
+  }
 
   const resetHandler = async () => {
     if (email == "") {
@@ -113,10 +124,16 @@ export default function ForgotPassword() {
                     />
                   </div>
                   {/* hCaptha clone for the time being */}
-                  <div className="mb-10">
+                  <div className="mb-10 flex justify-center w-full">
+                    <ReCAPTCHA
+                      sitekey={process.env.REACT_APP_GOOGLE_RECAPTCHA_SITEKEY}
+                      onChange={humanChecker}
+                    />
+                  </div>
+                  {/* <div className="mb-10">
                     <div className="w-[303px] h-[78px] mx-auto overflow-hidden">
                       <div className="w-[300px] h-[74px] bg-white bottom-[1px] rounded border-gray-100 overflow-hidden cursor-pointer">
-                        {/* Checkbox */}
+                        
                         <div className="h-full relative inline-block">
                           <div className="relative table top-0 h-full">
                             <div className="table-cell align-middle">
@@ -148,7 +165,7 @@ export default function ForgotPassword() {
                         <div className="h-full relative inline-block w-16"></div>
                       </div>
                     </div>
-                  </div>
+                  </div> */}
                   {msgError && (
                     <div className="relative p-4 text-[#912741] bg-[#fcd9e2] border-[#fbc6d3] mb-4 rounded-[0.475rem] text-md font-light leading-[19.5px] text-[13px]">
                       {msgError}