From 3b4fb2adfe2b62550824eb82f544299068f27e87 Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Wed, 15 Nov 2023 12:26:03 -0600
Subject: [PATCH 01/10] Applying eslint

---
 .../scripts/components/ScriptEditor.vue       | 157 ++++++++++++++----
 1 file changed, 121 insertions(+), 36 deletions(-)

diff --git a/resources/js/processes/scripts/components/ScriptEditor.vue b/resources/js/processes/scripts/components/ScriptEditor.vue
index d288bbbd7a..e57cfe2d85 100644
--- a/resources/js/processes/scripts/components/ScriptEditor.vue
+++ b/resources/js/processes/scripts/components/ScriptEditor.vue
@@ -1,58 +1,108 @@
 <template>
   <b-container class="h-100">
-    <b-card no-body class="h-100" >
-      <top-menu v-show="!previewChanges" ref="menuScript" :options="optionsMenu" />
-      <b-card-body ref="editorContainer" class="overflow-hidden p-4" >
+    <b-card
+      no-body
+      class="h-100"
+    >
+      <top-menu
+        v-show="!previewChanges"
+        ref="menuScript"
+        :options="optionsMenu"
+      />
+      <b-card-body
+        ref="editorContainer"
+        class="overflow-hidden p-4"
+      >
         <b-row class="h-100">
-          <b-col :cols="previewChanges && action !== 'generate' ? 12 : 9" class="h-100 p-0">
+          <b-col
+            :cols="previewChanges && action !== 'generate' ? 12 : 9"
+            class="h-100 p-0"
+          >
             <b-row class="h-100 w-100">
-              <b-col cols="12" class="h-100 p-0">
-                <div v-if="packageAi" v-show="showDiffEditor || showExplainEditor">
+              <b-col
+                cols="12"
+                class="h-100 p-0"
+              >
+                <div
+                  v-if="packageAi"
+                  v-show="showDiffEditor || showExplainEditor"
+                >
                   <div class="d-flex">
                     <div class="left-header-width pb-3 pl-3">
                       <div class="card-header h-100 d-flex align-items-center justify-content-between editor-header-border">
                         <span>{{ $t('Current Script') }}</span>
                       </div>
                     </div>
-                    <div v-if="showDiffEditor" class="right-header-width pb-3 pl-3">
+                    <div
+                      v-if="showDiffEditor"
+                      class="right-header-width pb-3 pl-3"
+                    >
                       <div class="card-header h-100 bg-primary-light d-flex align-items-center justify-content-between editor-header-border pulse header-x-padding">
                         <span>{{ $t('AI Generated Response') }}</span>
                         <div>
-                          <button class="btn btn-sm btn-light" @click="cancelChanges()">{{ $t('Cancel') }}</button>
-                          <button class="btn btn-sm btn-primary" @click="applyChanges()" v-b-tooltip.hover :title="$t('Apply recommended changes')">{{ $t('Apply changes  ') }}</button>
+                          <button
+                            class="btn btn-sm btn-light"
+                            @click="cancelChanges()"
+                          >
+                            {{ $t('Cancel') }}
+                          </button>
+                          <button
+                            v-b-tooltip.hover
+                            class="btn btn-sm btn-primary"
+                            :title="$t('Apply recommended changes')"
+                            @click="applyChanges()"
+                          >
+                            {{ $t('Apply changes  ') }}
+                          </button>
                         </div>
                       </div>
                     </div>
-                    <div v-else-if="showExplainEditor" class="right-header-width pb-3 pl-3">
+                    <div
+                      v-else-if="showExplainEditor"
+                      class="right-header-width pb-3 pl-3"
+                    >
                       <div class="card-header h-100 bg-primary-light d-flex align-items-center justify-content-between editor-header-border header-x-padding">
                         <span>{{ $t('AI Explanation') }}</span>
                         <div>
-                          <button class="btn" @click="closeExplanation()" v-b-tooltip.hover :title="$t('Close Explanation')">
-                            <i class="fa fa-times"></i>
-                        </button>
+                          <button
+                            v-b-tooltip.hover
+                            class="btn"
+                            :title="$t('Close Explanation')"
+                            @click="closeExplanation()"
+                          >
+                            <i class="fa fa-times" />
+                          </button>
                         </div>
                       </div>
                     </div>
                   </div>
                 </div>
-                <div class="d-flex justify-content-between" :class="{'h-100': !(showExplainEditor || showDiffEditor), 'editors-container': showExplainEditor || showDiffEditor}">
+                <div
+                  class="d-flex justify-content-between"
+                  :class="{'h-100': !(showExplainEditor || showDiffEditor), 'editors-container': showExplainEditor || showDiffEditor}"
+                >
                   <monaco-editor
-                    ref="editor"
                     v-show="showEditor"
+                    ref="editor"
                     v-model="code"
                     :class="[{hidden: resizing}, showExplainEditor ? 'w-50' : 'w-100']"
                     :options="monacoOptions"
                     :language="language"
                     :diff-editor="false"
                   />
-                  <div v-if="showExplainEditor" class="w-50 h-100 py-2 px-4 explain-editor-container">
-                    <div class="mx-auto explain-editor pb-5" v-html="newCode">
-                    </div>
+                  <div
+                    v-if="showExplainEditor"
+                    class="w-50 h-100 py-2 px-4 explain-editor-container"
+                  >
+                    <div
+                      class="mx-auto explain-editor pb-5"
+                      v-html="newCode"
+                    />
                   </div>
 
                   <monaco-editor
-                    ref="diffEditor"
                     v-show="showDiffEditor"
+                    ref="diffEditor"
                     class="diff-height w-100"
                     :class="{hidden: resizing}"
                     :options="monacoOptionsDiff"
@@ -67,34 +117,63 @@
           </b-col>
 
           <!-- Progress panel -->
-          <b-col v-if="packageAi && loading" cols="3" class="h-100">
+          <b-col
+            v-if="packageAi && loading"
+            cols="3"
+            class="h-100"
+          >
             <div class="h-100 px-5 d-flex justify-items-center justify-content-center flex-column progress-panel">
               <div class="w-100 d-flex justify-content-between text-muted">
                 <div><small>{{ loaderAction }}...</small></div>
-                <div v-if="progress.progress"><small>{{ Math.trunc(progress.progress) }}%</small></div>
+                <div v-if="progress.progress">
+                  <small>{{ Math.trunc(progress.progress) }}%</small>
+                </div>
               </div>
               <div class="progress">
-                <div class="progress-bar progress-bar-striped progress-bar-animated" role="progressbar" :style="{'width': progress.progress + '%'}" :aria-valuenow="progress.progress" aria-valuemin="0" aria-valuemax="100"></div>
+                <div
+                  class="progress-bar progress-bar-striped progress-bar-animated"
+                  role="progressbar"
+                  :style="{'width': progress.progress + '%'}"
+                  :aria-valuenow="progress.progress"
+                  aria-valuemin="0"
+                  aria-valuemax="100"
+                />
               </div>
               <div class="text-right progress-panel-footer">
-                <button class="btn btn-light" @click="cancelRequest()">{{ $t('Cancel') }}</button>
+                <button
+                  class="btn btn-light"
+                  @click="cancelRequest()"
+                >
+                  {{ $t('Cancel') }}
+                </button>
               </div>
             </div>
           </b-col>
 
           <!-- Right panel -->
-          <b-col v-if="!loading && !previewChanges" cols="3" class="h-100">
-            <b-card no-body class="h-100">
+          <b-col
+            v-if="!loading && !previewChanges"
+            cols="3"
+            class="h-100"
+          >
+            <b-card
+              no-body
+              class="h-100"
+            >
               <b-card-header class="light-gray-background">
                 <b-row class="d-flex align-items-center">
                   <b-col>{{ $t('Debugger') }}</b-col>
 
