0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2024-12-30 20:33:54 -05:00

fix(experience): add missing button loading state (#6599)

This commit is contained in:
Xiao Yijun 2024-09-20 14:49:53 +08:00 committed by GitHub
parent 918f8503fd
commit c61dd50e60
No known key found for this signature in database
GPG key ID: B5690EEEBB952194
4 changed files with 18 additions and 6 deletions

View file

@ -1,6 +1,7 @@
import { SignInIdentifier, SignInMode } from '@logto/schemas';
import classNames from 'classnames';
import type { TFuncKey } from 'i18next';
import { useState } from 'react';
import { useTranslation } from 'react-i18next';
import Button from '@/components/Button';
@ -44,6 +45,8 @@ const SocialLinkAccount = ({ connectorId, className, relatedUser }: Props) => {
const { signUpMethods, signInMode } = useSieMethods();
const bindSocialRelatedUser = useBindSocialRelatedUser();
const [isBindingUser, setIsBindingUser] = useState(false);
const registerWithSocial = useSocialRegister(connectorId);
const actionText = getCreateAccountActionText(signUpMethods);
@ -57,11 +60,14 @@ const SocialLinkAccount = ({ connectorId, className, relatedUser }: Props) => {
<Button
title="action.bind"
i18nProps={{ address: type === 'email' ? maskEmail(value) : maskPhone(value) }}
onClick={() => {
void bindSocialRelatedUser({
isLoading={isBindingUser}
onClick={async () => {
setIsBindingUser(true);
await bindSocialRelatedUser({
connectorId,
...(type === 'email' ? { email: value } : { phone: value }),
});
setIsBindingUser(false);
}}
/>

View file

@ -67,7 +67,7 @@ const useWebAuthnOperation = () => {
/**
* Assert type manually to get the correct type
*/
void sendMfaPayload(
await sendMfaPayload(
isAuthenticationResponseJSON(response)
? {
flow: UserMfaFlow.MfaVerification,

View file

@ -1,6 +1,7 @@
import { SignInIdentifier, SignInMode } from '@logto/schemas';
import classNames from 'classnames';
import type { TFuncKey } from 'i18next';
import { useState } from 'react';
import { useTranslation } from 'react-i18next';
import Button from '@/components/Button';
@ -45,6 +46,8 @@ const SocialLinkAccount = ({ connectorId, verificationId, className, relatedUser
const { signUpMethods, signInMode } = useSieMethods();
const bindSocialRelatedUser = useBindSocialRelatedUser();
const [isBindingUser, setIsBindingUser] = useState(false);
const registerWithSocial = useSocialRegister(connectorId);
const actionText = getCreateAccountActionText(signUpMethods);
@ -58,8 +61,11 @@ const SocialLinkAccount = ({ connectorId, verificationId, className, relatedUser
<Button
title="action.bind"
i18nProps={{ address: type === 'email' ? maskEmail(value) : maskPhone(value) }}
onClick={() => {
void bindSocialRelatedUser(verificationId);
isLoading={isBindingUser}
onClick={async () => {
setIsBindingUser(true);
await bindSocialRelatedUser(verificationId);
setIsBindingUser(false);
}}
/>

View file

@ -70,7 +70,7 @@ const useWebAuthnOperation = () => {
/**
* Assert type manually to get the correct type
*/
void sendMfaPayload(
await sendMfaPayload(
isAuthenticationResponseJSON(response)
? {
flow: UserMfaFlow.MfaVerification,