0
Fork 0
mirror of https://github.com/logto-io/logto.git synced 2025-02-24 22:05:56 -05:00

fix(console): improve swr error handling to avoid app crash

This commit is contained in:
Charles Zhao 2022-05-16 19:57:31 +08:00
parent 5d34442018
commit da77a1d1b5
No known key found for this signature in database
GPG key ID: 4858774754C92DF2
13 changed files with 25 additions and 25 deletions

View file

@ -9,7 +9,7 @@ import { toast } from 'react-hot-toast';
import { logtoApiResource } from '@/consts/api';
export class RequestError extends Error {
body: RequestErrorBody;
body?: RequestErrorBody;
constructor(body: RequestErrorBody) {
super('Request error occurred.');

View file

@ -84,7 +84,7 @@ const ApiResourceDetails = () => {
className={styles.backLink}
/>
{isLoading && <DetailsSkeleton />}
{error && <div>{`error occurred: ${error.body.message}`}</div>}
{!data && error && <div>{`error occurred: ${error.body?.message ?? error.message}`}</div>}
{data && (
<>
<Card className={styles.header}>

View file

@ -85,10 +85,10 @@ const ApiResources = () => {
</tr>
</thead>
<tbody>
{error && (
{!data && error && (
<TableError
columns={2}
content={error.body.message}
content={error.body?.message ?? error.message}
onRetry={async () => mutate(undefined, true)}
/>
)}

View file

@ -82,10 +82,10 @@ const Applications = () => {
</tr>
</thead>
<tbody>
{error && (
{!data && error && (
<TableError
columns={2}
content={error.body.message}
content={error.body?.message ?? error.message}
onRetry={async () => mutate(undefined, true)}
/>
)}

View file

@ -107,7 +107,7 @@ const ConnectorDetails = () => {
className={styles.backLink}
/>
{isLoading && <DetailsSkeleton />}
{error && <div>{`error occurred: ${error.body.message}`}</div>}
{!data && error && <div>{`error occurred: ${error.body?.message ?? error.message}`}</div>}
{data && (
<Card className={styles.header}>
<div className={styles.imagePlaceholder}>

View file

@ -85,10 +85,10 @@ const Connectors = () => {
</tr>
</thead>
<tbody>
{error && (
{!data && error && (
<TableError
columns={3}
content={error.body.message}
content={error.body?.message ?? error.message}
onRetry={async () => mutate(undefined, true)}
/>
)}

View file

@ -60,7 +60,7 @@ const Settings = () => {
<TabNavItem href="/settings">{t('settings.tabs.general')}</TabNavItem>
</TabNav>
{!data && !error && <div>loading</div>}
{error && <div>{`error occurred: ${error.body.message}`}</div>}
{!data && error && <div>{`error occurred: ${error.body?.message ?? error.message}`}</div>}
{data && (
<form className={detailsStyles.body} onSubmit={onSubmit}>
<div className={styles.fields}>

View file

@ -26,8 +26,8 @@ const ConnectorsTransfer = ({ value, onChange }: Props) => {
return <div>loading</div>;
}
if (error) {
<div>{`error occurred: ${error.body.message}`}</div>;
if (!data && error) {
<div>{`error occurred: ${error.body?.message ?? error.message}`}</div>;
}
const datasource = data

View file

@ -42,7 +42,7 @@ const SignInMethodsPreview = ({ data }: Props) => {
return (
<div>
{!connectors && !error && <div>loading</div>}
{error && <div>{error.body.message}</div>}
{!connectors && error && <div>{error.body?.message ?? error.message}</div>}
{connectors &&
Object.values(SignInMethodKey)
.filter((key) => signInMethods[key] !== SignInMethodState.Disabled)

View file

@ -84,8 +84,8 @@ const SignInExperience = () => {
return <div>loading</div>;
}
if (configError) {
return <div>{configError.body.message}</div>;
if (!configs && configError) {
return <div>{configError.body?.message ?? configError.message}</div>;
}
if (configs?.customizeSignInExperience) {
@ -109,7 +109,7 @@ const SignInExperience = () => {
</TabNavItem>
</TabNav>
{!data && !error && <div>loading</div>}
{error && <div>{`error occurred: ${error.body.message}`}</div>}
{!data && error && <div>{`error occurred: ${error.body?.message ?? error.message}`}</div>}
{data && (
<FormProvider {...methods}>
<form onSubmit={onSubmit}>

View file

@ -31,20 +31,20 @@ const UserConnectors = ({ userId, connectors, onDelete }: Props) => {
const { t } = useTranslation(undefined, { keyPrefix: 'admin_console' });
const { data, error, mutate } = useSWR<ConnectorDTO[], RequestError>('/api/connectors');
const isLoading = !data && !error;
const [isSubmiting, setIsSubmiting] = useState(false);
const [isSubmitting, setIsSubmitting] = useState(false);
const handleDelete = async (connectorId: string) => {
if (isSubmiting) {
if (isSubmitting) {
return;
}
setIsSubmiting(true);
setIsSubmitting(true);
try {
await api.delete(`/api/users/${userId}/identities/${connectorId}`);
onDelete?.(connectorId);
} finally {
setIsSubmiting(false);
setIsSubmitting(false);
}
};
@ -96,10 +96,10 @@ const UserConnectors = ({ userId, connectors, onDelete }: Props) => {
</tr>
</thead>
<tbody>
{error && (
{!data && error && (
<TableError
columns={3}
content={error.body.message}
content={error.body?.message ?? error.message}
onRetry={async () => mutate(undefined, true)}
/>
)}

View file

@ -113,7 +113,7 @@ const UserDetails = () => {
className={styles.backLink}
/>
{isLoading && <DetailsSkeleton />}
{error && <div>{`error occurred: ${error.body.message}`}</div>}
{!data && error && <div>{`error occurred: ${error.body?.message ?? error.message}`}</div>}
{id && data && (
<>
<Card className={styles.header}>

View file

@ -95,10 +95,10 @@ const Users = () => {
</tr>
</thead>
<tbody>
{error && (
{!data && error && (
<TableError
columns={3}
content={error.body.message}
content={error.body?.message ?? error.message}
onRetry={async () => mutate(undefined, true)}
/>
)}