refactor-warnIfUnsavedChanges #1458

This commit is contained in:
Sai Jatin K 2020-07-02 17:58:45 +05:30
parent 69bd6cb4a0
commit 707db59458
No known key found for this signature in database
GPG key ID: 58A469B796EA80DF

View file

@ -43,11 +43,29 @@ function isUserOwner(props) {
return props.project.owner && props.project.owner.id === props.user.id; return props.project.owner && props.project.owner.id === props.user.id;
} }
function warnIfUnsavedChanges(props) { // eslint-disable-line
const { route } = props.route;
if (route && (route.action === 'PUSH' && (route.pathname === '/login' || route.pathname === '/signup'))) {
// don't warn
props.persistState();
window.onbeforeunload = null;
} else if (route && (props.location.pathname === '/login' || props.location.pathname === '/signup')) {
// don't warn
props.persistState();
window.onbeforeunload = null;
} else if (props.ide.unsavedChanges) {
if (!window.confirm('Are you sure you want to leave this page? You have unsaved changes.')) {
return false;
}
props.setUnsavedChanges(false);
return true;
}
}
class IDEView extends React.Component { class IDEView extends React.Component {
constructor(props) { constructor(props) {
super(props); super(props);
this.handleGlobalKeydown = this.handleGlobalKeydown.bind(this); this.handleGlobalKeydown = this.handleGlobalKeydown.bind(this);
this.warnIfUnsavedChanges = this.warnIfUnsavedChanges.bind(this);
this.state = { this.state = {
consoleSize: props.ide.consoleIsExpanded ? 150 : 29, consoleSize: props.ide.consoleIsExpanded ? 150 : 29,
@ -71,9 +89,9 @@ class IDEView extends React.Component {
this.isMac = navigator.userAgent.toLowerCase().indexOf('mac') !== -1; this.isMac = navigator.userAgent.toLowerCase().indexOf('mac') !== -1;
document.addEventListener('keydown', this.handleGlobalKeydown, false); document.addEventListener('keydown', this.handleGlobalKeydown, false);
this.props.router.setRouteLeaveHook(this.props.route, route => this.warnIfUnsavedChanges(route)); this.props.router.setRouteLeaveHook(this.props.route, () => warnIfUnsavedChanges(this.props));
window.onbeforeunload = () => this.warnIfUnsavedChanges(); window.onbeforeunload = () => warnIfUnsavedChanges();
this.autosaveInterval = null; this.autosaveInterval = null;
} }
@ -122,7 +140,7 @@ class IDEView extends React.Component {
} }
if (this.props.route.path !== prevProps.route.path) { if (this.props.route.path !== prevProps.route.path) {
this.props.router.setRouteLeaveHook(this.props.route, route => this.warnIfUnsavedChanges(route)); this.props.router.setRouteLeaveHook(this.props.route, () => warnIfUnsavedChanges(this.props));
} }
} }
@ -186,24 +204,6 @@ class IDEView extends React.Component {
} }
} }
warnIfUnsavedChanges(route) { // eslint-disable-line
if (route && (route.action === 'PUSH' && (route.pathname === '/login' || route.pathname === '/signup'))) {
// don't warn
this.props.persistState();
window.onbeforeunload = null;
} else if (route && (this.props.location.pathname === '/login' || this.props.location.pathname === '/signup')) {
// don't warn
this.props.persistState();
window.onbeforeunload = null;
} else if (this.props.ide.unsavedChanges) {
if (!window.confirm('Are you sure you want to leave this page? You have unsaved changes.')) {
return false;
}
this.props.setUnsavedChanges(false);
return true;
}
}
render() { render() {
return ( return (
<div className="ide"> <div className="ide">
@ -212,7 +212,7 @@ class IDEView extends React.Component {
</Helmet> </Helmet>
{this.props.toast.isVisible && <Toast />} {this.props.toast.isVisible && <Toast />}
<Nav <Nav
warnIfUnsavedChanges={this.warnIfUnsavedChanges} warnIfUnsavedChanges={() => warnIfUnsavedChanges(this.props)}
cmController={this.cmController} cmController={this.cmController}
/> />
<Toolbar /> <Toolbar />
@ -604,7 +604,6 @@ IDEView.propTypes = {
showErrorModal: PropTypes.func.isRequired, showErrorModal: PropTypes.func.isRequired,
hideErrorModal: PropTypes.func.isRequired, hideErrorModal: PropTypes.func.isRequired,
clearPersistedState: PropTypes.func.isRequired, clearPersistedState: PropTypes.func.isRequired,
persistState: PropTypes.func.isRequired,
showRuntimeErrorWarning: PropTypes.func.isRequired, showRuntimeErrorWarning: PropTypes.func.isRequired,
hideRuntimeErrorWarning: PropTypes.func.isRequired, hideRuntimeErrorWarning: PropTypes.func.isRequired,
startSketch: PropTypes.func.isRequired, startSketch: PropTypes.func.isRequired,