From 8106f837ad51a6c79e3aace51ee335fea5d261c7 Mon Sep 17 00:00:00 2001
From: Gustavo Bascope <gustavo.bascope@processmaker.com>
Date: Wed, 31 Jan 2024 15:54:52 -0400
Subject: [PATCH 1/4] Fix the ellipsis showing over the header

---
 resources/js/components/shared/EllipsisMenu.vue           | 6 ++++++
 resources/js/processes/components/ArchivedProcessList.vue | 1 +
 resources/js/processes/components/ProcessesListing.vue    | 4 ++--
 3 files changed, 9 insertions(+), 2 deletions(-)

diff --git a/resources/js/components/shared/EllipsisMenu.vue b/resources/js/components/shared/EllipsisMenu.vue
index a3f829a313..09b1571189 100644
--- a/resources/js/components/shared/EllipsisMenu.vue
+++ b/resources/js/components/shared/EllipsisMenu.vue
@@ -2,6 +2,7 @@
   <b-dropdown
     v-if="filterActions.length > 0"
     :variant="variant ? variant : 'ellipsis'"
+    toggle-class="static-header"
     no-caret
     no-flip
     lazy
@@ -280,3 +281,8 @@ export default {
   color: #6C757D;
 }
 </style>
+<style>
+.static-header {
+  position: static !important;
+}
+</style>
diff --git a/resources/js/processes/components/ArchivedProcessList.vue b/resources/js/processes/components/ArchivedProcessList.vue
index 7b54944f11..7f52b17357 100644
--- a/resources/js/processes/components/ArchivedProcessList.vue
+++ b/resources/js/processes/components/ArchivedProcessList.vue
@@ -15,6 +15,7 @@
       <filter-table
         :headers="fields"
         :data="data"
+        style="height: calc(100vh - 350px);"
       >
         <!-- Slot Table Body -->
         <template
diff --git a/resources/js/processes/components/ProcessesListing.vue b/resources/js/processes/components/ProcessesListing.vue
index 93b1cb365d..9fb2670da0 100644
--- a/resources/js/processes/components/ProcessesListing.vue
+++ b/resources/js/processes/components/ProcessesListing.vue
@@ -86,9 +86,9 @@
                       class="mr-2"
                       :class="{ 'fas fa-check-circle text-success': row.status == 'ACTIVE', 'far fa-circle': row.status == 'INACTIVE' }"
                     />
-                    <span>
+                    <a :href="`modeler/${row.id}`" class="text-nowrap">
                       {{ row[header.field] }}
-                    </span>
+                    </a>
                   </div>
                   <b-tooltip
                     v-if="header.truncate"

From 5a30730c62ba72b13eb0320674aaf8375569fd1d Mon Sep 17 00:00:00 2001
From: Gustavo Bascope <gustavo.bascope@processmaker.com>
Date: Wed, 31 Jan 2024 16:14:57 -0400
Subject: [PATCH 2/4] Fix No results image showing below the table

---
 resources/js/components/shared/FilterTable.vue | 7 ++++---
 1 file changed, 4 insertions(+), 3 deletions(-)

