Harmonize CE and EE JS codereduce-ce-ee-disrepancies-in-js

Signed-off-by: Rémy Coutable <remy@rymai.me>

22 files changed, 58 insertions, 44 deletions

diff --git a/app/assets/javascripts/api.js b/app/assets/javascripts/api.js
index 9910e70526d..464611f66f0 100644
--- a/app/assets/javascripts/api.js
+++ b/app/assets/javascripts/api.js
@@ -32,7 +32,7 @@ const Api = {
   },
 
   // Return groups list. Filtered by query
-  groups(query, options, callback) {
+  groups(query, options, callback = $.noop) {
     const url = Api.buildUrl(Api.groupsPath);
     return axios.get(url, {
       params: Object.assign({
diff --git a/app/assets/javascripts/commit/pipelines/pipelines_table.vue b/app/assets/javascripts/commit/pipelines/pipelines_table.vue
index da0e8063ccb..ce19069f103 100644
--- a/app/assets/javascripts/commit/pipelines/pipelines_table.vue
+++ b/app/assets/javascripts/commit/pipelines/pipelines_table.vue
@@ -7,7 +7,6 @@
     mixins: [
       pipelinesMixin,
     ],
-
     props: {
       endpoint: {
         type: String,
diff --git a/app/assets/javascripts/cycle_analytics/components/stage_review_component.vue b/app/assets/javascripts/cycle_analytics/components/stage_review_component.vue
index 39b699a6395..34aa04083e6 100644
--- a/app/assets/javascripts/cycle_analytics/components/stage_review_component.vue
+++ b/app/assets/javascripts/cycle_analytics/components/stage_review_component.vue
@@ -37,7 +37,7 @@
       >
         <div class="item-details">
           <!-- FIXME: Pass an alt attribute here for accessibility -->
-          <user-avatar-image :img-src="mergeRequest.author.avatarUrl"/>
+          <user-avatar-image :img-src="mergeRequest.author.avatarUrl" />
           <h5 class="item-title merge-merquest-title">
             <a :href="mergeRequest.url">
               {{ mergeRequest.title }}
diff --git a/app/assets/javascripts/diff_notes/diff_notes_bundle.js b/app/assets/javascripts/diff_notes/diff_notes_bundle.js
index 38c42a11b4e..679057e787c 100644
--- a/app/assets/javascripts/diff_notes/diff_notes_bundle.js
+++ b/app/assets/javascripts/diff_notes/diff_notes_bundle.js
@@ -71,7 +71,7 @@ export default () => {
     el: '#resolve-count-app',
     components: {
       'resolve-count': ResolveCount
-    }
+    },
   });
 
   $(window).trigger('resize.nav');
diff --git a/app/assets/javascripts/filtered_search/filtered_search_dropdown.js b/app/assets/javascripts/filtered_search/filtered_search_dropdown.js
index cfdd3380fc7..fb4ae1d17dd 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_dropdown.js
+++ b/app/assets/javascripts/filtered_search/filtered_search_dropdown.js
@@ -111,6 +111,9 @@ export default class FilteredSearchDropdown {
 
     if (hook) {
       const data = hook.list.data || [];
+
+      if (!data) return;
+
       const results = data.map((o) => {
         const updated = o;
         updated.droplab_hidden = false;
diff --git a/app/assets/javascripts/gl_dropdown.js b/app/assets/javascripts/gl_dropdown.js
index e322756f256..6cf78bab6ad 100644
--- a/app/assets/javascripts/gl_dropdown.js
+++ b/app/assets/javascripts/gl_dropdown.js
@@ -607,7 +607,20 @@ GitLabDropdown = (function() {
   };
 
   GitLabDropdown.prototype.renderItem = function(data, group, index) {
-    var field, fieldName, html, selected, text, url, value;
+    var field, fieldName, html, selected, text, url, value, rowHidden;
+
+    if (!this.options.renderRow) {
+      value = this.options.id ? this.options.id(data) : data.id;
+
+      if (value) {
+        value = value.toString().replace(/'/g, '\\\'');
+      }
+    }
+
+    // Hide element
+    if (this.options.hideRow && this.options.hideRow(value)) {
+      rowHidden = true;
+    }
     if (group == null) {
       group = false;
     }
@@ -616,6 +629,7 @@ GitLabDropdown = (function() {
       index = false;
     }
     html = document.createElement('li');
+
     if (data === 'divider' || data === 'separator') {
       html.className = data;
       return html;
@@ -631,11 +645,9 @@ GitLabDropdown = (function() {
       html = this.options.renderRow.call(this.options, data, this);
     } else {
       if (!selected) {
-        value = this.options.id ? this.options.id(data) : data.id;
         fieldName = this.options.fieldName;
 
         if (value) {
-          value = value.toString().replace(/'/g, '\\\'');
           field = this.dropdown.parent().find(`input[name='${fieldName}'][value='${value}']`);
           if (field.length) {
             selected = true;
diff --git a/app/assets/javascripts/groups/components/item_stats_value.vue b/app/assets/javascripts/groups/components/item_stats_value.vue
index 08d0bf6e344..4d86ac8023c 100644
--- a/app/assets/javascripts/groups/components/item_stats_value.vue
+++ b/app/assets/javascripts/groups/components/item_stats_value.vue
@@ -30,11 +30,11 @@
         default: 'bottom',
       },
       /**
-      * value could either be number or string
-      * as `memberCount` is always passed as string
-      * while `subgroupCount` & `projectCount`
-      * are always number
-      */
+       * value could either be number or string
+       * as `memberCount` is always passed as string
+       * while `subgroupCount` & `projectCount`
+       * are always number
+       */
       value: {
         type: [Number, String],
         required: false,
diff --git a/app/assets/javascripts/labels_select.js b/app/assets/javascripts/labels_select.js
index dc1930a997f..5de48aa49a9 100644
--- a/app/assets/javascripts/labels_select.js
+++ b/app/assets/javascripts/labels_select.js
@@ -316,9 +316,9 @@ export default class LabelsSelect {
         },
         multiSelect: $dropdown.hasClass('js-multiselect'),
         vue: $dropdown.hasClass('js-issue-board-sidebar'),
-        clicked: function(options) {
-          const { $el, e, isMarking } = options;
-          const label = options.selectedObj;
+        clicked: function (clickEvent) {
+          const { $el, e, isMarking } = clickEvent;
+          const label = clickEvent.selectedObj;
 
           var isIssueIndex, isMRIndex, page, boardsModel;
           var fadeOutLoader = () => {
diff --git a/app/assets/javascripts/pages/projects/project.js b/app/assets/javascripts/pages/projects/project.js
index 6e48d207571..d23ad9a92f4 100644
--- a/app/assets/javascripts/pages/projects/project.js
+++ b/app/assets/javascripts/pages/projects/project.js
@@ -50,7 +50,7 @@ export default class Project {
     Project.projectSelectDropdown();
   }
 
-  static projectSelectDropdown () {
+  static projectSelectDropdown() {
     projectSelect();
     $('.project-item-select').on('click', e => Project.changeProject($(e.currentTarget).val()));
   }
diff --git a/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue b/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue
index e027f08ff5c..7adcf4017b8 100644
--- a/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue
+++ b/app/assets/javascripts/pipelines/components/graph/stage_column_component.vue
@@ -7,7 +7,6 @@
       jobComponent,
       dropdownJobComponent,
     },
-
     props: {
       title: {
         type: String,
diff --git a/app/assets/javascripts/pipelines/components/pipelines_table_row.vue b/app/assets/javascripts/pipelines/components/pipelines_table_row.vue
index 33d441e573e..2ba59051773 100644
--- a/app/assets/javascripts/pipelines/components/pipelines_table_row.vue
+++ b/app/assets/javascripts/pipelines/components/pipelines_table_row.vue
@@ -223,7 +223,8 @@
     <div class="table-section section-10 commit-link">
       <div
         class="table-mobile-header"
-        role="rowheader">
+        role="rowheader"
+      >
         Status
       </div>
       <div class="table-mobile-content">
diff --git a/app/assets/javascripts/pipelines/components/stage.vue b/app/assets/javascripts/pipelines/components/stage.vue
index 58806aa114a..ecf2b10486e 100644
--- a/app/assets/javascripts/pipelines/components/stage.vue
+++ b/app/assets/javascripts/pipelines/components/stage.vue
@@ -50,9 +50,7 @@
 
     computed: {
       dropdownClass() {
-        return this.dropdownContent.length > 0 ?
-          'js-builds-dropdown-container' :
-          'js-builds-dropdown-loading';
+        return this.dropdownContent.length > 0 ? 'js-builds-dropdown-container' : 'js-builds-dropdown-loading';
       },
 
       triggerButtonClass() {
diff --git a/app/assets/javascripts/project_find_file.js b/app/assets/javascripts/project_find_file.js
index 586d188350f..4fd639cce8e 100644
--- a/app/assets/javascripts/project_find_file.js
+++ b/app/assets/javascripts/project_find_file.js
@@ -73,7 +73,7 @@ export default class ProjectFindFile {
   // find file
   }
 
-    // files pathes load
+  // files pathes load
   load(url) {
     axios.get(url)
       .then(({ data }) => {
@@ -85,7 +85,7 @@ export default class ProjectFindFile {
       .catch(() => flash(__('An error occurred while loading filenames')));
   }
 
-    // render result
+  // render result
   renderList(filePaths, searchText) {
     var blobItemUrl, filePath, html, i, j, len, matches, results;
     this.element.find(".tree-table > tbody").empty();
diff --git a/app/assets/javascripts/render_gfm.js b/app/assets/javascripts/render_gfm.js
index 5482c55f8bb..05a623ca6d9 100644
--- a/app/assets/javascripts/render_gfm.js
+++ b/app/assets/javascripts/render_gfm.js
@@ -1,6 +1,7 @@
 import renderMath from './render_math';
 import renderMermaid from './render_mermaid';
 import syntaxHighlight from './syntax_highlight';
+
 // Render Gitlab flavoured Markdown
 //
 // Delegates to syntax highlight and render math & mermaid diagrams.
diff --git a/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue b/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue
index 9d22b9d77be..0686910fc7e 100644
--- a/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue
+++ b/app/assets/javascripts/sidebar/components/lock/lock_issue_sidebar.vue
@@ -1,5 +1,5 @@
 <script>
-  import Flash from '../../../flash';
+  import Flash from '~/flash';
   import editForm from './edit_form.vue';
   import issuableMixin from '../../../vue_shared/mixins/issuable';
   import Icon from '../../../vue_shared/components/icon.vue';
@@ -53,8 +53,7 @@
           discussion_locked: locked,
         })
         .then(() => location.reload())
-        .catch(() => Flash(this.__(`Something went wrong trying to
-  change the locked state of this ${this.issuableDisplayName}`)));
+        .catch(() => Flash(this.__(`Something went wrong trying to change the locked state of this ${this.issuableDisplayName}`)));
       },
     },
   };
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_rebase.vue b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_rebase.vue
index 2968af0d5cb..e9f23b0b113 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_rebase.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/mr_widget_rebase.vue
@@ -107,7 +107,8 @@
       <template v-if="!mr.rebaseInProgress && mr.canPushToSourceBranch && !isMakingRequest">
         <div
           class="accept-merge-holder clearfix
-js-toggle-container accept-action media space-children">
+js-toggle-container accept-action media space-children"
+        >
           <button
             type="button"
             class="btn btn-sm btn-reopen btn-success"
diff --git a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
index d8f0442ef9d..797f0f6ec0f 100644
--- a/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
+++ b/app/assets/javascripts/vue_merge_request_widget/mr_widget_options.js
@@ -96,9 +96,7 @@ export default {
             cb.call(null, data);
           }
         })
-        .catch(() => {
-          new Flash('Something went wrong. Please try again.'); // eslint-disable-line
-        });
+        .catch(() => new Flash('Something went wrong. Please try again.'));
     },
     initPolling() {
       this.pollingInterval = new SmartInterval({
@@ -146,9 +144,7 @@ export default {
             Project.initRefSwitcher();
           }
         })
-        .catch(() => {
-          new Flash('Something went wrong. Please try again.'); // eslint-disable-line
-        });
+        .catch(() => new Flash('Something went wrong. Please try again.'));
     },
     handleNotification(data) {
       if (data.ci_status === this.mr.ciStatus) return;
diff --git a/app/assets/javascripts/vue_merge_request_widget/stores/mr_widget_store.js b/app/assets/javascripts/vue_merge_request_widget/stores/mr_widget_store.js
index ed004b3bb08..9a750ce42bd 100644
--- a/app/assets/javascripts/vue_merge_request_widget/stores/mr_widget_store.js
+++ b/app/assets/javascripts/vue_merge_request_widget/stores/mr_widget_store.js
@@ -4,7 +4,6 @@ import { stateKey } from './state_maps';
 import { formatDate } from '../../lib/utils/datetime_utility';
 
 export default class MergeRequestStore {
-
   constructor(data) {
     this.sha = data.diff_head_sha;
     this.gitlabLogo = data.gitlabLogo;
@@ -169,5 +168,4 @@ export default class MergeRequestStore {
 
     return timeagoInstance.format(date);
   }
-
 }
diff --git a/app/assets/javascripts/vue_shared/components/header_ci_component.vue b/app/assets/javascripts/vue_shared/components/header_ci_component.vue
index 1f72dea1b33..a0cd0cbd200 100644
--- a/app/assets/javascripts/vue_shared/components/header_ci_component.vue
+++ b/app/assets/javascripts/vue_shared/components/header_ci_component.vue
@@ -6,12 +6,12 @@
   import userAvatarImage from './user_avatar/user_avatar_image.vue';
 
   /**
-  * Renders header component for job and pipeline page based on UI mockups
-  *
-  * Used in:
-  * - job show page
-  * - pipeline show page
-  */
+   * Renders header component for job and pipeline page based on UI mockups
+   *
+   * Used in:
+   * - job show page
+   * - pipeline show page
+   */
   export default {
     components: {
       ciIconBadge,
@@ -118,7 +118,8 @@
 
     <section
       class="header-action-buttons"
-      v-if="actions.length">
+      v-if="actions.length"
+    >
       <template
         v-for="(action, i) in actions"
       >
diff --git a/app/assets/javascripts/vue_shared/components/loading_button.vue b/app/assets/javascripts/vue_shared/components/loading_button.vue
index 6ae6b179f7f..e832d94d32f 100644
--- a/app/assets/javascripts/vue_shared/components/loading_button.vue
+++ b/app/assets/javascripts/vue_shared/components/loading_button.vue
@@ -1,6 +1,5 @@
 <script>
   /* eslint-disable vue/require-default-prop */
-
   /* This is a re-usable vue component for rendering a button
     that will probably be sending off ajax requests and need
     to show the loading status by setting the `loading` option.
diff --git a/app/assets/javascripts/vue_shared/components/markdown/header.vue b/app/assets/javascripts/vue_shared/components/markdown/header.vue
index f65eab11a27..177d2cfc8da 100644
--- a/app/assets/javascripts/vue_shared/components/markdown/header.vue
+++ b/app/assets/javascripts/vue_shared/components/markdown/header.vue
@@ -65,7 +65,8 @@
       </li>
       <li
         class="md-header-tab"
-        :class="{ active: previewMarkdown }">
+        :class="{ active: previewMarkdown }"
+      >
         <a
           class="js-preview-link"
           href="#md-preview-holder"
diff --git a/app/assets/javascripts/vue_shared/components/table_pagination.vue b/app/assets/javascripts/vue_shared/components/table_pagination.vue
index c44c606a8b2..22fc5757447 100644
--- a/app/assets/javascripts/vue_shared/components/table_pagination.vue
+++ b/app/assets/javascripts/vue_shared/components/table_pagination.vue
@@ -13,6 +13,12 @@
     props: {
       /**
         This function will take the information given by the pagination component
+
+        Here is an example `change` method:
+
+        change(pagenum) {
+          gl.utils.visitUrl(`?page=${pagenum}`);
+        },
       */
       change: {
         type: Function,