-                  <b-col align-self="end" class="text-right">
+                  <b-col
+                    align-self="end"
+                    class="text-right"
+                  >
                     <b-button
                       class="text-capitalize pl-3 pr-3"
                       :disabled="preview.executing"
                       size="sm"
-                      @click="execute" >
+                      @click="execute"
+                    >
                       <i class="fas fa-caret-square-right" />
                       {{ $t('Run') }}
                     </b-button>
@@ -113,7 +192,7 @@
                     :package-ai="packageAi"
                     :process-id="processId"
                     :default-prompt="prompt"
-                    :lineContext="lineContext"
+                    :line-context="lineContext"
                     @get-selection="onGetSelection"
                     @request-started="onRequestStarted"
                     @current-nonce-changed="onCurrentNonceChanged"
@@ -186,8 +265,8 @@
                       </b-col>
                       <b-col class="text-right">
                         <button
-                          type="button"
                           v-b-modal.data-preview
+                          type="button"
                           class="btn-sm float-right"
                           @click.stop
                         >
@@ -231,8 +310,15 @@
           </b-col>
 
           <!-- Right Panel generate script -->
-          <b-col v-if="!loading && previewChanges && action ==='generate'" cols="3" class="h-100">
-            <b-card no-body class="h-100">
+          <b-col
+            v-if="!loading && previewChanges && action ==='generate'"
+            cols="3"
+            class="h-100"
+          >
+            <b-card
+              no-body
+              class="h-100"
+            >
               <b-card-header class="light-gray-background">
                 {{ $t('Generate Script From Text') }}
               </b-card-header>
@@ -243,12 +329,12 @@
                     ref="aiTab2"
                     :default-prompt="prompt"
                     :user="user"
-                    :sourceCode="code"
+                    :source-code="code"
                     :language="language"
                     :selection="selection"
                     :package-ai="packageAi"
                     :default-selected="'generate'"
-                    :lineContext="lineContext"
+                    :line-context="lineContext"
                     @get-selection="onGetSelection"
                     @request-started="onRequestStarted"
                     @current-nonce-changed="onCurrentNonceChanged"
@@ -304,10 +390,9 @@
         <b-col cols="6">
           <tree-view
             v-model="stringifyJson"
-            :iframeHeight="iframeHeight"
+            :iframe-height="iframeHeight"
             style="border:1px; solid gray;"
-          >
-          </tree-view>
+          />
         </b-col>
       </b-row>
     </b-modal>

From 7ba93de0922ed05f401464bdc8b038bc6d49e660 Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Thu, 16 Nov 2023 09:33:29 -0600
Subject: [PATCH 02/10] WIP

---
 .../scripts/components/CreateScriptModal.vue  | 36 +++++++++++--------
 .../scripts/components/ScriptEditor.vue       | 12 +++++++
 2 files changed, 34 insertions(+), 14 deletions(-)

diff --git a/resources/js/processes/scripts/components/CreateScriptModal.vue b/resources/js/processes/scripts/components/CreateScriptModal.vue
index 61456cc198..3be16c8d43 100644
--- a/resources/js/processes/scripts/components/CreateScriptModal.vue
+++ b/resources/js/processes/scripts/components/CreateScriptModal.vue
@@ -258,6 +258,9 @@ export default {
       this.title = "";
       return this.$t("Create Script");
     },
+    isProjectRoute() {
+      return window.location.pathname.startsWith("/designer/projects/");
+    },
   },
   methods: {
     show() {
@@ -313,21 +316,12 @@ export default {
             hook.onsave(data);
           });
 
-          const url = `/designer/scripts/${data.id}/builder`;
-
-          if (this.callFromAiModeler) {
-            this.$emit("script-created-from-modeler", url, data.id, data.title);
-          } else if (this.copyAssetMode) {
-            this.close();
-          } else {
-            if (this.isQuickCreate === true) {
-              channel.postMessage({
-                assetType: "script",
-                asset: data,
-              });
-            }
-            window.location = url;
+          const url = new URL(`/designer/scripts/${data.id}/builder`, window.location.origin);
+          if (this.isProjectRoute) {
+            url.searchParams.append("project_id", this.projectId);
           }
+
+          this.handleRedirection(url, data);
         })
         .catch((error) => {
           this.disabled = false;
@@ -338,6 +332,20 @@ export default {
           }
         });
     },
+    handleRedirection(url, data) {
+      if (this.callFromAiModeler) {
+        this.$emit("script-created-from-modeler", url, data.id, data.title);
+      } else if (this.copyAssetMode) {
+        this.close();
+      } else if (this.isQuickCreate === true) {
+        channel.postMessage({
+          assetType: "script",
+          asset: data,
+        });
+      } else {
+        window.location.href = url;
+      }
+    },
   },
 };
 </script>
diff --git a/resources/js/processes/scripts/components/ScriptEditor.vue b/resources/js/processes/scripts/components/ScriptEditor.vue
index e57cfe2d85..3b25c51fe9 100644
--- a/resources/js/processes/scripts/components/ScriptEditor.vue
+++ b/resources/js/processes/scripts/components/ScriptEditor.vue
@@ -597,6 +597,9 @@ export default {
     ProcessMaker.EventBus.$on("script-discard", () => {
       this.discardDraft();
     });
+    ProcessMaker.EventBus.$on("handle-redirects", () => {
+      this.handleRedirects();
+    });
 
     window.addEventListener("resize", this.handleResize);
     const userID = document.head.querySelector("meta[name=\"user-id\"]");
@@ -856,6 +859,7 @@ export default {
           if (this.processId !== 0 && this.processId !== undefined && shouldRedirect) {
             window.location = `/modeler/${this.processId}`;
           }
+          window.ProcessMaker.EventBus.$emit("handle-redirects");
         }).catch((err) => {
           if (typeof onError === "function") {
             onError(err);
@@ -938,6 +942,14 @@ export default {
         }, 4);
       }
     },
+    async handleRedirects() {
+      const queryParams = new URLSearchParams(window.location.search);
+      const projectId = queryParams.get("project_id");
+
+      if (projectId) {
+        window.location.href = `/designer/projects/${projectId}`;
+      }
+    },
   },
 };
 </script>

From cad78a77ebcea8eeddb1a7ce705ad7ee69d725d7 Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Tue, 21 Nov 2023 11:29:58 -0600
Subject: [PATCH 03/10] Refactor redirect event in ScriptEditor component

---
 .../scripts/components/ScriptEditor.vue       | 36 ++++++++++++++-----
 1 file changed, 27 insertions(+), 9 deletions(-)

diff --git a/resources/js/processes/scripts/components/ScriptEditor.vue b/resources/js/processes/scripts/components/ScriptEditor.vue
index 34289904d7..e8f7710d5d 100644
--- a/resources/js/processes/scripts/components/ScriptEditor.vue
+++ b/resources/js/processes/scripts/components/ScriptEditor.vue
@@ -441,12 +441,16 @@ export default {
       default: false,
     },
     packageAi: {
+      type: [String, Number],
       default: 0,
     },
     processId: {
+      type: Number,
       default: 0,
     },
     user: {
+      type: Object,
+      required: true,
     },
   },
   data() {
@@ -529,7 +533,7 @@ export default {
           },
         ],
       },
-      closeHref: "/designer/scripts",
+      redirectUrl: null,
     };
   },
   computed: {
@@ -570,6 +574,9 @@ export default {
           });
       };
     },
