Skip to content

Commit ac61742

Browse files
fix login flow issues in enterprise mode
1 parent f9f6a70 commit ac61742

File tree

3 files changed

+91
-48
lines changed

3 files changed

+91
-48
lines changed

client/packages/lowcoder/src/pages/userAuth/formLoginSteps.tsx

+2-2
Original file line numberDiff line numberDiff line change
@@ -204,7 +204,7 @@ export default function FormLoginSteps(props: FormLoginProps) {
204204
}
205205
if (resp.data.length === 1) {
206206
// in Enterprise mode, we will get org data in different format
207-
const selectedOrgId = isEnterpriseMode ? resp.data[0].id : resp.data[0].orgId;
207+
const selectedOrgId = resp.data[0]?.id || resp.data[0]?.orgId;
208208
setOrganizationId(selectedOrgId);
209209
dispatch(fetchConfigAction(selectedOrgId));
210210
setCurrentStep(CurrentStepEnum.AUTH_PROVIDERS);
@@ -239,7 +239,7 @@ export default function FormLoginSteps(props: FormLoginProps) {
239239
invitedOrganizationId={organizationId}
240240
authGoal="login"
241241
/>
242-
{signupEnabled && (
242+
{(isFormLoginEnabled && signupEnabled) && (
243243
<>
244244
<Divider/>
245245
<AuthBottomView>

client/packages/lowcoder/src/pages/userAuth/register.tsx

+78-41
Original file line numberDiff line numberDiff line change
@@ -26,8 +26,10 @@ import { validateResponse } from "@lowcoder-ee/api/apiUtils";
2626
import history from "util/history";
2727
import LoadingOutlined from "@ant-design/icons/LoadingOutlined";
2828
import Spin from "antd/es/spin";
29-
import { useSelector } from "react-redux";
29+
import { useDispatch, useSelector } from "react-redux";
3030
import { getServerSettings } from "@lowcoder-ee/redux/selectors/applicationSelector";
31+
import { fetchConfigAction } from "@lowcoder-ee/redux/reduxActions/configActions";
32+
import { fetchOrgPaginationByEmail } from "@lowcoder-ee/util/pagination/axios";
3133

3234
const StyledFormInput = styled(FormInput)`
3335
margin-bottom: 16px;
@@ -45,6 +47,7 @@ const RegisterContent = styled(FormWrapperMobile)`
4547

4648
function UserRegister() {
4749
const location = useLocation();
50+
const dispatch = useDispatch();
4851
const [submitBtnDisable, setSubmitBtnDisable] = useState(false);
4952
const [account, setAccount] = useState(() => {
5053
const { email } = (location.state || {}) as any;
@@ -53,26 +56,52 @@ function UserRegister() {
5356
const [password, setPassword] = useState("");
5457
const [orgLoading, setOrgLoading] = useState(false);
5558
const [lastEmailChecked, setLastEmailChecked] = useState("");
59+
const [signupEnabled, setSignupEnabled] = useState<boolean>(true);
60+
const [signinEnabled, setSigninEnabled] = useState<boolean>(true);
5661
const redirectUrl = useRedirectUrl();
62+
const serverSettings = useSelector(getServerSettings);
5763
const { systemConfig, inviteInfo, fetchUserAfterAuthSuccess } = useContext(AuthContext);
5864
const invitationId = inviteInfo?.invitationId;
59-
65+
const isFormLoginEnabled = systemConfig?.form.enableLogin;
66+
const authId = systemConfig?.form.id;
6067
const orgId = useParams<any>().orgId;
68+
6169
const organizationId = useMemo(() => {
6270
if(inviteInfo?.invitedOrganizationId) {
6371
return inviteInfo?.invitedOrganizationId;
6472
}
6573
return orgId;
6674
}, [ inviteInfo, orgId ]);
6775

68-
const authId = systemConfig?.form.id;
69-
70-
const serverSettings = useSelector(getServerSettings);
76+
const isEmailLoginEnabled = useMemo(() => {
77+
return isFormLoginEnabled && signinEnabled;
78+
}, [isFormLoginEnabled, signinEnabled]);
7179

7280
const isEnterpriseMode = useMemo(() => {
7381
return serverSettings?.LOWCODER_WORKSPACE_MODE === "ENTERPRISE" || serverSettings?.LOWCODER_WORKSPACE_MODE === "SINGLEWORKSPACE";
7482
}, [serverSettings]);
7583

84+
useEffect(() => {
85+
if (isEnterpriseMode) {
86+
// dispatch(fetchConfigAction());
87+
fetchOrgPaginationByEmail({
88+
email: ' ',
89+
pageNum: 1,
90+
pageSize: 10,
91+
})
92+
.then((resp) => {
93+
if (resp.success) {
94+
const orgList = resp.data || [];
95+
if (orgList.length) {
96+
// in Enterprise mode, we will get org data in different format
97+
const selectedOrgId = orgList[0]?.id || orgList[0]?.orgId;
98+
dispatch(fetchConfigAction(selectedOrgId));
99+
}
100+
}
101+
})
102+
}
103+
}, [isEnterpriseMode]);
104+
76105
useEffect(() => {
77106
const { LOWCODER_EMAIL_SIGNUP_ENABLED } = serverSettings;
78107
if(
@@ -143,34 +172,38 @@ function UserRegister() {
143172
type="large"
144173
>
145174
<RegisterContent>
146-
<StyledFormInput
147-
className="form-input"
148-
label={trans("userAuth.email")}
149-
defaultValue={account}
150-
onChange={(value, valid) => setAccount(valid ? value : "")}
151-
onBlur={checkEmailExist}
152-
placeholder={trans("userAuth.inputEmail")}
153-
checkRule={{
154-
check: checkEmailValid,
155-
errorMsg: trans("userAuth.inputValidEmail"),
156-
}}
157-
/>
158-
<StyledPasswordInput
159-
className="form-input"
160-
passInputConf={{label:trans("password.label"), placeholder: trans("password.placeholder")}}
161-
confirmPassConf={{label:trans("password.conformLabel"), placeholder: trans("password.conformPlaceholder")}}
162-
valueCheck={checkPassWithMsg}
163-
onChange={(value, valid) => setPassword(valid ? value : "")}
164-
doubleCheck
165-
/>
166-
<ConfirmButton
167-
disabled={!account || !password || submitBtnDisable}
168-
onClick={onSubmit}
169-
loading={loading}
170-
>
171-
{trans("userAuth.register")}
172-
</ConfirmButton>
173-
<TermsAndPrivacyInfo onCheckChange={(e) => setSubmitBtnDisable(!e.target.checked)} />
175+
{ isFormLoginEnabled && (
176+
<>
177+
<StyledFormInput
178+
className="form-input"
179+
label={trans("userAuth.email")}
180+
defaultValue={account}
181+
onChange={(value, valid) => setAccount(valid ? value : "")}
182+
onBlur={checkEmailExist}
183+
placeholder={trans("userAuth.inputEmail")}
184+
checkRule={{
185+
check: checkEmailValid,
186+
errorMsg: trans("userAuth.inputValidEmail"),
187+
}}
188+
/>
189+
<StyledPasswordInput
190+
className="form-input"
191+
passInputConf={{label:trans("password.label"), placeholder: trans("password.placeholder")}}
192+
confirmPassConf={{label:trans("password.conformLabel"), placeholder: trans("password.conformPlaceholder")}}
193+
valueCheck={checkPassWithMsg}
194+
onChange={(value, valid) => setPassword(valid ? value : "")}
195+
doubleCheck
196+
/>
197+
<ConfirmButton
198+
disabled={!account || !password || submitBtnDisable}
199+
onClick={onSubmit}
200+
loading={loading}
201+
>
202+
{trans("userAuth.register")}
203+
</ConfirmButton>
204+
<TermsAndPrivacyInfo onCheckChange={(e) => setSubmitBtnDisable(!e.target.checked)} />
205+
</>
206+
)}
174207
{(organizationId || isEnterpriseMode) && (
175208
<ThirdPartyAuth
176209
invitationId={invitationId}
@@ -179,14 +212,18 @@ function UserRegister() {
179212
/>
180213
)}
181214
</RegisterContent>
182-
<Divider/>
183-
<StyledRouteLinkLogin to={{
184-
pathname: orgId
185-
? ORG_AUTH_LOGIN_URL.replace(':orgId', orgId)
186-
: AUTH_LOGIN_URL,
187-
state: location.state
188-
}}>{trans("userAuth.userLogin")}
189-
</StyledRouteLinkLogin>
215+
{isFormLoginEnabled && (
216+
<>
217+
<Divider/>
218+
<StyledRouteLinkLogin to={{
219+
pathname: orgId
220+
? ORG_AUTH_LOGIN_URL.replace(':orgId', orgId)
221+
: AUTH_LOGIN_URL,
222+
state: location.state
223+
}}>{trans("userAuth.userLogin")}
224+
</StyledRouteLinkLogin>
225+
</>
226+
)}
190227
</AuthContainer>
191228
</Spin>
192229
);

client/packages/lowcoder/src/pages/userAuth/thirdParty/thirdPartyAuth.tsx

+11-5
Original file line numberDiff line numberDiff line change
@@ -5,10 +5,10 @@ import {
55
} from "constants/authConstants";
66
import { WhiteLoading } from "lowcoder-design";
77
import history from "util/history";
8-
import { LoginLogoStyle, LoginLabelStyle, StyledLoginButton } from "pages/userAuth/authComponents";
8+
import { LoginLogoStyle, LoginLabelStyle, StyledLoginButton, TermsAndPrivacyInfo } from "pages/userAuth/authComponents";
99
import { useSelector } from "react-redux";
1010
import { getSystemConfigFetching, selectSystemConfig } from "redux/selectors/configSelectors";
11-
import React, { useMemo } from "react";
11+
import React, { useMemo, useState } from "react";
1212
import { messageInstance } from "lowcoder-design/src/components/GlobalInstances";
1313
import styled from "styled-components";
1414
import { trans } from "i18n";
@@ -40,6 +40,7 @@ function ThirdPartyLoginButton(props: {
4040
autoJump?: boolean;
4141
authGoal: ThirdPartyAuthGoal;
4242
label: string;
43+
disabled?: boolean;
4344
}) {
4445
const { config, label } = props;
4546
const loginRedirectUrl = useRedirectUrl();
@@ -93,7 +94,7 @@ function ThirdPartyLoginButton(props: {
9394
: `Sign in with ${label}`;
9495

9596
return (
96-
<StyledLoginButton buttonType="normal" onClick={onLoginClick}>
97+
<StyledLoginButton buttonType="normal" onClick={onLoginClick} disabled={props.disabled}>
9798
{config.icon && <MultiIconDisplay identifier={config.icon} width="20px" height="20px" style={{ marginRight: "20px", flexShrink: 0, color: "#000" }} />}
9899
{!config.icon && <LoginLogoStyle alt={config.name} src={config.logo} title={config.name} />}
99100
<LoginLabelStyle className="auth-label">
@@ -114,6 +115,7 @@ export function ThirdPartyAuth(props: {
114115
const systemConfig = useSelector(selectSystemConfig);
115116
const serverSettings = useSelector(getServerSettings);
116117
const isFormLoginEnabled = systemConfig?.form.enableLogin;
118+
const [disableButtons, setDisableButtons] = useState(false);
117119

118120
const isEmailLoginEnabled = useMemo(() => {
119121
return isFormLoginEnabled && serverSettings.LOWCODER_EMAIL_AUTH_ENABLED === 'true';
@@ -145,20 +147,24 @@ export function ThirdPartyAuth(props: {
145147
invitationId={props.invitationId}
146148
invitedOrganizationId={props.invitedOrganizationId}
147149
label={props.labelFormatter ? props.labelFormatter(config.name) : config.name}
150+
disabled={disableButtons}
148151
/>
149152
);
150153
});
151154
return (
152155
<ThirdPartyLoginButtonWrapper>
153156
{ (
154-
(isEmailLoginEnabled && props.authGoal === 'login')
155-
|| (isEmailSignupEnabled && props.authGoal === 'register')
157+
(isFormLoginEnabled && props.authGoal === 'login')
158+
|| (isFormLoginEnabled && isEmailSignupEnabled && props.authGoal === 'register')
156159
) && Boolean(socialLoginButtons.length) && (
157160
<Divider plain>
158161
<Text type="secondary">or</Text>
159162
</Divider>
160163
)}
161164
{socialLoginButtons}
165+
{!isFormLoginEnabled && (
166+
<TermsAndPrivacyInfo onCheckChange={(e) => setDisableButtons(!e.target.checked)} />
167+
)}
162168
</ThirdPartyLoginButtonWrapper>
163169
);
164170
}

0 commit comments

Comments
 (0)