add new error page

This commit is contained in:
cristhianzl 2024-02-19 10:59:50 -03:00
commit e922d5a0bd

View file

@ -5,32 +5,69 @@ export default function CrashErrorComponent({
resetErrorBoundary, resetErrorBoundary,
}: crashComponentPropsType): JSX.Element { }: crashComponentPropsType): JSX.Element {
return ( return (
<div className="fixed left-0 top-0 z-50 flex h-full w-full items-center justify-center bg-foreground bg-opacity-50"> <div className="z-50 flex h-screen w-screen items-center justify-center bg-foreground bg-opacity-50">
<div className="flex h-1/3 min-h-fit max-w-4xl flex-col justify-evenly rounded-lg bg-background p-8 text-start shadow-lg"> <div className="flex h-screen w-screen flex-col bg-background text-start shadow-lg">
<h1 className="mb-4 text-3xl text-status-red"> <div className="m-auto grid w-1/2 justify-center gap-5 text-center">
Oops! An unknown error has occurred. <div>
</h1> <h1 className="text-3xl text-status-red">
<p className="mb-4 text-xl text-foreground"> 🚀 Whoops! We've Hit a Snag.
Please click the 'Reset Application' button to restore the </h1>
application's state. If the error persists, please create an issue on <small>
our GitHub page. We apologize for any inconvenience this may have Hey there, it looks like we've encountered a bit of a hiccup.
caused. </small>
</p> </div>
<div className="flex justify-center"> <div>
<button <p className="mb-4 text-xl text-foreground">
onClick={resetErrorBoundary} But don't worry, it happens to the best of us! We're all about
className="mr-4 rounded bg-primary px-4 py-2 font-bold text-background hover:bg-ring" making things better together.
> </p>
Reset Application </div>
</button>
<a <div>
href="https://github.com/logspace-ai/langflow/issues/new" <p>
target="_blank" 🔧 Quick Fix: Try hitting the{" "}
rel="noopener noreferrer" <span className="font-bold">'Restart the Adventure'</span> button
className="rounded bg-status-red px-4 py-2 font-bold text-background hover:bg-error-foreground" to get things moving again. It's like a magic wand for minor
> glitches!
Create Issue </p>
</a> </div>
<div>
<p>
📝 Still Stuck? Let's Solve It Together: If our magic wand didn't
do the trick, we'd love your help to dig a bit deeper. By
reporting this hiccup on our{" "}
<a
href="https://github.com/logspace-ai/langflow/issues/new"
target="_blank"
rel="noopener noreferrer"
className="font-medium text-blue-600 hover:underline dark:text-blue-500"
>
GitHub
</a>{" "}
page, you're not just fixing your own experience but also helping
the whole community.
</p>
</div>
<div className="mt-4 flex justify-center">
<button
onClick={resetErrorBoundary}
className="cursor-pointer rounded-lg border-2 border-blue-600 px-3 py-2 font-bold text-blue-600 hover:bg-blue-600 hover:text-blue-100"
>
Restart the Adventure
</button>
<a
href="https://github.com/logspace-ai/langflow/issues/new"
target="_blank"
rel="noopener noreferrer"
>
<button className="ml-3 cursor-pointer rounded-lg border-2 border-gray-600 px-3 py-2 font-bold text-gray-600 hover:bg-gray-600 hover:text-gray-100">
Report on GitHub
</button>
</a>
</div>
</div> </div>
</div> </div>
</div> </div>