From 1aaaae706156e620f674783d54dbd8f5ef8edb7f Mon Sep 17 00:00:00 2001
From: bega <begmuhommet.jumayev@gmail.com>
Date: Thu, 28 Nov 2024 15:06:01 +0800
Subject: [PATCH] changed reCaptcha to hCaptcha

---
 .env                              |  4 +++-
 package-lock.json                 | 23 ++++++++++++++++++++---
 package.json                      |  1 +
 src/sections/form/FormSection.tsx | 11 +++++------
 4 files changed, 29 insertions(+), 10 deletions(-)

diff --git a/.env b/.env
index 995fca4..c1192e2 100644
--- a/.env
+++ b/.env
@@ -1 +1,3 @@
-NODE_ENV=production
\ No newline at end of file
+NODE_ENV=production
+NEXT_PUBLIC_RECAPTCHA_SECRET_KEY=
+NEXT_PUBLIC_RECAPTCHA_SITE_KEY=
\ No newline at end of file
diff --git a/package-lock.json b/package-lock.json
index b0e7f21..1fd9236 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -9,6 +9,7 @@
       "version": "0.1.0",
       "dependencies": {
         "@emailjs/browser": "4.4.1",
+        "@hcaptcha/react-hcaptcha": "1.11.0",
         "@radix-ui/react-accordion": "1.2.1",
         "@radix-ui/react-avatar": "1.1.1",
         "@radix-ui/react-dialog": "1.1.2",
@@ -63,7 +64,6 @@
       "version": "7.25.7",
       "resolved": "https://registry.npmjs.org/@babel/runtime/-/runtime-7.25.7.tgz",
       "integrity": "sha512-FjoyLe754PMiYsFaN5C94ttGiOmBNYTf6pLr4xXHAT5uctHb092PBszndLDR5XA/jghQvn4n7JMHl7dmTgbm9w==",
-      "dev": true,
       "dependencies": {
         "regenerator-runtime": "^0.14.0"
       },
@@ -135,6 +135,24 @@
         "node": "^12.22.0 || ^14.17.0 || >=16.0.0"
       }
     },
+    "node_modules/@hcaptcha/loader": {
+      "version": "1.2.4",
+      "resolved": "https://registry.npmjs.org/@hcaptcha/loader/-/loader-1.2.4.tgz",
+      "integrity": "sha512-3MNrIy/nWBfyVVvMPBKdKrX7BeadgiimW0AL/a/8TohNtJqxoySKgTJEXOQvYwlHemQpUzFrIsK74ody7JiMYw=="
+    },
+    "node_modules/@hcaptcha/react-hcaptcha": {
+      "version": "1.11.0",
+      "resolved": "https://registry.npmjs.org/@hcaptcha/react-hcaptcha/-/react-hcaptcha-1.11.0.tgz",
+      "integrity": "sha512-UKHtzzVMHLTGwab5pgV96UbcXdyh5Qyq8E0G5DTyXq8txMvuDx7rSyC+BneOjWVW0a7O9VuZmkg/EznVLRE45g==",
+      "dependencies": {
+        "@babel/runtime": "^7.17.9",
+        "@hcaptcha/loader": "^1.2.1"
+      },
+      "peerDependencies": {
+        "react": ">= 16.3.0",
+        "react-dom": ">= 16.3.0"
+      }
+    },
     "node_modules/@humanwhocodes/config-array": {
       "version": "0.13.0",
       "resolved": "https://registry.npmjs.org/@humanwhocodes/config-array/-/config-array-0.13.0.tgz",
@@ -4687,8 +4705,7 @@
     "node_modules/regenerator-runtime": {
       "version": "0.14.1",
       "resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.14.1.tgz",
-      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw==",
-      "dev": true
+      "integrity": "sha512-dYnhHh0nJoMfnkZs6GmmhFknAGRrLznOu5nc9ML+EJxGvrx6H7teuevqVqCuPcPK//3eDrrjQhehXVx9cnkGdw=="
     },
     "node_modules/regexp.prototype.flags": {
       "version": "1.5.3",
diff --git a/package.json b/package.json
index 9a0f573..d739088 100644
--- a/package.json
+++ b/package.json
@@ -10,6 +10,7 @@
   },
   "dependencies": {
     "@emailjs/browser": "4.4.1",
+    "@hcaptcha/react-hcaptcha": "1.11.0",
     "@radix-ui/react-accordion": "1.2.1",
     "@radix-ui/react-avatar": "1.1.1",
     "@radix-ui/react-dialog": "1.1.2",
diff --git a/src/sections/form/FormSection.tsx b/src/sections/form/FormSection.tsx
index 5eddd5d..c8747e4 100644
--- a/src/sections/form/FormSection.tsx
+++ b/src/sections/form/FormSection.tsx
@@ -8,9 +8,9 @@ import { Textarea } from '@/components/ui/textarea';
 import { useToast } from '@/hooks/use-toast';
 import { cn } from '@/lib/utils';
 import email from '@emailjs/browser';
+import HCaptcha from '@hcaptcha/react-hcaptcha';
 import { Loader } from 'lucide-react';
 import React, { ChangeEvent, FormEvent, useEffect, useState } from 'react';
-import ReCAPTCHA from 'react-google-recaptcha';
 
 const initialData = {
   name: '',
@@ -31,10 +31,8 @@ const FormSection: React.FC = () => {
 
   // Effects
   useEffect(() => {
-    console.log('env -> ', process.env);
-
     if (!process.env.NEXT_PUBLIC_EMAIL_PUBLIC_KEY) {
-      console.log('public key is undefined');
+      console.warn('public key is undefined');
       return;
     }
     email.init(process.env.NEXT_PUBLIC_EMAIL_PUBLIC_KEY);
@@ -177,9 +175,10 @@ const FormSection: React.FC = () => {
 
           <div className="flex items-center justify-center">
             {!!process.env.NEXT_PUBLIC_RECAPTCHA_SITE_KEY && (
-              <ReCAPTCHA
+              <HCaptcha
+                size="normal"
                 sitekey={process.env.NEXT_PUBLIC_RECAPTCHA_SITE_KEY}
-                onChange={handleRecaptchaChange}
+                onVerify={handleRecaptchaChange}
               />
             )}
           </div>