+    closeHref() {
+      return this.redirectUrl ? this.redirectUrl : "/designer/scripts";
+    },
   },
   watch: {
     "preview.output": "handlePreviewOutputChange",
@@ -597,8 +604,8 @@ export default {
     ProcessMaker.EventBus.$on("script-discard", () => {
       this.discardDraft();
     });
-    ProcessMaker.EventBus.$on("handle-redirects", () => {
-      this.handleRedirects();
+    ProcessMaker.EventBus.$on("redirect", () => {
+      this.handleRedirection();
     });
 
     window.addEventListener("resize", this.handleResize);
@@ -620,6 +627,8 @@ export default {
     if (this.processId !== 0) {
       this.prompt = `${this.script.title}\n${this.script.description}`;
     }
+
+    this.setRedirectUrl();
   },
 
   beforeDestroy() {
@@ -857,10 +866,13 @@ export default {
             onSuccess(response);
           }
 
-          if (this.processId !== 0 && this.processId !== undefined && shouldRedirect) {
-            window.location = `/modeler/${this.processId}`;
+          if (shouldRedirect) {
+            if (this.processId) {
+              window.location = `/modeler/${this.processId}`;
+            }
+
+            window.ProcessMaker.EventBus.$emit("redirect");
           }
-          window.ProcessMaker.EventBus.$emit("handle-redirects");
         }).catch((err) => {
           if (typeof onError === "function") {
             onError(err);
@@ -900,7 +912,8 @@ export default {
         }
 
         // Save boilerplate template to avoid issues when script code is [].
-        ProcessMaker.EventBus.$emit("save-script", false);
+        const shouldRedirect = false;
+        ProcessMaker.EventBus.$emit("save-script", shouldRedirect);
       }
     },
     setVersionIndicator(isDraft = null) {
@@ -943,12 +956,17 @@ export default {
         }, 4);
       }
     },
-    async handleRedirects() {
+    setRedirectUrl() {
       const queryParams = new URLSearchParams(window.location.search);
       const projectId = queryParams.get("project_id");
 
       if (projectId) {
-        window.location.href = `/designer/projects/${projectId}`;
+        this.redirectUrl = `/designer/projects/${projectId}`;
+      }
+    },
+    handleRedirection() {
+      if (this.redirectUrl) {
+        window.location.href = this.redirectUrl;
       }
     },
   },

From a1c39209d1730aece7f17d4f19ab4a1e0c18de85 Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Tue, 21 Nov 2023 12:53:23 -0600
Subject: [PATCH 04/10] Add asset redirect mixin

---
 resources/js/modules/assetRedirectMixin.js    | 14 ++++++
 .../screens/components/CreateScreenModal.vue  | 47 ++++++++++---------
 .../scripts/components/CreateScriptModal.vue  | 10 ++--
 3 files changed, 42 insertions(+), 29 deletions(-)
 create mode 100644 resources/js/modules/assetRedirectMixin.js

diff --git a/resources/js/modules/assetRedirectMixin.js b/resources/js/modules/assetRedirectMixin.js
new file mode 100644
index 0000000000..b36d49ed34
--- /dev/null
+++ b/resources/js/modules/assetRedirectMixin.js
@@ -0,0 +1,14 @@
+export default {
+  computed: {
+    isProjectRoute() {
+      return window.location.pathname.startsWith("/designer/projects/");
+    },
+  },
+  methods: {
+    appendProjectIdToURL(url, projectId) {
+      if (this.isProjectRoute) {
+        url.searchParams.append("project_id", projectId);
+      }
+    },
+  },
+};
diff --git a/resources/js/processes/screens/components/CreateScreenModal.vue b/resources/js/processes/screens/components/CreateScreenModal.vue
index 7466406596..cdc25b7f02 100644
--- a/resources/js/processes/screens/components/CreateScreenModal.vue
+++ b/resources/js/processes/screens/components/CreateScreenModal.vue
@@ -78,7 +78,7 @@
           v-if="isProjectsInstalled"
           v-model="formData.projects"
           :errors="errors.projects"
-          :projectId="projectId"
+          :project-id="projectId"
           :label="$t('Project')"
           :required="isProjectSelectionRequired"
           api-get="projects"
@@ -108,6 +108,7 @@ import {
   screenSelectId,
 } from "../../../utils/isQuickCreate";
 import { filterScreenType } from "../../../utils/filterScreenType";
+import AssetRedirectMixin from "../../../modules/assetRedirectMixin";
 
 const channel = new BroadcastChannel("assetCreation");
 
@@ -117,7 +118,7 @@ export default {
     Required,
     ProjectSelect,
   },
-  mixins: [FormErrorsMixin],
+  mixins: [FormErrorsMixin, AssetRedirectMixin],
   props: [
     "countCategories",
     "types",
@@ -167,7 +168,7 @@ export default {
     }
     if (this.callFromAiModeler === true) {
       this.screenTypes = this.types;
-    } 
+    }
   },
   methods: {
     show() {
@@ -193,10 +194,10 @@ export default {
       this.resetErrors();
     },
     close() {
-      this.$bvModal.hide('createScreen');
+      this.$bvModal.hide("createScreen");
       this.disabled = false;
-      this.$emit('reload');
-    },  
+      this.$emit("reload");
+    },
     onSubmit() {
       this.resetErrors();
       // single click
@@ -209,22 +210,9 @@ export default {
         .then(({ data }) => {
           ProcessMaker.alert(this.$t("The screen was created."), "success");
 
-          const url = `/designer/screen-builder/${data.id}/edit`;
-
-          if (this.callFromAiModeler) {
-            this.$emit("screen-created-from-modeler", url, data.id, data.title);
-          } else if (this.copyAssetMode) {
-            this.close();
-          } else {
-            if (this.isQuickCreate === true) {
-              channel.postMessage({
-                assetType: "screen",
-                asset: data,
-                screenSelectId: this.screenSelectId,
-              });
-            }
-            window.location = url;
-          }
+          const url = new URL(`/designer/screen-builder/${data.id}/edit`, window.location.origin);
+          this.appendProjectIdToURL(url, this.projectId);
+          this.handleRedirection(url, data);
         })
         .catch((error) => {
           this.disabled = false;
@@ -233,6 +221,21 @@ export default {
           }
         });
     },
+    handleRedirection(url, data) {
+      if (this.callFromAiModeler) {
+        this.$emit("screen-created-from-modeler", url, data.id, data.title);
+      } else if (this.copyAssetMode) {
+        this.close();
+      } else if (this.isQuickCreate === true) {
+        channel.postMessage({
+          assetType: "screen",
+          asset: data,
+          screenSelectId: this.screenSelectId,
+        });
+      } else {
+        window.location = url;
+      }
+    },
   },
 };
 </script>
diff --git a/resources/js/processes/scripts/components/CreateScriptModal.vue b/resources/js/processes/scripts/components/CreateScriptModal.vue
index 3be16c8d43..f9355b9f48 100644
--- a/resources/js/processes/scripts/components/CreateScriptModal.vue
+++ b/resources/js/processes/scripts/components/CreateScriptModal.vue
@@ -192,6 +192,7 @@ import Required from "../../../components/shared/Required.vue";
 import ProjectSelect from "../../../components/shared/ProjectSelect.vue";
 import SliderWithInput from "../../../components/shared/SliderWithInput.vue";
 import { isQuickCreate as isQuickCreateFunc } from "../../../utils/isQuickCreate";
+import AssetRedirectMixin from "../../../modules/assetRedirectMixin";
 
 const channel = new BroadcastChannel("assetCreation");
 
@@ -201,6 +202,7 @@ export default {
     Required,
     SliderWithInput,
     ProjectSelect,
+    AssetRedirectMixin,
   },
   mixins: [FormErrorsMixin],
   props: [
@@ -258,9 +260,6 @@ export default {
       this.title = "";
       return this.$t("Create Script");
     },
-    isProjectRoute() {
-      return window.location.pathname.startsWith("/designer/projects/");
-    },
   },
   methods: {
     show() {
@@ -317,10 +316,7 @@ export default {
           });
 
           const url = new URL(`/designer/scripts/${data.id}/builder`, window.location.origin);
-          if (this.isProjectRoute) {
-            url.searchParams.append("project_id", this.projectId);
-          }
-
+          this.appendProjectIdToURL(url, this.projectId);
           this.handleRedirection(url, data);
         })
         .catch((error) => {

From 8dbec859a6cdce0dad43fd0d683407e49c58ad1a Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Tue, 21 Nov 2023 13:26:38 -0600
Subject: [PATCH 05/10] Refactor assetRedirectMixin in screen.vue and
 ScriptEditor.vue

---
 resources/js/modules/assetRedirectMixin.js    | 24 +++++++++++++++++++
 .../js/processes/screen-builder/screen.vue    | 20 ++++++++++------
 .../scripts/components/ScriptEditor.vue       | 22 ++---------------
 3 files changed, 39 insertions(+), 27 deletions(-)

diff --git a/resources/js/modules/assetRedirectMixin.js b/resources/js/modules/assetRedirectMixin.js
index b36d49ed34..b0ae02817c 100644
--- a/resources/js/modules/assetRedirectMixin.js
+++ b/resources/js/modules/assetRedirectMixin.js
@@ -1,4 +1,15 @@
 export default {
+  data() {
+    return {
+      redirectUrl: null,
+    };
+  },
+  mounted() {
+    this.setRedirectUrl();
+    ProcessMaker.EventBus.$on("redirect", () => {
+      this.handleRedirection();
+    });
+  },
   computed: {
     isProjectRoute() {
       return window.location.pathname.startsWith("/designer/projects/");
@@ -10,5 +21,18 @@ export default {
         url.searchParams.append("project_id", projectId);
       }
     },
+    setRedirectUrl() {
+      const queryParams = new URLSearchParams(window.location.search);
+      const projectId = queryParams.get("project_id");
+
+      if (projectId) {
+        this.redirectUrl = `/designer/projects/${projectId}`;
+      }
+    },
+    handleRedirection() {
+      if (this.redirectUrl) {
+        window.location.href = this.redirectUrl;
+      }
+    },
   },
 };
diff --git a/resources/js/processes/screen-builder/screen.vue b/resources/js/processes/screen-builder/screen.vue
index 306acaee42..f030ddfd1c 100644
--- a/resources/js/processes/screen-builder/screen.vue
+++ b/resources/js/processes/screen-builder/screen.vue
@@ -281,10 +281,9 @@
         <b-col cols="6">
           <tree-view
             v-model="previewDataStringify"
-            :iframeHeight="iframeHeight"
+            :iframe-height="iframeHeight"
             style="border:1px; solid gray;"
-          >
-          </tree-view>
+          />
         </b-col>
       </b-row>
     </b-modal>
@@ -324,6 +323,7 @@ import mockMagicVariables from "./mockMagicVariables";
 import formTypes from "./formTypes";
 import DataLoadingBasic from "../../components/shared/DataLoadingBasic.vue";
 import autosaveMixins from "../../modules/autosave/mixins";
+import assetRedirectMixin from "../../modules/assetRedirectMixin";
 
 // To include another language in the Validator with variable processmaker
 if (
@@ -351,7 +351,7 @@ export default {
     TopMenu,
     DataLoadingBasic,
   },
-  mixins: [...autosaveMixins],
+  mixins: [...autosaveMixins, assetRedirectMixin],
   props: {
     screen: {
       type: Object,
@@ -560,7 +560,6 @@ export default {
           },
         ],
       },
-      closeHref: "/designer/screens",
       iframeHeight: "600px",
     };
   },
@@ -648,6 +647,9 @@ export default {
           });
       };
     },
