💫 add loading animation
show loading indicator in continue with provider if is pressed and hide indicator if something failed
This commit is contained in:
@ -30,6 +30,8 @@ const OAuthProviders = () => {
|
|||||||
})();
|
})();
|
||||||
}, []);
|
}, []);
|
||||||
|
|
||||||
|
const [loadingButton, setLoadingButton] = useState(false);
|
||||||
|
|
||||||
/**
|
/**
|
||||||
* Start the authentication process using oAuth by sending the endpoint URL to the backend for processing.
|
* Start the authentication process using oAuth by sending the endpoint URL to the backend for processing.
|
||||||
*
|
*
|
||||||
@ -37,10 +39,13 @@ const OAuthProviders = () => {
|
|||||||
*/
|
*/
|
||||||
const startOauthProcess = async (providerRequestEndpoint: string) => {
|
const startOauthProcess = async (providerRequestEndpoint: string) => {
|
||||||
try {
|
try {
|
||||||
|
setLoadingButton(true);
|
||||||
|
|
||||||
(await requestOauthUrl(
|
(await requestOauthUrl(
|
||||||
providerRequestEndpoint
|
providerRequestEndpoint
|
||||||
)) as ResponseRequestOauthUrl;
|
)) as ResponseRequestOauthUrl;
|
||||||
} catch (err) {
|
} catch (err) {
|
||||||
|
setLoadingButton(false);
|
||||||
console.error(err);
|
console.error(err);
|
||||||
}
|
}
|
||||||
};
|
};
|
||||||
@ -57,6 +62,7 @@ const OAuthProviders = () => {
|
|||||||
variant="bordered"
|
variant="bordered"
|
||||||
startContent={<Icon icon={provider.icon} />}
|
startContent={<Icon icon={provider.icon} />}
|
||||||
onPress={() => startOauthProcess(provider.req_endpoint)}
|
onPress={() => startOauthProcess(provider.req_endpoint)}
|
||||||
|
isLoading={loadingButton}
|
||||||
>
|
>
|
||||||
Continue with {provider.name}
|
Continue with {provider.name}
|
||||||
</Button>
|
</Button>
|
||||||
|
|||||||
Reference in New Issue
Block a user