From 893877a148d2bb7ae08ac95a27ffc152dde58370 Mon Sep 17 00:00:00 2001
From: Roly Gutierrez <roly.gutierrez@processmaker.com>
Date: Thu, 6 Jun 2024 19:22:43 -0400
Subject: [PATCH 1/7] FOUR-14053 All Templates section (UI change)

---
 .../templates/SelectTemplateModal.vue         | 10 ++++-
 .../components/CardProcess.vue                | 21 +++++++++-
 .../components/ProcessListing.vue             |  2 +-
 .../components/menuCatologue.vue              | 40 ++++++++++++++-----
 .../components/utils/Card.vue                 |  9 ++++-
 resources/js/processes-catalogue/index.js     |  3 +-
 6 files changed, 68 insertions(+), 17 deletions(-)

diff --git a/resources/js/components/templates/SelectTemplateModal.vue b/resources/js/components/templates/SelectTemplateModal.vue
index 9e9ad46d7f..cf76ca80b3 100644
--- a/resources/js/components/templates/SelectTemplateModal.vue
+++ b/resources/js/components/templates/SelectTemplateModal.vue
@@ -19,7 +19,10 @@
       @ok.prevent="onSubmit"
       @close="close"
     >
-      <template-search :type="type" :component="currentComponent" @show-details="updateModal($event)" 
+      <template-search ref="template-search"
+        :type="type" 
+        :component="currentComponent" 
+        @show-details="updateModal($event)" 
         @blank-process-button-clicked="createBlankProcess()"
         @ai-process-button-clicked="createAiProcess()"
         :showTemplateOptionsActionBar="true"
