Merge branch '44579-ide-add-pipeline-to-status-bar' into 'master'

Resolve "Show CI pipeline status in Web IDE"

Closes #44579

See merge request gitlab-org/gitlab-ce!19048

3 files changed, 85 insertions, 21 deletions

diff --git a/app/assets/javascripts/ide/stores/actions/project.js b/app/assets/javascripts/ide/stores/actions/project.js
index eff9bc03651..cece9154c82 100644
--- a/app/assets/javascripts/ide/stores/actions/project.js
+++ b/app/assets/javascripts/ide/stores/actions/project.js
@@ -1,6 +1,11 @@
+import Visibility from 'visibilityjs';
 import flash from '~/flash';
+import { __ } from '~/locale';
 import service from '../../services';
 import * as types from '../mutation_types';
+import Poll from '../../../lib/utils/poll';
+
+let eTagPoll;
 
 export const getProjectData = (
   { commit, state, dispatch },
@@ -21,7 +26,7 @@ export const getProjectData = (
         })
         .catch(() => {
           flash(
-            'Error loading project data. Please try again.',
+            __('Error loading project data. Please try again.'),
             'alert',
             document,
             null,
@@ -59,7 +64,7 @@ export const getBranchData = (
         })
         .catch(() => {
           flash(
-            'Error loading branch data. Please try again.',
+            __('Error loading branch data. Please try again.'),
             'alert',
             document,
             null,
@@ -73,25 +78,74 @@ export const getBranchData = (
     }
   });
 
-export const refreshLastCommitData = (
-  { commit, state, dispatch },
-  { projectId, branchId } = {},
-) => service
-  .getBranchData(projectId, branchId)
-  .then(({ data }) => {
-    commit(types.SET_BRANCH_COMMIT, {
-      projectId,
-      branchId,
-      commit: data.commit,
+export const refreshLastCommitData = ({ commit, state, dispatch }, { projectId, branchId } = {}) =>
+  service
+    .getBranchData(projectId, branchId)
+    .then(({ data }) => {
+      commit(types.SET_BRANCH_COMMIT, {
+        projectId,
+        branchId,
+        commit: data.commit,
+      });
+    })
+    .catch(() => {
+      flash(__('Error loading last commit.'), 'alert', document, null, false, true);
     });
-  })
-  .catch(() => {
-    flash(
-      'Error loading last commit.',
-      'alert',
-      document,
-      null,
-      false,
-      true,
+
+export const pollSuccessCallBack = ({ commit, state, dispatch }, { data }) => {
+  if (data.pipelines && data.pipelines.length) {
+    const lastCommitHash =
+      state.projects[state.currentProjectId].branches[state.currentBranchId].commit.id;
+    const lastCommitPipeline = data.pipelines.find(
+      pipeline => pipeline.commit.id === lastCommitHash,
     );
+    commit(types.SET_LAST_COMMIT_PIPELINE, {
+      projectId: state.currentProjectId,
+      branchId: state.currentBranchId,
+      pipeline: lastCommitPipeline || {},
+    });
+  }
+
+  return data;
+};
+
+export const pipelinePoll = ({ getters, dispatch }) => {
+  eTagPoll = new Poll({
+    resource: service,
+    method: 'lastCommitPipelines',
+    data: {
+      getters,
+    },
+    successCallback: ({ data }) => dispatch('pollSuccessCallBack', { data }),
+    errorCallback: () => {
+      flash(
+        __('Something went wrong while fetching the latest pipeline status.'),
+        'alert',
+        document,
+        null,
+        false,
+        true,
+      );
+    },
   });
+
+  if (!Visibility.hidden()) {
+    eTagPoll.makeRequest();
+  }
+
+  Visibility.change(() => {
+    if (!Visibility.hidden()) {
+      eTagPoll.restart();
+    } else {
+      eTagPoll.stop();
+    }
+  });
+};
+
+export const stopPipelinePolling = () => {
+  eTagPoll.stop();
+};
+
+export const restartPipelinePolling = () => {
+  eTagPoll.restart();
+};
diff --git a/app/assets/javascripts/ide/stores/mutation_types.js b/app/assets/javascripts/ide/stores/mutation_types.js
index a3fb3232f1d..0a3f8d031c4 100644
--- a/app/assets/javascripts/ide/stores/mutation_types.js
+++ b/app/assets/javascripts/ide/stores/mutation_types.js
@@ -23,6 +23,7 @@ export const SET_BRANCH = 'SET_BRANCH';
 export const SET_BRANCH_COMMIT = 'SET_BRANCH_COMMIT';
 export const SET_BRANCH_WORKING_REFERENCE = 'SET_BRANCH_WORKING_REFERENCE';
 export const TOGGLE_BRANCH_OPEN = 'TOGGLE_BRANCH_OPEN';
+export const SET_LAST_COMMIT_PIPELINE = 'SET_LAST_COMMIT_PIPELINE';
 
 // Tree mutation types
 export const SET_DIRECTORY_DATA = 'SET_DIRECTORY_DATA';
diff --git a/app/assets/javascripts/ide/stores/mutations/branch.js b/app/assets/javascripts/ide/stores/mutations/branch.js
index e09f88878f4..f17ec4da308 100644
--- a/app/assets/javascripts/ide/stores/mutations/branch.js
+++ b/app/assets/javascripts/ide/stores/mutations/branch.js
@@ -14,6 +14,10 @@ export default {
           treeId: `${projectPath}/${branchName}`,
           active: true,
           workingReference: '',
+          commit: {
+            ...branch.commit,
+            pipeline: {},
+          },
         },
       },
     });
@@ -28,4 +32,9 @@ export default {
       commit,
     });
   },
+  [types.SET_LAST_COMMIT_PIPELINE](state, { projectId, branchId, pipeline }) {
+    Object.assign(state.projects[projectId].branches[branchId].commit, {
+      pipeline,
+    });
+  },
 };