@applica-software-guru/react-admin 1.5.345 → 1.5.346

package/package.json

@@ -108,5 +108,5 @@
   "type": "module",
   "types": "dist/index.d.ts",
   "typings": "dist/index.d.ts",
-  "version": "1.5.345"
+  "version": "1.5.346"
 }

package/src/components/Layout/Error.tsx

@@ -1,6 +1,6 @@
 import imgSrc from '@/assets/generic-error.png';
 import { History } from '@mui/icons-material';
-import { Button, Container, Stack, Typography, useTheme } from '@mui/material';
+import { Box, Button, Container, Typography, useTheme } from '@mui/material';
 import { TitleComponent, useTranslate } from 'ra-core';
 import { Title, useResetErrorBoundaryOnLocationChange } from 'ra-ui-materialui';
 import { ComponentType, ErrorInfo, HtmlHTMLAttributes, useCallback } from 'react';
@@ -33,38 +33,32 @@ function Error(props: ErrorBoundaryProps) {
 
   return (
     <Container>
-      <Stack alignItems="center" px={2} py={{ xs: 4, sm: 8 }} spacing={2} textAlign="center">
-        {title ? <Title title={title} /> : null}
-        <img src={imgSrc} style={{ width: '100%', maxWidth: 450, marginTop: theme.spacing(4) }} alt="oops!" />
+      <Box
+        sx={{
+          display: 'flex',
+          flexDirection: 'column',
+          justifyContent: 'center',
+          alignItems: 'center',
+          py: 4,
+          gap: 2
+        }}
+      >
+        <Title title={title || 'Error'} />
         <Typography
-          variant="h2"
-          sx={{
-            whiteSpace: 'pre-wrap',
-            wordBreak: 'break-word'
-          }}
-        >
+          component="img"
+          src={imgSrc}
+          style={{ width: '100%', maxWidth: 350, marginTop: theme.spacing(3), marginBottom: theme.spacing(2) }}
+          alt="oops!"
+        />
+
+        <Typography variant="h2" justifyContent={'center'} align="center" sx={{ mb: 2 }}>
           {translate(isProduction ? 'ra.page.error' : error.message, { _: error.message })}
         </Typography>
-        {!isProduction && <Typography variant="caption">{translate('ra.message.error_more_info')}</Typography>}
-        {errorInfo ? (
-          <Typography
-            variant="body1"
-            component="pre"
-            textAlign={isProduction ? 'center' : 'start'}
-            fontFamily={isProduction ? 'inherit' : 'monospace'}
-            sx={{
-              whiteSpace: 'pre-wrap',
-              wordBreak: 'break-word'
-            }}
-          >
-            {isProduction ? translate('ra.message.error') : errorInfo?.componentStack?.substring(0, 250) + '...'}
-          </Typography>
-        ) : null}
 
-        <Button variant="contained" startIcon={<History />} onClick={handleBack}>
+        <Button variant="contained" startIcon={<History sx={{ fontSize: 22 }} />} onClick={handleBack}>
           {translate('ra.action.back')}
         </Button>
-      </Stack>
+      </Box>
     </Container>
   );
 }