mirror of
https://github.com/logto-io/logto.git
synced 2025-02-24 22:05:56 -05:00
fix(console): correct sign-in method item state (#2298)
This commit is contained in:
parent
bf6bd75e0f
commit
a4d8d31e98
3 changed files with 21 additions and 35 deletions
|
@ -14,8 +14,8 @@ import type { SignInMethod } from './types';
|
|||
|
||||
type Props = {
|
||||
signInMethod: SignInMethod;
|
||||
isPasswordDisabled: boolean;
|
||||
isVerificationDisabled: boolean;
|
||||
isPasswordCheckable: boolean;
|
||||
isVerificationCodeCheckable: boolean;
|
||||
isDeletable: boolean;
|
||||
onVerificationStateChange: (
|
||||
identifier: SignInIdentifier,
|
||||
|
@ -28,8 +28,8 @@ type Props = {
|
|||
|
||||
const SignInMethodItem = ({
|
||||
signInMethod: { identifier, password, verificationCode, isPasswordPrimary },
|
||||
isPasswordDisabled,
|
||||
isVerificationDisabled,
|
||||
isPasswordCheckable,
|
||||
isVerificationCodeCheckable,
|
||||
isDeletable,
|
||||
onVerificationStateChange,
|
||||
onToggleVerificationPrimary,
|
||||
|
@ -55,7 +55,7 @@ const SignInMethodItem = ({
|
|||
<Checkbox
|
||||
label={t('sign_in_exp.sign_up_and_sign_in.sign_in.password_auth')}
|
||||
value={password}
|
||||
disabled={isPasswordDisabled}
|
||||
disabled={!isPasswordCheckable}
|
||||
onChange={(checked) => {
|
||||
onVerificationStateChange(identifier, 'password', checked);
|
||||
}}
|
||||
|
@ -73,7 +73,7 @@ const SignInMethodItem = ({
|
|||
<Checkbox
|
||||
label={t('sign_in_exp.sign_up_and_sign_in.sign_in.verification_code_auth')}
|
||||
value={verificationCode}
|
||||
disabled={isVerificationDisabled}
|
||||
disabled={!isVerificationCodeCheckable}
|
||||
onChange={(checked) => {
|
||||
onVerificationStateChange(identifier, 'verificationCode', checked);
|
||||
}}
|
||||
|
@ -83,7 +83,7 @@ const SignInMethodItem = ({
|
|||
</div>
|
||||
</div>
|
||||
<IconButton
|
||||
disabled={isDeletable}
|
||||
disabled={!isDeletable}
|
||||
onClick={() => {
|
||||
onDelete(identifier);
|
||||
}}
|
||||
|
|
|
@ -55,15 +55,12 @@ const SignInMethodEditBox = ({
|
|||
computeOnSignInMethodAppended(value, {
|
||||
identifier,
|
||||
password: getSignInMethodPasswordCheckState(identifier, isSignUpPasswordRequired),
|
||||
verificationCode: getSignInMethodVerificationCodeCheckState(
|
||||
identifier,
|
||||
isSignUpVerificationRequired
|
||||
),
|
||||
verificationCode: getSignInMethodVerificationCodeCheckState(identifier),
|
||||
isPasswordPrimary: true,
|
||||
})
|
||||
);
|
||||
},
|
||||
[handleChange, value, isSignUpPasswordRequired, isSignUpVerificationRequired]
|
||||
[handleChange, value, isSignUpPasswordRequired]
|
||||
);
|
||||
|
||||
useEffect(() => {
|
||||
|
@ -72,10 +69,7 @@ const SignInMethodEditBox = ({
|
|||
computeOnSignInMethodAppended(previous, {
|
||||
identifier: current,
|
||||
password: getSignInMethodPasswordCheckState(current, isSignUpPasswordRequired),
|
||||
verificationCode: getSignInMethodVerificationCodeCheckState(
|
||||
current,
|
||||
isSignUpVerificationRequired
|
||||
),
|
||||
verificationCode: getSignInMethodVerificationCodeCheckState(current),
|
||||
isPasswordPrimary: true,
|
||||
}),
|
||||
signInMethods.current
|
||||
|
@ -89,11 +83,7 @@ const SignInMethodEditBox = ({
|
|||
isSignUpPasswordRequired,
|
||||
method.password
|
||||
),
|
||||
verificationCode: getSignInMethodVerificationCodeCheckState(
|
||||
method.identifier,
|
||||
isSignUpVerificationRequired,
|
||||
method.verificationCode
|
||||
),
|
||||
verificationCode: getSignInMethodVerificationCodeCheckState(method.identifier),
|
||||
}))
|
||||
);
|
||||
}, [
|
||||
|
@ -138,11 +128,15 @@ const SignInMethodEditBox = ({
|
|||
>
|
||||
<SignInMethodItem
|
||||
signInMethod={signInMethod}
|
||||
isPasswordDisabled={
|
||||
signInMethod.identifier === SignInIdentifier.Username || isSignUpPasswordRequired
|
||||
isPasswordCheckable={
|
||||
signInMethod.identifier !== SignInIdentifier.Username && !isSignUpPasswordRequired
|
||||
}
|
||||
isVerificationDisabled={isSignUpVerificationRequired && !isSignUpPasswordRequired}
|
||||
isDeletable={requiredSignInIdentifiers.includes(signInMethod.identifier)}
|
||||
isVerificationCodeCheckable={
|
||||
(isSignUpPasswordRequired && isSignUpVerificationRequired) ||
|
||||
// Note: the next line is used to handle the case when the sign-up identifier is `Username`
|
||||
(isSignUpPasswordRequired && signInMethod.identifier !== SignInIdentifier.Username)
|
||||
}
|
||||
isDeletable={!requiredSignInIdentifiers.includes(signInMethod.identifier)}
|
||||
onVerificationStateChange={(identifier, verification, checked) => {
|
||||
handleChange(
|
||||
computeOnVerificationStateChanged(value, identifier, verification, checked)
|
||||
|
|
|
@ -55,14 +55,6 @@ export const getSignInMethodPasswordCheckState = (
|
|||
return isSignUpPasswordRequired || originCheckState;
|
||||
};
|
||||
|
||||
export const getSignInMethodVerificationCodeCheckState = (
|
||||
signInIdentifier: SignInIdentifier,
|
||||
isSignUpVerificationRequired: boolean,
|
||||
originCheckState = false
|
||||
) => {
|
||||
if (signInIdentifier === SignInIdentifier.Username) {
|
||||
return false;
|
||||
}
|
||||
|
||||
return isSignUpVerificationRequired || originCheckState;
|
||||
export const getSignInMethodVerificationCodeCheckState = (signInIdentifier: SignInIdentifier) => {
|
||||
return signInIdentifier !== SignInIdentifier.Username;
|
||||
};
|
||||
|
|
Loading…
Add table
Reference in a new issue