fix(recaptcha|sso): recaptcha not generated issue (#9764)

Fix https://github.com/twentyhq/twenty/issues/9759
https://github.com/twentyhq/twenty/issues/9694
https://github.com/twentyhq/twenty/issues/9323

packages/twenty-front/src/modules/auth/sign-in-up/components/SignInUpGlobalScopeForm.tsx

@@ -26,6 +26,7 @@ import { useRedirectToWorkspaceDomain } from '@/domain-manager/hooks/useRedirect
 import { SnackBarVariant } from '@/ui/feedback/snack-bar-manager/components/SnackBar';
 import { useSnackBar } from '@/ui/feedback/snack-bar-manager/hooks/useSnackBar';
 import { isDefined } from '~/utils/isDefined';
+import { isRequestingCaptchaTokenState } from '@/captcha/states/isRequestingCaptchaTokenState';
 
 const StyledContentContainer = styled(motion.div)`
   margin-bottom: ${({ theme }) => theme.spacing(8)};
@@ -49,6 +50,10 @@ export const SignInUpGlobalScopeForm = () => {
   const setSignInUpStep = useSetRecoilState(signInUpStepState);
   const [signInUpMode, setSignInUpMode] = useRecoilState(signInUpModeState);
 
+  const isRequestingCaptchaToken = useRecoilValue(
+    isRequestingCaptchaTokenState,
+  );
+
   const { enqueueSnackBar } = useSnackBar();
   const { requestFreshCaptchaToken } = useRequestFreshCaptchaToken();
 
@@ -118,8 +123,8 @@ export const SignInUpGlobalScopeForm = () => {
                 signInUpMode={signInUpMode}
               />
             )}
-
             <MainButton
+              disabled={isRequestingCaptchaToken}
               title={
                 signInUpStep === SignInUpStep.Password ? 'Sign Up' : 'Continue'
               }

packages/twenty-front/src/modules/auth/sign-in-up/components/SignInUpWorkspaceScopeFormEffect.tsx

@@ -2,9 +2,10 @@ import { useSignInUp } from '@/auth/sign-in-up/hooks/useSignInUp';
 import { useSignInUpForm } from '@/auth/sign-in-up/hooks/useSignInUpForm';
 import { SignInUpStep } from '@/auth/states/signInUpStepState';
 import { workspaceAuthProvidersState } from '@/workspace/states/workspaceAuthProvidersState';
-import { useCallback, useEffect } from 'react';
+import { useEffect, useState } from 'react';
 import { useRecoilValue } from 'recoil';
 import { isDefined } from '~/utils/isDefined';
+import { isRequestingCaptchaTokenState } from '@/captcha/states/isRequestingCaptchaTokenState';
 
 const searchParams = new URLSearchParams(window.location.search);
 const email = searchParams.get('email');
@@ -12,23 +13,40 @@ const email = searchParams.get('email');
 export const SignInUpWorkspaceScopeFormEffect = () => {
   const workspaceAuthProviders = useRecoilValue(workspaceAuthProvidersState);
 
+  const isRequestingCaptchaToken = useRecoilValue(
+    isRequestingCaptchaTokenState,
+  );
+
+  const [isInitialLoading, setIsInitialLoading] = useState(false);
+
   const { form } = useSignInUpForm();
 
   const { signInUpStep, continueWithEmail, continueWithCredentials } =
     useSignInUp(form);
 
-  const checkAuthProviders = useCallback(() => {
+  useEffect(() => {
+    if (!isRequestingCaptchaToken) {
+      setIsInitialLoading(true);
+    }
+  }, [isRequestingCaptchaToken]);
+
+  useEffect(() => {
     if (
       signInUpStep === SignInUpStep.Init &&
       !workspaceAuthProviders.google &&
       !workspaceAuthProviders.microsoft &&
       !workspaceAuthProviders.sso
     ) {
-      return continueWithEmail();
+      continueWithEmail();
+      return;
     }
 
-    if (isDefined(email) && workspaceAuthProviders.password) {
+    if (
-      return continueWithCredentials();
+      isDefined(email) &&
+      workspaceAuthProviders.password &&
+      isInitialLoading
+    ) {
+      continueWithCredentials();
     }
   }, [
     signInUpStep,
@@ -38,11 +56,8 @@ export const SignInUpWorkspaceScopeFormEffect = () => {
     workspaceAuthProviders.password,
     continueWithEmail,
     continueWithCredentials,
+    isInitialLoading,
   ]);
 
-  useEffect(() => {
-    checkAuthProviders();
-  }, [checkAuthProviders]);
-
   return <></>;
 };

packages/twenty-front/src/modules/settings/security/components/SettingsSSOIdentitiesProvidersListCard.tsx

@@ -37,6 +37,7 @@ export const SettingsSSOIdentitiesProvidersListCard = () => {
   );
 
   const { loading } = useListSsoIdentityProvidersByWorkspaceIdQuery({
+    fetchPolicy: 'network-only',
     skip: currentWorkspace?.hasValidEntrepriseKey === false,
     onCompleted: (data) => {
       setSSOIdentitiesProviders(