+    closeHref() {
+      return this.redirectUrl ? this.redirectUrl : "/designer/screens";
+    },
   },
   watch: {
     customCSS(newCustomCSS) {
@@ -1066,8 +1068,12 @@ export default {
               onSuccess(response);
             }
 
-            if (this.processId !== 0 && this.processId !== undefined && !exportScreen) {
-              window.location = `/modeler/${this.processId}`;
+            if (!exportScreen) {
+              if (this.processId) {
+                window.location = `/modeler/${this.processId}`;
+              }
+
+              window.ProcessMaker.EventBus.$emit("redirect");
             }
           })
           .catch((err) => {
diff --git a/resources/js/processes/scripts/components/ScriptEditor.vue b/resources/js/processes/scripts/components/ScriptEditor.vue
index e8f7710d5d..62e7285354 100644
--- a/resources/js/processes/scripts/components/ScriptEditor.vue
+++ b/resources/js/processes/scripts/components/ScriptEditor.vue
@@ -406,6 +406,7 @@ import TopMenu from "../../../components/Menu.vue";
 // eslint-disable-next-line no-unused-vars
 import customFilters from "../customFilters";
 import autosaveMixins from "../../../modules/autosave/mixins";
+import assetRedirectMixin from "../../../modules/assetRedirectMixin";
 import AiTab from "./AiTab.vue";
 
 export default {
@@ -414,7 +415,7 @@ export default {
     TopMenu,
     AiTab,
   },
-  mixins: [...autosaveMixins],
+  mixins: [...autosaveMixins, assetRedirectMixin],
   props: {
     script: {
       type: Object,
@@ -533,7 +534,6 @@ export default {
           },
         ],
       },
-      redirectUrl: null,
     };
   },
   computed: {
@@ -604,9 +604,6 @@ export default {
     ProcessMaker.EventBus.$on("script-discard", () => {
       this.discardDraft();
     });
-    ProcessMaker.EventBus.$on("redirect", () => {
-      this.handleRedirection();
-    });
 
     window.addEventListener("resize", this.handleResize);
     const userID = document.head.querySelector("meta[name=\"user-id\"]");
@@ -627,8 +624,6 @@ export default {
     if (this.processId !== 0) {
       this.prompt = `${this.script.title}\n${this.script.description}`;
     }
-
-    this.setRedirectUrl();
   },
 
   beforeDestroy() {
@@ -956,19 +951,6 @@ export default {
         }, 4);
       }
     },
-    setRedirectUrl() {
-      const queryParams = new URLSearchParams(window.location.search);
-      const projectId = queryParams.get("project_id");
-
-      if (projectId) {
-        this.redirectUrl = `/designer/projects/${projectId}`;
-      }
-    },
-    handleRedirection() {
-      if (this.redirectUrl) {
-        window.location.href = this.redirectUrl;
-      }
-    },
   },
 };
 </script>

From 8b2f6787ea0caa4c24e237155052081eb377e0d1 Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Tue, 21 Nov 2023 13:30:08 -0600
Subject: [PATCH 06/10] Apply eslint fixes

---
 .../components/CreateProcessModal.vue         | 363 +++++++++---------
 1 file changed, 190 insertions(+), 173 deletions(-)

diff --git a/resources/js/processes/components/CreateProcessModal.vue b/resources/js/processes/components/CreateProcessModal.vue
index b8b64605e7..d080fcdfdd 100644
--- a/resources/js/processes/components/CreateProcessModal.vue
+++ b/resources/js/processes/components/CreateProcessModal.vue
@@ -1,6 +1,6 @@
 <template>
   <div>
-    <modal 
+    <modal
       id="createProcess"
       :title="$t('Create Process')"
       :ok-disabled="disabled"
@@ -9,7 +9,7 @@
       @shown="onShown()"
     >
       <template v-if="countCategories">
-        <required></required>
+        <required />
         <b-form-group
           required
           :label="$t('Name')"
