add listeners for closing page without stopping edit

survey-frontend/src/SurveyContainerComponent.tsx

@@ -126,6 +126,15 @@ function SurveyContainerComponent({ loadFrom, saveTo = '' }) {
         }
     }
 
+    const beforeUnloadListener = (event) => {
+        event.preventDefault();
+        return (event.returnValue = "");
+    };
+
+    const pageHideListener = (event) => {
+        window.navigator.sendBeacon('/api/survey/unlock/' + year + '/' + nren, JSON.stringify({some: "data"}))
+    }
+
     const doSurveyAction = (action) => {
         switch(action) {
             case 'save':
@@ -137,9 +146,13 @@ function SurveyContainerComponent({ loadFrom, saveTo = '' }) {
             case 'saveAndStopEdit':
                 saveSurveyData(surveyModel);  // TODO include stop editing
                 surveyModel.mode = 'display';
+                removeEventListener("beforeunload", beforeUnloadListener, { capture: true });
+                removeEventListener("pagehide", pageHideListener);
                 break;
             case 'startEdit':
                 // TODO lock http request
+                addEventListener("pagehide", pageHideListener);
+                addEventListener("beforeunload", beforeUnloadListener, { capture: true });
                 surveyModel.mode = 'edit';
                 break;
         }

survey-frontend/src/SurveyManagementComponent.tsx

@@ -100,7 +100,7 @@ function SurveyManagementComponent() {
                                             <td>
                                                 <Button onClick={() => navigate(`/survey/respond/${survey.year}/${response.nren}`)} style={{ pointerEvents: 'auto' }}
                                                     title="Open the responses of the NREN.">
-                                                    edit
+                                                    open
                                                 </Button>
 
                                                 remove lock (only available when locked)