Merge remote-tracking branch 'origin/release-2024-fall' into bugfix/F…

…OUR-19011
ProcessMaker · Oct 29, 2024 · c6f68d4 · c6f68d4
2 parents b15aa6c + 83aaa2e
commit c6f68d4
Show file tree

Hide file tree

Showing 6 changed files with 123 additions and 5 deletions.
diff --git a/src/components/editor/loop.vue b/src/components/editor/loop.vue
@@ -27,6 +27,15 @@
                 class="mr-2 ml-1"
               />
               {{ element.config.name || $t("Variable Name") }}
+              <b-badge
+                v-if="isInClipboard(items[index])"
+                data-cy="copied-badge"
+                class="m-2 custom-badge"
+                pill
+              >
+                <i class="far fa-check-circle"></i>
+                <span class="pl-2">{{ $t('Copied')}}</span>
+              </b-badge>
               <div class="ml-auto">
                 <clipboard-button
                   :index="index"
@@ -91,6 +100,15 @@
                 class="mr-2 ml-1"
               />
               {{ element.config.name || $t("Variable Name") }}
+              <b-badge
+                v-if="isInClipboard(items[index])"
+                data-cy="copied-badge"
+                class="m-2 custom-badge"
+                pill
+              >
+                <i class="far fa-check-circle"></i>
+                <span class="pl-2">{{ $t('Copied')}}</span>
+              </b-badge>
               <div class="ml-auto">
                 <clipboard-button
                   :index="index"
@@ -334,4 +352,12 @@ export default {
     box-shadow: 0 0 0 13px rgba(0, 0, 0, 0);
   }
 }
+.custom-badge {
+  background-color: #D1F4D7 !important;
+  color: #06723A !important;
+  padding: 0.5rem 0.75rem;
+  border-radius: 8px;
+  font-weight: 500;
+  font-size: 14px;
+}
 </style>
diff --git a/src/components/editor/multi-column.vue b/src/components/editor/multi-column.vue
@@ -42,6 +42,15 @@
                       class="mr-2 ml-1"
                     />
                     {{ element.config.name || $t("Variable Name") }}
+                    <b-badge
+                      v-if="isInClipboard(element)"
+                      data-cy="copied-badge"
+                      class="m-2 custom-badge"
+                      pill
+                    >
+                      <i class="far fa-check-circle"></i>
+                      <span class="pl-2">{{ $t('Copied')}}</span>
+                    </b-badge>
                     <div class="ml-auto">
                       <clipboard-button
                         :index="index"
@@ -108,6 +117,15 @@
                       class="mr-2 ml-1"
                     />
                     {{ element.config.name || $t("Variable Name") }}
+                    <b-badge
+                      v-if="isInClipboard(element)"
+                      data-cy="copied-badge"
+                      class="m-2 custom-badge"
+                      pill
+                    >
+                      <i class="far fa-check-circle"></i>
+                      <span class="pl-2">{{ $t('Copied')}}</span>
+                    </b-badge>
                     <div class="ml-auto">
                       <clipboard-button
                         :index="index"
@@ -375,4 +393,12 @@ export default {
     box-shadow: 0 0 0 13px rgba(0, 0, 0, 0);
   }
 }
+.custom-badge {
+  background-color: #D1F4D7 !important;
+  color: #06723A !important;
+  padding: 0.5rem 0.75rem;
+  border-radius: 8px;
+  font-weight: 500;
+  font-size: 14px;
+}
 </style>
diff --git a/src/components/renderer/file-upload.vue b/src/components/renderer/file-upload.vue
@@ -158,6 +158,10 @@ export default {
     this.removeDefaultClasses();
   },
   mounted() {
+    if (this.value) {
+      this.fetchFiles();
+    }
+    
     this.$root.$on('set-upload-data-name',
       (recordList, index, id) => this.listenRecordList(recordList, index, id));
 
@@ -703,7 +707,29 @@ export default {
     },
     cfSkipFileUpload() {
       this.$emit('cf-skip-file-upload');
-    }
+    },
+    async fetchFiles() {
+      const fileIds = Array.isArray(this.value) ? this.value : [this.value];
+
+      const fetchPromises = fileIds.map(async (file) => {
+        const id = file?.file ?? file;
+        const endpoint = `files/${id}`;
+        try {
+            const response = await ProcessMaker.apiClient.get(endpoint);
+            if (response?.data) {
+                const fileExists = this.files.some(existingFile => existingFile.id === response.data.id);
+                // Check if the file already exists in the list before adding it.
+                if (!fileExists) {
+                    this.files.push(response.data);
+                }
+            }
+        } catch (error) {
+            console.error(`Failed to fetch file ${id}`, error);
+        }
+      });
+
+      return await Promise.all(fetchPromises);
+    },
   },
 };
 </script>

