Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-01-06 20:40:08 -05:00
Code Issues Activity

fix(experience): improve the loading experience (#5038)

Browse source 
improve the loading experience
This commit is contained in:
simeng-li 2023-12-01 19:40:59 +08:00 committed by GitHub
parent 527cd22608
commit ba691c5636
No known key found for this signature in database
GPG key ID: 4AEE18F83AFDEB23
3 changed files with 16 additions and 9 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

2
packages/experience/src/Providers/LoadingLayerProvider/index.tsx
View file

@ -7,7 +7,7 @@ import LoadingLayer from '@/components/LoadingLayer';
const LoadingLayerProvider = () => {
const { loading } = useContext(PageContext);
const debouncedLoading = useDebouncedLoader(loading);
const debouncedLoading = useDebouncedLoader(loading, 500);
return (
<>

14
packages/experience/src/hooks/use-api.ts
View file

@ -3,16 +3,24 @@ import { useCallback, useContext } from 'react';
import PageContext from '@/Providers/PageContextProvider/PageContext';
const useApi = <Args extends unknown[], Response>(api: (...args: Args) => Promise<Response>) => {
type Options = {
silent?: boolean;
};
const useApi = <Args extends unknown[], Response>(
api: (...args: Args) => Promise<Response>,
options?: Options
) => {
const { setLoading } = useContext(PageContext);
const request = useCallback(
async (...args: Args): Promise<[Nullable<unknown>, Response?]> => {
if (!options?.silent) {
setLoading(true);
}
try {
const result = await api(...args);
return [null, result];
} catch (error: unknown) {
return [error];
@ -20,7 +28,7 @@ const useApi = <Args extends unknown[], Response>(api: (...args: Args) => Promis
setLoading(false);
}
},
[api, setLoading]
[api, options?.silent, setLoading]
);
return request;

7
packages/experience/src/hooks/use-single-sign-on-watch.ts
View file

@ -23,12 +23,11 @@ const useSingleSignOnWatch = (identifierInput?: IdentifierInputValue) => {
const { showSingleSignOnForm, setShowSingleSignOnForm } = useContext(SingleSignOnFormModeContext);
const request = useApi(getSingleSignOnConnectors);
const request = useApi(getSingleSignOnConnectors, { silent: true });
const singleSignOn = useSingleSignOn();
/**
* Silently check if the email is registered with any SSO connectors
*/
// Silently check if the email is registered with any SSO connectors
const fetchSsoConnectors = useCallback(
async (email: string) => {
const [, result] = await request(email);