-
-
Notifications
You must be signed in to change notification settings - Fork 1.1k
/
index.js
79 lines (72 loc) · 2.03 KB
/
index.js
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
import React from 'react';
import TextAreaWithCopyButton from '../../utils/TextAreaWithCopyButton';
import CreateIssue from '../CreateIssue';
import {withStyles} from '@material-ui/core/styles';
const styles = {
errorBoundaryContainer: {
overflowY: 'auto',
display: 'flex',
flexDirection: 'column',
justifyContent: 'center',
height: '100%',
'& h1': {
textAlign: 'center',
},
},
errorsContainer: {
display: 'flex',
justifyContent: 'center',
},
errorContainer: {
textAlign: 'left',
justifyContent: 'center',
margin: '3rem 6rem',
width: '30vw',
},
};
class ErrorBoundary extends React.Component {
static getDerivedStateFromError(error) {
// Update state so the next render will show the fallback UI.
return {
hasError: true,
error: JSON.stringify(error, Object.getOwnPropertyNames(error)),
};
}
componentDidCatch(error, errorInfo) {
// You can also log the error to an error reporting service
this.setState({
err: error,
error: JSON.stringify(error, Object.getOwnPropertyNames(error)),
errorInfo: JSON.stringify(
errorInfo,
Object.getOwnPropertyNames(errorInfo)
),
});
}
constructor(props) {
super(props);
this.state = {hasError: false};
}
render() {
const {classes} = this.props;
if (this.state.hasError) {
// You can render any custom fallback UI
return (
<div className={classes.errorBoundaryContainer}>
<h1>😓 App has crashed!</h1>
<div className={classes.errorsContainer}>
<p className={classes.errorContainer}>
Stack Trace: <TextAreaWithCopyButton text={this.state.error} />
</p>
<p className={classes.errorContainer}>
Error Info: <TextAreaWithCopyButton text={this.state.errorInfo} />
</p>
</div>
<CreateIssue state={this.state} />
</div>
);
}
return this.props.children;
}
}
export default withStyles(styles)(ErrorBoundary);