diff --git a/src/components/vue-form-builder.vue b/src/components/vue-form-builder.vue
@@ -202,6 +202,15 @@
                     class="mr-2 ml-1"
                   />
                   {{ element.config.name || element.label || $t("Field Name") }}
+                  <b-badge
+                    v-if="!isClipboardPage(tabPage) && isInClipboard(extendedPages[tabPage].items[index])"
+                    data-cy="copied-badge"
+                    class="m-2 custom-badge"
+                    pill
+                  >
+                    <i class="far fa-check-circle"></i>
+                    <span class="pl-2">{{ $t('Copied')}}</span>
+                  </b-badge>
                   <div class="ml-auto">
                     <clipboard-button
                       v-if="!isClipboardPage(tabPage)"
@@ -267,6 +276,15 @@
                     class="mr-2 ml-1"
                   />
                   {{ element.config.name || $t("Variable Name") }}
+                  <b-badge
+                    v-if="!isClipboardPage(tabPage) && isInClipboard(extendedPages[tabPage].items[index])"
+                    data-cy="copied-badge"
+                    class="m-2 custom-badge"
+                    pill
+                  >
+                    <i class="far fa-check-circle"></i>
+                    <span class="pl-2">{{ $t('Copied')}}</span>
+                  </b-badge>
                   <div class="ml-auto">
                     <clipboard-button
                       v-if="!isClipboardPage(tabPage)"
@@ -1746,6 +1764,14 @@ $side-bar-font-size: 0.875rem;
   cursor: not-allowed; /* Cambia el cursor cuando se pasa por encima */
   pointer-events: all; /* Permite que el pseudo-elemento reciba eventos del ratón */
 }
+.custom-badge {
+  background-color: #D1F4D7 !important;
+  color: #06723A !important;
+  padding: 0.5rem 0.75rem;
+  border-radius: 8px;
+  font-weight: 500;
+  font-size: 14px;
+}
 .no-text-transform {
     text-transform: none;
 }

diff --git a/tests/e2e/specs/Clipboard.spec.js b/tests/e2e/specs/Clipboard.spec.js
@@ -28,7 +28,7 @@ describe("Clipboard Button Actions", () => {
 
     // Step 4: Verify 'Remove from Clipboard' button is visible after adding to clipboard and then click it
     cy.get('[data-cy="removeFromClipboard"]').should("be.visible");
-    cy.get('[data-cy="removeFromClipboard"]').click();
+    cy.get('[data-cy="removeFromClipboard"]').click({force: true});
     cy.get('[data-cy="removeFromClipboard"]').should("not.exist");
   });
 
@@ -73,7 +73,7 @@ describe("Clipboard Button Actions", () => {
 
     // Step 5: Remove the form input from the clipboard
     cy.get('[data-cy="removeFromClipboard"]').should("be.visible");
-    cy.get('[data-cy="removeFromClipboard"]').click();
+    cy.get('[data-cy="removeFromClipboard"]').click({force: true});
     cy.get('[data-cy="removeFromClipboard"]').should("not.exist");
   });
 
@@ -102,7 +102,7 @@ describe("Clipboard Button Actions", () => {
 
     // Step 4: Remove the form input from the clipboard
     cy.get('[data-cy="removeFromClipboard"]').should("be.visible");
-    cy.get('[data-cy="removeFromClipboard"]').click();
+    cy.get('[data-cy="removeFromClipboard"]').click({force: true});
     cy.get('[data-cy="removeFromClipboard"]').should("not.exist");
   });
 

diff --git a/tests/e2e/specs/ClipboardTestCases.spec.js b/tests/e2e/specs/ClipboardTestCases.spec.js
@@ -61,31 +61,37 @@ describe("Clipboard Button Actions", () => {
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(2) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(3) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(4) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(5) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(6) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get("[data-test=page-dropdown").click();
     cy.get("[data-test=clipboard]").should("exist").click({ force: true });
@@ -111,32 +117,37 @@ describe("Clipboard Button Actions", () => {
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(2) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(3) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(4) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(5) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(6) > [data-cy="screen-element-container"]').click({ force: true });
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
-
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get("[data-test=page-dropdown").click();
     cy.get("[data-test=clipboard]").should("exist").click({ force: true });
@@ -158,6 +169,7 @@ describe("Clipboard Button Actions", () => {
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get("[data-test=page-dropdown").click();
     cy.get("[data-test=clipboard]").should("exist").click({ force: true });
@@ -178,11 +190,13 @@ describe("Clipboard Button Actions", () => {
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
     cy.get(':nth-child(2) > [data-cy="screen-element-container"]').click();
     cy.get('[data-cy="addToClipboard"]').should("be.visible");
     cy.get('[data-cy="addToClipboard"]').click();
     cy.get('[data-cy="addToClipboard"]').should("not.exist");
+    cy.get('[data-cy="copied-badge"]').should("exist");
 
 
     cy.get("[data-test=page-dropdown").click();