diff --git a/webapp/packages/core-blocks/src/ExceptionMessage.tsx b/webapp/packages/core-blocks/src/ExceptionMessage.tsx index 368213a19c..4fd80e2c96 100644 --- a/webapp/packages/core-blocks/src/ExceptionMessage.tsx +++ b/webapp/packages/core-blocks/src/ExceptionMessage.tsx @@ -93,6 +93,21 @@ const style = css` } error[|icon] { padding: 0; + height: 100%; + width: 100%; + max-height: 24px; + max-width: 24px; + + & error-icon { + display: flex; + align-items: center; + align-content: center; + + & IconOrImage { + height: 100%; + width: 100%; + } + } } error-action-close { cursor: pointer; @@ -103,8 +118,6 @@ const style = css` `; interface Props { - name?: string; - message?: string; exception?: Error; icon?: boolean; inline?: boolean; @@ -114,21 +127,9 @@ interface Props { onClose?: () => void; } -export const ExceptionMessage = observer(function ExceptionMessage({ - name, - message, - exception = null, - icon, - inline, - className, - styles, - onRetry, - onClose, -}) { +export const ExceptionMessage = observer(function ExceptionMessage({ exception = null, icon, inline, className, styles, onRetry, onClose }) { const translate = useTranslate(); const error = useErrorDetails(exception); - name = name || error.name; - message = message || error.message; if (error.refresh) { const retry = onRetry; @@ -141,22 +142,22 @@ export const ExceptionMessage = observer(function ExceptionMessage({ return styled(useStyles(style, styles))( - - + + {!icon && ( <> - {name} + {translate('core_blocks_exception_message_error_title')} - {message} + + {translate('core_blocks_exception_message_error_message')} {onRetry && translate('ui_please_retry')} + - {error.hasDetails && ( - - )} + {onRetry && (