1 files changed, 43 insertions, 30 deletions
diff --git a/app/assets/javascripts/ide/stores/modules/pipelines/mutations.js b/app/assets/javascripts/ide/stores/modules/pipelines/mutations.js
index 2b16e57b386..745797e1ee5 100644
--- a/app/assets/javascripts/ide/stores/modules/pipelines/mutations.js
+++ b/app/assets/javascripts/ide/stores/modules/pipelines/mutations.js
@@ -1,5 +1,6 @@
 /* eslint-disable no-param-reassign */
 import * as types from './mutation_types';
+import { normalizeJob } from './utils';
 
 export default {
   [types.REQUEST_LATEST_PIPELINE](state) {
@@ -14,40 +15,52 @@ export default {
     if (pipeline) {
       state.latestPipeline = {
         id: pipeline.id,
-        status: pipeline.status,
+        path: pipeline.path,
+        commit: pipeline.commit,
+        details: {
+          status: pipeline.details.status,
+        },
+        yamlError: pipeline.yaml_errors,
       };
+      state.stages = pipeline.details.stages.map((stage, i) => {
+        const foundStage = state.stages.find(s => s.id === i);
+        return {
+          id: i,
+          dropdownPath: stage.dropdown_path,
+          name: stage.name,
+          status: stage.status,
+          isCollapsed: foundStage ? foundStage.isCollapsed : false,
+          isLoading: foundStage ? foundStage.isLoading : false,
+          jobs: foundStage ? foundStage.jobs : [],
+        };
+      });
+    } else {
+      state.latestPipeline = false;
     }
   },
-  [types.REQUEST_JOBS](state) {
-    state.isLoadingJobs = true;
+  [types.REQUEST_JOBS](state, id) {
+    state.stages = state.stages.map(stage => ({
+      ...stage,
+      isLoading: stage.id === id ? true : stage.isLoading,
+    }));
   },
-  [types.RECEIVE_JOBS_ERROR](state) {
-    state.isLoadingJobs = false;
+  [types.RECEIVE_JOBS_ERROR](state, id) {
+    state.stages = state.stages.map(stage => ({
+      ...stage,
+      isLoading: stage.id === id ? false : stage.isLoading,
+    }));
   },
-  [types.RECEIVE_JOBS_SUCCESS](state, jobs) {
-    state.isLoadingJobs = false;
-
-    state.stages = jobs.reduce((acc, job) => {
-      let stage = acc.find(s => s.title === job.stage);
-
-      if (!stage) {
-        stage = {
-          title: job.stage,
-          jobs: [],
-        };
-
-        acc.push(stage);
-      }
-
-      stage.jobs = stage.jobs.concat({
-        id: job.id,
-        name: job.name,
-        status: job.status,
-        stage: job.stage,
-        duration: job.duration,
-      });
-
-      return acc;
-    }, state.stages);
+  [types.RECEIVE_JOBS_SUCCESS](state, { id, data }) {
+    state.stages = state.stages.map(stage => ({
+      ...stage,
+      isLoading: stage.id === id ? false : stage.isLoading,
+      jobs: stage.id === id ? data.latest_statuses.map(normalizeJob) : stage.jobs,
+    }));
+  },
+  [types.TOGGLE_STAGE_COLLAPSE](state, id) {
+    state.stages = state.stages.map(stage => ({
+      ...stage,
+      isCollapsed: stage.id === id ? !stage.isCollapsed : stage.isCollapsed,
+    }));
   },
 };