diff --git a/src/ui/component/errorBoundary/view.jsx b/src/ui/component/errorBoundary/view.jsx
index 39751f9e0..632f0c2d2 100644
--- a/src/ui/component/errorBoundary/view.jsx
+++ b/src/ui/component/errorBoundary/view.jsx
@@ -3,19 +3,25 @@ import { Lbryio } from 'lbryinc';
import * as React from 'react';
import Yrbl from 'component/yrbl';
import Button from 'component/button';
+import { withRouter } from 'react-router';
type Props = {
children: React.Node,
+ history: {
+ replace: string => void,
+ },
};
type State = {
hasError: boolean,
};
-export default class ErrorBoundary extends React.Component {
+class ErrorBoundary extends React.Component {
constructor() {
super();
this.state = { hasError: false };
+
+ (this: any).refresh = this.refresh.bind(this);
}
static getDerivedStateFromError() {
@@ -35,6 +41,13 @@ export default class ErrorBoundary extends React.Component {
}
}
+ refresh() {
+ const { history } = this.props;
+ // use history.replace instead of history.push so the user can't click back to the errored page
+ history.replace('');
+ this.setState({ hasError: false });
+ }
+
render() {
if (this.state.hasError) {
return (
@@ -50,7 +63,7 @@ export default class ErrorBoundary extends React.Component {
button="link"
className="load-screen__button"
label={__('refreshing the app')}
- onClick={() => (window.location.href = '/')}
+ onClick={this.refresh}
/>{' '}
{__('to fix it')}.
@@ -64,3 +77,5 @@ export default class ErrorBoundary extends React.Component {
return this.props.children;
}
}
+
+export default withRouter(ErrorBoundary);