fix(ui): refresh workflow view when launching new workflow run (#4830)

Signed-off-by: Benjamin Coenen <5719034+bnjjj@users.noreply.github.com>
ovh · Dec 17, 2019 · ac5272e · ac5272e
1 parent cf4ee90
commit ac5272e
Show file tree

Hide file tree

Showing 3 changed files with 8 additions and 18 deletions.
diff --git a/ui/src/app/views/workflow/graph/workflow.graph.component.ts b/ui/src/app/views/workflow/graph/workflow.graph.component.ts
@@ -1,17 +1,5 @@
-import {
-    AfterViewInit,
-    ChangeDetectionStrategy,
-    ChangeDetectorRef,
-    Component,
-    ComponentFactoryResolver,
-    ComponentRef,
-    EventEmitter,
-    HostListener,
-    Input,
-    Output,
-    ViewChild,
-    ViewContainerRef
-} from '@angular/core';
+// tslint:disable-next-line: max-line-length
+import { AfterViewInit, ChangeDetectionStrategy, ChangeDetectorRef, Component, ComponentFactoryResolver, ComponentRef, EventEmitter, HostListener, Input, Output, ViewChild, ViewContainerRef } from '@angular/core';
 import * as d3 from 'd3';
 import * as dagreD3 from 'dagre-d3';
 import { Project } from '../../../model/project.model';
@@ -100,7 +88,6 @@ export class WorkflowGraphComponent implements AfterViewInit {
     initWorkflow() {
         // https://github.com/cpettitt/dagre/wiki#configuring-the-layout
         this.g = new dagreD3.graphlib.Graph().setGraph({ rankdir: this.direction, nodesep: 10, ranksep: 15, edgesep: 5 });
-
         // Create all nodes
         if (this.workflow.workflow_data && this.workflow.workflow_data.node) {
             this.createNode(this.workflow.workflow_data.node);
@@ -125,7 +112,10 @@ export class WorkflowGraphComponent implements AfterViewInit {
             WorkflowGraphComponent.minScale,
             WorkflowGraphComponent.maxScale
         ]).on('zoom', () => {
-            g.attr('transform', d3.event.transform);
+            if (d3.event.transform && d3.event.transform.x && d3.event.transform.x !== Number.POSITIVE_INFINITY
+                && d3.event.transform.y && d3.event.transform.y !== Number.POSITIVE_INFINITY) {
+                g.attr('transform', d3.event.transform);
+            }
         });
 
         this.svg.call(this.zoom);

diff --git a/ui/src/app/views/workflow/run/workflow.run.component.ts b/ui/src/app/views/workflow/run/workflow.run.component.ts
@@ -99,7 +99,7 @@ export class WorkflowRunComponent implements OnInit {
                 if (!this.workflowRunData) {
                     this.workflowRunData = {};
                 }
-                if (!this.workflowRunData['workflow']) {
+                if (!this.workflowRunData['workflow'] || !this.workflowRunData['workflow'].workflow_data) {
                     this.workflowRunData['workflow'] = s.workflowRun.workflow;
                     this.workflowName = s.workflowRun.workflow.name;
                 }

diff --git a/ui/src/app/views/workflow/run/workflow.run.html b/ui/src/app/views/workflow/run/workflow.run.html
@@ -2,7 +2,7 @@
     <app-workflow-run-summary [(direction)]="direction" [project]="project" [workflowName]="workflowName"
         [class.above]="workflowRunData['status'] === pipelineStatusEnum.PENDING">
     </app-workflow-run-summary>
-    <ng-container *ngIf="workflowRunData['id'] !== pipelineStatusEnum.PENDING; else pendingBlock">
+    <ng-container *ngIf="workflowRunData['status'] !== pipelineStatusEnum.PENDING; else pendingBlock">
         <ng-container *ngIf="workflowRunData['workflow'] && workflowRunData['workflow'].workflow_data && !displayError">
             <app-workflow-graph class="graph" [direction]="direction" [project]="project"
                 [workflowData]="workflowRunData['workflow']">