82 lines
1.7 KiB
JavaScript
82 lines
1.7 KiB
JavaScript
import React, { Component } from 'react';
|
|
import PropTypes from 'prop-types';
|
|
import { defineMessages, injectIntl } from 'react-intl';
|
|
import Button from '/imports/ui/components/button/component';
|
|
|
|
import styles from './styles.scss';
|
|
|
|
const intlMessages = defineMessages({
|
|
500: {
|
|
id: 'app.error.500',
|
|
defaultMessage: 'Ops, something went wrong',
|
|
},
|
|
404: {
|
|
id: 'app.error.404',
|
|
defaultMessage: 'Not found',
|
|
},
|
|
401: {
|
|
id: 'app.error.401',
|
|
},
|
|
403: {
|
|
id: 'app.error.403',
|
|
},
|
|
leave: {
|
|
id: 'app.error.leaveLabel',
|
|
description: 'aria-label for leaving',
|
|
},
|
|
});
|
|
|
|
const propTypes = {
|
|
code: PropTypes.oneOfType([
|
|
PropTypes.string,
|
|
PropTypes.number,
|
|
]),
|
|
};
|
|
|
|
const defaultProps = {
|
|
code: 500,
|
|
};
|
|
|
|
class ErrorScreen extends Component {
|
|
|
|
onClick() {
|
|
window.location = window.location.origin;
|
|
}
|
|
|
|
render() {
|
|
const { intl, code, children } = this.props;
|
|
|
|
let formatedMessage = intl.formatMessage(intlMessages[500]);
|
|
|
|
if (code in intlMessages) {
|
|
formatedMessage = intl.formatMessage(intlMessages[code]);
|
|
}
|
|
|
|
return (
|
|
<div className={styles.background}>
|
|
<h1 className={styles.code}>
|
|
{code}
|
|
</h1>
|
|
<h1 className={styles.message}>
|
|
{formatedMessage}
|
|
</h1>
|
|
<div className={styles.content}>
|
|
{children}
|
|
</div>
|
|
<div className={styles.content}>
|
|
<Button
|
|
size={'sm'}
|
|
onClick={this.onClick}
|
|
label={intl.formatMessage(intlMessages.leave)}
|
|
/>
|
|
</div>
|
|
</div>
|
|
);
|
|
}
|
|
}
|
|
|
|
export default injectIntl(ErrorScreen);
|
|
|
|
ErrorScreen.propTypes = propTypes;
|
|
ErrorScreen.defaultProps = defaultProps;
|