83 lines
2.4 KiB
TypeScript
83 lines
2.4 KiB
TypeScript
import axios, { type AxiosError } from 'axios';
|
||
import clsx from 'clsx';
|
||
|
||
import { isResponseHtml } from '@/utils/utils';
|
||
|
||
import PrettyJson from '../ui/PrettyJSON';
|
||
import AnimateFade from '../wrap/AnimateFade';
|
||
|
||
export type ErrorData = string | Error | AxiosError | undefined;
|
||
|
||
interface InfoErrorProps {
|
||
error: ErrorData;
|
||
}
|
||
|
||
function DescribeError({ error }: { error: ErrorData }) {
|
||
if (!error) {
|
||
return <p>Ошибки отсутствуют</p>;
|
||
} else if (typeof error === 'string') {
|
||
return <p>{error}</p>;
|
||
} else if (!axios.isAxiosError(error)) {
|
||
return <PrettyJson data={error} />;
|
||
}
|
||
if (!error?.response) {
|
||
return <p>Нет ответа от сервера</p>;
|
||
}
|
||
if (error.response.status === 404) {
|
||
return (
|
||
<div>
|
||
<p>{'Обращение к несуществующему API'}</p>
|
||
<PrettyJson data={error} />
|
||
</div>
|
||
);
|
||
}
|
||
if (error.response.status === 403 && error.message.includes('CSRF')) {
|
||
return (
|
||
<div>
|
||
<p>{'Соединение с сервером потеряно. Перезагрузите страницу'}</p>
|
||
<PrettyJson data={error} />
|
||
</div>
|
||
);
|
||
}
|
||
|
||
// eslint-disable-next-line @typescript-eslint/no-unsafe-assignment
|
||
const isHtml = isResponseHtml(error.response);
|
||
return (
|
||
<div>
|
||
<p className='underline'>Ошибка</p>
|
||
<p>{error.message}</p>
|
||
{error.response.data && (
|
||
<>
|
||
<p className='mt-2 underline'>Описание</p>
|
||
{isHtml ? <div dangerouslySetInnerHTML={{ __html: error.response.data as TrustedHTML }} /> : null}
|
||
{!isHtml ? <PrettyJson data={error.response.data as object} /> : null}
|
||
</>
|
||
)}
|
||
</div>
|
||
);
|
||
}
|
||
|
||
function InfoError({ error }: InfoErrorProps) {
|
||
return (
|
||
<AnimateFade
|
||
className={clsx(
|
||
'min-w-[25rem] w-full',
|
||
'px-3 py-2 flex flex-col',
|
||
'clr-text-red',
|
||
'text-sm font-semibold',
|
||
'select-text'
|
||
)}
|
||
>
|
||
<div className='font-normal clr-text-default'>
|
||
<p>Пожалуйста сделайте скриншот и отправьте вместе с описанием ситуации на почту portal@acconcept.ru</p>
|
||
<br />
|
||
<p>Для продолжения работы перезагрузите страницу</p>
|
||
</div>
|
||
|
||
<DescribeError error={error} />
|
||
</AnimateFade>
|
||
);
|
||
}
|
||
|
||
export default InfoError;
|