Blocking page refresh when forms are filled. Fixes #671

This commit is contained in:
Dessalines 2020-07-08 14:32:37 -04:00
parent d720993141
commit 32d43b85b9
5 changed files with 62 additions and 0 deletions

View File

@ -108,8 +108,17 @@ export class CommentForm extends Component<CommentFormProps, CommentFormState> {
});
}
componentDidUpdate() {
if (this.state.commentForm.content) {
window.onbeforeunload = () => true;
} else {
window.onbeforeunload = undefined;
}
}
componentWillUnmount() {
this.subscription.unsubscribe();
window.onbeforeunload = null;
}
render() {

View File

@ -97,8 +97,22 @@ export class CommunityForm extends Component<
});
}
componentDidUpdate() {
if (
!this.state.loading &&
(this.state.communityForm.name ||
this.state.communityForm.title ||
this.state.communityForm.description)
) {
window.onbeforeunload = () => true;
} else {
window.onbeforeunload = undefined;
}
}
componentWillUnmount() {
this.subscription.unsubscribe();
window.onbeforeunload = null;
}
render() {

View File

@ -151,8 +151,22 @@ export class PostForm extends Component<PostFormProps, PostFormState> {
setupTippy();
}
componentDidUpdate() {
if (
!this.state.loading &&
(this.state.postForm.name ||
this.state.postForm.url ||
this.state.postForm.body)
) {
window.onbeforeunload = () => true;
} else {
window.onbeforeunload = undefined;
}
}
componentWillUnmount() {
this.subscription.unsubscribe();
window.onbeforeunload = null;
}
render() {

View File

@ -110,8 +110,17 @@ export class PrivateMessageForm extends Component<
setupTippy();
}
componentDidUpdate() {
if (!this.state.loading && this.state.privateMessageForm.content) {
window.onbeforeunload = () => true;
} else {
window.onbeforeunload = undefined;
}
}
componentWillUnmount() {
this.subscription.unsubscribe();
window.onbeforeunload = null;
}
render() {

View File

@ -64,6 +64,22 @@ export class SiteForm extends Component<SiteFormProps, SiteFormState> {
this.setState(this.state);
}
componentDidUpdate() {
if (
!this.state.loading &&
!this.props.site &&
(this.state.siteForm.name || this.state.siteForm.description)
) {
window.onbeforeunload = () => true;
} else {
window.onbeforeunload = undefined;
}
}
componentWillUnmount() {
window.onbeforeunload = null;
}
render() {
return (
<>