feature: parse error to ErrorMessage component
parent
7eb0ca8034
commit
c6c6ef1e8f
|
@ -1,14 +1,27 @@
|
||||||
import React from 'react';
|
import React from 'react';
|
||||||
|
import PropTypes from 'prop-types';
|
||||||
import { FormattedMessage } from 'react-intl';
|
import { FormattedMessage } from 'react-intl';
|
||||||
import Icon from './Icon';
|
import Icon from './Icon';
|
||||||
import Exclamation from 'assets/exclamation-triangle.svg';
|
import Exclamation from 'assets/exclamation-triangle.svg';
|
||||||
import styles from './ErrorMessage.module.css';
|
import styles from './ErrorMessage.module.css';
|
||||||
|
|
||||||
export default function ErrorMessage() {
|
const DEFAULT_ID = 'message.failure';
|
||||||
|
const DEFAULT_MESSAGE = 'Something went wrong';
|
||||||
|
|
||||||
|
function ErrorMessage({ error }) {
|
||||||
|
const [id, defaultMessage] =
|
||||||
|
typeof error === 'string' ? error.split('\t') : [DEFAULT_ID, DEFAULT_MESSAGE];
|
||||||
|
|
||||||
return (
|
return (
|
||||||
<div className={styles.error}>
|
<div className={styles.error}>
|
||||||
<Icon icon={<Exclamation />} className={styles.icon} size="large" />
|
<Icon icon={<Exclamation />} className={styles.icon} size="large" />
|
||||||
<FormattedMessage id="message.failure" defaultMessage="Something went wrong." />
|
<FormattedMessage id={id} defaultMessage={defaultMessage} />
|
||||||
</div>
|
</div>
|
||||||
);
|
);
|
||||||
}
|
}
|
||||||
|
|
||||||
|
ErrorMessage.propTypes = {
|
||||||
|
error: PropTypes.oneOfType([PropTypes.string, PropTypes.instanceOf(Error)]),
|
||||||
|
};
|
||||||
|
|
||||||
|
export default ErrorMessage;
|
||||||
|
|
Loading…
Reference in New Issue