diff --git a/resources/js/components/shared/FilterTable.vue b/resources/js/components/shared/FilterTable.vue
index 46a7422606..5bcb2e7dab 100644
--- a/resources/js/components/shared/FilterTable.vue
+++ b/resources/js/components/shared/FilterTable.vue
@@ -238,8 +238,6 @@ export default {
   border-radius: 5px;
   scrollbar-width: 8px;
   scrollbar-color: #6C757D;
-  height: calc(100vh - 150px);
-  min-height: 400px;
 }
 
 .pm-table-container th {
@@ -379,7 +377,10 @@ export default {
 .pm-table-container::-webkit-scrollbar-thumb {
   background-color: #6C757D;
   border-radius: 20px;
-} 
+}
+.pm-table-container {
+  max-height: calc(100vh - 150px);
+}
 .ellipsis-dropdown-main ul.dropdown-menu.dropdown-menu-right.show {
   max-height: 250px;
   overflow-y: auto;

From 32ab5d8ff9c4ef640387f9a10026155306c89a28 Mon Sep 17 00:00:00 2001
From: Gustavo Bascope <gustavo.bascope@processmaker.com>
Date: Wed, 31 Jan 2024 16:58:24 -0400
Subject: [PATCH 3/4] Fix SonarQube observations

---
 resources/js/components/shared/FilterTable.vue         | 4 +---
 resources/js/processes/components/ProcessMixin.js      | 3 +++
 resources/js/processes/components/ProcessesListing.vue | 2 +-
 3 files changed, 5 insertions(+), 4 deletions(-)

diff --git a/resources/js/components/shared/FilterTable.vue b/resources/js/components/shared/FilterTable.vue
index 5bcb2e7dab..3154ab021d 100644
--- a/resources/js/components/shared/FilterTable.vue
+++ b/resources/js/components/shared/FilterTable.vue
@@ -238,6 +238,7 @@ export default {
   border-radius: 5px;
   scrollbar-width: 8px;
   scrollbar-color: #6C757D;
+  max-height: calc(100vh - 150px);
 }
 
 .pm-table-container th {
@@ -378,9 +379,6 @@ export default {
   background-color: #6C757D;
   border-radius: 20px;
 }
-.pm-table-container {
-  max-height: calc(100vh - 150px);
-}
 .ellipsis-dropdown-main ul.dropdown-menu.dropdown-menu-right.show {
   max-height: 250px;
   overflow-y: auto;
diff --git a/resources/js/processes/components/ProcessMixin.js b/resources/js/processes/components/ProcessMixin.js
index 38e5989276..249e20a538 100644
--- a/resources/js/processes/components/ProcessMixin.js
+++ b/resources/js/processes/components/ProcessMixin.js
@@ -156,5 +156,8 @@ export default {
         this.fetch();
       }
     },
+    openModeler(data) {
+      return `/modeler/${data.id}`;
+    },
   },
 };
diff --git a/resources/js/processes/components/ProcessesListing.vue b/resources/js/processes/components/ProcessesListing.vue
index c7400fd5e7..07ee51dff6 100644
--- a/resources/js/processes/components/ProcessesListing.vue
+++ b/resources/js/processes/components/ProcessesListing.vue
@@ -86,7 +86,7 @@
                       class="mr-2"
                       :class="{ 'fas fa-check-circle text-success': row.status == 'ACTIVE', 'far fa-circle': row.status == 'INACTIVE' }"
                     />
-                    <a :href="`modeler/${row.id}`" class="text-nowrap">
+                    <a :href="openModeler(row)" class="text-nowrap">
                       {{ row[header.field] }}
                     </a>
                   </div>

From 06533bddb1658c1ee58e35a4051859f2c95dcc2f Mon Sep 17 00:00:00 2001
From: Gustavo Bascope <gustavo.bascope@processmaker.com>
Date: Mon, 5 Feb 2024 17:16:52 -0400
Subject: [PATCH 4/4] Fix loading screen showing below the table

---
 resources/js/components/shared/FilterTable.vue       | 8 ++++++++
 resources/js/requests/components/RequestsListing.vue | 1 +
 resources/js/tasks/components/TasksList.vue          | 3 ++-
 3 files changed, 11 insertions(+), 1 deletion(-)

diff --git a/resources/js/components/shared/FilterTable.vue b/resources/js/components/shared/FilterTable.vue
index 8b719fe1db..9ad466a300 100644
--- a/resources/js/components/shared/FilterTable.vue
+++ b/resources/js/components/shared/FilterTable.vue
@@ -49,6 +49,7 @@
         </tr>
       </thead>
       <tbody>
+        <template v-if="!loading">
         <tr
           v-for="(row, rowIndex) in data.data"
           :key="rowIndex"
@@ -105,6 +106,7 @@
             </td>
           </slot>
         </tr>
+        </template>
       </tbody>
     </table>
   </div>
@@ -133,6 +135,12 @@ export default {
         return "";
       }
     },
+    loading: {
+      type: Boolean,
+      default: function () {
+        return false;
+      }
+    },
   },
   data() {
     return {
diff --git a/resources/js/requests/components/RequestsListing.vue b/resources/js/requests/components/RequestsListing.vue
index 266daaf587..48be6ac440 100644
--- a/resources/js/requests/components/RequestsListing.vue
+++ b/resources/js/requests/components/RequestsListing.vue
@@ -7,6 +7,7 @@
         :headers="tableHeaders"
         :data="data"
         :unread="unreadColumnName"
+        :loading="shouldShowLoader"
         @table-row-click="handleRowClick"
       >
         <!-- Slot Table Header -->
diff --git a/resources/js/tasks/components/TasksList.vue b/resources/js/tasks/components/TasksList.vue
index 1586c17c33..5535ab5178 100644
--- a/resources/js/tasks/components/TasksList.vue
+++ b/resources/js/tasks/components/TasksList.vue
@@ -8,6 +8,7 @@
         :headers="tableHeaders"
         :data="data"
         :unread="unreadColumnName"
+        :loading="shouldShowLoader"
         @table-row-click="handleRowClick"
         @table-row-mouseover="handleRowMouseover"
         @table-row-mouseleave="handleRowMouseleave"
@@ -48,7 +49,7 @@
                 :id="`element-${rowIndex}-${colIndex}`"
                 :class="{ 'pm-table-truncate': header.truncate }"
                 :style="{ maxWidth: header.width + 'px' }"
-                  >
+              >
                 <div v-html="sanitize(getNestedPropertyValue(row, header.field))"></div>
               </div>
               <b-tooltip