Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-03-31 22:51:25 -05:00
Code Issues Activity

refactor(experience): clear invalid totp code input (#4745)

Browse source
This commit is contained in:
Xiao Yijun 2023-10-25 13:59:29 +08:00 • committed by GitHub
parent c1d7df329a
commit 1c8ef14167
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 6 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

8
packages/experience/src/containers/TotpCodeVerification/index.tsx
View file

@ -1,4 +1,4 @@
import { useState } from 'react';
import { useCallback, useState } from 'react';
import VerificationCodeInput from '@/components/VerificationCode';
import { type UserMfaFlow } from '@/types';
@ -14,7 +14,11 @@ type Props = {
const TotpCodeVerification = ({ flow }: Props) => {
const [code, setCode] = useState<string[]>([]);
const { errorMessage, onSubmit } = useTotpCodeVerification(flow);
const errorCallback = useCallback(() => {
setCode([]);
}, []);
const { errorMessage, onSubmit } = useTotpCodeVerification(flow, errorCallback);
return (
<VerificationCodeInput

7
packages/experience/src/containers/TotpCodeVerification/use-totp-code-verification.ts
View file

@ -5,7 +5,7 @@ import { type ErrorHandlers } from '@/hooks/use-error-handler';
import useSendMfaPayload from '@/hooks/use-send-mfa-payload';
import { type UserMfaFlow } from '@/types';
const useTotpCodeVerification = (flow: UserMfaFlow) => {
const useTotpCodeVerification = (flow: UserMfaFlow, errorCallback?: () => void) => {
const [errorMessage, setErrorMessage] = useState<string>();
const sendMfaPayload = useSendMfaPayload();
@ -22,10 +22,11 @@ const useTotpCodeVerification = (flow: UserMfaFlow) => {
(code: string) => {
void sendMfaPayload(
{ flow, payload: { type: MfaFactor.TOTP, code } },
invalidCodeErrorHandlers
invalidCodeErrorHandlers,
errorCallback
);
},
[flow, invalidCodeErrorHandlers, sendMfaPayload]
[errorCallback, flow, invalidCodeErrorHandlers, sendMfaPayload]
);
return {

7
packages/experience/src/hooks/use-send-mfa-payload.ts
View file

@ -31,7 +31,11 @@ const useSendMfaPayload = () => {
const handleError = useErrorHandler();
return useCallback(
async (apiOptions: SendMfaPayloadApiOptions, errorHandlers?: ErrorHandlers) => {
async (
apiOptions: SendMfaPayloadApiOptions,
errorHandlers?: ErrorHandlers,
errorCallback?: () => void
) => {
const [error, result] = await asyncSendMfaPayload(apiOptions);
if (error) {
@ -39,6 +43,7 @@ const useSendMfaPayload = () => {
...errorHandlers,
...preSignInErrorHandler,
});
errorCallback?.();
return;
}