Fix child workflow navigation & compact display extra fields (#82)

* cleaning up code so its more readable what its trying to do and fixing bug for duplicating getHistory api call

* adding in eventId and timestamp to kvps

* changing order of kvps to match previous version

* lint fixes

* 3.7.1-beta.0

* 3.7.1

Author: just-at-uber

client/routes/execution/helpers/get-event-details.js

@@ -1,14 +1,19 @@
 import { getKeyValuePairs } from '../../../helpers';
 
 const getEventDetails = event => {
-  const { details, eventId, eventType } = event;
-  const kvps = getKeyValuePairs(details);
+  const { details, eventId, eventType, timeStampDisplay } = event;
+  const kvps = getKeyValuePairs({
+    timestamp: timeStampDisplay,
+    eventId,
+    ...details,
+  });
 
   return {
     ...details,
     eventId,
     eventType,
     kvps,
+    timestamp: timeStampDisplay,
   };
 };
 

client/routes/execution/helpers/get-history-events.js

@@ -12,16 +12,10 @@ const getHistoryEvents = events => {
 
   return events
     .map(event => {
-      const details = getEventDetails(event);
-      const eventSummary = getEventSummary(event);
-      const eventFullDetails = getEventFullDetails(event);
       const timestamp = moment(event.timestamp);
 
       return {
         ...event,
-        details,
-        eventSummary,
-        eventFullDetails,
         timestamp,
       };
     })
@@ -34,6 +28,18 @@ const getHistoryEvents = events => {
         timeStampDisplay,
         timeElapsedDisplay,
       };
+    })
+    .map(event => {
+      const details = getEventDetails(event);
+      const eventSummary = getEventSummary(event);
+      const eventFullDetails = getEventFullDetails(event);
+
+      return {
+        ...event,
+        details,
+        eventSummary,
+        eventFullDetails,
+      };
     });
 };
 

client/routes/execution/index.vue

@@ -86,9 +86,7 @@ export default {
     );
   },
   beforeDestroy() {
-    while (this.unwatch.length) {
-      this.unwatch.pop()();
-    }
+    this.clearWatches();
   },
   computed: {
     baseAPIURL() {
@@ -111,6 +109,36 @@ export default {
     },
   },
   methods: {
+    clearState() {
+      this.events = [];
+      this.isWorkflowRunning = undefined;
+      this.nextPageToken = undefined;
+      this.wfError = undefined;
+      this.wfLoading = true;
+      this.workflow = undefined;
+
+      this.history.error = undefined;
+      this.history.events = [];
+      this.history.loading = undefined;
+      this.history.timelineEvents = [];
+
+      this.summary.input = undefined;
+      this.summary.isWorkflowRunning = undefined;
+      this.summary.parentWorkflowRoute = undefined;
+      this.summary.result = undefined;
+      this.summary.wfStatus = undefined;
+      this.summary.workflow = undefined;
+    },
+    clearWatches() {
+      while (this.unwatch.length) {
+        this.unwatch.pop()();
+      }
+    },
+    clearQueryUrlWatch() {
+      while (this.unwatch.length > 1) {
+        this.unwatch.pop()();
+      }
+    },
     fetchHistoryPage(pagedQueryUrl) {
       this.history.error = undefined;
 
@@ -190,10 +218,9 @@ export default {
         });
     },
     onBaseApiUrlChange(baseAPIURL) {
-      this.events = [];
-      this.history.events = [];
-      this.history.timelineEvents = [];
-      this.nextPageToken = undefined;
+      this.clearQueryUrlWatch();
+      this.clearState();
+      this.wfLoading = true;
 
       return this.$http(baseAPIURL)
         .then(
@@ -214,10 +241,7 @@ export default {
       this.fetchHistoryPage(queryUrl);
     },
     setupQueryUrlWatch() {
-      while (this.unwatch.length > 1) {
-        this.unwatch.pop()();
-      }
-
+      this.clearQueryUrlWatch();
       this.unwatch.push(
         this.$watch('queryUrl', this.onQueryUrlChange, { immediate: true })
       );

package.json

@@ -1,6 +1,6 @@
 {
   "name": "cadence-web",
-  "version": "3.7.0",
+  "version": "3.7.1",
   "description": "Cadence Web UI",
   "main": "server/index.js",
   "licence": "MIT",