fix login flow issues in enterprise mode

raheeliftikhar5 · raheeliftikhar5 · commit ac61742c2a65 · 2025-04-21T20:35:57.000+05:00
diff --git a/client/packages/lowcoder/src/pages/userAuth/formLoginSteps.tsx b/client/packages/lowcoder/src/pages/userAuth/formLoginSteps.tsx
@@ -204,7 +204,7 @@ export default function FormLoginSteps(props: FormLoginProps) {
           }
           if (resp.data.length === 1) {
             // in Enterprise mode, we will get org data in different format
-            const selectedOrgId = isEnterpriseMode ? resp.data[0].id : resp.data[0].orgId;
+            const selectedOrgId = resp.data[0]?.id || resp.data[0]?.orgId;
             setOrganizationId(selectedOrgId);
             dispatch(fetchConfigAction(selectedOrgId));
             setCurrentStep(CurrentStepEnum.AUTH_PROVIDERS);
@@ -239,7 +239,7 @@ export default function FormLoginSteps(props: FormLoginProps) {
           invitedOrganizationId={organizationId}
           authGoal="login"
         />
-        {signupEnabled && (
+        {(isFormLoginEnabled && signupEnabled) && (
           <>
             <Divider/>
             <AuthBottomView>
diff --git a/client/packages/lowcoder/src/pages/userAuth/register.tsx b/client/packages/lowcoder/src/pages/userAuth/register.tsx
@@ -26,8 +26,10 @@ import { validateResponse } from "@lowcoder-ee/api/apiUtils";
 import history from "util/history";
 import LoadingOutlined from "@ant-design/icons/LoadingOutlined";
 import Spin from "antd/es/spin";
-import { useSelector } from "react-redux";
+import { useDispatch, useSelector } from "react-redux";
 import { getServerSettings } from "@lowcoder-ee/redux/selectors/applicationSelector";
+import { fetchConfigAction } from "@lowcoder-ee/redux/reduxActions/configActions";
+import { fetchOrgPaginationByEmail } from "@lowcoder-ee/util/pagination/axios";
 
 const StyledFormInput = styled(FormInput)`
   margin-bottom: 16px;
@@ -45,6 +47,7 @@ const RegisterContent = styled(FormWrapperMobile)`
 
 function UserRegister() {
   const location = useLocation();
+  const dispatch = useDispatch();
   const [submitBtnDisable, setSubmitBtnDisable] = useState(false);
   const [account, setAccount] = useState(() => {
     const { email } = (location.state || {}) as any;
@@ -53,26 +56,52 @@ function UserRegister() {
   const [password, setPassword] = useState("");
   const [orgLoading, setOrgLoading] = useState(false);
   const [lastEmailChecked, setLastEmailChecked] = useState("");
+  const [signupEnabled, setSignupEnabled] = useState<boolean>(true);
+  const [signinEnabled, setSigninEnabled] = useState<boolean>(true);
   const redirectUrl = useRedirectUrl();
+  const serverSettings = useSelector(getServerSettings);
   const { systemConfig, inviteInfo, fetchUserAfterAuthSuccess } = useContext(AuthContext);
   const invitationId = inviteInfo?.invitationId;
-
+  const isFormLoginEnabled = systemConfig?.form.enableLogin;
+  const authId = systemConfig?.form.id;
   const orgId = useParams<any>().orgId;
+
   const organizationId = useMemo(() => {
     if(inviteInfo?.invitedOrganizationId) {
       return inviteInfo?.invitedOrganizationId;
     }
     return orgId;
   }, [ inviteInfo, orgId ]);
 
-  const authId = systemConfig?.form.id;
-
-  const serverSettings = useSelector(getServerSettings);
+  const isEmailLoginEnabled = useMemo(() => {
+    return isFormLoginEnabled && signinEnabled;
+  }, [isFormLoginEnabled, signinEnabled]);
 
   const isEnterpriseMode = useMemo(() => {
     return serverSettings?.LOWCODER_WORKSPACE_MODE === "ENTERPRISE" || serverSettings?.LOWCODER_WORKSPACE_MODE === "SINGLEWORKSPACE";
   }, [serverSettings]);
 
+  useEffect(() => {
+    if (isEnterpriseMode) {
+      // dispatch(fetchConfigAction());
+      fetchOrgPaginationByEmail({
+          email: ' ',
+          pageNum: 1,
+          pageSize: 10,
+        })
+        .then((resp) => {
+          if (resp.success) {
+            const orgList = resp.data || [];
+            if (orgList.length) {
+              // in Enterprise mode, we will get org data in different format
+              const selectedOrgId = orgList[0]?.id || orgList[0]?.orgId;
+              dispatch(fetchConfigAction(selectedOrgId));
+            }
+          }
+        })
+    }
+  }, [isEnterpriseMode]);
+
   useEffect(() => {
     const { LOWCODER_EMAIL_SIGNUP_ENABLED } = serverSettings;
     if(
@@ -143,34 +172,38 @@ function UserRegister() {
         type="large"
       >
         <RegisterContent>
-          <StyledFormInput
-            className="form-input"
-            label={trans("userAuth.email")}
-            defaultValue={account}
-            onChange={(value, valid) => setAccount(valid ? value : "")}
-            onBlur={checkEmailExist}
-            placeholder={trans("userAuth.inputEmail")}
-            checkRule={{
-              check: checkEmailValid,
-              errorMsg: trans("userAuth.inputValidEmail"),
-            }}
-          />
-          <StyledPasswordInput
-            className="form-input"
-            passInputConf={{label:trans("password.label"), placeholder: trans("password.placeholder")}}
-            confirmPassConf={{label:trans("password.conformLabel"), placeholder: trans("password.conformPlaceholder")}}
-            valueCheck={checkPassWithMsg}
-            onChange={(value, valid) => setPassword(valid ? value : "")}
-            doubleCheck
-          />
-          <ConfirmButton
-            disabled={!account || !password || submitBtnDisable}
-            onClick={onSubmit}
-            loading={loading}
-          >
-            {trans("userAuth.register")}
-          </ConfirmButton>
-          <TermsAndPrivacyInfo onCheckChange={(e) => setSubmitBtnDisable(!e.target.checked)} />
+          { isFormLoginEnabled && (
+            <>
+              <StyledFormInput
+                className="form-input"
+                label={trans("userAuth.email")}
+                defaultValue={account}
+                onChange={(value, valid) => setAccount(valid ? value : "")}
+                onBlur={checkEmailExist}
+                placeholder={trans("userAuth.inputEmail")}
+                checkRule={{
+                  check: checkEmailValid,
+                  errorMsg: trans("userAuth.inputValidEmail"),
+                }}
+              />
+              <StyledPasswordInput
+                className="form-input"
+                passInputConf={{label:trans("password.label"), placeholder: trans("password.placeholder")}}
+                confirmPassConf={{label:trans("password.conformLabel"), placeholder: trans("password.conformPlaceholder")}}
+                valueCheck={checkPassWithMsg}
+                onChange={(value, valid) => setPassword(valid ? value : "")}
+                doubleCheck
+              />
+              <ConfirmButton
+                disabled={!account || !password || submitBtnDisable}
+                onClick={onSubmit}
+                loading={loading}
+              >
+                {trans("userAuth.register")}
+              </ConfirmButton>
+              <TermsAndPrivacyInfo onCheckChange={(e) => setSubmitBtnDisable(!e.target.checked)} />
+            </>
+          )}
           {(organizationId || isEnterpriseMode) && (
             <ThirdPartyAuth
               invitationId={invitationId}
@@ -179,14 +212,18 @@ function UserRegister() {
             />
           )}
         </RegisterContent>
-        <Divider/>
-        <StyledRouteLinkLogin to={{
-          pathname: orgId
-            ? ORG_AUTH_LOGIN_URL.replace(':orgId', orgId)
-            : AUTH_LOGIN_URL,
-          state: location.state
-        }}>{trans("userAuth.userLogin")}
-        </StyledRouteLinkLogin>
+        {isFormLoginEnabled && (
+          <>
+            <Divider/>
+            <StyledRouteLinkLogin to={{
+              pathname: orgId
+                ? ORG_AUTH_LOGIN_URL.replace(':orgId', orgId)
+                : AUTH_LOGIN_URL,
+              state: location.state
+            }}>{trans("userAuth.userLogin")}
+            </StyledRouteLinkLogin>
+          </>
+        )}
       </AuthContainer>
     </Spin>
   );
diff --git a/client/packages/lowcoder/src/pages/userAuth/thirdParty/thirdPartyAuth.tsx b/client/packages/lowcoder/src/pages/userAuth/thirdParty/thirdPartyAuth.tsx
@@ -5,10 +5,10 @@ import {
 } from "constants/authConstants";
 import { WhiteLoading } from "lowcoder-design";
 import history from "util/history";
-import { LoginLogoStyle, LoginLabelStyle, StyledLoginButton } from "pages/userAuth/authComponents";
+import { LoginLogoStyle, LoginLabelStyle, StyledLoginButton, TermsAndPrivacyInfo } from "pages/userAuth/authComponents";
 import { useSelector } from "react-redux";
 import { getSystemConfigFetching, selectSystemConfig } from "redux/selectors/configSelectors";
-import React, { useMemo } from "react";
+import React, { useMemo, useState } from "react";
 import { messageInstance } from "lowcoder-design/src/components/GlobalInstances";
 import styled from "styled-components";
 import { trans } from "i18n";
@@ -40,6 +40,7 @@ function ThirdPartyLoginButton(props: {
   autoJump?: boolean;
   authGoal: ThirdPartyAuthGoal;
   label: string;
+  disabled?: boolean;
 }) {
   const { config, label } = props;
   const loginRedirectUrl = useRedirectUrl();
@@ -93,7 +94,7 @@ function ThirdPartyLoginButton(props: {
     : `Sign in with ${label}`;
 
   return (
-    <StyledLoginButton buttonType="normal" onClick={onLoginClick}>
+    <StyledLoginButton buttonType="normal" onClick={onLoginClick} disabled={props.disabled}>
       {config.icon && <MultiIconDisplay identifier={config.icon} width="20px" height="20px" style={{ marginRight: "20px", flexShrink: 0, color: "#000" }} />}
       {!config.icon && <LoginLogoStyle alt={config.name} src={config.logo} title={config.name} />}
       <LoginLabelStyle className="auth-label">
@@ -114,6 +115,7 @@ export function ThirdPartyAuth(props: {
   const systemConfig = useSelector(selectSystemConfig);
   const serverSettings = useSelector(getServerSettings);
   const isFormLoginEnabled = systemConfig?.form.enableLogin;
+  const [disableButtons, setDisableButtons] = useState(false);
 
   const isEmailLoginEnabled = useMemo(() => {
     return isFormLoginEnabled && serverSettings.LOWCODER_EMAIL_AUTH_ENABLED === 'true';
@@ -145,20 +147,24 @@ export function ThirdPartyAuth(props: {
         invitationId={props.invitationId}
         invitedOrganizationId={props.invitedOrganizationId}
         label={props.labelFormatter ? props.labelFormatter(config.name) : config.name}
+        disabled={disableButtons}
       />
     );
   });
   return (
     <ThirdPartyLoginButtonWrapper>
       { (
-        (isEmailLoginEnabled && props.authGoal === 'login')
-        || (isEmailSignupEnabled && props.authGoal === 'register')
+        (isFormLoginEnabled && props.authGoal === 'login')
+        || (isFormLoginEnabled && isEmailSignupEnabled && props.authGoal === 'register')
       ) && Boolean(socialLoginButtons.length) && (
         <Divider plain>
           <Text type="secondary">or</Text>
         </Divider>
       )}
       {socialLoginButtons}
+      {!isFormLoginEnabled && (
+        <TermsAndPrivacyInfo onCheckChange={(e) => setDisableButtons(!e.target.checked)} />
+      )}
     </ThirdPartyLoginButtonWrapper>
   );
 }
