26 lines
818 B
TypeScript
26 lines
818 B
TypeScript
import { AlertTriangle } from 'lucide-react'
|
|
import { Alert, AlertDescription, AlertTitle } from '~/components/ui/alert'
|
|
import { Button } from '~/components/ui/button'
|
|
|
|
type Props = {
|
|
error: Error
|
|
reset?: () => void
|
|
}
|
|
|
|
export function ErrorState({ error, reset }: Props) {
|
|
return (
|
|
<Alert variant="destructive" className="my-3 rounded-md py-10">
|
|
<div className="flex flex-col items-center gap-2 text-center">
|
|
<AlertTriangle className="h-8 w-8" />
|
|
<AlertTitle className="mt-4 text-lg">Something went wrong</AlertTitle>
|
|
<AlertDescription className="max-w-sm">{error.message}</AlertDescription>
|
|
{reset && (
|
|
<Button variant="outline" size="sm" onClick={reset} className="mt-3">
|
|
Try again
|
|
</Button>
|
|
)}
|
|
</div>
|
|
</Alert>
|
|
)
|
|
}
|