@processmaker/modeler 1.43.4 → 1.43.5

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@processmaker/modeler",
-  "version": "1.43.4",
+  "version": "1.43.5",
   "scripts": {
     "serve": "vue-cli-service serve --mode development",
     "test:unit": "vue-cli-service test:unit",

package/src/components/modeler/Modeler.vue

@@ -1895,6 +1895,34 @@ export default {
           this.assetFail = true;
         });
     },
+    highlightTaskArrays(data) {
+      if (data) {
+        this.addAiHighlights(data.tasks);
+        this.addAiHighlights(data.serviceTasks);
+        this.addAiHighlights(data.scriptTasks);
+      }
+    },
+    unhighlightTaskArrays(data) {
+      if (data) {
+        this.removeAiHighlights(data.tasks);
+        this.removeAiHighlights(data.serviceTasks);
+        this.removeAiHighlights(data.scriptTasks);
+      }
+    },
+    addAiHighlights(taskArray) {
+      let self = this;
+      taskArray.forEach(task => {
+        const taskNode = self.getElementByNodeId(task.id);
+        taskNode.component.setAiStatusHighlight(task.status);
+      });
+    },
+    removeAiHighlights(taskArray) {
+      let self = this;
+      taskArray.forEach(task => {
+        const taskNode = self.getElementByNodeId(task.id);
+        taskNode.component.unsetHighlights();
+      });
+    },
     subscribeToProgress() {
       const channel = `ProcessMaker.Models.User.${window.ProcessMaker?.modeler?.process?.user_id}`;
       const streamProgressEvent = '.ProcessMaker\\Package\\PackageAi\\Events\\GenerateArtifactsProgressEvent';
@@ -1902,17 +1930,19 @@ export default {
         streamProgressEvent,
         (response) => {
           if (response.data.promptSessionId !== this.promptSessionId) {
+            this.unhighlightTaskArrays(response.data);
             return;
           }
 
           if (this.cancelledJobs.some((element) => element === response.data.nonce)) {
+            this.unhighlightTaskArrays(response.data);
             return;
           }
 
           if (response.data) {
             if (response.data.progress.status === 'running') {
               this.loadingAI = true;
-              // Blue color for nodes running
+              this.highlightTaskArrays(response.data);
             } else if (response.data.progress.status === 'error') {
               this.loadingAI = false;
               window.ProcessMaker.alert(response.data.message, 'danger');
@@ -1922,6 +1952,7 @@ export default {
               this.setPromptSessions(response.data.promptSessionId);
               // Successful generation 
               this.assetsCreated = true;
+              this.unhighlightTaskArrays(response.data);
               this.fetchHistory();
               setTimeout(() => {
                 this.loadingAI = false;

package/src/mixins/highlightConfig.js

@@ -143,7 +143,29 @@ export default {
       } else {
         this.shapeView.unhighlight(this.shapeBody, this.prepareCustomColorHighlighter(color));
       }
-     
+    },
+    setAiStatusHighlight(status) {
+      this.shapeView.unhighlight(this.shapeBody, completedHighlighter);
+      if (status === 'generated') {
+        this.shape.attr('body/fill', COLOR_COMPLETED_FILL);
+        this.shapeView.highlight(this.shapeBody, completedHighlighter);
+      }
+      this.shapeView.unhighlight(this.shapeBody, inProgressHighlighter);
+      if (status === 'generating') {
+        this.shape.attr('body/fill', COLOR_IN_PROGRESS_FILL);
+        this.shapeView.highlight(this.shapeBody, inProgressHighlighter);
+      }
+      this.shapeView.unhighlight(this.shapeBody, idleHighlighter);
+      if (status === 'previously generated') {
+        this.shape.attr('body/fill', COLOR_IDLE_FILL);
+        this.shapeView.highlight(this.shapeBody, idleHighlighter);
+      }
+    },
+    unsetHighlights() {
+      this.shape.attr('body/fill', '#FFFFFF');
+      this.shapeView.unhighlight(this.shapeBody, inProgressHighlighter);
+      this.shapeView.unhighlight(this.shapeBody, completedHighlighter);
+      this.shapeView.unhighlight(this.shapeBody, idleHighlighter);
     },
     setShapeHighlightForReadOnly() {
       if (!this.shapeView) {