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:
parent
918f8503fd
commit
c61dd50e60
4 changed files with 18 additions and 6 deletions
|
@ -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);
|
||||
}}
|
||||
/>
|
||||
|
||||
|
|
|
@ -67,7 +67,7 @@ const useWebAuthnOperation = () => {
|
|||
/**
|
||||
* Assert type manually to get the correct type
|
||||
*/
|
||||
void sendMfaPayload(
|
||||
await sendMfaPayload(
|
||||
isAuthenticationResponseJSON(response)
|
||||
? {
|
||||
flow: UserMfaFlow.MfaVerification,
|
||||
|
|
|
@ -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);
|
||||
}}
|
||||
/>
|
||||
|
||||
|
|
|
@ -70,7 +70,7 @@ const useWebAuthnOperation = () => {
|
|||
/**
|
||||
* Assert type manually to get the correct type
|
||||
*/
|
||||
void sendMfaPayload(
|
||||
await sendMfaPayload(
|
||||
isAuthenticationResponseJSON(response)
|
||||
? {
|
||||
flow: UserMfaFlow.MfaVerification,
|
||||
|
|
Loading…
Reference in a new issue