From f1c5f21190a997c8c9fe277ee607725a77e0b531 Mon Sep 17 00:00:00 2001
From: Cyrus Hiatt <chiatt@fargeo.com>
Date: Tue, 11 Jun 2019 08:59:21 -0700
Subject: [PATCH 1/2] Fixes latency when loading a workflow. re #4821

---
 .../app/media/js/viewmodels/workflow-step.js  | 16 +++----
 arches/app/media/js/viewmodels/workflow.js    | 46 +++++++++----------
 .../views/components/plugins/workflow.htm     |  4 +-
 3 files changed, 32 insertions(+), 34 deletions(-)

diff --git a/arches/app/media/js/viewmodels/workflow-step.js b/arches/app/media/js/viewmodels/workflow-step.js
index 11873e0f934..6e4484566cb 100644
--- a/arches/app/media/js/viewmodels/workflow-step.js
+++ b/arches/app/media/js/viewmodels/workflow-step.js
@@ -20,7 +20,13 @@ define([
             return {};
         };
 
-        _.extend(this, koMapping.fromJS(config));
+        Object.keys(config).forEach(function(prop){
+            if(prop !== 'workflow') {
+                config[prop] = koMapping.fromJS(config[prop]);
+            }
+        });
+
+        _.extend(this, config);
 
         this.iconClass = ko.computed(function(){
             var ret = '';
@@ -33,14 +39,6 @@ define([
             }
             return ret + ' ' + ko.unwrap(this.icon);
         }, this);
-
-        this.ready = ko.observable(false);
-        var self = this;
-
-        require([config.component], function(componentViewmodel) {
-            self.componentViewmodel = componentViewmodel;
-            self.ready(true);
-        });
     };
     return WorkflowStep;
 });
diff --git a/arches/app/media/js/viewmodels/workflow.js b/arches/app/media/js/viewmodels/workflow.js
index b3ee16c47bd..23df8a14e1f 100644
--- a/arches/app/media/js/viewmodels/workflow.js
+++ b/arches/app/media/js/viewmodels/workflow.js
@@ -1,9 +1,10 @@
 define([
     'jquery',
+    'underscore',
     'knockout',
     'knockout-mapping',
     'viewmodels/workflow-step'
-], function($, ko, koMapping, Step) {
+], function($, _, ko, koMapping, Step) {
     var Workflow = function(config) {
         var self = this;
         this.steps = config.steps || [];
@@ -13,7 +14,6 @@ define([
         this.loading = config.loading || ko.observable(false);
         this.alert = config.alert || ko.observable(null);
         this.state = {steps:{}};
-        this.advance = true;
 
         this.restoreStateFromURL = function(){
             var urlparams = new window.URLSearchParams(window.location.search);
@@ -26,29 +26,29 @@ define([
         this.restoreStateFromURL();
 
         this.ready.subscribe(function() {
-            self.steps.forEach(function(step, i) {
-                if (!(self.steps[i] instanceof Step)) {
-                    step.workflow = self;
-                    step.loading = self.loading;
-                    step.alert = self.alert;
-                    self.steps[i] = new Step(step);
-                    self.steps[i].ready.subscribe(function(val){
-                        if (val) {
-                            console.log(self.steps[i])
-                        }
-                    })
-                    self.steps[i].complete.subscribe(function(complete) {
-                        if (complete && self.advance) self.next();
-                    });
+            var components = _.unique(self.steps.map(function(step) {return step.component;}));
+            require(components, function() {
+                var modules = arguments;
+                self.steps.forEach(function(step, i) {
+                    if (!(self.steps[i] instanceof Step)) {
+                        step.workflow = self;
+                        step.loading = self.loading;
+                        step.alert = self.alert;
+                        self.steps[i] = new Step(step);
+                        self.steps[i].complete.subscribe(function(complete) {
+                            if (complete) self.next();
+                        });
+                    }
+                    self.steps[i]._index = i;
+                });
+                if (self.state.activestep) {
+                    self.activeStep(self.steps[self.state.activestep]);
                 }
-                self.steps[i]._index = i;
+                else if(self.steps.length > 0) {
+                    self.activeStep(self.steps[0]);
+                }
+                console.log(modules);
             });
-            if (self.state.activestep) {
-                self.activeStep(self.steps[self.state.activestep]);
-            }
-            else if(self.steps.length > 0) {
-                self.activeStep(self.steps[0]);
-            }
         });
 
         this.updateUrl = function() {
diff --git a/arches/app/templates/views/components/plugins/workflow.htm b/arches/app/templates/views/components/plugins/workflow.htm
index da9cf06cf4e..e067458b7bc 100644
--- a/arches/app/templates/views/components/plugins/workflow.htm
+++ b/arches/app/templates/views/components/plugins/workflow.htm
@@ -1,6 +1,7 @@
 {% load i18n %}
 <!--ko if: ready() -->
 <div class="workflow-plugin">
+    <!--ko if: ko.unwrap(activeStep) -->
     <div class="workflowstep-nav">
         <!--ko foreach: {data: steps, as: 'step'}-->
         <div data-bind=""><i class="fa fa-lg" data-bind="class: step.iconClass"></i></div>
@@ -17,14 +18,13 @@
         <div class="workflow-nav-controls right"><i class="fa fa-chevron-circle-right" data-bind="click: next"></i></div>
     </div>
     <div class='workflow-step-body'>
-        <!--ko if: activeStep().ready() -->
         <!--ko if: activeStep().componentname-->
             <!-- ko component: {
                 name: activeStep().componentname,
                 params: activeStep()
             } --><!--/ko-->
             <!--/ko-->
-        <!--/ko-->
     </div>
+    <!--/ko-->
 </div>
 <!--/ko-->

From 7ddb705719df078fa05fec951b56c067ecdbee24 Mon Sep 17 00:00:00 2001
From: Cyrus Hiatt <chiatt@fargeo.com>
Date: Tue, 11 Jun 2019 09:03:48 -0700
Subject: [PATCH 2/2] lints

---
 arches/app/media/js/viewmodels/workflow.js | 3 +--
 1 file changed, 1 insertion(+), 2 deletions(-)

diff --git a/arches/app/media/js/viewmodels/workflow.js b/arches/app/media/js/viewmodels/workflow.js
index 23df8a14e1f..d37f4f8a193 100644
--- a/arches/app/media/js/viewmodels/workflow.js
+++ b/arches/app/media/js/viewmodels/workflow.js
@@ -28,7 +28,7 @@ define([
         this.ready.subscribe(function() {
             var components = _.unique(self.steps.map(function(step) {return step.component;}));
             require(components, function() {
-                var modules = arguments;
+                // var modules = arguments;
                 self.steps.forEach(function(step, i) {
                     if (!(self.steps[i] instanceof Step)) {
                         step.workflow = self;
@@ -47,7 +47,6 @@ define([
                 else if(self.steps.length > 0) {
                     self.activeStep(self.steps[0]);
                 }
-                console.log(modules);
             });
         });