@@ -18,13 +18,13 @@
           :state="errorState('name', addError)"
         >
           <b-form-input
-            autofocus
             v-model="name"
+            autofocus
             autocomplete="off"
             :state="errorState('name', addError)"
             name="name"
             required
-          ></b-form-input>
+          />
         </b-form-group>
         <b-form-group
           required
@@ -33,41 +33,41 @@
           :state="errorState('description', addError)"
         >
           <b-form-textarea
-            required
             v-model="description"
+            required
             autocomplete="off"
             rows="3"
             :state="errorState('description', addError)"
             name="description"
-          ></b-form-textarea>
+          />
         </b-form-group>
         <category-select
+          v-model="process_category_id"
           :label="$t('Category')"
           api-get="process_categories"
           api-list="process_categories"
-          v-model="process_category_id"
           :errors="addError?.process_category_id"
           name="category"
-        ></category-select>
-        <project-select 
+        />
+        <project-select
           v-if="isProjectsInstalled"
+          v-model="projects"
           :required="isProjectSelectionRequired"
           :label="$t('Project')"
           api-get="projects"
           api-list="projects"
-          v-model="projects"
           :errors="addError?.projects"
           name="project"
-          :projectId="projectId"
-        ></project-select>
-       <b-form-group
+          :project-id="projectId"
+        />
+        <b-form-group
           :label="$t('Process Manager')"
         >
           <select-user
-            :multiple="false"
             v-model="manager"
+            :multiple="false"
             name="process_manager_id"
-          ></select-user>
+          />
         </b-form-group>
         <b-form-group
           v-if="!selectedTemplate && !generativeProcessData"
@@ -76,18 +76,21 @@
           :state="errorState('bpmn', addError)"
         >
           <b-form-file
+            ref="customFile"
             :browse-text="$t('Browse')"
             accept=".bpmn,.xml"
             :placeholder="selectedFile"
-            ref="customFile"
-            @change="onFileChange"
             :state="errorState('bpmn', addError)"
-          ></b-form-file>
+            @change="onFileChange"
+          />
         </b-form-group>
       </template>
       <template v-else>
         <div>{{ $t('Categories are required to create a process') }}</div>
-        <a href="/designer/processes/categories" class="btn btn-primary container mt-2">
+        <a
+          href="/designer/processes/categories"
+          class="btn btn-primary container mt-2"
+        >
           {{ $t('Add Category') }}
         </a>
       </template>
@@ -96,185 +99,199 @@
 </template>
 
 <script>
-  import Required from "../../components/shared/Required.vue";
-  import Modal from "../../components/shared/Modal.vue";
-  import FormErrorsMixin from "../../components/shared/FormErrorsMixin";
-  import TemplateSearch from "../../components/templates/TemplateSearch.vue";
-  import ProjectSelect from "../../components/shared/ProjectSelect.vue";
+import Required from "../../components/shared/Required.vue";
+import Modal from "../../components/shared/Modal.vue";
+import FormErrorsMixin from "../../components/shared/FormErrorsMixin";
+import TemplateSearch from "../../components/templates/TemplateSearch.vue";
+import ProjectSelect from "../../components/shared/ProjectSelect.vue";
 
