[airavata-django-portal] 02/05: AIRAVATA-3453 Adding post-save/launch navigation

[ma...@apache.org]

This is an automated email from the ASF dual-hosted git repository.

machristie pushed a commit to branch develop
in repository https://gitbox.apache.org/repos/asf/airavata-django-portal.git

commit 72486c672990b1bd55db7e9799aa5557a4f9d750
Author: Marcus Christie <ma...@apache.org>
AuthorDate: Thu Jun 24 16:59:08 2021 -0400

    AIRAVATA-3453 Adding post-save/launch navigation
    
    The default behavior is overrideable via custom events.
---
 .../js/web-components/ExperimentEditor.vue         | 39 +++++++++++++++++++---
 1 file changed, 35 insertions(+), 4 deletions(-)

diff --git a/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/ExperimentEditor.vue b/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/ExperimentEditor.vue
index 291bb29..22c1fbe 100644
--- a/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/ExperimentEditor.vue
+++ b/django_airavata/apps/workspace/static/django_airavata_workspace/js/web-components/ExperimentEditor.vue
@@ -62,6 +62,7 @@ import {
 
 import Vue from "vue";
 import { BootstrapVue } from "bootstrap-vue";
+import urls from "../utils/urls";
 Vue.use(BootstrapVue);
 
 export default {
@@ -145,15 +146,45 @@ export default {
         return;
       }
       if (event.submitter.name === "save-experiment-button") {
-        this.saveExperiment();
+        await saveExperiment(this.experiment);
+        this.postSave();
+        return;
       } else {
         // Default submit button handling is save and launch
-        const experiment = await this.saveExperiment();
+        const experiment = await saveExperiment(this.experiment);
         await launchExperiment(experiment.experimentId);
+        this.postSaveAndLaunch(experiment);
+        return;
       }
     },
-    async saveExperiment() {
-      return await saveExperiment(this.experiment);
+    postSave() {
+      // client code can listen for 'saved' and preventDefault() on it to handle
+      // it differently. Default action is to navigate to experiments list.
+      const savedEvent = new CustomEvent("saved", {
+        detail: [this.experiment],
+        cancelable: true,
+        composed: true,
+      });
+      this.$el.dispatchEvent(savedEvent);
+      if (savedEvent.defaultPrevented) {
+        return;
+      }
+      urls.navigateToExperimentsList();
+    },
+    postSaveAndLaunch(experiment) {
+      // client code can listen for 'saved-and-launched' and preventDefault() on
+      // it to handle it differently. Default action is to navigate to
+      // the experiment summary page.
+      const savedAndLaunchedEvent = new CustomEvent("saved-and-launched", {
+        detail: [this.experiment],
+        cancelable: true,
+        composed: true,
+      });
+      this.$el.dispatchEvent(savedAndLaunchedEvent);
+      if (savedAndLaunchedEvent.defaultPrevented) {
+        return;
+      }
+      urls.navigateToViewExperiment(experiment, { launching: true });
     },
     async loadExperiment() {
       if (this.experimentId) {