recaptcha

src/Pages/Authentication/index.js

@@ -342,6 +342,7 @@ function SignUp({ notificationApi }) {
   const navigate = useNavigate();
 
   const [isRequesting, setIsRequesting] = useState(false);
+  const recaptchaValueRef = useRef(null);
 
   const [form] = Form.useForm();
 
@@ -360,19 +361,18 @@ function SignUp({ notificationApi }) {
       .then((values) => {
         setIsRequesting(true);
 
-        let body = {
+        myFetch({
+          url: `/user/auth/signup`,
+          method: "POST",
+          body: {
             companyName: values.companyName,
             accountName: values.accountName.toLocaleLowerCase(),
             password: EncodeStringToBase64(values.password),
             username: values.username,
             language: i18n.language,
             rememberMe: values.rememberMe,
-        };
-
-        myFetch({
-          url: `/user/auth/signup`,
-          method: "POST",
-          body: body,
+            recaptcha: recaptchaValueRef.current,
+          },
           notificationApi: notificationApi,
           t: t,
         })
@@ -415,11 +415,20 @@ function SignUp({ notificationApi }) {
 
       <RememberMeCheckbox />
 
+      <Form.Item
+        name="recaptcha"
+        rules={[
+          {
+            required: true,
+            message: t("common.inputRules.recaptchaRequired"),
+          },
+        ]}
+      >
         <ReCAPTCHA
-        style={{ paddingBottom: 16 }}
           sitekey={process.env.REACT_APP_RECAPTCHA_SITE_KEY}
-        onChange={(value) => console.log("Captcha value:", value)}
+          onChange={(value) => (recaptchaValueRef.current = value)}
         />
+      </Form.Item>
 
       <Button
         type="primary"