feat: add scenario launch confimation dialog

Cosmo-Tech · Mar 16, 2022 · 282d3ab · 282d3ab
1 parent ff7d4cc
commit 282d3ab
Show file tree

Hide file tree

Showing 3 changed files with 57 additions and 16 deletions.
diff --git a/public/locales/en/translation.json b/public/locales/en/translation.json
@@ -287,10 +287,16 @@
         "parameters": {
           "button": {
             "cancel": "Cancel",
-            "validate": "Discard"
+            "validate": "Discard",
+            "launch": "Launch"
           },
           "title": "Discard current modifications ?",
-          "body": "You will lose all your current changes made on the scenario parameters."
+          "body": "You will lose all your current changes made on the scenario parameters.", 
+          "confirmLaunchDialog": {
+            "title": "Launch scenario ?",
+            "body": "Running a scenario can take time. Any existing results for this scenario will be overwriten.",
+            "checkbox": "Don't ask again"
+          }
         }
       },
       "about": {

diff --git a/public/locales/fr/translation.json b/public/locales/fr/translation.json
@@ -287,10 +287,16 @@
         "parameters": {
           "button": {
             "cancel": "Annuler",
-            "validate": "Abandonner"
+            "validate": "Abandonner",
+            "launch": "Lancer"
           },
           "title": "Abandonner les modifications ?",
-          "body": "Vous allez perdre toutes les modifications que vous avez faites sur les paramètres de scénario."
+          "body": "Vous allez perdre toutes les modifications que vous avez faites sur les paramètres de scénario.",
+          "confirmLaunchDialog": {
+            "title": "Lancer le scenario ?",
+            "body": "Lancer un scénario peut prendre du temps. Tous les résultats existants pour ce scénario seront écrasés.",
+            "checkbox": "Ne pas demander la prochaine fois."
+          }
         }
       },
       "about": {

diff --git a/src/components/ScenarioParameters/ScenarioParameters.js b/src/components/ScenarioParameters/ScenarioParameters.js
@@ -9,7 +9,7 @@ import { SCENARIO_PARAMETERS_CONFIG } from '../../config/ScenarioParameters';
 import { DATASET_ID_VARTYPE, SCENARIO_RUN_STATE } from '../../services/config/ApiConstants';
 import { EditModeButton, NormalModeButton, ScenarioParametersTabs } from './components';
 import { useTranslation } from 'react-i18next';
-import { SimpleTwoActionsDialog } from '@cosmotech/ui';
+import { SimpleTwoActionsDialog, DontAskAgainDialog } from '@cosmotech/ui';
 import { FileManagementUtils } from './FileManagementUtils';
 import { ScenarioParametersUtils } from '../../utils';
 import { ScenarioParametersTabFactory } from '../../utils/scenarioParameters/factories/ScenarioParametersTabFactory';
@@ -225,19 +225,33 @@ const ScenarioParameters = ({
     }
     changeEditMode(true);
   };
-  const askDiscardConfirmation = (event) => {
-    event.stopPropagation();
-    setShowDiscardConfirmationPopup(true);
+
+  const [showWarningBeforeLaunchPopup, setShowWarningBeforeLaunchPopup] = useState(false);
+  const closeConfirmLaunchDialog = () => {
+    setShowWarningBeforeLaunchPopup(false);
   };
-  const startScenarioLaunch = async (event) => {
+
+  const updateBeforeLaunch = useRef(null);
+
+  const confirmAndLaunch = (event, updateBeforeLaunch_) => {
     event.stopPropagation();
-    await processScenarioLaunch(ScenarioParametersUtils.shouldForceUpdateScenarioParameters());
+    updateBeforeLaunch.current = updateBeforeLaunch_;
+    if (localStorage.getItem('dontAskAgainToConfirmLaunch') === 'true') {
+      startScenarioLaunch();
+    } else {
+      setShowWarningBeforeLaunchPopup(true);
+    }
   };
-  const startScenarioUpdateAndLaunch = async (event) => {
-    event.stopPropagation();
-    await processScenarioLaunch(true);
+
+  const startScenarioLaunch = async () => {
+    const forceUpdate = ScenarioParametersUtils.shouldForceUpdateScenarioParameters();
+    await processScenarioLaunch(forceUpdate || updateBeforeLaunch.current);
   };
 
+  const askDiscardConfirmation = (event) => {
+    event.stopPropagation();
+    setShowDiscardConfirmationPopup(true);
+  };
   const cancelDiscard = () => {
     setShowDiscardConfirmationPopup(false);
   };
@@ -297,13 +311,13 @@ const ScenarioParameters = ({
                   <EditModeButton
                     classes={classes}
                     handleClickOnDiscardChange={(event) => askDiscardConfirmation(event)}
-                    handleClickOnUpdateAndLaunchScenario={(event) => startScenarioUpdateAndLaunch(event)}
+                    handleClickOnUpdateAndLaunchScenario={(event) => confirmAndLaunch(event, true)}
                   />
                 ) : (
                   <NormalModeButton
                     classes={classes}
                     handleClickOnEdit={(event) => startParametersEdition(event)}
-                    handleClickOnLaunchScenario={(event) => startScenarioLaunch(event)}
+                    handleClickOnLaunchScenario={(event) => confirmAndLaunch(event, false)}
                     editDisabled={noTabsShown || isCurrentScenarioRunning}
                     runDisabled={isCurrentScenarioRunning}
                   />
@@ -330,11 +344,26 @@ const ScenarioParameters = ({
           body: t('genericcomponent.dialog.scenario.parameters.body'),
           button1: t('genericcomponent.dialog.scenario.parameters.button.cancel'),
           button2: t('genericcomponent.dialog.scenario.parameters.button.validate'),
-          ariaLabelledby: 'discard-changes-dialog',
         }}
         handleClickOnButton1={cancelDiscard}
         handleClickOnButton2={confirmDiscard}
       />
+      <DontAskAgainDialog
+        id={'launch'}
+        open={showWarningBeforeLaunchPopup}
+        labels={{
+          title: t('genericcomponent.dialog.scenario.parameters.confirmLaunchDialog.title'),
+          body: t('genericcomponent.dialog.scenario.parameters.confirmLaunchDialog.body'),
+          cancel: t('genericcomponent.dialog.scenario.parameters.button.cancel'),
+          confirm: t('genericcomponent.dialog.scenario.parameters.button.launch'),
+          checkbox: t('genericcomponent.dialog.scenario.parameters.confirmLaunchDialog.checkbox'),
+        }}
+        onClose={closeConfirmLaunchDialog}
+        onConfirm={(dontAskAgain) => {
+          localStorage.setItem('dontAskAgainToConfirmLaunch', dontAskAgain);
+          startScenarioLaunch();
+        }}
+      />
     </div>
   );
 };