update CI cookie flag to auto-validate input to bypass onchange event…

… issue

web/atoms/Captcha.tsx

@@ -1,16 +1,9 @@
-import React, { useEffect } from 'react';
+import React from 'react';
 import HCaptcha from '@hcaptcha/react-hcaptcha';
 import { post } from '@shared/lib/fetch';
 import { CAPTCHA_API_PATCH } from 'config/paths';
-import Cookies from 'js-cookie';
-import { DISABLE_CAPTCHA_COOKIE } from 'config/cookies';
 
 export const Captcha = ({ onSuccess, onExpire }: CaptchaProps) => {
-    useEffect(() => {
-        const disableCaptcha = Cookies.get(DISABLE_CAPTCHA_COOKIE);
-        if (disableCaptcha) onSuccess();
-    }, []);
-
     const onVerify = async (token: string, _ekey: string) => {
         const resp = await post<{ success: boolean }, { token: string }>(
             CAPTCHA_API_PATCH,

web/molecules/steps/SecretInputCard.tsx

@@ -17,6 +17,8 @@ import { Captcha } from 'atoms/Captcha';
 import { ACCEPTED_FILE_TYPES, MAX_PAYLOAD_SIZE } from '@shared/config/files';
 import { CONFIRM_PAYLOAD_BTN_ID } from 'lib/constants';
 import { useUser } from '@auth0/nextjs-auth0/client';
+import Cookies from 'js-cookie';
+import { DISABLE_CAPTCHA_COOKIE } from 'config/cookies';
 
 export const SecretInputCard = () => {
     const [mode, setMode] = useState<PayloadInputMode>('text');
@@ -39,6 +41,15 @@ export const SecretInputCard = () => {
         else setCanConfirm(false);
     }, [user]);
 
+    useEffect(() => {
+        const disableCaptcha = Cookies.get(DISABLE_CAPTCHA_COOKIE);
+
+        if (disableCaptcha) {
+            setCanConfirm(true);
+            setIsValid(true);
+        }
+    }, []);
+
     const isValidJson = (input: string) => {
         try {
             JSON.parse(input);