From a1c7f6836adb7e3e6a65b428ef8e911c11a16edc Mon Sep 17 00:00:00 2001
From: Deerjason <jasonniu@buffalo.edu>
Date: Fri, 22 Nov 2019 13:22:23 -0500
Subject: [PATCH] Group Page Exiting Without Saving Popup #99

---
 frontend/app/containers/Pages/Group/Group.js  | 19 +++++++++++++++++--
 .../Pages/GroupCreation/GroupCreation.js      |  4 ++--
 2 files changed, 19 insertions(+), 4 deletions(-)

diff --git a/frontend/app/containers/Pages/Group/Group.js b/frontend/app/containers/Pages/Group/Group.js
index dd0f74e..4696e63 100644
--- a/frontend/app/containers/Pages/Group/Group.js
+++ b/frontend/app/containers/Pages/Group/Group.js
@@ -82,6 +82,18 @@ class Group extends Component {
     onGetGroup(payload);
   }
 
+  componentDidUpdate = () => {
+    if (this.state.changed.length > 0) {
+      window.onbeforeunload = () => true;
+    } else {
+      window.onbeforeunload = undefined;
+    }
+  };
+
+  componentWillUnmount() {
+    window.onbeforeunload = undefined;
+  }
+
   handleJoinGroup = () => {
     const { onJoinGroup } = this.props;
     const payload = { groupId: this.props.match.params.groupId };
@@ -92,6 +104,9 @@ class Group extends Component {
     const { onLeaveGroup } = this.props;
     const payload = { groupId: this.props.match.params.groupId };
     onLeaveGroup(payload);
+    this.setState({
+      loading: true,
+    });
   };
 
   handleUpdateGroup = () => {
@@ -185,7 +200,7 @@ class Group extends Component {
                   className={classes.description}
                   text={this.state.description}
                   onChange={this.handleDescriptionChange}
-                  placeholder="Group Description"
+                  placeholder="Group Description - Try Highlighting Your Text!"
                 />
                 <div className={classes.languagesMenu}>
                   <LangMenu
@@ -228,7 +243,7 @@ class Group extends Component {
                     className={classes.contactPopup}
                     text={this.state.contact}
                     onChange={this.handleContactChange}
-                    placeholder="Group Contact"
+                    placeholder="Group Contact - Try Highlighting Your Text!"
                   />
                 </Popup>
               </Grid>
diff --git a/frontend/app/containers/Pages/GroupCreation/GroupCreation.js b/frontend/app/containers/Pages/GroupCreation/GroupCreation.js
index 27394a3..ead30d7 100644
--- a/frontend/app/containers/Pages/GroupCreation/GroupCreation.js
+++ b/frontend/app/containers/Pages/GroupCreation/GroupCreation.js
@@ -82,7 +82,7 @@ class GroupCreation extends Component {
               className={classes.description}
               text={this.state.description}
               onChange={this.handleDescriptionChange}
-              placeholder="Group Description"
+              placeholder="Group Description - Try Highlighting Your Text!"
             />
             <div className={classes.languages}>
               <LangMenu
@@ -114,7 +114,7 @@ class GroupCreation extends Component {
                 className={classes.contactPopup}
                 text={this.state.contact}
                 onChange={this.handleContactChange}
-                placeholder="Group Contact"
+                placeholder="Group Contact - Try Highlighting Your Text!"
               />
             </Popup>
           </Grid>