Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-02-17 22:04:19 -05:00
Code Issues Activity

refactor(console): keep sign-in method verification code check state (#3039)

Browse source
This commit is contained in:
Xiao Yijun 2023-02-05 10:15:24 +08:00 • committed by GitHub
parent 8683312664
commit 17707bc642
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
4 changed files with 58 additions and 46 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

32
packages/console/src/pages/SignInExperience/tabs/SignUpAndSignIn/SignUpForm.tsx
View file

@ -19,9 +19,10 @@ import {
import * as styles from '../index.module.scss';
import ConnectorSetupWarning from './components/ConnectorSetupWarning';
import {
createSignInMethod,
getSignInMethodPasswordCheckState,
getSignInMethodVerificationCodeCheckState,
} from './components/SignInMethodEditBox/utilities';
} from './utilities';
const SignUpForm = () => {
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
@ -35,12 +36,14 @@ const SignUpForm = () => {
} = useFormContext<SignInExperienceForm>();
const { isConnectorTypeEnabled } = useEnabledConnectorTypes();
const { identifier: signUpIdentifier } = watch('signUp') ?? {};
const signUp = watch('signUp');
if (!signUpIdentifier) {
if (!signUp) {
return null;
}
const { identifier: signUpIdentifier } = signUp;
const isUsernamePasswordSignUp = signUpIdentifier === SignUpIdentifier.Username;
const postSignUpIdentifierChange = (signUpIdentifier: SignUpIdentifier) => {
@ -64,9 +67,8 @@ const SignUpForm = () => {
};
const refreshSignInMethods = () => {
const signUpIdentifier = getValues('signUp.identifier');
const signInMethods = getValues('signIn.methods');
const isSignUpPasswordRequired = getValues('signUp.password');
const { identifier: signUpIdentifier } = signUp;
// Note: append required sign-in methods according to the sign-up identifier config
const requiredSignInIdentifiers = signUpIdentifiersMapping[signUpIdentifier];
@ -75,31 +77,23 @@ const SignUpForm = () => {
return methods;
}
return [
...methods,
{
identifier: requiredIdentifier,
password: getSignInMethodPasswordCheckState(requiredIdentifier, isSignUpPasswordRequired),
verificationCode: getSignInMethodVerificationCodeCheckState(requiredIdentifier),
isPasswordPrimary: true,
},
];
return [...methods, createSignInMethod(requiredIdentifier)];
}, signInMethods);
setValue(
'signIn.methods',
// Note: refresh sign-in authentications according to the sign-up authentications config
allSignInMethods.map((method) => {
const { identifier, password } = method;
const { identifier, password, verificationCode } = method;
return {
...method,
password: getSignInMethodPasswordCheckState(
password: getSignInMethodPasswordCheckState(identifier, signUp, password),
verificationCode: getSignInMethodVerificationCodeCheckState(
identifier,
isSignUpPasswordRequired,
password
signUp,
verificationCode
),
verificationCode: getSignInMethodVerificationCodeCheckState(identifier),
};
})
);

12
packages/console/src/pages/SignInExperience/tabs/SignUpAndSignIn/components/SignInMethodEditBox/index.tsx
View file

@ -13,13 +13,10 @@ import {
import type { SignInExperienceForm } from '@/pages/SignInExperience/types';
import { getSignUpRequiredConnectorTypes } from '@/pages/SignInExperience/utils/identifier';
import { createSignInMethod } from '../../utilities';
import AddButton from './AddButton';
import SignInMethodItem from './SignInMethodItem';
import * as styles from './index.module.scss';
import {
getSignInMethodPasswordCheckState,
getSignInMethodVerificationCodeCheckState,
} from './utilities';
const SignInMethodEditBox = () => {
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
@ -142,12 +139,7 @@ const SignInMethodEditBox = () => {
options={signInIdentifierOptions}
hasSelectedIdentifiers={fields.length > 0}
onSelected={(identifier) => {
append({
identifier,
password: getSignInMethodPasswordCheckState(identifier, isSignUpPasswordRequired),
verificationCode: getSignInMethodVerificationCodeCheckState(identifier),
isPasswordPrimary: true,
});
append(createSignInMethod(identifier));
revalidate();
}}
/>

17
packages/console/src/pages/SignInExperience/tabs/SignUpAndSignIn/components/SignInMethodEditBox/utilities.ts
View file

@ -1,17 +0,0 @@
import { SignInIdentifier } from '@logto/schemas';
export const getSignInMethodPasswordCheckState = (
signInIdentifier: SignInIdentifier,
isSignUpPasswordRequired: boolean,
defaultCheckState = true
) => {
if (signInIdentifier === SignInIdentifier.Username) {
return true;
}
return isSignUpPasswordRequired || defaultCheckState;
};
export const getSignInMethodVerificationCodeCheckState = (signInIdentifier: SignInIdentifier) => {
return signInIdentifier !== SignInIdentifier.Username;
};

43
packages/console/src/pages/SignInExperience/tabs/SignUpAndSignIn/utilities.ts Normal file
View file

@ -0,0 +1,43 @@
import { SignInIdentifier } from '@logto/schemas';
import type { SignUpForm } from '@/pages/SignInExperience/types';
import { SignUpIdentifier } from '@/pages/SignInExperience/types';
export const getSignInMethodPasswordCheckState = (
signInIdentifier: SignInIdentifier,
signUpConfig: SignUpForm,
currentCheckState: boolean
) => {
if (signInIdentifier === SignInIdentifier.Username) {
return currentCheckState;
}
const { password: isSignUpPasswordRequired } = signUpConfig;
return isSignUpPasswordRequired || currentCheckState;
};
export const getSignInMethodVerificationCodeCheckState = (
signInIdentifier: SignInIdentifier,
signUpConfig: SignUpForm,
currentCheckState: boolean
) => {
if (signInIdentifier === SignInIdentifier.Username) {
return currentCheckState;
}
const { identifier: signUpIdentifier, password: isSignUpPasswordRequired } = signUpConfig;
if (SignUpIdentifier.None !== signUpIdentifier && !isSignUpPasswordRequired) {
return true;
}
return currentCheckState;
};
export const createSignInMethod = (identifier: SignInIdentifier) => ({
identifier,
password: true,
verificationCode: identifier !== SignInIdentifier.Username,
isPasswordPrimary: true,
});