17754: Attempts to improve code layout for better readability.

[arvados-workbench2.git] / src / views / workflow-panel / workflow-graph.tsx

diff --git a/src/views/workflow-panel/workflow-graph.tsx b/src/views/workflow-panel/workflow-graph.tsx
index de2903288f6e8520e6fc1beab935aab8a008a460..3f4aac2bbe424b0974613f75910394f1a2b7b908 100644 (file)
--- a/src/views/workflow-panel/workflow-graph.tsx
+++ b/src/views/workflow-panel/workflow-graph.tsx
@@ -1,10 +1,14 @@
-import * as React from 'react';
-import { WorkflowResource } from "~/models/workflow";
+// Copyright (C) The Arvados Authors. All rights reserved.
+//
+// SPDX-License-Identifier: AGPL-3.0
+
+import React from 'react';
+import { WorkflowResource } from "models/workflow";
 import { WorkflowFactory } from "cwlts/models";
 import * as yaml from 'js-yaml';
-import "~/lib/cwl-svg/assets/styles/themes/rabix-dark/theme.css";
-import "~/lib/cwl-svg/plugins/port-drag/theme.dark.css";
-import "~/lib/cwl-svg/plugins/selection/theme.dark.css";
+import "lib/cwl-svg/assets/styles/themes/rabix-dark/theme.css";
+import "lib/cwl-svg/plugins/port-drag/theme.dark.css";
+import "lib/cwl-svg/plugins/selection/theme.dark.css";
 import {
     SelectionPlugin,
     SVGArrangePlugin,
@@ -12,7 +16,7 @@ import {
     SVGNodeMovePlugin,
     SVGPortDragPlugin, Workflow,
     ZoomPlugin
-} from "~/lib/cwl-svg";
+} from "lib/cwl-svg";
 
 interface WorkflowGraphProps {
     workflow: WorkflowResource;
@@ -20,7 +24,7 @@ interface WorkflowGraphProps {
 export class WorkflowGraph extends React.Component<WorkflowGraphProps, {}> {
     private svgRoot: React.RefObject<SVGSVGElement> = React.createRef();
 
-    componentDidMount(): void {
+    setGraph() {
         const graphs = yaml.safeLoad(this.props.workflow.definition, { json: true });
 
         let workflowGraph = graphs;
@@ -37,7 +41,7 @@ export class WorkflowGraph extends React.Component<WorkflowGraphProps, {}> {
                 new SVGArrangePlugin(),
                 new SVGEdgeHoverPlugin(),
                 new SVGNodeMovePlugin({
-                    movementSpeed: 10
+                    movementSpeed: 2
                 }),
                 new SVGPortDragPlugin(),
                 new SelectionPlugin(),
@@ -47,6 +51,14 @@ export class WorkflowGraph extends React.Component<WorkflowGraphProps, {}> {
         workflow.draw();
     }
 
+    componentDidMount() {
+        this.setGraph();
+    }
+
+    componentDidUpdate() {
+        this.setGraph();
+    }
+
     render() {
         return <svg
             ref={this.svgRoot}