60 lines
1.5 KiB
JavaScript
60 lines
1.5 KiB
JavaScript
// @flow
|
|
import React, { Component } from 'react';
|
|
import { observer } from 'mobx-react';
|
|
import { observable } from 'mobx';
|
|
import type { Location } from 'react-router-dom';
|
|
import CenteredContent from 'components/CenteredContent';
|
|
import PageTitle from 'components/PageTitle';
|
|
|
|
type Props = {
|
|
location?: Location,
|
|
children?: ?React.Element<any>,
|
|
};
|
|
|
|
@observer
|
|
class ErrorBoundary extends Component {
|
|
props: Props;
|
|
@observable error: boolean = false;
|
|
|
|
componentWillReceiveProps(nextProps: Object) {
|
|
if (
|
|
this.props.location &&
|
|
nextProps.location &&
|
|
this.props.location.pathname !== nextProps.location.pathname
|
|
)
|
|
this.error = false;
|
|
}
|
|
|
|
componentDidCatch(error: Error, info: Object) {
|
|
this.error = true;
|
|
|
|
// Error handler is often blocked by the browser
|
|
if (window.Bugsnag) {
|
|
Bugsnag.notifyException(error, { react: info });
|
|
}
|
|
}
|
|
|
|
handleReload = () => {
|
|
window.location.reload();
|
|
};
|
|
|
|
render() {
|
|
if (this.error) {
|
|
return (
|
|
<CenteredContent>
|
|
<PageTitle title="Something went wrong" />
|
|
<h1>🛸 Something unexpected happened</h1>
|
|
<p>
|
|
An unrecoverable error occurred{window.Bugsnag ||
|
|
(true && ' and our engineers have been notified')}. Please try{' '}
|
|
<a onClick={this.handleReload}>reloading</a>.
|
|
</p>
|
|
</CenteredContent>
|
|
);
|
|
}
|
|
return this.props.children;
|
|
}
|
|
}
|
|
|
|
export default ErrorBoundary;
|