2023-03-17 12:00:05 +01:00
|
|
|
import React from 'react';
|
|
|
|
import PropTypes from 'prop-types';
|
|
|
|
import Box from '../../../ui/box/box';
|
|
|
|
import {
|
|
|
|
AlignItems,
|
2023-06-06 12:15:20 +02:00
|
|
|
BackgroundColor,
|
2023-03-17 12:00:05 +01:00
|
|
|
BLOCK_SIZES,
|
|
|
|
FLEX_DIRECTION,
|
|
|
|
FONT_WEIGHT,
|
2023-06-06 12:15:20 +02:00
|
|
|
IconColor,
|
2023-03-17 12:00:05 +01:00
|
|
|
JustifyContent,
|
2023-06-06 12:15:20 +02:00
|
|
|
TextAlign,
|
2023-03-17 12:00:05 +01:00
|
|
|
TextVariant,
|
|
|
|
} from '../../../../helpers/constants/design-system';
|
|
|
|
import ActionableMessage from '../../../ui/actionable-message/actionable-message';
|
2023-06-06 12:15:20 +02:00
|
|
|
import { AvatarIcon, IconSize, Text } from '../../../component-library';
|
2023-03-17 12:00:05 +01:00
|
|
|
|
2023-06-06 12:15:20 +02:00
|
|
|
const InstallError = ({ title, error, description, iconName }) => {
|
2023-03-17 12:00:05 +01:00
|
|
|
return (
|
|
|
|
<Box
|
|
|
|
flexDirection={FLEX_DIRECTION.COLUMN}
|
|
|
|
alignItems={AlignItems.center}
|
|
|
|
justifyContent={JustifyContent.center}
|
|
|
|
height={BLOCK_SIZES.FULL}
|
|
|
|
padding={2}
|
|
|
|
>
|
2023-06-06 12:15:20 +02:00
|
|
|
{iconName && (
|
|
|
|
<AvatarIcon
|
|
|
|
iconName={iconName}
|
|
|
|
size={IconSize.Xl}
|
|
|
|
iconProps={{
|
|
|
|
size: IconSize.Xl,
|
|
|
|
}}
|
|
|
|
color={IconColor.errorDefault}
|
|
|
|
backgroundColor={BackgroundColor.errorMuted}
|
|
|
|
marginBottom={4}
|
|
|
|
/>
|
|
|
|
)}
|
2023-03-17 12:00:05 +01:00
|
|
|
<Text fontWeight={FONT_WEIGHT.BOLD} variant={TextVariant.headingLg}>
|
|
|
|
{title}
|
|
|
|
</Text>
|
2023-06-06 12:15:20 +02:00
|
|
|
{description && <Text textAlign={TextAlign.Center}>{description}</Text>}
|
2023-06-09 16:36:38 +02:00
|
|
|
{error && (
|
|
|
|
<Box padding={2}>
|
|
|
|
<ActionableMessage type="danger" message={error} />
|
|
|
|
</Box>
|
|
|
|
)}
|
2023-03-17 12:00:05 +01:00
|
|
|
</Box>
|
|
|
|
);
|
|
|
|
};
|
|
|
|
|
|
|
|
InstallError.propTypes = {
|
|
|
|
title: PropTypes.node.isRequired,
|
2023-06-09 16:36:38 +02:00
|
|
|
error: PropTypes.string,
|
2023-06-06 12:15:20 +02:00
|
|
|
description: PropTypes.string,
|
|
|
|
iconName: PropTypes.string,
|
2023-03-17 12:00:05 +01:00
|
|
|
};
|
|
|
|
|
|
|
|
export default InstallError;
|