Merge branch 'dev' into staging

This commit is contained in:
Maxime Lalo 2023-12-01 14:59:22 +01:00
commit f7a2f809b5
3 changed files with 48 additions and 37 deletions

View File

@ -8,6 +8,7 @@ export type IMailVerifyParams = {
export type IMailVerifyReturn = { export type IMailVerifyReturn = {
partialPhoneNumber: string; partialPhoneNumber: string;
totpCodeUid: string;
}; };
export type IVerifyTotpCodeParams = { export type IVerifyTotpCodeParams = {
@ -36,6 +37,16 @@ export type IAskNewPasswordParams = {
email: string; email: string;
}; };
export type IAskAnotherCodeParams = {
email: string;
totpCodeUid: string;
};
export type IAskAnotherCodeReturn = {
partialPhoneNumber: string;
totpCodeUid: string;
};
export default class Auth extends BaseApiService { export default class Auth extends BaseApiService {
private static instance: Auth; private static instance: Auth;
protected readonly namespaceUrl = this.getBaseUrl().concat("/customer"); protected readonly namespaceUrl = this.getBaseUrl().concat("/customer");
@ -95,10 +106,10 @@ export default class Auth extends BaseApiService {
} }
} }
public async sendAnotherCode(body: IMailVerifyParams): Promise<IMailVerifyReturn> { public async sendAnotherCode(body: IAskAnotherCodeParams): Promise<IAskAnotherCodeReturn> {
const url = new URL(this.baseURl.concat("/send-another-code")); const url = new URL(this.baseURl.concat("/send-another-code"));
try { try {
return this.postRequest<IMailVerifyReturn>(url, body); return this.postRequest<IAskAnotherCodeReturn>(url, body);
} catch (err) { } catch (err) {
this.onError(err); this.onError(err);
return Promise.reject(err); return Promise.reject(err);

View File

@ -21,9 +21,10 @@ export default function StepTotp(props: IProps) {
const interval = setInterval(() => { const interval = setInterval(() => {
if (secondsBeforeNewCode > 0) { if (secondsBeforeNewCode > 0) {
setSecondsBeforeNewCode(secondsBeforeNewCode - 1); setSecondsBeforeNewCode(secondsBeforeNewCode - 1);
} else { if (secondsBeforeNewCode === 1) {
setDisableNewCodeButton(false); setDisableNewCodeButton(false);
} }
}
}, 1000); }, 1000);
return () => clearInterval(interval); return () => clearInterval(interval);
}, [secondsBeforeNewCode]); }, [secondsBeforeNewCode]);
@ -61,12 +62,14 @@ export default function StepTotp(props: IProps) {
className={classes["new-code-button"]}> className={classes["new-code-button"]}>
Envoyer un nouveau code Envoyer un nouveau code
</Button> </Button>
{secondsBeforeNewCode !== 0 && (
<Typography typo={ITypo.P_SB_16} className={classes["new-code-timer"]}> <Typography typo={ITypo.P_SB_16} className={classes["new-code-timer"]}>
Redemandez un code dans Redemandez un code dans
<Typography typo={ITypo.P_16} color={ITypoColor.PINK_FLASH}> <Typography typo={ITypo.P_16} color={ITypoColor.PINK_FLASH}>
00:{secondsBeforeNewCode < 10 ? `0${secondsBeforeNewCode}` : secondsBeforeNewCode} 00:{secondsBeforeNewCode < 10 ? `0${secondsBeforeNewCode}` : secondsBeforeNewCode}
</Typography> </Typography>
</Typography> </Typography>
)}
</div> </div>
</div> </div>
); );

View File

@ -31,6 +31,7 @@ export default function Login() {
const [isErrorModalOpen, setIsErrorModalOpen] = useState(false); const [isErrorModalOpen, setIsErrorModalOpen] = useState(false);
const [step, setStep] = useState<LoginStep>(LoginStep.EMAIL); const [step, setStep] = useState<LoginStep>(LoginStep.EMAIL);
const [totpCodeUid, setTotpCodeUid] = useState<string>("");
const [totpCode, setTotpCode] = useState<string>(""); const [totpCode, setTotpCode] = useState<string>("");
const [email, setEmail] = useState<string>(""); const [email, setEmail] = useState<string>("");
const [partialPhoneNumber, setPartialPhoneNumber] = useState<string>(""); const [partialPhoneNumber, setPartialPhoneNumber] = useState<string>("");
@ -48,20 +49,15 @@ export default function Login() {
if (error === "1") openErrorModal(); if (error === "1") openErrorModal();
}, [error, openErrorModal]); }, [error, openErrorModal]);
const onEmailFormSubmit = useCallback( const onEmailFormSubmit = useCallback(async (e: React.FormEvent<HTMLFormElement> | null, values: { [key: string]: string }) => {
async (e: React.FormEvent<HTMLFormElement> | null, values: { [key: string]: string }) => {
try { try {
if (!values["email"]) return; if (!values["email"]) return;
setEmail(values["email"]); setEmail(values["email"]);
const res = await Auth.getInstance().mailVerifySms({ email: values["email"] }); const res = await Auth.getInstance().mailVerifySms({ email: values["email"] });
setPartialPhoneNumber(res.partialPhoneNumber); setPartialPhoneNumber(res.partialPhoneNumber);
setTotpCodeUid(res.totpCodeUid);
setStep(LoginStep.TOTP); setStep(LoginStep.TOTP);
} catch (error: any) { } catch (error: any) {
// If token already exists and is still valid redirect to the connect/register page
if (error.http_status === 425) {
setStep(LoginStep.TOTP);
return;
}
setValidationErrors([ setValidationErrors([
{ {
property: "email", property: "email",
@ -72,9 +68,7 @@ export default function Login() {
]); ]);
return; return;
} }
}, }, []);
[setEmail, setPartialPhoneNumber, setStep],
);
const onSmsCodeSubmit = useCallback( const onSmsCodeSubmit = useCallback(
async (e: React.FormEvent<HTMLFormElement> | null, values: { [key: string]: string }) => { async (e: React.FormEvent<HTMLFormElement> | null, values: { [key: string]: string }) => {
@ -179,7 +173,10 @@ export default function Login() {
const onSendAnotherCode = useCallback(async () => { const onSendAnotherCode = useCallback(async () => {
try { try {
await Auth.getInstance().sendAnotherCode({ email }); const res = await Auth.getInstance().sendAnotherCode({ email, totpCodeUid });
setPartialPhoneNumber(res.partialPhoneNumber);
setTotpCodeUid(res.totpCodeUid);
} catch (error: any) { } catch (error: any) {
setValidationErrors([ setValidationErrors([
{ {
@ -191,7 +188,7 @@ export default function Login() {
]); ]);
return; return;
} }
}, [email]); }, [email, totpCodeUid]);
return ( return (
<DefaultDoubleSidePage title={"Login"} image={LandingImage}> <DefaultDoubleSidePage title={"Login"} image={LandingImage}>