Prettify app/assets/javascripts/pagesprettify-all-the-things-3

25 files changed, 594 insertions, 448 deletions

diff --git a/app/assets/javascripts/pages/projects/branches/new/index.js b/app/assets/javascripts/pages/projects/branches/new/index.js
index a9658fd1eb4..13ff47d53c2 100644
--- a/app/assets/javascripts/pages/projects/branches/new/index.js
+++ b/app/assets/javascripts/pages/projects/branches/new/index.js
@@ -1,6 +1,11 @@
 import $ from 'jquery';
 import NewBranchForm from '~/new_branch_form';
 
-document.addEventListener('DOMContentLoaded', () => (
-  new NewBranchForm($('.js-create-branch-form'), JSON.parse(document.getElementById('availableRefs').innerHTML))
-));
+document.addEventListener(
+  'DOMContentLoaded',
+  () =>
+    new NewBranchForm(
+      $('.js-create-branch-form'),
+      JSON.parse(document.getElementById('availableRefs').innerHTML),
+    ),
+);
diff --git a/app/assets/javascripts/pages/projects/graphs/charts/index.js b/app/assets/javascripts/pages/projects/graphs/charts/index.js
index 80159a82bd4..3ccad513c05 100644
--- a/app/assets/javascripts/pages/projects/graphs/charts/index.js
+++ b/app/assets/javascripts/pages/projects/graphs/charts/index.js
@@ -31,14 +31,16 @@ document.addEventListener('DOMContentLoaded', () => {
 
   const chartData = data => ({
     labels: Object.keys(data),
-    datasets: [{
-      fillColor: 'rgba(220,220,220,0.5)',
-      strokeColor: 'rgba(220,220,220,1)',
-      barStrokeWidth: 1,
-      barValueSpacing: 1,
-      barDatasetSpacing: 1,
-      data: _.values(data),
-    }],
+    datasets: [
+      {
+        fillColor: 'rgba(220,220,220,0.5)',
+        strokeColor: 'rgba(220,220,220,1)',
+        barStrokeWidth: 1,
+        barValueSpacing: 1,
+        barDatasetSpacing: 1,
+        data: _.values(data),
+      },
+    ],
   });
 
   const hourData = chartData(projectChartData.hour);
@@ -51,7 +53,9 @@ document.addEventListener('DOMContentLoaded', () => {
   responsiveChart($('#month-chart'), monthData);
 
   const data = projectChartData.languages;
-  const ctx = $('#languages-chart').get(0).getContext('2d');
+  const ctx = $('#languages-chart')
+    .get(0)
+    .getContext('2d');
   const options = {
     scaleOverlay: true,
     responsive: true,
diff --git a/app/assets/javascripts/pages/projects/graphs/show/index.js b/app/assets/javascripts/pages/projects/graphs/show/index.js
index 71f629fbc13..f79c386b59e 100644
--- a/app/assets/javascripts/pages/projects/graphs/show/index.js
+++ b/app/assets/javascripts/pages/projects/graphs/show/index.js
@@ -7,7 +7,8 @@ import ContributorsStatGraph from './stat_graph_contributors';
 document.addEventListener('DOMContentLoaded', () => {
   const url = document.querySelector('.js-graphs-show').dataset.projectGraphPath;
 
-  axios.get(url)
+  axios
+    .get(url)
     .then(({ data }) => {
       const graph = new ContributorsStatGraph();
       graph.init(data);
diff --git a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors.js b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors.js
index 58bb8c5b0c8..76613394af6 100644
--- a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors.js
+++ b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors.js
@@ -3,7 +3,11 @@
 import $ from 'jquery';
 import _ from 'underscore';
 import { n__, s__, createDateTimeFormat, sprintf } from '~/locale';
-import { ContributorsGraph, ContributorsAuthorGraph, ContributorsMasterGraph } from './stat_graph_contributors_graph';
+import {
+  ContributorsGraph,
+  ContributorsAuthorGraph,
+  ContributorsMasterGraph,
+} from './stat_graph_contributors_graph';
 import ContributorsStatGraphUtil from './stat_graph_contributors_util';
 
 export default (function() {
@@ -14,7 +18,7 @@ export default (function() {
   ContributorsStatGraph.prototype.init = function(log) {
     var author_commits, total_commits;
     this.parsed_log = ContributorsStatGraphUtil.parse_log(log);
-    this.set_current_field("commits");
+    this.set_current_field('commits');
     total_commits = ContributorsStatGraphUtil.get_total_data(this.parsed_log, this.field);
     author_commits = ContributorsStatGraphUtil.get_author_data(this.parsed_log, this.field);
     this.add_master_graph(total_commits);
@@ -31,23 +35,26 @@ export default (function() {
     var limited_author_data;
     this.authors = [];
     limited_author_data = author_data.slice(0, 100);
-    return _.each(limited_author_data, (function(_this) {
-      return function(d) {
-        var author_graph, author_header;
-        author_header = _this.create_author_header(d);
-        $(".contributors-list").append(author_header);
-
-        author_graph = new ContributorsAuthorGraph(d.dates);
-        _this.authors[d.author_name] = author_graph;
-        return author_graph.draw();
-      };
-    })(this));
+    return _.each(
+      limited_author_data,
+      (function(_this) {
+        return function(d) {
+          var author_graph, author_header;
+          author_header = _this.create_author_header(d);
+          $('.contributors-list').append(author_header);
+
+          author_graph = new ContributorsAuthorGraph(d.dates);
+          _this.authors[d.author_name] = author_graph;
+          return author_graph.draw();
+        };
+      })(this),
+    );
   };
 
   ContributorsStatGraph.prototype.format_author_commit_info = function(author) {
     var commits;
     commits = $('<span/>', {
-      "class": 'graph-author-commits-count'
+      class: 'graph-author-commits-count',
     });
     commits.text(n__('%d commit', '%d commits', author.commits));
     return $('<span/>').append(commits);
@@ -56,13 +63,13 @@ export default (function() {
   ContributorsStatGraph.prototype.create_author_header = function(author) {
     var author_commit_info, author_commit_info_span, author_email, author_name, list_item;
     list_item = $('<li/>', {
-      "class": 'person',
-      style: 'display: block;'
+      class: 'person',
+      style: 'display: block;',
     });
     author_name = $('<h4>' + author.author_name + '</h4>');
     author_email = $('<p class="graph-author-email">' + author.author_email + '</p>');
     author_commit_info_span = $('<span/>', {
-      "class": 'commits'
+      class: 'commits',
     });
     author_commit_info = this.format_author_commit_info(author);
     author_commit_info_span.html(author_commit_info);
@@ -80,37 +87,41 @@ export default (function() {
   };
 
   ContributorsStatGraph.prototype.redraw_authors = function() {
-    $("ol").html("");
+    $('ol').html('');
 
     const { x_domain } = ContributorsGraph.prototype;
-    const author_commits = ContributorsStatGraphUtil.get_author_data(this.parsed_log, this.field, x_domain);
-
-    return _.each(author_commits, (function(_this) {
-      return function(d) {
-        _this.redraw_author_commit_info(d);
-        if (_this.authors[d.author_name] != null) {
-          $(_this.authors[d.author_name].list_item).appendTo("ol");
-          _this.authors[d.author_name].set_data(d.dates);
-          return _this.authors[d.author_name].redraw();
-        }
-        return '';
-      };
-    })(this));
+    const author_commits = ContributorsStatGraphUtil.get_author_data(
+      this.parsed_log,
+      this.field,
+      x_domain,
+    );
+
+    return _.each(
+      author_commits,
+      (function(_this) {
+        return function(d) {
+          _this.redraw_author_commit_info(d);
+          if (_this.authors[d.author_name] != null) {
+            $(_this.authors[d.author_name].list_item).appendTo('ol');
+            _this.authors[d.author_name].set_data(d.dates);
+            return _this.authors[d.author_name].redraw();
+          }
+          return '';
+        };
+      })(this),
+    );
   };
 
   ContributorsStatGraph.prototype.set_current_field = function(field) {
-    return this.field = field;
+    return (this.field = field);
   };
 
   ContributorsStatGraph.prototype.change_date_header = function() {
     const { x_domain } = ContributorsGraph.prototype;
-    const formattedDateRange = sprintf(
-      s__('ContributorsPage|%{startDate} – %{endDate}'),
-      {
-        startDate: this.dateFormat.format(new Date(x_domain[0])),
-        endDate: this.dateFormat.format(new Date(x_domain[1])),
-      },
-    );
+    const formattedDateRange = sprintf(s__('ContributorsPage|%{startDate} – %{endDate}'), {
+      startDate: this.dateFormat.format(new Date(x_domain[0])),
+      endDate: this.dateFormat.format(new Date(x_domain[1])),
+    });
     return $('#date_header').text(formattedDateRange);
   };
 
@@ -120,7 +131,7 @@ export default (function() {
     if ($author != null) {
       author_list_item = $(this.authors[author.author_name].list_item);
       author_commit_info = this.format_author_commit_info(author);
-      return author_list_item.find("span").html(author_commit_info);
+      return author_list_item.find('span').html(author_commit_info);
     }
     return '';
   };
diff --git a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_graph.js b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_graph.js
index 5f91686347a..377dce6c746 100644
--- a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_graph.js
+++ b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_graph.js
@@ -11,10 +11,32 @@ import { brushX } from 'd3-brush';
 import { timeParse } from 'd3-time-format';
 import { dateTickFormat } from '~/lib/utils/tick_formats';
 
-const d3 = { extent, max, select, scaleTime, scaleLinear, axisLeft, axisBottom, area, brushX, timeParse };
+const d3 = {
+  extent,
+  max,
+  select,
+  scaleTime,
+  scaleLinear,
+  axisLeft,
+  axisBottom,
+  area,
+  brushX,
+  timeParse,
+};
 
 const hasProp = {}.hasOwnProperty;
-const extend = function(child, parent) { for (const key in parent) { if (hasProp.call(parent, key)) child[key] = parent[key]; } function ctor() { this.constructor = child; } ctor.prototype = parent.prototype; child.prototype = new ctor(); child.__super__ = parent.prototype; return child; };
+const extend = function(child, parent) {
+  for (const key in parent) {
+    if (hasProp.call(parent, key)) child[key] = parent[key];
+  }
+  function ctor() {
+    this.constructor = child;
+  }
+  ctor.prototype = parent.prototype;
+  child.prototype = new ctor();
+  child.__super__ = parent.prototype;
+  return child;
+};
 
 export const ContributorsGraph = (function() {
   function ContributorsGraph() {}
@@ -23,7 +45,7 @@ export const ContributorsGraph = (function() {
     top: 20,
     right: 10,
     bottom: 30,
-    left: 40
+    left: 40,
   };
 
   ContributorsGraph.prototype.x_domain = null;
@@ -33,35 +55,39 @@ export const ContributorsGraph = (function() {
   ContributorsGraph.prototype.dates = [];
 
   ContributorsGraph.prototype.determine_width = function(baseWidth, $parentElement) {
-    const parentPaddingWidth = parseFloat($parentElement.css('padding-left')) + parseFloat($parentElement.css('padding-right'));
+    const parentPaddingWidth =
+      parseFloat($parentElement.css('padding-left')) +
+      parseFloat($parentElement.css('padding-right'));
     const marginWidth = this.MARGIN.left + this.MARGIN.right;
     return baseWidth - parentPaddingWidth - marginWidth;
   };
 
   ContributorsGraph.set_x_domain = function(data) {
-    return ContributorsGraph.prototype.x_domain = data;
+    return (ContributorsGraph.prototype.x_domain = data);
   };
 
   ContributorsGraph.set_y_domain = function(data) {
-    return ContributorsGraph.prototype.y_domain = [
-      0, d3.max(data, function(d) {
-        return d.commits = d.commits || d.additions || d.deletions;
-      })
-    ];
+    return (ContributorsGraph.prototype.y_domain = [
+      0,
+      d3.max(data, function(d) {
+        return (d.commits = d.commits || d.additions || d.deletions);
+      }),
+    ]);
   };
 
   ContributorsGraph.init_x_domain = function(data) {
-    return ContributorsGraph.prototype.x_domain = d3.extent(data, function(d) {
+    return (ContributorsGraph.prototype.x_domain = d3.extent(data, function(d) {
       return d.date;
-    });
+    }));
   };
 
   ContributorsGraph.init_y_domain = function(data) {
-    return ContributorsGraph.prototype.y_domain = [
-      0, d3.max(data, function(d) {
-        return d.commits = d.commits || d.additions || d.deletions;
-      })
-    ];
+    return (ContributorsGraph.prototype.y_domain = [
+      0,
+      d3.max(data, function(d) {
+        return (d.commits = d.commits || d.additions || d.deletions);
+      }),
+    ]);
   };
 
   ContributorsGraph.init_domain = function(data) {
@@ -70,7 +96,7 @@ export const ContributorsGraph = (function() {
   };
 
   ContributorsGraph.set_dates = function(data) {
-    return ContributorsGraph.prototype.dates = data;
+    return (ContributorsGraph.prototype.dates = data);
   };
 
   ContributorsGraph.prototype.set_x_domain = function() {
@@ -87,20 +113,33 @@ export const ContributorsGraph = (function() {
   };
 
   ContributorsGraph.prototype.create_scale = function(width, height) {
-    this.x = d3.scaleTime().range([0, width]).clamp(true);
-    return this.y = d3.scaleLinear().range([height, 0]).nice();
+    this.x = d3
+      .scaleTime()
+      .range([0, width])
+      .clamp(true);
+    return (this.y = d3
+      .scaleLinear()
+      .range([height, 0])
+      .nice());
   };
 
   ContributorsGraph.prototype.draw_x_axis = function() {
-    return this.svg.append("g").attr("class", "x axis").attr("transform", "translate(0, " + this.height + ")").call(this.x_axis);
+    return this.svg
+      .append('g')
+      .attr('class', 'x axis')
+      .attr('transform', 'translate(0, ' + this.height + ')')
+      .call(this.x_axis);
   };
 
   ContributorsGraph.prototype.draw_y_axis = function() {
-    return this.svg.append("g").attr("class", "y axis").call(this.y_axis);
+    return this.svg
+      .append('g')
+      .attr('class', 'y axis')
+      .call(this.y_axis);
   };
 
   ContributorsGraph.prototype.set_data = function(data) {
-    return this.data = data;
+    return (this.data = data);
   };
 
   return ContributorsGraph;
@@ -137,9 +176,9 @@ export const ContributorsMasterGraph = (function(superClass) {
   };
 
   ContributorsMasterGraph.prototype.parse_dates = function(data) {
-    const parseDate = d3.timeParse("%Y-%m-%d");
+    const parseDate = d3.timeParse('%Y-%m-%d');
     return data.forEach(function(d) {
-      return d.date = parseDate(d.date);
+      return (d.date = parseDate(d.date));
     });
   };
 
@@ -148,42 +187,63 @@ export const ContributorsMasterGraph = (function(superClass) {
   };
 
   ContributorsMasterGraph.prototype.create_axes = function() {
-    this.x_axis = d3.axisBottom()
+    this.x_axis = d3
+      .axisBottom()
       .scale(this.x)
       .tickFormat(dateTickFormat);
-    return this.y_axis = d3.axisLeft().scale(this.y).ticks(5);
+    return (this.y_axis = d3
+      .axisLeft()
+      .scale(this.y)
+      .ticks(5));
   };
 
   ContributorsMasterGraph.prototype.create_svg = function() {
-    this.svg = d3.select("#contributors-master")
-      .append("svg")
-      .attr("width", this.width + this.MARGIN.left + this.MARGIN.right)
-      .attr("height", this.height + this.MARGIN.top + this.MARGIN.bottom)
-      .attr("class", "tint-box")
-      .append("g")
-      .attr("transform", "translate(" + this.MARGIN.left + "," + this.MARGIN.top + ")");
+    this.svg = d3
+      .select('#contributors-master')
+      .append('svg')
+      .attr('width', this.width + this.MARGIN.left + this.MARGIN.right)
+      .attr('height', this.height + this.MARGIN.top + this.MARGIN.bottom)
+      .attr('class', 'tint-box')
+      .append('g')
+      .attr('transform', 'translate(' + this.MARGIN.left + ',' + this.MARGIN.top + ')');
     return this.svg;
   };
 
   ContributorsMasterGraph.prototype.create_area = function(x, y) {
-    return this.area = d3.area().x(function(d) {
-      return x(d.date);
-    }).y0(this.height).y1(function(d) {
-      d.commits = d.commits || d.additions || d.deletions;
-      return y(d.commits);
-    });
+    return (this.area = d3
+      .area()
+      .x(function(d) {
+        return x(d.date);
+      })
+      .y0(this.height)
+      .y1(function(d) {
+        d.commits = d.commits || d.additions || d.deletions;
+        return y(d.commits);
+      }));
   };
 
   ContributorsMasterGraph.prototype.create_brush = function() {
-    return this.brush = d3.brushX(this.x).extent([[this.x.range()[0], 0], [this.x.range()[1], this.height]]).on("end", this.update_content);
+    return (this.brush = d3
+      .brushX(this.x)
+      .extent([[this.x.range()[0], 0], [this.x.range()[1], this.height]])
+      .on('end', this.update_content));
   };
 
   ContributorsMasterGraph.prototype.draw_path = function(data) {
-    return this.svg.append("path").datum(data).attr("class", "area").attr("d", this.area);
+    return this.svg
+      .append('path')
+      .datum(data)
+      .attr('class', 'area')
+      .attr('d', this.area);
   };
 
   ContributorsMasterGraph.prototype.add_brush = function() {
-    return this.svg.append("g").attr("class", "selection").call(this.brush).selectAll("rect").attr("height", this.height);
+    return this.svg
+      .append('g')
+      .attr('class', 'selection')
+      .call(this.brush)
+      .selectAll('rect')
+      .attr('height', this.height);
   };
 
   ContributorsMasterGraph.prototype.update_content = function() {
@@ -193,7 +253,7 @@ export const ContributorsMasterGraph = (function(superClass) {
     } else {
       ContributorsGraph.set_x_domain(this.x_max_domain);
     }
-    return $("#brush_change").trigger('change');
+    return $('#brush_change').trigger('change');
   };
 
   ContributorsMasterGraph.prototype.draw = function() {
@@ -216,9 +276,9 @@ export const ContributorsMasterGraph = (function(superClass) {
     this.process_dates(this.data);
     ContributorsGraph.set_y_domain(this.data);
     this.set_y_domain();
-    this.svg.select("path").datum(this.data);
-    this.svg.select("path").attr("d", this.area);
-    return this.svg.select(".y.axis").call(this.y_axis);
+    this.svg.select('path').datum(this.data);
+    this.svg.select('path').attr('d', this.area);
+    return this.svg.select('.y.axis').call(this.y_axis);
   };
 
   return ContributorsMasterGraph;
@@ -252,43 +312,58 @@ export const ContributorsAuthorGraph = (function(superClass) {
   };
 
   ContributorsAuthorGraph.prototype.create_axes = function() {
-    this.x_axis = d3.axisBottom()
+    this.x_axis = d3
+      .axisBottom()
       .scale(this.x)
       .ticks(8)
       .tickFormat(dateTickFormat);
-    return this.y_axis = d3.axisLeft().scale(this.y).ticks(5);
+    return (this.y_axis = d3
+      .axisLeft()
+      .scale(this.y)
+      .ticks(5));
   };
 
   ContributorsAuthorGraph.prototype.create_area = function(x, y) {
-    return this.area = d3.area().x(function(d) {
-      const parseDate = d3.timeParse("%Y-%m-%d");
-      return x(parseDate(d));
-    }).y0(this.height).y1((function(_this) {
-      return function(d) {
-        if (_this.data[d] != null) {
-          return y(_this.data[d]);
-        } else {
-          return y(0);
-        }
-      };
-    })(this));
+    return (this.area = d3
+      .area()
+      .x(function(d) {
+        const parseDate = d3.timeParse('%Y-%m-%d');
+        return x(parseDate(d));
+      })
+      .y0(this.height)
+      .y1(
+        (function(_this) {
+          return function(d) {
+            if (_this.data[d] != null) {
+              return y(_this.data[d]);
+            } else {
+              return y(0);
+            }
+          };
+        })(this),
+      ));
   };
 
   ContributorsAuthorGraph.prototype.create_svg = function() {
     const persons = document.querySelectorAll('.person');
     this.list_item = persons[persons.length - 1];
-    this.svg = d3.select(this.list_item)
-      .append("svg")
-      .attr("width", this.width + this.MARGIN.left + this.MARGIN.right)
-      .attr("height", this.height + this.MARGIN.top + this.MARGIN.bottom)
-      .attr("class", "spark")
-      .append("g")
-      .attr("transform", "translate(" + this.MARGIN.left + "," + this.MARGIN.top + ")");
+    this.svg = d3
+      .select(this.list_item)
+      .append('svg')
+      .attr('width', this.width + this.MARGIN.left + this.MARGIN.right)
+      .attr('height', this.height + this.MARGIN.top + this.MARGIN.bottom)
+      .attr('class', 'spark')
+      .append('g')
+      .attr('transform', 'translate(' + this.MARGIN.left + ',' + this.MARGIN.top + ')');
     return this.svg;
   };
 
   ContributorsAuthorGraph.prototype.draw_path = function(data) {
-    return this.svg.append("path").datum(data).attr("class", "area-contributor").attr("d", this.area);
+    return this.svg
+      .append('path')
+      .datum(data)
+      .attr('class', 'area-contributor')
+      .attr('d', this.area);
   };
 
   ContributorsAuthorGraph.prototype.draw = function() {
@@ -304,10 +379,10 @@ export const ContributorsAuthorGraph = (function(superClass) {
 
   ContributorsAuthorGraph.prototype.redraw = function() {
     this.set_domain();
-    this.svg.select("path").datum(this.dates);
-    this.svg.select("path").attr("d", this.area);
-    this.svg.select(".x.axis").call(this.x_axis);
-    return this.svg.select(".y.axis").call(this.y_axis);
+    this.svg.select('path').datum(this.dates);
+    this.svg.select('path').attr('d', this.area);
+    this.svg.select('.x.axis').call(this.x_axis);
+    return this.svg.select('.y.axis').call(this.y_axis);
   };
 
   return ContributorsAuthorGraph;
diff --git a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_util.js b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_util.js
index cd0e2bc023c..988ae164955 100644
--- a/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_util.js
+++ b/app/assets/javascripts/pages/projects/graphs/show/stat_graph_contributors_util.js
@@ -26,12 +26,12 @@ export default {
     by_author = _.toArray(by_author);
     return {
       total: total,
-      by_author: by_author
+      by_author: by_author,
     };
   },
   add_date: function(date, collection) {
     collection[date] = {};
-    return collection[date].date = date;
+    return (collection[date].date = date);
   },
   add_author: function(author, by_author, by_email) {
     var data, normalized_email;
@@ -49,28 +49,28 @@ export default {
     return this.store_deletions(entry, total, by_author);
   },
   store_commits: function(total, by_author) {
-    this.add(total, "commits", 1);
-    return this.add(by_author, "commits", 1);
+    this.add(total, 'commits', 1);
+    return this.add(by_author, 'commits', 1);
   },
   add: function(collection, field, value) {
     if (collection[field] == null) {
       collection[field] = 0;
     }
-    return collection[field] += value;
+    return (collection[field] += value);
   },
   store_additions: function(entry, total, by_author) {
     if (entry.additions == null) {
       entry.additions = 0;
     }
-    this.add(total, "additions", entry.additions);
-    return this.add(by_author, "additions", entry.additions);
+    this.add(total, 'additions', entry.additions);
+    return this.add(by_author, 'additions', entry.additions);
   },
   store_deletions: function(entry, total, by_author) {
     if (entry.deletions == null) {
       entry.deletions = 0;
     }
-    this.add(total, "deletions", entry.deletions);
-    return this.add(by_author, "deletions", entry.deletions);
+    this.add(total, 'deletions', entry.deletions);
+    return this.add(by_author, 'deletions', entry.deletions);
   },
   get_total_data: function(parsed_log, field) {
     var log, total_data;
@@ -95,15 +95,18 @@ export default {
     }
     log = parsed_log.by_author;
     author_data = [];
-    _.each(log, (function(_this) {
-      return function(log_entry) {
-        var parsed_log_entry;
-        parsed_log_entry = _this.parse_log_entry(log_entry, field, date_range);
-        if (!_.isEmpty(parsed_log_entry.dates)) {
-          return author_data.push(parsed_log_entry);
-        }
-      };
-    })(this));
+    _.each(
+      log,
+      (function(_this) {
+        return function(log_entry) {
+          var parsed_log_entry;
+          parsed_log_entry = _this.parse_log_entry(log_entry, field, date_range);
+          if (!_.isEmpty(parsed_log_entry.dates)) {
+            return author_data.push(parsed_log_entry);
+          }
+        };
+      })(this),
+    );
     return _.sortBy(author_data, function(d) {
       return d[field];
     }).reverse();
@@ -120,16 +123,19 @@ export default {
     parsed_entry.additions = 0;
     parsed_entry.deletions = 0;
 
-    _.each(_.omit(log_entry, 'author_name', 'author_email'), (function(_this) {
-      return function(value, key) {
-        if (_this.in_range(value.date, date_range)) {
-          parsed_entry.dates[value.date] = value[field];
-          parsed_entry.commits += value.commits;
-          parsed_entry.additions += value.additions;
-          return parsed_entry.deletions += value.deletions;
-        }
-      };
-    })(this));
+    _.each(
+      _.omit(log_entry, 'author_name', 'author_email'),
+      (function(_this) {
+        return function(value, key) {
+          if (_this.in_range(value.date, date_range)) {
+            parsed_entry.dates[value.date] = value[field];
+            parsed_entry.commits += value.commits;
+            parsed_entry.additions += value.additions;
+            return (parsed_entry.deletions += value.deletions);
+          }
+        };
+      })(this),
+    );
     return parsed_entry;
   },
   in_range: function(date, date_range) {
@@ -139,5 +145,5 @@ export default {
     } else {
       return false;
     }
-  }
+  },
 };
diff --git a/app/assets/javascripts/pages/projects/init_blob.js b/app/assets/javascripts/pages/projects/init_blob.js
index bc08ccf3584..bd8afa2d5ba 100644
--- a/app/assets/javascripts/pages/projects/init_blob.js
+++ b/app/assets/javascripts/pages/projects/init_blob.js
@@ -16,7 +16,8 @@ export default () => {
   );
 
   const fileBlobPermalinkUrlElement = document.querySelector('.js-data-file-blob-permalink-url');
-  const fileBlobPermalinkUrl = fileBlobPermalinkUrlElement && fileBlobPermalinkUrlElement.getAttribute('href');
+  const fileBlobPermalinkUrl =
+    fileBlobPermalinkUrlElement && fileBlobPermalinkUrlElement.getAttribute('href');
 
   new ShortcutsNavigation(); // eslint-disable-line no-new
 
diff --git a/app/assets/javascripts/pages/projects/init_form.js b/app/assets/javascripts/pages/projects/init_form.js
index 9f20a3e4e46..019efe077f7 100644
--- a/app/assets/javascripts/pages/projects/init_form.js
+++ b/app/assets/javascripts/pages/projects/init_form.js
@@ -1,7 +1,7 @@
 import ZenMode from '~/zen_mode';
 import GLForm from '~/gl_form';
 
-export default function ($formEl) {
+export default function($formEl) {
   new ZenMode(); // eslint-disable-line no-new
   new GLForm($formEl); // eslint-disable-line no-new
 }
diff --git a/app/assets/javascripts/pages/projects/issues/show.js b/app/assets/javascripts/pages/projects/issues/show.js
index ef65196872c..8987c8e3f47 100644
--- a/app/assets/javascripts/pages/projects/issues/show.js
+++ b/app/assets/javascripts/pages/projects/issues/show.js
@@ -5,7 +5,7 @@ import ZenMode from '~/zen_mode';
 import '~/notes/index';
 import initIssueableApp from '~/issue_show';
 
-export default function () {
+export default function() {
   initIssueableApp();
   new Issue(); // eslint-disable-line no-new
   new ShortcutsIssuable(); // eslint-disable-line no-new
diff --git a/app/assets/javascripts/pages/projects/labels/components/promote_label_modal.vue b/app/assets/javascripts/pages/projects/labels/components/promote_label_modal.vue
index 5d2247f6c6d..e8b646f3f6e 100644
--- a/app/assets/javascripts/pages/projects/labels/components/promote_label_modal.vue
+++ b/app/assets/javascripts/pages/projects/labels/components/promote_label_modal.vue
@@ -1,72 +1,86 @@
 <script>
-  import _ from 'underscore';
-  import axios from '~/lib/utils/axios_utils';
-  import createFlash from '~/flash';
-  import GlModal from '~/vue_shared/components/gl_modal.vue';
-  import { s__, sprintf } from '~/locale';
-  import { visitUrl } from '~/lib/utils/url_utility';
-  import eventHub from '../event_hub';
+import _ from 'underscore';
+import axios from '~/lib/utils/axios_utils';
+import createFlash from '~/flash';
+import GlModal from '~/vue_shared/components/gl_modal.vue';
+import { s__, sprintf } from '~/locale';
+import { visitUrl } from '~/lib/utils/url_utility';
+import eventHub from '../event_hub';
 
-  export default {
-    components: {
-      GlModal,
+export default {
+  components: {
+    GlModal,
+  },
+  props: {
+    url: {
+      type: String,
+      required: true,
     },
-    props: {
-      url: {
-        type: String,
-        required: true,
-      },
-      labelTitle: {
-        type: String,
-        required: true,
-      },
-      labelColor: {
-        type: String,
-        required: true,
-      },
-      labelTextColor: {
-        type: String,
-        required: true,
-      },
-      groupName: {
-        type: String,
-        required: true,
-      },
+    labelTitle: {
+      type: String,
+      required: true,
     },
-    computed: {
-      text() {
-        return sprintf(s__(`Labels|Promoting %{labelTitle} will make it available for all projects inside %{groupName}. 
-        Existing project labels with the same title will be merged. This action cannot be reversed.`), {
+    labelColor: {
+      type: String,
+      required: true,
+    },
+    labelTextColor: {
+      type: String,
+      required: true,
+    },
+    groupName: {
+      type: String,
+      required: true,
+    },
+  },
+  computed: {
+    text() {
+      return sprintf(
+        s__(`Labels|Promoting %{labelTitle} will make it available for all projects inside %{groupName}.
+        Existing project labels with the same title will be merged. This action cannot be reversed.`),
+        {
           labelTitle: this.labelTitle,
           groupName: this.groupName,
-        });
-      },
-      title() {
-        const label = `<span
+        },
+      );
+    },
+    title() {
+      const label = `<span
           class="label color-label"
           style="background-color: ${this.labelColor}; color: ${this.labelTextColor};"
         >${_.escape(this.labelTitle)}</span>`;
 
-        return sprintf(s__('Labels|<span>Promote label</span> %{labelTitle} <span>to Group Label?</span>'), {
+      return sprintf(
+        s__('Labels|<span>Promote label</span> %{labelTitle} <span>to Group Label?</span>'),
+        {
           labelTitle: label,
-        }, false);
-      },
+        },
+        false,
+      );
     },
-    methods: {
-      onSubmit() {
-        eventHub.$emit('promoteLabelModal.requestStarted', this.url);
-        return axios.post(this.url, { params: { format: 'json' } })
-          .then((response) => {
-            eventHub.$emit('promoteLabelModal.requestFinished', { labelUrl: this.url, successful: true });
-            visitUrl(response.data.url);
-          })
-          .catch((error) => {
-            eventHub.$emit('promoteLabelModal.requestFinished', { labelUrl: this.url, successful: false });
-            createFlash(error);
+  },
+  methods: {
+    onSubmit() {
+      eventHub.$emit('promoteLabelModal.requestStarted', this.url);
+      return axios
+        .post(this.url, { params: { format: 'json' } })
+        .then(response => {
+          eventHub.$emit('promoteLabelModal.requestFinished', {
+            labelUrl: this.url,
+            successful: true,
+          });
+          visitUrl(response.data.url);
+        })
+        .catch(error => {
+          eventHub.$emit('promoteLabelModal.requestFinished', {
+            labelUrl: this.url,
+            successful: false,
           });
-      },
+          createFlash(error);
+        });
     },
-  };
+  },
+};
 </script>
 <template>
   <gl-modal
diff --git a/app/assets/javascripts/pages/projects/labels/index/index.js b/app/assets/javascripts/pages/projects/labels/index/index.js
index 03cfef61311..36cf485f33d 100644
--- a/app/assets/javascripts/pages/projects/labels/index/index.js
+++ b/app/assets/javascripts/pages/projects/labels/index/index.js
@@ -10,20 +10,24 @@ const initLabelIndex = () => {
   initLabels();
 
   const onRequestFinished = ({ labelUrl, successful }) => {
-    const button = document.querySelector(`.js-promote-project-label-button[data-url="${labelUrl}"]`);
+    const button = document.querySelector(
+      `.js-promote-project-label-button[data-url="${labelUrl}"]`,
+    );
 
     if (!successful) {
       button.removeAttribute('disabled');
     }
   };
 
-  const onRequestStarted = (labelUrl) => {
-    const button = document.querySelector(`.js-promote-project-label-button[data-url="${labelUrl}"]`);
+  const onRequestStarted = labelUrl => {
+    const button = document.querySelector(
+      `.js-promote-project-label-button[data-url="${labelUrl}"]`,
+    );
     button.setAttribute('disabled', '');
     eventHub.$once('promoteLabelModal.requestFinished', onRequestFinished);
   };
 
-  const onDeleteButtonClick = (event) => {
+  const onDeleteButtonClick = event => {
     const button = event.currentTarget;
     const modalProps = {
       labelTitle: button.dataset.labelTitle,
@@ -37,12 +41,12 @@ const initLabelIndex = () => {
   };
 
   const promoteLabelButtons = document.querySelectorAll('.js-promote-project-label-button');
-  promoteLabelButtons.forEach((button) => {
+  promoteLabelButtons.forEach(button => {
     button.addEventListener('click', onDeleteButtonClick);
   });
 
   eventHub.$once('promoteLabelModal.mounted', () => {
-    promoteLabelButtons.forEach((button) => {
+    promoteLabelButtons.forEach(button => {
       button.removeAttribute('disabled');
     });
   });
diff --git a/app/assets/javascripts/pages/projects/network/network.js b/app/assets/javascripts/pages/projects/network/network.js
index 70fbb3f301c..226d63f05c4 100644
--- a/app/assets/javascripts/pages/projects/network/network.js
+++ b/app/assets/javascripts/pages/projects/network/network.js
@@ -6,13 +6,15 @@ import BranchGraph from '../../../network/branch_graph';
 export default (function() {
   function Network(opts) {
     var vph;
-    $("#filter_ref").click(function() {
-      return $(this).closest('form').submit();
+    $('#filter_ref').click(function() {
+      return $(this)
+        .closest('form')
+        .submit();
     });
-    this.branch_graph = new BranchGraph($(".network-graph"), opts);
+    this.branch_graph = new BranchGraph($('.network-graph'), opts);
     vph = $(window).height() - 250;
     $('.network-graph').css({
-      'height': vph + 'px'
+      height: vph + 'px',
     });
   }
 
diff --git a/app/assets/javascripts/pages/projects/pipeline_schedules/index/index.js b/app/assets/javascripts/pages/projects/pipeline_schedules/index/index.js
index 544360dcd51..6197dc8a9db 100644
--- a/app/assets/javascripts/pages/projects/pipeline_schedules/index/index.js
+++ b/app/assets/javascripts/pages/projects/pipeline_schedules/index/index.js
@@ -1,12 +1,16 @@
 import Vue from 'vue';
 import PipelineSchedulesCallout from '../shared/components/pipeline_schedules_callout.vue';
 
-document.addEventListener('DOMContentLoaded', () => new Vue({
-  el: '#pipeline-schedules-callout',
-  components: {
-    'pipeline-schedules-callout': PipelineSchedulesCallout,
-  },
-  render(createElement) {
-    return createElement('pipeline-schedules-callout');
-  },
-}));
+document.addEventListener(
+  'DOMContentLoaded',
+  () =>
+    new Vue({
+      el: '#pipeline-schedules-callout',
+      components: {
+        'pipeline-schedules-callout': PipelineSchedulesCallout,
+      },
+      render(createElement) {
+        return createElement('pipeline-schedules-callout');
+      },
+    }),
+);
diff --git a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/interval_pattern_input.vue b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/interval_pattern_input.vue
index ef53d67e7cb..ab6f42d928c 100644
--- a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/interval_pattern_input.vue
+++ b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/interval_pattern_input.vue
@@ -1,63 +1,63 @@
 <script>
-  import _ from 'underscore';
+import _ from 'underscore';
 
-  export default {
-    props: {
-      initialCronInterval: {
-        type: String,
-        required: false,
-        default: '',
-      },
-    },
-    data() {
-      return {
-        inputNameAttribute: 'schedule[cron]',
-        cronInterval: this.initialCronInterval,
-        cronIntervalPresets: {
-          everyDay: '0 4 * * *',
-          everyWeek: '0 4 * * 0',
-          everyMonth: '0 4 1 * *',
-        },
-        cronSyntaxUrl: 'https://en.wikipedia.org/wiki/Cron',
-        customInputEnabled: false,
-      };
+export default {
+  props: {
+    initialCronInterval: {
+      type: String,
+      required: false,
+      default: '',
     },
-    computed: {
-      intervalIsPreset() {
-        return _.contains(this.cronIntervalPresets, this.cronInterval);
-      },
-      // The text input is editable when there's a custom interval, or when it's
-      // a preset interval and the user clicks the 'custom' radio button
-      isEditable() {
-        return !!(this.customInputEnabled || !this.intervalIsPreset);
+  },
+  data() {
+    return {
+      inputNameAttribute: 'schedule[cron]',
+      cronInterval: this.initialCronInterval,
+      cronIntervalPresets: {
+        everyDay: '0 4 * * *',
+        everyWeek: '0 4 * * 0',
+        everyMonth: '0 4 1 * *',
       },
+      cronSyntaxUrl: 'https://en.wikipedia.org/wiki/Cron',
+      customInputEnabled: false,
+    };
+  },
+  computed: {
+    intervalIsPreset() {
+      return _.contains(this.cronIntervalPresets, this.cronInterval);
     },
-    watch: {
-      cronInterval() {
-        // updates field validation state when model changes, as
-        // glFieldError only updates on input.
-        this.$nextTick(() => {
-          gl.pipelineScheduleFieldErrors.updateFormValidityState();
-        });
-      },
+    // The text input is editable when there's a custom interval, or when it's
+    // a preset interval and the user clicks the 'custom' radio button
+    isEditable() {
+      return !!(this.customInputEnabled || !this.intervalIsPreset);
     },
-    created() {
-      if (this.intervalIsPreset) {
-        this.enableCustomInput = false;
-      }
+  },
+  watch: {
+    cronInterval() {
+      // updates field validation state when model changes, as
+      // glFieldError only updates on input.
+      this.$nextTick(() => {
+        gl.pipelineScheduleFieldErrors.updateFormValidityState();
+      });
     },
-    methods: {
-      toggleCustomInput(shouldEnable) {
-        this.customInputEnabled = shouldEnable;
+  },
+  created() {
+    if (this.intervalIsPreset) {
+      this.enableCustomInput = false;
+    }
+  },
+  methods: {
+    toggleCustomInput(shouldEnable) {
+      this.customInputEnabled = shouldEnable;
 
-        if (shouldEnable) {
-          // We need to change the value so other radios don't remain selected
-          // because the model (cronInterval) hasn't changed. The server trims it.
-          this.cronInterval = `${this.cronInterval} `;
-        }
-      },
+      if (shouldEnable) {
+        // We need to change the value so other radios don't remain selected
+        // because the model (cronInterval) hasn't changed. The server trims it.
+        this.cronInterval = `${this.cronInterval} `;
+      }
     },
-  };
+  },
+};
 </script>
 
 <template>
diff --git a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedules_callout.vue b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedules_callout.vue
index 77508e62cef..33fc2420e4d 100644
--- a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedules_callout.vue
+++ b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/pipeline_schedules_callout.vue
@@ -1,31 +1,31 @@
 <script>
-  import Vue from 'vue';
-  import Cookies from 'js-cookie';
-  import Translate from '../../../../../vue_shared/translate';
-  import illustrationSvg from '../icons/intro_illustration.svg';
+import Vue from 'vue';
+import Cookies from 'js-cookie';
+import Translate from '../../../../../vue_shared/translate';
+import illustrationSvg from '../icons/intro_illustration.svg';
 
-  Vue.use(Translate);
+Vue.use(Translate);
 
-  const cookieKey = 'pipeline_schedules_callout_dismissed';
+const cookieKey = 'pipeline_schedules_callout_dismissed';
 
-  export default {
-    name: 'PipelineSchedulesCallout',
-    data() {
-      return {
-        docsUrl: document.getElementById('pipeline-schedules-callout').dataset.docsUrl,
-        calloutDismissed: Cookies.get(cookieKey) === 'true',
-      };
+export default {
+  name: 'PipelineSchedulesCallout',
+  data() {
+    return {
+      docsUrl: document.getElementById('pipeline-schedules-callout').dataset.docsUrl,
+      calloutDismissed: Cookies.get(cookieKey) === 'true',
+    };
+  },
+  created() {
+    this.illustrationSvg = illustrationSvg;
+  },
+  methods: {
+    dismissCallout() {
+      this.calloutDismissed = true;
+      Cookies.set(cookieKey, this.calloutDismissed, { expires: 365 });
     },
-    created() {
-      this.illustrationSvg = illustrationSvg;
-    },
-    methods: {
-      dismissCallout() {
-        this.calloutDismissed = true;
-        Cookies.set(cookieKey, this.calloutDismissed, { expires: 365 });
-      },
-    },
-  };
+  },
+};
 </script>
 <template>
   <div
diff --git a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/target_branch_dropdown.js b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/target_branch_dropdown.js
index 4ef0d11dd36..0057700c1b3 100644
--- a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/target_branch_dropdown.js
+++ b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/components/target_branch_dropdown.js
@@ -26,8 +26,7 @@ export default class TargetBranchDropdown {
   }
 
   formatBranchesList() {
-    return this.$dropdown.data('data')
-      .map(val => ({ name: val }));
+    return this.$dropdown.data('data').map(val => ({ name: val }));
   }
 
   setDropdownToggle() {
diff --git a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/init_form.js b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/init_form.js
index c3ac54733a3..4d494efef6c 100644
--- a/app/assets/javascripts/pages/projects/pipeline_schedules/shared/init_form.js
+++ b/app/assets/javascripts/pages/projects/pipeline_schedules/shared/init_form.js
@@ -11,7 +11,9 @@ Vue.use(Translate);
 
 function initIntervalPatternInput() {
   const intervalPatternMount = document.getElementById('interval-pattern-input');
-  const initialCronInterval = intervalPatternMount ? intervalPatternMount.dataset.initialInterval : '';
+  const initialCronInterval = intervalPatternMount
+    ? intervalPatternMount.dataset.initialInterval
+    : '';
 
   return new Vue({
     el: intervalPatternMount,
diff --git a/app/assets/javascripts/pages/projects/pipelines/charts/index.js b/app/assets/javascripts/pages/projects/pipelines/charts/index.js
index 07b6992eba1..48353f3b4ef 100644
--- a/app/assets/javascripts/pages/projects/pipelines/charts/index.js
+++ b/app/assets/javascripts/pages/projects/pipelines/charts/index.js
@@ -7,26 +7,29 @@ const options = {
   maintainAspectRatio: false,
 };
 
-const buildChart = (chartScope) => {
+const buildChart = chartScope => {
   const data = {
     labels: chartScope.labels,
-    datasets: [{
-      fillColor: '#707070',
-      strokeColor: '#707070',
-      pointColor: '#707070',
-      pointStrokeColor: '#EEE',
-      data: chartScope.totalValues,
-    },
-    {
-      fillColor: '#1aaa55',
-      strokeColor: '#1aaa55',
-      pointColor: '#1aaa55',
-      pointStrokeColor: '#fff',
-      data: chartScope.successValues,
-    },
+    datasets: [
+      {
+        fillColor: '#707070',
+        strokeColor: '#707070',
+        pointColor: '#707070',
+        pointStrokeColor: '#EEE',
+        data: chartScope.totalValues,
+      },
+      {
+        fillColor: '#1aaa55',
+        strokeColor: '#1aaa55',
+        pointColor: '#1aaa55',
+        pointStrokeColor: '#fff',
+        data: chartScope.successValues,
+      },
     ],
   };
-  const ctx = $(`#${chartScope.scope}Chart`).get(0).getContext('2d');
+  const ctx = $(`#${chartScope.scope}Chart`)
+    .get(0)
+    .getContext('2d');
 
   new Chart(ctx).Line(data, options);
 };
@@ -36,14 +39,16 @@ document.addEventListener('DOMContentLoaded', () => {
   const chartsData = JSON.parse(document.getElementById('pipelinesChartsData').innerHTML);
   const data = {
     labels: chartTimesData.labels,
-    datasets: [{
-      fillColor: 'rgba(220,220,220,0.5)',
-      strokeColor: 'rgba(220,220,220,1)',
-      barStrokeWidth: 1,
-      barValueSpacing: 1,
-      barDatasetSpacing: 1,
-      data: chartTimesData.values,
-    }],
+    datasets: [
+      {
+        fillColor: 'rgba(220,220,220,0.5)',
+        strokeColor: 'rgba(220,220,220,1)',
+        barStrokeWidth: 1,
+        barValueSpacing: 1,
+        barDatasetSpacing: 1,
+        data: chartTimesData.values,
+      },
+    ],
   };
 
   if (window.innerWidth < 768) {
@@ -51,7 +56,11 @@ document.addEventListener('DOMContentLoaded', () => {
     options.scaleFontSize = 8;
   }
 
-  new Chart($('#build_timesChart').get(0).getContext('2d')).Bar(data, options);
+  new Chart(
+    $('#build_timesChart')
+      .get(0)
+      .getContext('2d'),
+  ).Bar(data, options);
 
   chartsData.forEach(scope => buildChart(scope));
 });
diff --git a/app/assets/javascripts/pages/projects/pipelines/index/index.js b/app/assets/javascripts/pages/projects/pipelines/index/index.js
index a84e2790680..fc337a7609b 100644
--- a/app/assets/javascripts/pages/projects/pipelines/index/index.js
+++ b/app/assets/javascripts/pages/projects/pipelines/index/index.js
@@ -6,35 +6,39 @@ import { convertPermissionToBoolean } from '../../../../lib/utils/common_utils';
 
 Vue.use(Translate);
 
-document.addEventListener('DOMContentLoaded', () => new Vue({
-  el: '#pipelines-list-vue',
-  components: {
-    pipelinesComponent,
-  },
-  data() {
-    return {
-      store: new PipelinesStore(),
-    };
-  },
-  created() {
-    this.dataset = document.querySelector(this.$options.el).dataset;
-  },
-  render(createElement) {
-    return createElement('pipelines-component', {
-      props: {
-        store: this.store,
-        endpoint: this.dataset.endpoint,
-        helpPagePath: this.dataset.helpPagePath,
-        emptyStateSvgPath: this.dataset.emptyStateSvgPath,
-        errorStateSvgPath: this.dataset.errorStateSvgPath,
-        noPipelinesSvgPath: this.dataset.noPipelinesSvgPath,
-        autoDevopsPath: this.dataset.helpAutoDevopsPath,
-        newPipelinePath: this.dataset.newPipelinePath,
-        canCreatePipeline: convertPermissionToBoolean(this.dataset.canCreatePipeline),
-        hasGitlabCi: convertPermissionToBoolean(this.dataset.hasGitlabCi),
-        ciLintPath: this.dataset.ciLintPath,
-        resetCachePath: this.dataset.resetCachePath,
+document.addEventListener(
+  'DOMContentLoaded',
+  () =>
+    new Vue({
+      el: '#pipelines-list-vue',
+      components: {
+        pipelinesComponent,
       },
-    });
-  },
-}));
+      data() {
+        return {
+          store: new PipelinesStore(),
+        };
+      },
+      created() {
+        this.dataset = document.querySelector(this.$options.el).dataset;
+      },
+      render(createElement) {
+        return createElement('pipelines-component', {
+          props: {
+            store: this.store,
+            endpoint: this.dataset.endpoint,
+            helpPagePath: this.dataset.helpPagePath,
+            emptyStateSvgPath: this.dataset.emptyStateSvgPath,
+            errorStateSvgPath: this.dataset.errorStateSvgPath,
+            noPipelinesSvgPath: this.dataset.noPipelinesSvgPath,
+            autoDevopsPath: this.dataset.helpAutoDevopsPath,
+            newPipelinePath: this.dataset.newPipelinePath,
+            canCreatePipeline: convertPermissionToBoolean(this.dataset.canCreatePipeline),
+            hasGitlabCi: convertPermissionToBoolean(this.dataset.hasGitlabCi),
+            ciLintPath: this.dataset.ciLintPath,
+            resetCachePath: this.dataset.resetCachePath,
+          },
+        });
+      },
+    }),
+);
diff --git a/app/assets/javascripts/pages/projects/pipelines/init_pipelines.js b/app/assets/javascripts/pages/projects/pipelines/init_pipelines.js
index 94dfeb96e8c..ba4ae04ab3d 100644
--- a/app/assets/javascripts/pages/projects/pipelines/init_pipelines.js
+++ b/app/assets/javascripts/pages/projects/pipelines/init_pipelines.js
@@ -2,9 +2,12 @@ import Pipelines from '~/pipelines';
 
 export default () => {
   const { controllerAction } = document.querySelector('.js-pipeline-container').dataset;
-  const pipelineStatusUrl = `${document.querySelector('.js-pipeline-tab-link a').getAttribute('href')}/status.json`;
+  const pipelineStatusUrl = `${document
+    .querySelector('.js-pipeline-tab-link a')
+    .getAttribute('href')}/status.json`;
 
-  new Pipelines({ // eslint-disable-line no-new
+  // eslint-disable-next-line no-new
+  new Pipelines({
     initTabs: true,
     pipelineStatusUrl,
     tabsOptions: {
diff --git a/app/assets/javascripts/pages/projects/shared/permissions/components/project_feature_setting.vue b/app/assets/javascripts/pages/projects/shared/permissions/components/project_feature_setting.vue
index 06101290f6c..dced839c883 100644
--- a/app/assets/javascripts/pages/projects/shared/permissions/components/project_feature_setting.vue
+++ b/app/assets/javascripts/pages/projects/shared/permissions/components/project_feature_setting.vue
@@ -1,73 +1,71 @@
 <script>
-  import projectFeatureToggle from '../../../../../vue_shared/components/toggle_button.vue';
+import projectFeatureToggle from '../../../../../vue_shared/components/toggle_button.vue';
 
-  export default {
-    components: {
-      projectFeatureToggle,
-    },
+export default {
+  components: {
+    projectFeatureToggle,
+  },
 
-    model: {
-      prop: 'value',
-      event: 'change',
-    },
+  model: {
+    prop: 'value',
+    event: 'change',
+  },
 
-    props: {
-      name: {
-        type: String,
-        required: false,
-        default: '',
-      },
-      options: {
-        type: Array,
-        required: false,
-        default: () => [],
-      },
-      value: {
-        type: Number,
-        required: false,
-        default: 0,
-      },
-      disabledInput: {
-        type: Boolean,
-        required: false,
-        default: false,
-      },
+  props: {
+    name: {
+      type: String,
+      required: false,
+      default: '',
+    },
+    options: {
+      type: Array,
+      required: false,
+      default: () => [],
+    },
+    value: {
+      type: Number,
+      required: false,
+      default: 0,
     },
+    disabledInput: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+  },
 
-    computed: {
-      featureEnabled() {
-        return this.value !== 0;
-      },
+  computed: {
+    featureEnabled() {
+      return this.value !== 0;
+    },
 
-      displayOptions() {
-        if (this.featureEnabled) {
-          return this.options;
-        }
-        return [
-          [0, 'Enable feature to choose access level'],
-        ];
-      },
+    displayOptions() {
+      if (this.featureEnabled) {
+        return this.options;
+      }
+      return [[0, 'Enable feature to choose access level']];
+    },
 
-      displaySelectInput() {
-        return this.disabledInput || !this.featureEnabled || this.displayOptions.length < 2;
-      },
+    displaySelectInput() {
+      return this.disabledInput || !this.featureEnabled || this.displayOptions.length < 2;
     },
+  },
 
-    methods: {
-      toggleFeature(featureEnabled) {
-        if (featureEnabled === false || this.options.length < 1) {
-          this.$emit('change', 0);
-        } else {
-          const [firstOptionValue] = this.options[this.options.length - 1];
-          this.$emit('change', firstOptionValue);
-        }
-      },
+  methods: {
+    toggleFeature(featureEnabled) {
+      if (featureEnabled === false || this.options.length < 1) {
+        this.$emit('change', 0);
+      } else {
+        const [firstOptionValue] = this.options[this.options.length - 1];
+        this.$emit('change', firstOptionValue);
+      }
+    },
 
-      selectOption(e) {
-        this.$emit('change', Number(e.target.value));
-      },
+    selectOption(e) {
+      this.$emit('change', Number(e.target.value));
     },
-  };
+  },
+};
 </script>
 
 <template>
diff --git a/app/assets/javascripts/pages/projects/shared/permissions/components/project_setting_row.vue b/app/assets/javascripts/pages/projects/shared/permissions/components/project_setting_row.vue
index 83437363af5..898d605463f 100644
--- a/app/assets/javascripts/pages/projects/shared/permissions/components/project_setting_row.vue
+++ b/app/assets/javascripts/pages/projects/shared/permissions/components/project_setting_row.vue
@@ -1,23 +1,23 @@
 <script>
-  export default {
-    props: {
-      label: {
-        type: String,
-        required: false,
-        default: null,
-      },
-      helpPath: {
-        type: String,
-        required: false,
-        default: null,
-      },
-      helpText: {
-        type: String,
-        required: false,
-        default: null,
-      },
+export default {
+  props: {
+    label: {
+      type: String,
+      required: false,
+      default: null,
     },
-  };
+    helpPath: {
+      type: String,
+      required: false,
+      default: null,
+    },
+    helpText: {
+      type: String,
+      required: false,
+      default: null,
+    },
+  },
+};
 </script>
 
 <template>
diff --git a/app/assets/javascripts/pages/projects/shared/permissions/constants.js b/app/assets/javascripts/pages/projects/shared/permissions/constants.js
index ce47562f259..bc5c29d12b5 100644
--- a/app/assets/javascripts/pages/projects/shared/permissions/constants.js
+++ b/app/assets/javascripts/pages/projects/shared/permissions/constants.js
@@ -5,7 +5,9 @@ export const visibilityOptions = {
 };
 
 export const visibilityLevelDescriptions = {
-  [visibilityOptions.PRIVATE]: 'The project is accessible only by members of the project. Access must be granted explicitly to each user.',
+  [visibilityOptions.PRIVATE]:
+    'The project is accessible only by members of the project. Access must be granted explicitly to each user.',
   [visibilityOptions.INTERNAL]: 'The project can be accessed by any user who is logged in.',
-  [visibilityOptions.PUBLIC]: 'The project can be accessed by anyone, regardless of authentication.',
+  [visibilityOptions.PUBLIC]:
+    'The project can be accessed by anyone, regardless of authentication.',
 };
diff --git a/app/assets/javascripts/pages/projects/shared/project_avatar.js b/app/assets/javascripts/pages/projects/shared/project_avatar.js
index 447877752fe..1e69ecb481d 100644
--- a/app/assets/javascripts/pages/projects/shared/project_avatar.js
+++ b/app/assets/javascripts/pages/projects/shared/project_avatar.js
@@ -8,8 +8,9 @@ export default function projectAvatar() {
 
   $('.js-project-avatar-input').bind('change', function onClickAvatarInput() {
     const form = $(this).closest('form');
-    // eslint-disable-next-line no-useless-escape
-    const filename = $(this).val().replace(/^.*[\\\/]/, '');
+    const filename = $(this)
+      .val()
+      .replace(/^.*[\\\/]/, ''); // eslint-disable-line no-useless-escape
     return form.find('.js-avatar-filename').text(filename);
   });
 }
diff --git a/app/assets/javascripts/pages/projects/wikis/index.js b/app/assets/javascripts/pages/projects/wikis/index.js
index c2629090f01..f5fd84d69ac 100644
--- a/app/assets/javascripts/pages/projects/wikis/index.js
+++ b/app/assets/javascripts/pages/projects/wikis/index.js
@@ -21,7 +21,8 @@ document.addEventListener('DOMContentLoaded', () => {
 
     const { deleteWikiUrl, pageTitle } = deleteWikiModalWrapperEl.dataset;
 
-    new Vue({ // eslint-disable-line no-new
+    // eslint-disable-next-line no-new
+    new Vue({
       el: deleteWikiModalWrapperEl,
       data: {
         deleteWikiUrl: '',