@@ -121,6 +124,11 @@
       },
       show() {
         this.$bvModal.show('selectTemplate');
+      },
+      hideBackButton() {
+        this.headerButtons[0].hidden = true;
+        this.titleButtons[0].hidden = true;
+        this.hasHeaderButtons = false;
       }
     },
     mounted() {
diff --git a/resources/js/processes-catalogue/components/CardProcess.vue b/resources/js/processes-catalogue/components/CardProcess.vue
index 0d9a69ac1c..6fe4a8a698 100644
--- a/resources/js/processes-catalogue/components/CardProcess.vue
+++ b/resources/js/processes-catalogue/components/CardProcess.vue
@@ -13,6 +13,7 @@
         :key="index"
         :process="process"
         @openProcessInfo="openProcessInfo"
+        :hideBookmark="categoryId === 'all_templates'"
       />
       <pagination
         :total-row="totalRow"
@@ -43,6 +44,7 @@ import pagination from "./utils/pagination.vue";
 import SearchCards from "./utils/SearchCards.vue";
 import dataLoadingMixin from "../../components/common/mixins/apiDataLoading";
 import Card from "./utils/Card.vue";
+import { EventBus } from '../index.js';
 
 export default {
   components: {
@@ -63,6 +65,7 @@ export default {
       data: null,
       totalPages: 1,
       pmql: "",
+      filter: "",
       bookmarkIcon: "far fa-bookmark",
       showEmpty: false,
       loading: false,
@@ -71,6 +74,7 @@ export default {
   watch: {
     categoryId() {
       this.pmql = "";
+      this.filter = "";
       this.loadCard();
     },
   },
@@ -100,7 +104,7 @@ export default {
      * Build URL for Process Cards
      */
     buildURL() {
-      if (!this.categoryId || this.categoryId === 'all_processes') {
+      if (this.categoryId === 'all_processes') {
         return "process_bookmarks/processes?"
           + `&page=${this.currentPage}`
           + `&per_page=${this.perPage}`
@@ -118,6 +122,14 @@ export default {
           + "&launchpad=true"
           + "&order_by=name&order_direction=asc";
       }
+      if (this.categoryId === 'all_templates') {
+        return `templates/process?page=${this.currentPage}`
+          + `&per_page=${this.perPage}`
+          + `&filter=${encodeURIComponent(this.filter)}`
+          + `&order_by=name`
+          + `&order_direction=asc`
+          + `&include=user,categories,category`;
+      }
       return `process_bookmarks/processes?page=${this.currentPage}`
           + `&per_page=${this.perPage}`
           + `&category=${this.categoryId}`
@@ -130,8 +142,12 @@ export default {
      * Go to process info
      */
     openProcessInfo(process) {
+      if (this.categoryId === 'all_templates') {
+        EventBus.$emit('process-selected', { template: process, type: "Process" });
+        return;
+      }
       this.$router.push({ name: "show", params: { process: process, processId: process.id } });
-      this.$emit("openProcess", process);
+      //this.$emit("openProcess", process);
     },
     /**
      * Load Cards in the new pagination
@@ -146,6 +162,7 @@ export default {
     onFilter(value, showEmpty = false) {
       this.currentPage = 1;
       this.pmql = `(fulltext LIKE "%${value}%")`;
+      this.filter = value;
       this.showEmpty = showEmpty;
       this.loadCard();
     },
diff --git a/resources/js/processes-catalogue/components/ProcessListing.vue b/resources/js/processes-catalogue/components/ProcessListing.vue
index 5cdbd88a94..6f9dba2ede 100644
--- a/resources/js/processes-catalogue/components/ProcessListing.vue
+++ b/resources/js/processes-catalogue/components/ProcessListing.vue
@@ -25,7 +25,7 @@ export default {
   },
   computed: {
     isTemplateCategory() {
-      return ['all_templates', 'guided_templates'].includes(this.categoryId)
+      return ['guided_templates'].includes(this.categoryId)
     },
   }
 };
diff --git a/resources/js/processes-catalogue/components/menuCatologue.vue b/resources/js/processes-catalogue/components/menuCatologue.vue
index 86b037f7d4..c8a0fca94d 100644
--- a/resources/js/processes-catalogue/components/menuCatologue.vue
+++ b/resources/js/processes-catalogue/components/menuCatologue.vue
@@ -93,6 +93,11 @@
     </b-collapse>
     </div>
 
+    <!-- 
+    This line :type="$t('Process'), needs to be reviewed. 
+    The parameter 'type' assigns a translation string. If the language changes, 
+    it may have side effects." 
+    -->
     <select-template-modal
       ref="addProcessModal"
       :type="$t('Process')"
@@ -106,6 +111,7 @@
 <script>
 import SearchCategories from "./utils/SearchCategories.vue";
 import SelectTemplateModal from "../../components/templates/SelectTemplateModal.vue";
+import { EventBus } from '../index.js';
 
 export default {
   components: {
@@ -148,6 +154,11 @@ export default {
       comeFromProcess: false,
     };
   },
+  created() {
+    EventBus.$on('process-selected', (obj)=>{
+      this.openTemplate(obj);
+    });
+  },
   computed: {
     /**
      * Filters options regarding user permissions
@@ -172,12 +183,6 @@ export default {
     }
   },
   watch: {
-    selectedProcessItem: {
-      deep: true,
-      handler: function () {
-        this.$emit('categorySelected', this.selectedProcessItem);
-      },
-    },
     $route(r) {
       this.handleRouteQuery();
     },
@@ -204,6 +209,9 @@ export default {
         this.selectedProcessItem = this.data.find((category) => {
           return String(category.id) === String(query.categoryId);
         });
+        this.selectedTemplateItem = this.filteredTemplateOptions.find((category) => {
+          return String(category.id) === String(query.categoryId);
+        });
       }
     },
     /**
@@ -216,6 +224,7 @@ export default {
       this.comeFromProcess = false;
       this.selectedProcessItem = item;
       this.selectedTemplateItem = null;
+      this.$emit('categorySelected', item);
     },
     /**
      * Enables All Templates option only if user has create-processes permission
@@ -229,13 +238,13 @@ export default {
           return obj.id === "guided_templates";
         });
       }
-      if (item.id === "all_templates") {
+      /*if (item.id === "all_templates") {
         this.addNewProcess();
         return;
-      }
+      }*/
       this.selectedTemplateItem = item;
       this.selectedProcessItem = null;
-      this.$emit('categorySelected', this.selectedTemplateItem);
+      this.$emit('categorySelected', item);
     },
     /**
      * This method opens New Process modal window
@@ -245,11 +254,20 @@ export default {
         this.$refs.addProcessModal.show();
       });
     },
+    openTemplate(obj) {
+      this.$nextTick(() => {
+        this.$refs.addProcessModal.show();
+        this.$refs.addProcessModal.$nextTick(() => {
+          this.$refs.addProcessModal.$refs["template-search"].showDetails(obj);
+          this.$refs.addProcessModal.hideBackButton();
+        });
+      });
+    },
     isSelectedProcess(item) {
       return this.selectedProcessItem === item;
     },
-    isSelectedTemplate(index) {
-      return this.selectedTemplateItem === index;
+    isSelectedTemplate(item) {    
+      return this.selectedTemplateItem === item;
     },
     onToggleCatalogue() {
       this.showCatalogue = !this.showCatalogue;
diff --git a/resources/js/processes-catalogue/components/utils/Card.vue b/resources/js/processes-catalogue/components/utils/Card.vue
index 31fc32815b..5f7b10fd79 100644
--- a/resources/js/processes-catalogue/components/utils/Card.vue
+++ b/resources/js/processes-catalogue/components/utils/Card.vue
@@ -33,6 +33,7 @@
       </div>
       <div class="card-bookmark">
         <i
+          v-if="!hideBookmark"
           :ref="`bookmark-${process.id}`"
           v-b-tooltip.hover.bottom
           :title="$t(labelTooltip)"
@@ -46,7 +47,13 @@
 
 <script>
 export default {
-  props: ["process"],
+  props: {
+    process: null,
+    hideBookmark: {
+      type: Boolean,
+      default: false
+    }
+  },
   data() {
     return {
       labelIcon: "Default Icon",
diff --git a/resources/js/processes-catalogue/index.js b/resources/js/processes-catalogue/index.js
index 85c431a223..ec344c98b2 100644
--- a/resources/js/processes-catalogue/index.js
+++ b/resources/js/processes-catalogue/index.js
@@ -1,8 +1,9 @@
 import Vue from "vue";
 import Process from "./components/Process";
 import ProcessesCatalogue from "./components/ProcessesCatalogue";
-import ProcessListing from "./components/ProcessListing";
+import ProcessListing from "./components/ProcessListing.vue";
 
+export const EventBus = new Vue();
 Vue.use(VueRouter);
 const router = new VueRouter({
   mode: "history",

From 095ce064db0fe887422417310b7dcb332c8276e3 Mon Sep 17 00:00:00 2001
From: Roly Gutierrez <roly.gutierrez@processmaker.com>
Date: Thu, 6 Jun 2024 19:30:07 -0400
Subject: [PATCH 2/7] FOUR-14053 All Templates section (UI change)

---
 resources/js/processes-catalogue/components/menuCatologue.vue | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/processes-catalogue/components/menuCatologue.vue b/resources/js/processes-catalogue/components/menuCatologue.vue
index c8a0fca94d..7c7fd82397 100644
--- a/resources/js/processes-catalogue/components/menuCatologue.vue
+++ b/resources/js/processes-catalogue/components/menuCatologue.vue
@@ -266,7 +266,7 @@ export default {
     isSelectedProcess(item) {
       return this.selectedProcessItem === item;
     },
-    isSelectedTemplate(item) {    
+    isSelectedTemplate(item) {
       return this.selectedTemplateItem === item;
     },
     onToggleCatalogue() {

From 8fb39aedc31c39bf81e18fa31be52fe87aa01024 Mon Sep 17 00:00:00 2001
From: Roly Gutierrez <roly.gutierrez@processmaker.com>
Date: Thu, 6 Jun 2024 19:30:52 -0400
Subject: [PATCH 3/7] FOUR-14053 All Templates section (UI change)

---
 resources/js/processes-catalogue/index.js | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/resources/js/processes-catalogue/index.js b/resources/js/processes-catalogue/index.js
index ec344c98b2..0b7630ff87 100644
--- a/resources/js/processes-catalogue/index.js
+++ b/resources/js/processes-catalogue/index.js
@@ -1,7 +1,7 @@
 import Vue from "vue";
 import Process from "./components/Process";
 import ProcessesCatalogue from "./components/ProcessesCatalogue";
-import ProcessListing from "./components/ProcessListing.vue";
+import ProcessListing from "./components/ProcessListing";
 
 export const EventBus = new Vue();
 Vue.use(VueRouter);

From 9523611b3a73eb4bd7328c6cb5f34c10f1a13a95 Mon Sep 17 00:00:00 2001
From: Roly Gutierrez <roly.gutierrez@processmaker.com>
Date: Thu, 6 Jun 2024 19:31:41 -0400
Subject: [PATCH 4/7] FOUR-14053 All Templates section (UI change)

---
 resources/js/processes-catalogue/components/menuCatologue.vue | 4 ----
 1 file changed, 4 deletions(-)

diff --git a/resources/js/processes-catalogue/components/menuCatologue.vue b/resources/js/processes-catalogue/components/menuCatologue.vue
index 7c7fd82397..8519b9fc15 100644
--- a/resources/js/processes-catalogue/components/menuCatologue.vue
+++ b/resources/js/processes-catalogue/components/menuCatologue.vue
@@ -238,10 +238,6 @@ export default {
           return obj.id === "guided_templates";
         });
       }
-      /*if (item.id === "all_templates") {
-        this.addNewProcess();
-        return;
-      }*/
       this.selectedTemplateItem = item;
       this.selectedProcessItem = null;
       this.$emit('categorySelected', item);

From ba207bc5ff2928df7f1b57c023017eb67be45abc Mon Sep 17 00:00:00 2001
From: Roly Gutierrez <roly.gutierrez@processmaker.com>
Date: Thu, 6 Jun 2024 19:33:53 -0400
Subject: [PATCH 5/7] FOUR-14053 All Templates section (UI change)

---
 resources/js/processes-catalogue/components/CardProcess.vue   | 4 ++--
 resources/js/processes-catalogue/components/menuCatologue.vue | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/resources/js/processes-catalogue/components/CardProcess.vue b/resources/js/processes-catalogue/components/CardProcess.vue
index 6fe4a8a698..034588dfcd 100644
--- a/resources/js/processes-catalogue/components/CardProcess.vue
+++ b/resources/js/processes-catalogue/components/CardProcess.vue
@@ -143,11 +143,11 @@ export default {
      */
     openProcessInfo(process) {
       if (this.categoryId === 'all_templates') {
-        EventBus.$emit('process-selected', { template: process, type: "Process" });
+        EventBus.$emit('templates-selected', { template: process, type: "Process" });
         return;
       }
       this.$router.push({ name: "show", params: { process: process, processId: process.id } });
-      //this.$emit("openProcess", process);
+      this.$emit("openProcess", process);
     },
     /**
      * Load Cards in the new pagination
diff --git a/resources/js/processes-catalogue/components/menuCatologue.vue b/resources/js/processes-catalogue/components/menuCatologue.vue
index 8519b9fc15..2a70e4215f 100644
--- a/resources/js/processes-catalogue/components/menuCatologue.vue
+++ b/resources/js/processes-catalogue/components/menuCatologue.vue
@@ -155,7 +155,7 @@ export default {
     };
   },
   created() {
-    EventBus.$on('process-selected', (obj)=>{
+    EventBus.$on('templates-selected', (obj) => {
       this.openTemplate(obj);
     });
   },

From 78d2bdab8ffaa7d0ea89275446215f9bda9cb819 Mon Sep 17 00:00:00 2001
From: Roly Gutierrez <roly.gutierrez@processmaker.com>
Date: Fri, 7 Jun 2024 20:48:17 -0400
Subject: [PATCH 6/7] FOUR-14053 All Templates section (UI change)

---
 resources/js/components/templates/SelectTemplateModal.vue | 4 ++--
 1 file changed, 2 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/templates/SelectTemplateModal.vue b/resources/js/components/templates/SelectTemplateModal.vue
index cf76ca80b3..fe27a59d9e 100644
--- a/resources/js/components/templates/SelectTemplateModal.vue
+++ b/resources/js/components/templates/SelectTemplateModal.vue
@@ -126,8 +126,8 @@
         this.$bvModal.show('selectTemplate');
       },
       hideBackButton() {
-        this.headerButtons[0].hidden = true;
-        this.titleButtons[0].hidden = true;
+        this.headerButtons[0].hidden = false;
+        this.titleButtons[0].hidden = false;
         this.hasHeaderButtons = false;
       }
     },

From d38afb12a0a42c6774dc763ce0be12e424d018b0 Mon Sep 17 00:00:00 2001
From: Nolan Ehrstrom <github@nolanpro.com>
Date: Mon, 10 Jun 2024 10:22:02 -0700
Subject: [PATCH 7/7] Remove comment for sonar qube

---
 .../js/processes-catalogue/components/menuCatologue.vue      | 5 -----
 1 file changed, 5 deletions(-)

diff --git a/resources/js/processes-catalogue/components/menuCatologue.vue b/resources/js/processes-catalogue/components/menuCatologue.vue
index 2a70e4215f..9fc6b47fbb 100644
--- a/resources/js/processes-catalogue/components/menuCatologue.vue
+++ b/resources/js/processes-catalogue/components/menuCatologue.vue
@@ -93,11 +93,6 @@
     </b-collapse>
     </div>
 
-    <!-- 
-    This line :type="$t('Process'), needs to be reviewed. 
-    The parameter 'type' assigns a translation string. If the language changes, 
-    it may have side effects." 
-    -->
     <select-template-modal
       ref="addProcessModal"
       :type="$t('Process')"