-  export default {
-    components: { Modal, Required, TemplateSearch, ProjectSelect },
-    mixins: [ FormErrorsMixin ],
-    props: [
-      "countCategories", 
-      "blankTemplate", 
-      "selectedTemplate", 
-      "templateData", 
-      "generativeProcessData", 
-      "isProjectsInstalled", 
-      "categoryType", 
-      "callFromAiModeler",
-      "isProjectSelectionRequired",
-      "projectId"
-    ],
-    data: function() {
-      return {
-        showModal: false,
-        name: "",
-        selectedFile: "",
-        categoryOptions: "",
-        description: "",
-        process_category_id: "",
-        category_type_id: "",
-        projects: [],
-        projectCategories: false,
-        template_version: null,
-        addError: {},
-        status: "",
-        bpmn: "",
-        disabled: false,
-        customModalButtons: [
-            {"content": "Cancel", "action": "hide()", "variant": "outline-secondary", "disabled": false, "hidden": false},
-            {"content": "Create", "action": "createTemplate", "variant": "primary", "disabled": false, "hidden": false},
-        ],
-        manager: "",
+export default {
+  components: {
+    Modal, Required, TemplateSearch, ProjectSelect,
+  },
+  mixins: [FormErrorsMixin],
+  props: [
+    "countCategories",
+    "blankTemplate",
+    "selectedTemplate",
+    "templateData",
+    "generativeProcessData",
+    "isProjectsInstalled",
+    "categoryType",
+    "callFromAiModeler",
+    "isProjectSelectionRequired",
+    "projectId",
+  ],
+  data() {
+    return {
+      showModal: false,
+      name: "",
+      selectedFile: "",
+      categoryOptions: "",
+      description: "",
+      process_category_id: "",
+      category_type_id: "",
+      projects: [],
+      projectCategories: false,
+      template_version: null,
+      addError: {},
+      status: "",
+      bpmn: "",
+      disabled: false,
+      customModalButtons: [
+        {
+          content: "Cancel", action: "hide()", variant: "outline-secondary", disabled: false, hidden: false,
+        },
+        {
+          content: "Create", action: "createTemplate", variant: "primary", disabled: false, hidden: false,
+        },
+      ],
+      manager: "",
+    };
+  },
+  watch: {
+    selectedTemplate() {
+      if (this.selectedTemplate) {
+        this.name = this.templateData.name;
+        this.description = this.templateData.description;
+        if (this.categoryType) {
+          this.category_type_id = this.templateData.category_id;
+        } else {
+          this.process_category_id = this.templateData.category_id;
+        }
+        this.template_version = this.templateData.version;
       }
     },
-    watch: {
-      selectedTemplate: function() {
-        if (this.selectedTemplate) {
-          this.name = this.templateData.name;
-          this.description = this.templateData.description;  
-          if (this.categoryType) {
-            this.category_type_id = this.templateData.category_id;
-          } else {
-            this.process_category_id = this.templateData.category_id;
-          }
-          this.template_version = this.templateData.version;
-        }
-      },
-      manager: function() {
-        if (!this.manager) {
-          this.manager = "";
-        }
-      },
+    manager() {
+      if (!this.manager) {
+        this.manager = "";
+      }
     },
-    mounted() {
-      const searchParams = new URLSearchParams(window.location.search);
-      if (searchParams.size > 0 && searchParams.get("create") === "true") {
-          this.show();
-      };
+  },
+  mounted() {
+    const searchParams = new URLSearchParams(window.location.search);
+    if (searchParams.size > 0 && searchParams.get("create") === "true") {
+      this.show();
+    }
+  },
+  methods: {
+    onShown() {
+      if (this.generativeProcessData) {
+        this.name = this.generativeProcessData.process_title;
+        this.description = this.generativeProcessData.process_description;
+      }
     },
-    methods: {
-      onShown() {
-        if (this.generativeProcessData) {
-          this.name = this.generativeProcessData.process_title;
-          this.description = this.generativeProcessData.process_description;
-        }
-      },
-      show() {
+    show() {
       this.$bvModal.show("createProcess");
-      },
-      browse () {
-        this.$refs.customFile.click();
-      },
-      onFileChange (e) {
-        let files = e.target.files || e.dataTransfer.files;
+    },
+    browse() {
+      this.$refs.customFile.click();
+    },
+    onFileChange(e) {
+      const files = e.target.files || e.dataTransfer.files;
 
-        if (!files.length) {
-          return;
-        }
+      if (!files.length) {
+        return;
+      }
 
-        this.selectedFile = files[0].name;
-        this.file = files[0];
-      },
-      onClose () {
-        this.name = "";
-        this.description = "";
-        this.process_category_id = "";
-        this.category_type_id = "";
-        this.projects = [];
-        this.status = "";
-        this.addError = {};
-        this.selectedFile = "";
-        this.file = null;
-        this.manager = "";
-        this.$emit("resetModal");
-      },
-      onSubmit () {
-        this.errors = Object.assign({}, {
-          name: null,
-          description: null,
-          process_category_id: null,
-          status: null
-        });
-        if (this.process_category_id === "") {
-          this.addError = {"process_category_id": ["{{__('The category field is required.')}}"]};
-          return;
-        }
-        //single click
-        if (this.disabled) {
-          return;
-        }
-        this.disabled = true;
-        
-        let formData = new FormData();
-        formData.append("name", this.name);
-        formData.append("description", this.description);
-        formData.append("process_category_id", this.process_category_id);
-        formData.append("projects", this.projects);
-        formData.append("manager_id", this.manager.id);
-        if (this.file) {
-          formData.append("file", this.file);
-        }
-        if (this.selectedTemplate) {
-          formData.append("version", this.template_version);
-          this.handleCreateFromTemplate(this.templateData.id, formData);
-        } else {
-          if (this.generativeProcessData) {
-            formData.append("bpmn", this.generativeProcessData.bpmn);
-          }
-          this.handleCreateBlank(formData);
+      this.selectedFile = files[0].name;
+      this.file = files[0];
+    },
+    onClose() {
+      this.name = "";
+      this.description = "";
+      this.process_category_id = "";
+      this.category_type_id = "";
+      this.projects = [];
+      this.status = "";
+      this.addError = {};
+      this.selectedFile = "";
+      this.file = null;
+      this.manager = "";
+      this.$emit("resetModal");
+    },
+    onSubmit() {
+      this.errors = {
+        name: null,
+        description: null,
+        process_category_id: null,
+        status: null,
+      };
+      if (this.process_category_id === "") {
+        this.addError = { process_category_id: ["{{__('The category field is required.')}}"] };
+        return;
+      }
+      // single click
+      if (this.disabled) {
+        return;
+      }
+      this.disabled = true;
+
+      const formData = new FormData();
+      formData.append("name", this.name);
+      formData.append("description", this.description);
+      formData.append("process_category_id", this.process_category_id);
+      formData.append("projects", this.projects);
+      formData.append("manager_id", this.manager.id);
+      if (this.file) {
+        formData.append("file", this.file);
+      }
+      if (this.selectedTemplate) {
+        formData.append("version", this.template_version);
+        this.handleCreateFromTemplate(this.templateData.id, formData);
+      } else {
+        if (this.generativeProcessData) {
+          formData.append("bpmn", this.generativeProcessData.bpmn);
         }
-      },
-      handleCreateFromTemplate(id, formData) {
-        ProcessMaker.apiClient.post(`template/create/process/${id}`, formData,
+        this.handleCreateBlank(formData);
+      }
+    },
+    handleCreateFromTemplate(id, formData) {
+      ProcessMaker.apiClient.post(
+        `template/create/process/${id}`,
+        formData,
         {
           headers: {
-            "Content-Type": "multipart/form-data"
-          }
-        })
-        .then(response => {
+            "Content-Type": "multipart/form-data",
+          },
+        },
+      )
+        .then((response) => {
           if (response.data.existingAssets) {
             const assets = JSON.stringify(response.data.existingAssets);
             const responseId = response.data.id;
             const request = JSON.stringify(response.data.request);
-            window.history.pushState({
-              assets: assets,
-              name: this.templateData.name,
-              responseId: responseId,
-              request: request},
+            window.history.pushState(
+              {
+                assets,
+                name: this.templateData.name,
+                responseId,
+                request,
+              },
               "",
-              '/template/assets'
+              "/template/assets",
             );
-            window.location = '/template/assets';
+            window.location = "/template/assets";
           } else {
             ProcessMaker.alert(this.$t("The process was created."), "success");
-            window.location = "/modeler/" + response.data.processId;
+            window.location = `/modeler/${response.data.processId}`;
           }
         })
-        .catch(error => {
+        .catch((error) => {
           this.disabled = false;
           this.addError = error.response.data.errors;
         });
-      },
-      handleCreateBlank(formData) {
-        ProcessMaker.apiClient.post("/processes", formData,
+    },
+    handleCreateBlank(formData) {
+      ProcessMaker.apiClient.post(
+        "/processes",
+        formData,
         {
           headers: {
             "Content-Type": "multipart/form-data",
           },
-        })
+        },
+      )
         .then((response) => {
           if (this.generativeProcessData) {
             this.$emit("clear-ai-history");
@@ -289,13 +306,13 @@
             window.location = `/modeler/${response.data.id}`;
           }
         })
-        .catch(error => {
+        .catch((error) => {
           this.disabled = false;
           this.addError = error.response.data.errors;
         });
-      },
     },
-  };
+  },
+};
 </script>
 
 <style scoped>

From 7395fd21ffc1c988e7da37602cf115e52a30d23d Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Tue, 21 Nov 2023 14:39:14 -0600
Subject: [PATCH 07/10] Add asset redirect for processes

---
 .../components/CreateProcessModal.vue         | 29 +++++++-----
 .../modeler/components/ModelerApp.vue         | 47 ++++++++++++++-----
 2 files changed, 53 insertions(+), 23 deletions(-)

diff --git a/resources/js/processes/components/CreateProcessModal.vue b/resources/js/processes/components/CreateProcessModal.vue
index d080fcdfdd..337c93f0c5 100644
--- a/resources/js/processes/components/CreateProcessModal.vue
+++ b/resources/js/processes/components/CreateProcessModal.vue
@@ -102,14 +102,14 @@
 import Required from "../../components/shared/Required.vue";
 import Modal from "../../components/shared/Modal.vue";
 import FormErrorsMixin from "../../components/shared/FormErrorsMixin";
-import TemplateSearch from "../../components/templates/TemplateSearch.vue";
 import ProjectSelect from "../../components/shared/ProjectSelect.vue";
+import AssetRedirectMixin from "../../modules/assetRedirectMixin";
 
 export default {
   components: {
-    Modal, Required, TemplateSearch, ProjectSelect,
+    Modal, Required, ProjectSelect,
   },
-  mixins: [FormErrorsMixin],
+  mixins: [FormErrorsMixin, AssetRedirectMixin],
   props: [
     "countCategories",
     "blankTemplate",
@@ -194,8 +194,8 @@ export default {
         return;
       }
 
-      this.selectedFile = files[0].name;
-      this.file = files[0];
+      [this.file] = files;
+      this.selectedFile = this.file.name;
     },
     onClose() {
       this.name = "";
@@ -292,25 +292,30 @@ export default {
           },
         },
       )
-        .then((response) => {
+        .then(({ data }) => {
           if (this.generativeProcessData) {
             this.$emit("clear-ai-history");
           }
 
           ProcessMaker.alert(this.$t("The process was created."), "success");
 
-          if (this.callFromAiModeler) {
-            const url = `/package-ai/processes/create/${response.data.id}`;
-            this.$emit("process-created-from-modeler", url, response.data.id, response.data.name);
-          } else {
-            window.location = `/modeler/${response.data.id}`;
-          }
+          const url = new URL(`/modeler/${data.id}`, window.location.origin);
+          this.appendProjectIdToURL(url, this.projectId);
+          this.handleRedirection(url, data);
         })
         .catch((error) => {
           this.disabled = false;
           this.addError = error.response.data.errors;
         });
     },
+    handleRedirection(url, data) {
+      if (this.callFromAiModeler) {
+        const redirectUrl = `/package-ai/processes/create/${data.id}`;
+        this.$emit("process-created-from-modeler", redirectUrl, data.id, data.name);
+      } else {
+        window.location.href = url;
+      }
+    },
   },
 };
 </script>
diff --git a/resources/js/processes/modeler/components/ModelerApp.vue b/resources/js/processes/modeler/components/ModelerApp.vue
index 748a8d81e7..dba511a562 100644
--- a/resources/js/processes/modeler/components/ModelerApp.vue
+++ b/resources/js/processes/modeler/components/ModelerApp.vue
@@ -15,7 +15,7 @@
           ref="modeler"
           :owner="self"
           :decorations="decorations"
-          :validationBar="validationBar"
+          :validation-bar="validationBar"
           @validate="validationErrors = $event"
           @warnings="warnings = $event"
           @saveBpmn="emitSaveEvent"
@@ -25,10 +25,11 @@
           @publishPmBlock="publishPmBlock"
           @set-xml-manager="xmlManager = $event"
         />
-        <pan-comment :commentable_id="processId"
-                     commentable_type="ProcessMaker\Models\Process"
-                     :readonly="false"
-                     />
+        <pan-comment
+          :commentable_id="processId"
+          commentable_type="ProcessMaker\Models\Process"
+          :readonly="false"
+        />
       </b-card-body>
       <component
         :is="component.panel"
@@ -42,8 +43,20 @@
         :key="`external-${index}`"
         :options="component.options"
       />
-      <create-template-modal ref="create-template-modal" assetType="process" :assetName="processName" :assetId="processId" :currentUserId="currentUserId"/>
-      <create-pm-block-modal ref="create-pm-block-modal" assetType="process" :assetName="processName" :assetId="processId" :currentUserId="currentUserId"/>
+      <create-template-modal
+        ref="create-template-modal"
+        asset-type="process"
+        :asset-name="processName"
+        :asset-id="processId"
+        :current-user-id="currentUserId"
+      />
+      <create-pm-block-modal
+        ref="create-pm-block-modal"
+        asset-type="process"
+        :asset-name="processName"
+        :asset-id="processId"
+        :current-user-id="currentUserId"
+      />
     </b-card>
   </b-container>
 </template>
@@ -53,6 +66,7 @@ import { Modeler, ValidationStatus } from "@processmaker/modeler";
 import CreateTemplateModal from "../../../components/templates/CreateTemplateModal.vue";
 import CreatePmBlockModal from "../../../components/pm-blocks/CreatePmBlockModal.vue";
 import autosaveMixins from "../../../modules/autosave/mixins";
+import assetRedirectMixin from "../../../modules/assetRedirectMixin";
 
 export default {
   name: "ModelerApp",
@@ -62,7 +76,7 @@ export default {
     CreateTemplateModal,
     CreatePmBlockModal,
   },
-  mixins: [...autosaveMixins],
+  mixins: [...autosaveMixins, assetRedirectMixin],
   data() {
     return {
       self: this,
@@ -127,8 +141,16 @@ export default {
       };
     },
     closeHref() {
-      return this.process?.asset_type === 'PM_BLOCK' ? "/designer/pm-blocks" : "/processes";
-    }
+      let url = "/processes";
+
+      if (this.redirectUrl) {
+        url = this.redirectUrl;
+      } else if (this.process?.asset_type === "PM_BLOCK") {
+        url = "/designer/pm-blocks";
+      }
+
+      return url;
+    },
   },
   watch: {
     validationErrors: {
@@ -208,7 +230,9 @@ export default {
       });
       return notifications;
     },
-    emitSaveEvent({ xml, svg, redirectUrl = null, nodeId = null }) {
+    emitSaveEvent({
+      xml, svg, redirectUrl = null, nodeId = null,
+    }) {
       this.dataXmlSvg.xml = xml;
       this.dataXmlSvg.svg = svg;
 
@@ -257,6 +281,7 @@ export default {
         if (response.data.warnings && response.data.warnings.length > 0) {
           window.ProcessMaker.EventBus.$emit("save-changes-activate-autovalidate");
         }
+        window.ProcessMaker.EventBus.$emit("redirect");
         if (typeof onSuccess === "function") {
           onSuccess(response);
         }

From faefbcd6005c4de8b4fdbd9c3a4dad82c07ff5e3 Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Tue, 21 Nov 2023 16:19:38 -0600
Subject: [PATCH 08/10] Add AssetRedirectMixin to shared components

---
 .../shared/AssetRedirectMixin.js}                            | 0
 resources/js/components/shared/index.js                      | 2 ++
 resources/js/processes/components/CreateProcessModal.vue     | 2 +-
 resources/js/processes/modeler/components/ModelerApp.vue     | 4 ++--
 resources/js/processes/screen-builder/screen.vue             | 4 ++--
 .../js/processes/screens/components/CreateScreenModal.vue    | 2 +-
 .../js/processes/scripts/components/CreateScriptModal.vue    | 5 ++---
 resources/js/processes/scripts/components/ScriptEditor.vue   | 4 ++--
 8 files changed, 12 insertions(+), 11 deletions(-)
 rename resources/js/{modules/assetRedirectMixin.js => components/shared/AssetRedirectMixin.js} (100%)

diff --git a/resources/js/modules/assetRedirectMixin.js b/resources/js/components/shared/AssetRedirectMixin.js
similarity index 100%
rename from resources/js/modules/assetRedirectMixin.js
rename to resources/js/components/shared/AssetRedirectMixin.js
diff --git a/resources/js/components/shared/index.js b/resources/js/components/shared/index.js
index 9013aa80d4..6190426aca 100644
--- a/resources/js/components/shared/index.js
+++ b/resources/js/components/shared/index.js
@@ -14,6 +14,7 @@ import EllipsisMenu from "./EllipsisMenu";
 import EnterPasswordModal from "../../processes/import/components/EnterPasswordModal.vue";
 import FileUploadButton from "./FileUploadButton";
 import FormErrorsMixin from "./FormErrorsMixin";
+import AssetRedirectMixin from "./AssetRedirectMixin";
 import IconSelector from "./IconSelector";
 import Modal from "./Modal";
 import PmqlInput from "./PmqlInput";
@@ -64,6 +65,7 @@ export {
   EnterPasswordModal,
   FileUploadButton,
   FormErrorsMixin,
+  AssetRedirectMixin,
   IconSelector,
   Modal,
   PmqlInput,
diff --git a/resources/js/processes/components/CreateProcessModal.vue b/resources/js/processes/components/CreateProcessModal.vue
index 337c93f0c5..ecb3ddbcf8 100644
--- a/resources/js/processes/components/CreateProcessModal.vue
+++ b/resources/js/processes/components/CreateProcessModal.vue
@@ -102,8 +102,8 @@
 import Required from "../../components/shared/Required.vue";
 import Modal from "../../components/shared/Modal.vue";
 import FormErrorsMixin from "../../components/shared/FormErrorsMixin";
+import AssetRedirectMixin from "../../components/shared/AssetRedirectMixin";
 import ProjectSelect from "../../components/shared/ProjectSelect.vue";
-import AssetRedirectMixin from "../../modules/assetRedirectMixin";
 
 export default {
   components: {
diff --git a/resources/js/processes/modeler/components/ModelerApp.vue b/resources/js/processes/modeler/components/ModelerApp.vue
index dba511a562..c9876060c4 100644
--- a/resources/js/processes/modeler/components/ModelerApp.vue
+++ b/resources/js/processes/modeler/components/ModelerApp.vue
@@ -66,7 +66,7 @@ import { Modeler, ValidationStatus } from "@processmaker/modeler";
 import CreateTemplateModal from "../../../components/templates/CreateTemplateModal.vue";
 import CreatePmBlockModal from "../../../components/pm-blocks/CreatePmBlockModal.vue";
 import autosaveMixins from "../../../modules/autosave/mixins";
-import assetRedirectMixin from "../../../modules/assetRedirectMixin";
+import AssetRedirectMixin from "../../../components/shared/AssetRedirectMixin";
 
 export default {
   name: "ModelerApp",
@@ -76,7 +76,7 @@ export default {
     CreateTemplateModal,
     CreatePmBlockModal,
   },
-  mixins: [...autosaveMixins, assetRedirectMixin],
+  mixins: [...autosaveMixins, AssetRedirectMixin],
   data() {
     return {
       self: this,
diff --git a/resources/js/processes/screen-builder/screen.vue b/resources/js/processes/screen-builder/screen.vue
index f030ddfd1c..8799bc3e6f 100644
--- a/resources/js/processes/screen-builder/screen.vue
+++ b/resources/js/processes/screen-builder/screen.vue
@@ -322,8 +322,8 @@ import TopMenu from "../../components/Menu.vue";
 import mockMagicVariables from "./mockMagicVariables";
 import formTypes from "./formTypes";
 import DataLoadingBasic from "../../components/shared/DataLoadingBasic.vue";
+import AssetRedirectMixin from "../../components/shared/AssetRedirectMixin";
 import autosaveMixins from "../../modules/autosave/mixins";
-import assetRedirectMixin from "../../modules/assetRedirectMixin";
 
 // To include another language in the Validator with variable processmaker
 if (
@@ -351,7 +351,7 @@ export default {
     TopMenu,
     DataLoadingBasic,
   },
-  mixins: [...autosaveMixins, assetRedirectMixin],
+  mixins: [...autosaveMixins, AssetRedirectMixin],
   props: {
     screen: {
       type: Object,
diff --git a/resources/js/processes/screens/components/CreateScreenModal.vue b/resources/js/processes/screens/components/CreateScreenModal.vue
index cdc25b7f02..42a19237b3 100644
--- a/resources/js/processes/screens/components/CreateScreenModal.vue
+++ b/resources/js/processes/screens/components/CreateScreenModal.vue
@@ -108,7 +108,7 @@ import {
   screenSelectId,
 } from "../../../utils/isQuickCreate";
 import { filterScreenType } from "../../../utils/filterScreenType";
-import AssetRedirectMixin from "../../../modules/assetRedirectMixin";
+import AssetRedirectMixin from "../../../components/shared/AssetRedirectMixin";
 
 const channel = new BroadcastChannel("assetCreation");
 
diff --git a/resources/js/processes/scripts/components/CreateScriptModal.vue b/resources/js/processes/scripts/components/CreateScriptModal.vue
index f9355b9f48..ff7880c942 100644
--- a/resources/js/processes/scripts/components/CreateScriptModal.vue
+++ b/resources/js/processes/scripts/components/CreateScriptModal.vue
@@ -187,12 +187,12 @@
 
 <script>
 import FormErrorsMixin from "../../../components/shared/FormErrorsMixin";
+import AssetRedirectMixin from "../../../components/shared/AssetRedirectMixin";
 import Modal from "../../../components/shared/Modal.vue";
 import Required from "../../../components/shared/Required.vue";
 import ProjectSelect from "../../../components/shared/ProjectSelect.vue";
 import SliderWithInput from "../../../components/shared/SliderWithInput.vue";
 import { isQuickCreate as isQuickCreateFunc } from "../../../utils/isQuickCreate";
-import AssetRedirectMixin from "../../../modules/assetRedirectMixin";
 
 const channel = new BroadcastChannel("assetCreation");
 
@@ -202,9 +202,8 @@ export default {
     Required,
     SliderWithInput,
     ProjectSelect,
-    AssetRedirectMixin,
   },
-  mixins: [FormErrorsMixin],
+  mixins: [FormErrorsMixin, AssetRedirectMixin],
   props: [
     "countCategories",
     "scriptExecutors",
diff --git a/resources/js/processes/scripts/components/ScriptEditor.vue b/resources/js/processes/scripts/components/ScriptEditor.vue
index 62e7285354..cae091d15a 100644
--- a/resources/js/processes/scripts/components/ScriptEditor.vue
+++ b/resources/js/processes/scripts/components/ScriptEditor.vue
@@ -406,7 +406,7 @@ import TopMenu from "../../../components/Menu.vue";
 // eslint-disable-next-line no-unused-vars
 import customFilters from "../customFilters";
 import autosaveMixins from "../../../modules/autosave/mixins";
-import assetRedirectMixin from "../../../modules/assetRedirectMixin";
+import AssetRedirectMixin from "../../../components/shared/AssetRedirectMixin";
 import AiTab from "./AiTab.vue";
 
 export default {
@@ -415,7 +415,7 @@ export default {
     TopMenu,
     AiTab,
   },
-  mixins: [...autosaveMixins, assetRedirectMixin],
+  mixins: [...autosaveMixins, AssetRedirectMixin],
   props: {
     script: {
       type: Object,

From a507188e720fc1bb775a896772569b6297dbf07a Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Wed, 22 Nov 2023 11:17:24 -0600
Subject: [PATCH 09/10] Fix handleRedirection method to return a Promise

---
 resources/js/components/shared/AssetRedirectMixin.js | 10 +++++++---
 1 file changed, 7 insertions(+), 3 deletions(-)

diff --git a/resources/js/components/shared/AssetRedirectMixin.js b/resources/js/components/shared/AssetRedirectMixin.js
index b0ae02817c..0bbf099c01 100644
--- a/resources/js/components/shared/AssetRedirectMixin.js
+++ b/resources/js/components/shared/AssetRedirectMixin.js
@@ -30,9 +30,13 @@ export default {
       }
     },
     handleRedirection() {
-      if (this.redirectUrl) {
-        window.location.href = this.redirectUrl;
-      }
+      return new Promise((resolve) => {
+        if (this.redirectUrl) {
+          window.location.href = this.redirectUrl;
+          resolve(true);
+        }
+        resolve(false);
+      });
     },
   },
 };

From 0ea9a680b1e3410a57e44a67f42c9aa0ec5b328f Mon Sep 17 00:00:00 2001
From: Eleazar Resendez <eleazar.resendez@processmaker.com>
Date: Mon, 27 Nov 2023 16:19:55 -0600
Subject: [PATCH 10/10] Fix console error redirect issue in ModelerApp.vue

---
 resources/js/processes/modeler/components/ModelerApp.vue | 6 ++++--
 1 file changed, 4 insertions(+), 2 deletions(-)

diff --git a/resources/js/processes/modeler/components/ModelerApp.vue b/resources/js/processes/modeler/components/ModelerApp.vue
index c9876060c4..4eb82e2491 100644
--- a/resources/js/processes/modeler/components/ModelerApp.vue
+++ b/resources/js/processes/modeler/components/ModelerApp.vue
@@ -276,12 +276,14 @@ export default {
         ProcessMaker.alert(this.$t(`The ${type} was saved.`, { type }), "success");
         // Set published status.
         this.setVersionIndicator(false);
-        window.ProcessMaker.EventBus.$emit("save-changes", redirectUrl, nodeId);
         this.$set(this, "warnings", response.data.warnings || []);
         if (response.data.warnings && response.data.warnings.length > 0) {
           window.ProcessMaker.EventBus.$emit("save-changes-activate-autovalidate");
         }
-        window.ProcessMaker.EventBus.$emit("redirect");
+        window.ProcessMaker.EventBus.$emit("save-changes", redirectUrl, nodeId);
+        if (!redirectUrl) {
+          window.ProcessMaker.EventBus.$emit("redirect");
+        }
         if (typeof onSuccess === "function") {
           onSuccess(response);
         }