NAN

2024-09-25 19:13:52 +05:30
parent d2a2bafd2c
commit fcb11548e1
2 changed files with 294 additions and 281 deletions
--- a/index.html
+++ b/index.html
@@ -9,5 +9,6 @@
  <body>
    <div id="root"></div>
    <script type="module" src="/src/main.jsx"></script>
+    <script src="https://www.google.com/recaptcha/api.js"></script>
  </body>
 </html>
--- a/src/components/Form.jsx
+++ b/src/components/Form.jsx
@@ -1,4 +1,4 @@
-import { useState } from "react";
+import { useState, useRef, React, createRef } from "react";
 import {
  Box,
  Button,
@@ -26,7 +26,6 @@ import ReCAPTCHA from "react-google-recaptcha";
 import { Spinner } from "@chakra-ui/react";
 import { TbNumber2Small } from "react-icons/tb";

-
 const Form = () => {
  const [sliderValue, setSliderValue] = useState(0);
  const [fileAdded, setFileAdded] = useState(false);
@@ -35,8 +34,7 @@ const Form = () => {
  const [success, setSuccess] = useState(null);
  const [formError, setformError] = useState(null);
  const [captchaValue, setCaptchaValue] = useState(null);
-
-
+  const recaptchaRef = createRef();
  const {
    register,
    handleSubmit,
@@ -52,6 +50,9 @@ const Form = () => {
      return;
    }

+    const recaptchaValue = recaptchaRef.current.getValue();
+    this.props.onSubmit(recaptchaValue);
+
    const handleCaptcha = (value) => {
      setCaptchaValue(value);
    };
@@ -125,7 +126,12 @@ const Form = () => {
  };

  return (
-    <Container id="contact-section" maxW="container.2xl" p={{ base: "1rem", lg: "3rem" }} bg="black">
+    <Container
+      id="contact-section"
+      maxW="container.2xl"
+      p={{ base: "1rem", lg: "3rem" }}
+      bg="black"
+    >
      <Box
        bg="#0F0F0F"
        display="flex"
@@ -151,7 +157,7 @@ const Form = () => {
          p={"2rem"}
          w={"100%"}
        >
-          {/* <form> */}
+          {/* <form onSubmit={handleSubmit(onSubmit)}> */}
            <FormControl
              display="flex"
              flexDirection="column"
@@ -437,9 +443,15 @@ const Form = () => {
              )} */}
                <Box>
                  {/* <ReCAPTCHA
-                  sitekey='6Ldhwk4qAAAAAB-Xbyvp8BtmnyrBqBbpnC1skOb6'
+                    ref={recaptchaRef}
+                    sitekey="6LeJxU4qAAAAAO9S71T7dh4xc0N1g5vrfT0Vaoi-"
                    onChange={onCaptchaChange}
                  /> */}
+                  {/* <Box
+                  className="g-recaptcha"
+                  // data-sitekey="6Lel4Z4UAAAAAOa8LO1Q9mqKRUiMYl_00o5mXJrR"
+                  datasitekey="6Ldhwk4qAAAAAB-Xbyvp8BtmnyrBqBbpnC1skOb6"
+                ></Box> */}
                </Box>
              </Box>