Infrastructure/logto
0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2024-12-16 20:26:19 -05:00
Code Issues Activity

fix(console): useApi hook should not cause component re-render

Browse source
This commit is contained in:
Charles Zhao 2022-10-27 16:56:13 +08:00
parent ee374d19cc
commit 4074d694ef
No known key found for this signature in database
GPG key ID: 4858774754C92DF2
1 changed files with 16 additions and 20 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

36
packages/console/src/hooks/use-api.ts
View file

@ -2,7 +2,7 @@ import { useLogto } from '@logto/react';
import type { RequestErrorBody } from '@logto/schemas'; import type { RequestErrorBody } from '@logto/schemas';
import { managementResource } from '@logto/schemas/lib/seeds'; import { managementResource } from '@logto/schemas/lib/seeds';
import ky from 'ky'; import ky from 'ky';
import { useMemo } from 'react'; import { useCallback, useMemo } from 'react';
import { toast } from 'react-hot-toast'; import { toast } from 'react-hot-toast';
import { useTranslation } from 'react-i18next'; import { useTranslation } from 'react-i18next';
@ -19,31 +19,27 @@ export class RequestError extends Error {
} }
} }
const useToastError = () => {
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
const toastError = async (response: Response) => {
const fallbackErrorMessage = t('errors.unknown_server_error');
try {
const data = await response.json<RequestErrorBody>();
toast.error([data.message, data.details].join('\n') || fallbackErrorMessage);
} catch {
toast.error(fallbackErrorMessage);
}
};
return toastError;
};
type Props = { type Props = {
hideErrorToast?: boolean; hideErrorToast?: boolean;
}; };
const useApi = ({ hideErrorToast }: Props = {}) => { const useApi = ({ hideErrorToast }: Props = {}) => {
const { isAuthenticated, getAccessToken } = useLogto(); const { isAuthenticated, getAccessToken } = useLogto();
const { i18n } = useTranslation(); const { t, i18n } = useTranslation(undefined, { keyPrefix: 'admin_console' });
const toastError = useToastError();
const toastError = useCallback(
async (response: Response) => {
const fallbackErrorMessage = t('errors.unknown_server_error');
try {
const data = await response.json<RequestErrorBody>();
toast.error([data.message, data.details].join('\n') || fallbackErrorMessage);
} catch {
toast.error(fallbackErrorMessage);
}
},
[t]
);
const api = useMemo( const api = useMemo(
() => () =>