Просмотр исходного кода

feat: update general error page to be more flexible

satnaing 2 лет назад
Родитель
Сommit
4cfac3fa5a
1 измененных файлов с 21 добавлено и 9 удалено
  1. 21 9
      src/pages/errors/general-error.tsx

+ 21 - 9
src/pages/errors/general-error.tsx

@@ -1,22 +1,34 @@
 import { useNavigate } from 'react-router-dom'
 import { Button } from '@/components/ui/button'
+import { cn } from '@/lib/utils'
 
-export default function GeneralError() {
+interface GeneralErrorProps extends React.HTMLAttributes<HTMLDivElement> {
+  minimal?: boolean
+}
+
+export default function GeneralError({
+  className,
+  minimal = false,
+}: GeneralErrorProps) {
   const navigate = useNavigate()
   return (
-    <div className='h-svh'>
+    <div className={cn('h-svh w-full', className)}>
       <div className='m-auto flex h-full w-full flex-col items-center justify-center gap-2'>
-        <h1 className='text-[7rem] font-bold leading-tight'>500</h1>
+        {!minimal && (
+          <h1 className='text-[7rem] font-bold leading-tight'>500</h1>
+        )}
         <span className='font-medium'>Oops! Something went wrong {`:')`}</span>
         <p className='text-center text-muted-foreground'>
           We apologize for the inconvenience. <br /> Please try again later.
         </p>
-        <div className='mt-6 flex gap-4'>
-          <Button variant='outline' onClick={() => navigate(-1)}>
-            Go Back
-          </Button>
-          <Button onClick={() => navigate('/')}>Back to Home</Button>
-        </div>
+        {!minimal && (
+          <div className='mt-6 flex gap-4'>
+            <Button variant='outline' onClick={() => navigate(-1)}>
+              Go Back
+            </Button>
+            <Button onClick={() => navigate('/')}>Back to Home</Button>
+          </div>
+        )}
       </div>
     </div>
   )