Page MenuHomePhabricator

D3811.diff
No OneTemporary

D3811.diff

diff --git a/web/error-boundary.css b/web/error-boundary.css
new file mode 100644
--- /dev/null
+++ b/web/error-boundary.css
@@ -0,0 +1,9 @@
+.container {
+ height: 100vh;
+ display: flex;
+ flex-direction: column;
+ justify-content: center;
+ align-items: center;
+ color: var(--fg);
+ font-size: var(--m-font-16);
+}
diff --git a/web/error-boundary.react.js b/web/error-boundary.react.js
new file mode 100644
--- /dev/null
+++ b/web/error-boundary.react.js
@@ -0,0 +1,42 @@
+// @flow
+
+import * as React from 'react';
+
+import type { ErrorInfo, ErrorData } from 'lib/types/report-types';
+
+import css from './error-boundary.css';
+
+type Props = {
+ +children: React.Node,
+};
+
+type State = {
+ +errorData: $ReadOnlyArray<ErrorData>,
+ +showError: boolean,
+};
+
+class ErrorBoundary extends React.PureComponent<Props, State> {
+ state: State = {
+ errorData: [],
+ showError: false,
+ };
+
+ componentDidCatch(error: Error, info: ErrorInfo) {
+ this.setState(prevState => ({
+ errorData: [...prevState.errorData, { error, info }],
+ }));
+ }
+
+ render(): React.Node {
+ if (this.state.errorData.length > 0) {
+ return (
+ <div className={css.container}>
+ <h3>Something has gone wrong, please reload the page</h3>
+ </div>
+ );
+ }
+ return this.props.children;
+ }
+}
+
+export default ErrorBoundary;
diff --git a/web/hot.js b/web/hot.js
--- a/web/hot.js
+++ b/web/hot.js
@@ -5,15 +5,18 @@
import { Router, Route } from 'react-router';
import App from './app.react';
+import ErrorBoundary from './error-boundary.react';
import history from './router-history';
import Socket from './socket.react';
const RootComponent = () => (
<React.Fragment>
- <Router history={history.getHistoryObject()}>
- <Route path="*" component={App} />
- </Router>
- <Socket />
+ <ErrorBoundary>
+ <Router history={history.getHistoryObject()}>
+ <Route path="*" component={App} />
+ </Router>
+ <Socket />
+ </ErrorBoundary>
</React.Fragment>
);

File Metadata

Mime Type
text/plain
Expires
Sat, Nov 9, 11:55 AM (18 h, 23 m)
Storage Engine
blob
Storage Format
Raw Data
Storage Handle
2451954
Default Alt Text
D3811.diff (2 KB)

Event Timeline