1 files changed, 14 insertions, 20 deletions

diff --git a/app/assets/javascripts/pipelines.js.es6 b/app/assets/javascripts/pipelines.js.es6
index e6fada5c84c..43263368494 100644
--- a/app/assets/javascripts/pipelines.js.es6
+++ b/app/assets/javascripts/pipelines.js.es6
@@ -1,29 +1,23 @@
-/* eslint-disable */
-((global) => {
+/* eslint-disable no-new, guard-for-in, no-restricted-syntax, no-continue, no-param-reassign, max-len */
 
-  class Pipelines {
-    constructor() {
-      this.initGraphToggle();
-      this.addMarginToBuildColumns();
-    }
+//= require lib/utils/bootstrap_linked_tabs
 
-    initGraphToggle() {
-      this.pipelineGraph = document.querySelector('.pipeline-graph');
-      this.toggleButton = document.querySelector('.toggle-pipeline-btn');
-      this.toggleButtonText = this.toggleButton.querySelector('.toggle-btn-text');
-      this.toggleButton.addEventListener('click', this.toggleGraph.bind(this));
-    }
+((global) => {
+  class Pipelines {
+    constructor(options = {}) {
+      if (options.initTabs && options.tabsOptions) {
+        new global.LinkedTabs(options.tabsOptions);
+      }
 
-    toggleGraph() {
-      const graphCollapsed = this.pipelineGraph.classList.contains('graph-collapsed');
-      this.toggleButton.classList.toggle('graph-collapsed');
-      this.pipelineGraph.classList.toggle('graph-collapsed');
-      this.toggleButtonText.textContent = graphCollapsed ? 'Hide' : 'Expand';
+      this.addMarginToBuildColumns();
     }
 
     addMarginToBuildColumns() {
+      this.pipelineGraph = document.querySelector('.js-pipeline-graph');
+
       const secondChildBuildNodes = this.pipelineGraph.querySelectorAll('.build:nth-child(2)');
-      for (buildNodeIndex in secondChildBuildNodes) {
+
+      for (const buildNodeIndex in secondChildBuildNodes) {
         const buildNode = secondChildBuildNodes[buildNodeIndex];
         const firstChildBuildNode = buildNode.previousElementSibling;
         if (!firstChildBuildNode || !firstChildBuildNode.matches('.build')) continue;
@@ -35,10 +29,10 @@
         const columnBuilds = previousColumn.querySelectorAll('.build');
         if (columnBuilds.length === 1) previousColumn.classList.add('no-margin');
       }
+
       this.pipelineGraph.classList.remove('hidden');
     }
   }
 
   global.Pipelines = Pipelines;
-
 })(window.gl || (window.gl = {}));