54 lines
1.5 KiB
TypeScript
54 lines
1.5 KiB
TypeScript
import { Button } from "@/ui";
|
|
import { HomeIcon } from "lucide-react";
|
|
import { useNavigate } from "react-router-dom";
|
|
import { BackHistoryButton } from "../CustomButtons";
|
|
|
|
interface ErrorOverlayProps {
|
|
title?: string;
|
|
subtitle?: string;
|
|
description?: string;
|
|
|
|
errorMessage?: string;
|
|
//errorStatusCode?: number | string | undefined;
|
|
}
|
|
|
|
/*const _DrawByStatusCode = {
|
|
0: UndrawAutumn,
|
|
404: UndrawNoData, //UndrawEmpty,
|
|
};*/
|
|
|
|
export const ErrorOverlay = ({
|
|
title = "Se ha producido un error",
|
|
subtitle = undefined,
|
|
description = undefined,
|
|
errorMessage = undefined,
|
|
}: //errorStatusCode = undefined,
|
|
ErrorOverlayProps): JSX.Element => {
|
|
const navigate = useNavigate();
|
|
/*const ErrorIllustration = () =>
|
|
String(errorStatusCode).length
|
|
? _DrawByStatusCode[String(errorStatusCode)]
|
|
: _DrawByStatusCode['0'];*/
|
|
|
|
return (
|
|
<div className='grid h-screen place-items-center '>
|
|
<div className='text-center'>
|
|
<h2 className='mt-2 text-xl font-semibold text-center text-slate-900'>{title}</h2>
|
|
<p className='mt-1 font-medium text-slate-500'>
|
|
{subtitle || errorMessage}
|
|
<br />
|
|
{description}
|
|
</p>
|
|
<div className='mt-6 space-x-8 md:ml-4'>
|
|
<BackHistoryButton />
|
|
<Button onClick={() => navigate("/")}>
|
|
<HomeIcon className='w-4 h-4 mr-2' /> Ir al inicio
|
|
</Button>
|
|
</div>
|
|
</div>
|
|
</div>
|
|
);
|
|
};
|
|
|
|
ErrorOverlay.displayName = "ErrorOverlay";
|