Merge branch 'main-js-tidy-up' into 'master'

Tidy up main JS file

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

.eslintrc

@@ -10,7 +10,6 @@
   ],
   "globals": {
     "__webpack_public_path__": true,
-    "_": false,
     "gl": false,
     "gon": false,
     "localStorage": false

app/assets/javascripts/blob/blob_file_dropzone.js

@@ -4,6 +4,8 @@ import { visitUrl } from '../lib/utils/url_utility';
 import { HIDDEN_CLASS } from '../lib/utils/constants';
 import csrf from '../lib/utils/csrf';
 
+Dropzone.autoDiscover = false;
+
 function toggleLoading($el, $icon, loading) {
   if (loading) {
     $el.disable();

app/assets/javascripts/boards/components/board.js

 /* eslint-disable comma-dangle, space-before-function-paren, one-var */
-/* global Sortable */
+import Sortable from 'vendor/Sortable';
 import Vue from 'vue';
 import AccessorUtilities from '../../lib/utils/accessor';
 import boardList from './board_list';

app/assets/javascripts/boards/components/board_list.js

-/* global Sortable */
+import Sortable from 'vendor/Sortable';
 import boardNewIssue from './board_new_issue';
 import boardCard from './board_card.vue';
 import eventHub from '../eventhub';

app/assets/javascripts/create_merge_request_dropdown.js

 /* eslint-disable no-new */
+import _ from 'underscore';
 import Flash from './flash';
 import DropLab from './droplab/drop_lab';
 import ISetter from './droplab/plugins/input_setter';

app/assets/javascripts/dropzone_input.js

@@ -3,6 +3,8 @@ import _ from 'underscore';
 import './preview_markdown';
 import csrf from './lib/utils/csrf';
 
+Dropzone.autoDiscover = false;
+
 export default function dropzoneInput(form) {
   const divHover = '<div class="div-dropzone-hover"></div>';
   const iconPaperclip = '<i class="fa fa-paperclip div-dropzone-icon"></i>';

app/assets/javascripts/environments/mixins/environments_mixin.js

 /**
  * Common code between environmets app and folder view
  */
-
+import _ from 'underscore';
 import Visibility from 'visibilityjs';
 import Poll from '../../lib/utils/poll';
 import {

app/assets/javascripts/filtered_search/filtered_search_dropdown_manager.js

+import _ from 'underscore';
 import DropLab from '~/droplab/drop_lab';
 import FilteredSearchContainer from './container';
 

app/assets/javascripts/filtered_search/filtered_search_manager.js

+import _ from 'underscore';
 import { visitUrl } from '../lib/utils/url_utility';
 import Flash from '../flash';
 import FilteredSearchContainer from './container';

app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js

+import _ from 'underscore';
 import AjaxCache from '../lib/utils/ajax_cache';
 import Flash from '../flash';
 import FilteredSearchContainer from './container';

app/assets/javascripts/ide/lib/editor.js

+import _ from 'underscore';
 import DecorationsController from './decorations/controller';
 import DirtyDiffController from './diff/controller';
 import Disposable from './common/disposable';

app/assets/javascripts/ide/stores/utils.js

+import _ from 'underscore';
+
 export const dataStructure = () => ({
   id: '',
   key: '',

app/assets/javascripts/label_manager.js

 /* eslint-disable comma-dangle, class-methods-use-this, no-underscore-dangle, no-param-reassign, no-unused-vars, consistent-return, func-names, space-before-function-paren, max-len */
-/* global Sortable */
+import Sortable from 'vendor/Sortable';
 
 import Flash from './flash';
 

app/assets/javascripts/main.js

-/* eslint-disable func-names, space-before-function-paren, no-var, quotes, consistent-return, prefer-arrow-callback, comma-dangle, object-shorthand, no-new, max-len, no-multi-spaces, import/newline-after-import, import/first */
+/* eslint-disable import/first */
 /* global ConfirmDangerModal */
 
 import jQuery from 'jquery';
-import _ from 'underscore';
 import Cookies from 'js-cookie';
-import Dropzone from 'dropzone';
-import Sortable from 'vendor/Sortable';
 import svg4everybody from 'svg4everybody';
 
-// libraries with import side-effects
-import 'mousetrap';
-import 'mousetrap/plugins/pause/mousetrap-pause';
-
 // expose common libraries as globals (TODO: remove these)
 window.jQuery = jQuery;
 window.$ = jQuery;
-window._ = _;
-window.Dropzone = Dropzone;
-window.Sortable = Sortable;
-
-// templates
-import './templates/issuable_template_selector';
-import './templates/issuable_template_selectors';
-
-import './commit/image_file';
 
 // lib/utils
 import { handleLocationHash } from './lib/utils/common_utils';
-import { localTimeAgo, renderTimeago } from './lib/utils/datetime_utility';
+import { localTimeAgo } from './lib/utils/datetime_utility';
 import { getLocationHash, visitUrl } from './lib/utils/url_utility';
 
 // behaviors
@@ -43,7 +27,6 @@ import initTodoToggle from './header';
 import initImporterStatus from './importer_status';
 import initLayoutNav from './layout_nav';
 import LazyLoader from './lazy_loader';
-import './line_highlighter';
 import initLogoAnimation from './logo';
 import './milestone_select';
 import './projects_dropdown';
@@ -55,11 +38,9 @@ import './dispatcher';
 // eslint-disable-next-line global-require, import/no-commonjs
 if (process.env.NODE_ENV !== 'production') require('./test_utils/');
 
-Dropzone.autoDiscover = false;
-
 svg4everybody();
 
-document.addEventListener('beforeunload', function () {
+document.addEventListener('beforeunload', () => {
   // Unbind scroll events
   $(document).off('scroll');
   // Close any open tooltips
@@ -76,16 +57,15 @@ window.addEventListener('load', function onLoad() {
 
 gl.lazyLoader = new LazyLoader({
   scrollContainer: window,
-  observerNode: '#content-body'
+  observerNode: '#content-body',
 });
 
-$(function () {
-  var $body = $('body');
-  var $document = $(document);
-  var $window = $(window);
-  var $sidebarGutterToggle = $('.js-sidebar-toggle');
-  var bootstrapBreakpoint = bp.getBreakpointSize();
-  var fitSidebarForSize;
+$(() => {
+  const $body = $('body');
+  const $document = $(document);
+  const $window = $(window);
+  const $sidebarGutterToggle = $('.js-sidebar-toggle');
+  let bootstrapBreakpoint = bp.getBreakpointSize();
 
   initBreadcrumbs();
   initLayoutNav();
@@ -97,8 +77,8 @@ $(function () {
   Cookies.defaults.path = gon.relative_url_root || '/';
 
   // `hashchange` is not triggered when link target is already in window.location
-  $body.on('click', 'a[href^="#"]', function() {
-    var href = this.getAttribute('href');
+  $body.on('click', 'a[href^="#"]', function clickHashLinkCallback() {
+    const href = this.getAttribute('href');
     if (href.substr(1) === getLocationHash()) {
       setTimeout(handleLocationHash, 1);
     }
@@ -113,155 +93,162 @@ $(function () {
   }
 
   // prevent default action for disabled buttons
-  $('.btn').click(function(e) {
+  $('.btn').click(function clickDisabledButtonCallback(e) {
     if ($(this).hasClass('disabled')) {
       e.preventDefault();
       e.stopImmediatePropagation();
       return false;
     }
+
+    return true;
   });
 
-  $('.js-select-on-focus').on('focusin', function () {
-    return $(this).select().one('mouseup', function (e) {
-      return e.preventDefault();
-    });
   // Click a .js-select-on-focus field, select the contents
   // Prevent a mouseup event from deselecting the input
+  $('.js-select-on-focus').on('focusin', function selectOnFocusCallback() {
+    $(this).select().one('mouseup', (e) => {
+      e.preventDefault();
+    });
   });
-  $('.remove-row').bind('ajax:success', function () {
+
+  $('.remove-row').on('ajax:success', function removeRowAjaxSuccessCallback() {
     $(this).tooltip('destroy')
       .closest('li')
       .fadeOut();
   });
-  $('.js-remove-tr').bind('ajax:before', function () {
-    return $(this).hide();
+
+  $('.js-remove-tr').on('ajax:before', function removeTRAjaxBeforeCallback() {
+    $(this).hide();
   });
-  $('.js-remove-tr').bind('ajax:success', function () {
-    return $(this).closest('tr').fadeOut();
+
+  $('.js-remove-tr').on('ajax:success', function removeTRAjaxSuccessCallback() {
+    $(this).closest('tr').fadeOut();
   });
+
+  // Initialize select2 selects
   $('select.select2').select2({
     width: 'resolve',
-    // Initialize select2 selects
-    dropdownAutoWidth: true
+    dropdownAutoWidth: true,
   });
-  $('.js-select2').bind('select2-close', function () {
-    return setTimeout((function () {
-      $('.select2-container-active').removeClass('select2-container-active');
-      return $(':focus').blur();
-    }), 1);
+
   // Close select2 on escape
+  $('.js-select2').on('select2-close', () => {
+    setTimeout(() => {
+      $('.select2-container-active').removeClass('select2-container-active');
+      $(':focus').blur();
+    }, 1);
   });
+
   // Initialize tooltips
   $.fn.tooltip.Constructor.DEFAULTS.trigger = 'hover';
   $body.tooltip({
     selector: '.has-tooltip, [data-toggle="tooltip"]',
-    placement: function (tip, el) {
+    placement(tip, el) {
       return $(el).data('placement') || 'bottom';
-    }
+    },
   });
+
   // Initialize popovers
   $body.popover({
     selector: '[data-toggle="popover"]',
     trigger: 'focus',
     // set the viewport to the main content, excluding the navigation bar, so
     // the navigation can't overlap the popover
-    viewport: '.layout-page'
+    viewport: '.layout-page',
   });
-  $('.trigger-submit').on('change', function () {
-    return $(this).parents('form').submit();
+
   // Form submitter
+  $('.trigger-submit').on('change', function triggerSubmitCallback() {
+    $(this).parents('form').submit();
   });
+
   localTimeAgo($('abbr.timeago, .js-timeago'), true);
+
   // Disable form buttons while a form is submitting
-  $body.on('ajax:complete, ajax:beforeSend, submit', 'form', function (e) {
-    var buttons;
-    buttons = $('[type="submit"], .js-disable-on-submit', this);
+  $body.on('ajax:complete, ajax:beforeSend, submit', 'form', function ajaxCompleteCallback(e) {
+    const $buttons = $('[type="submit"], .js-disable-on-submit', this);
     switch (e.type) {
       case 'ajax:beforeSend':
       case 'submit':
-        return buttons.disable();
+        return $buttons.disable();
       default:
-        return buttons.enable();
+        return $buttons.enable();
     }
   });
-  $(document).ajaxError(function (e, xhrObj) {
-    var ref = xhrObj.status;
-    if (xhrObj.status === 401) {
-      return new Flash('You need to be logged in.', 'alert');
+
+  $(document).ajaxError((e, xhrObj) => {
+    const ref = xhrObj.status;
+
+    if (ref === 401) {
+      Flash('You need to be logged in.');
     } else if (ref === 404 || ref === 500) {
-      return new Flash('Something went wrong on our end.', 'alert');
+      Flash('Something went wrong on our end.');
     }
   });
-  $('.account-box').hover(function () {
-    // Show/Hide the profile menu when hovering the account box
-    return $(this).toggleClass('hover');
-  });
-  $document.on('click', '.diff-content .js-show-suppressed-diff', function () {
-    var $container;
-    $container = $(this).parent();
-    $container.next('table').show();
-    return $container.remove();
+
   // Commit show suppressed diff
+  $document.on('click', '.diff-content .js-show-suppressed-diff', function showDiffCallback() {
+    const $container = $(this).parent();
+    $container.next('table').show();
+    $container.remove();
   });
+
   $('.navbar-toggle').on('click', () => {
     $('.header-content').toggleClass('menu-expanded');
     gl.lazyLoader.loadCheck();
   });
+
   // Show/hide comments on diff
-  $body.on('click', '.js-toggle-diff-comments', function (e) {
-    var $this = $(this);
-    var notesHolders = $this.closest('.diff-file').find('.notes_holder');
+  $body.on('click', '.js-toggle-diff-comments', function toggleDiffCommentsCallback(e) {
+    const $this = $(this);
+    const notesHolders = $this.closest('.diff-file').find('.notes_holder');
+
+    e.preventDefault();
+
     $this.toggleClass('active');
+
     if ($this.hasClass('active')) {
       notesHolders.show().find('.hide, .content').show();
     } else {
       notesHolders.hide().find('.content').hide();
     }
+
     $(document).trigger('toggle.comments');
-    return e.preventDefault();
   });
-  $document.off('click', '.js-confirm-danger');
-  $document.on('click', '.js-confirm-danger', function (e) {
-    var btn = $(e.target);
-    var form = btn.closest('form');
-    var text = btn.data('confirm-danger-message');
+
+  $document.on('click', '.js-confirm-danger', (e) => {
+    const btn = $(e.target);
+    const form = btn.closest('form');
+    const text = btn.data('confirm-danger-message');
     e.preventDefault();
-    return new ConfirmDangerModal(form, text);
-  });
-  $('input[type="search"]').each(function () {
-    var $this = $(this);
-    $this.attr('value', $this.val());
-  });
-  $document.off('keyup', 'input[type="search"]').on('keyup', 'input[type="search"]', function () {
-    var $this;
-    $this = $(this);
-    return $this.attr('value', $this.val());
+
+    // eslint-disable-next-line no-new
+    new ConfirmDangerModal(form, text);
   });
-  $document.off('breakpoint:change').on('breakpoint:change', function (e, breakpoint) {
-    var $gutterIcon;
+
+  $document.on('breakpoint:change', (e, breakpoint) => {
     if (breakpoint === 'sm' || breakpoint === 'xs') {
-      $gutterIcon = $sidebarGutterToggle.find('i');
+      const $gutterIcon = $sidebarGutterToggle.find('i');
       if ($gutterIcon.hasClass('fa-angle-double-right')) {
-        return $sidebarGutterToggle.trigger('click');
+        $sidebarGutterToggle.trigger('click');
       }
     }
   });
-  fitSidebarForSize = function () {
-    var oldBootstrapBreakpoint;
-    oldBootstrapBreakpoint = bootstrapBreakpoint;
+
+  function fitSidebarForSize() {
+    const oldBootstrapBreakpoint = bootstrapBreakpoint;
     bootstrapBreakpoint = bp.getBreakpointSize();
+
     if (bootstrapBreakpoint !== oldBootstrapBreakpoint) {
-      return $document.trigger('breakpoint:change', [bootstrapBreakpoint]);
+      $document.trigger('breakpoint:change', [bootstrapBreakpoint]);
     }
-  };
-  $window.off('resize.app').on('resize.app', function () {
-    return fitSidebarForSize();
-  });
-  loadAwardsHandler();
+  }
 
-  renderTimeago();
+  $window.on('resize.app', fitSidebarForSize);
+
+  loadAwardsHandler();
 
-  $('form.filter-form').on('submit', function (event) {
+  $('form.filter-form').on('submit', function filterFormSubmitCallback(event) {
     const link = document.createElement('a');
     link.href = this.action;
 

app/assets/javascripts/milestone.js

-/* global Sortable */
-
 import Flash from './flash';
 
 export default class Milestone {

app/assets/javascripts/pages/admin/broadcast_messages/broadcast_message.js

+import _ from 'underscore';
+
 export default function initBroadcastMessagesForm() {
   $('input#broadcast_message_color').on('input', function onMessageColorInput() {
     const previewColor = $(this).val();

app/assets/javascripts/projects_dropdown/service/projects_service.js

+import _ from 'underscore';
 import Vue from 'vue';
 import VueResource from 'vue-resource';
 

app/assets/javascripts/shortcuts_blob.js

-/* global Mousetrap */
+import Mousetrap from 'mousetrap';
 import { getLocationHash, visitUrl } from './lib/utils/url_utility';
 import Shortcuts from './shortcuts';
 

app/assets/javascripts/shortcuts_find_file.js

-/* global Mousetrap */
-
+import Mousetrap from 'mousetrap';
 import ShortcutsNavigation from './shortcuts_navigation';
 
 export default class ShortcutsFindFile extends ShortcutsNavigation {

app/assets/javascripts/shortcuts_issuable.js

-/* global Mousetrap */
-
+import Mousetrap from 'mousetrap';
 import _ from 'underscore';
-import 'mousetrap';
 import Sidebar from './right_sidebar';
 import ShortcutsNavigation from './shortcuts_navigation';
 import { CopyAsGFM } from './behaviors/copy_as_gfm';

app/assets/javascripts/shortcuts_navigation.js

-/* global Mousetrap */
-
+import Mousetrap from 'mousetrap';
 import findAndFollowLink from './shortcuts_dashboard_navigation';
 import Shortcuts from './shortcuts';
 

app/assets/javascripts/shortcuts_network.js

-/* global Mousetrap */
+import Mousetrap from 'mousetrap';
 import ShortcutsNavigation from './shortcuts_navigation';
 
 export default class ShortcutsNetwork extends ShortcutsNavigation {

app/assets/javascripts/shortcuts_wiki.js

-/* eslint-disable class-methods-use-this */
-/* global Mousetrap */
-
+import Mousetrap from 'mousetrap';
 import ShortcutsNavigation from './shortcuts_navigation';
 import findAndFollowLink from './shortcuts_dashboard_navigation';
 
 export default class ShortcutsWiki extends ShortcutsNavigation {
   constructor() {
     super();
-    Mousetrap.bind('e', this.editWiki);
+    Mousetrap.bind('e', ShortcutsWiki.editWiki);
   }
 
-  editWiki() {
+  static editWiki() {
     findAndFollowLink('.js-wiki-edit');
   }
 }

app/assets/javascripts/zen_mode.js

 /* eslint-disable func-names, space-before-function-paren, wrap-iife, prefer-arrow-callback, no-unused-vars, consistent-return, camelcase, comma-dangle, max-len, class-methods-use-this */
-/* global Mousetrap */
 
 // Zen Mode (full screen) textarea
 //
@@ -8,9 +7,11 @@
 
 import 'vendor/jquery.scrollTo';
 import Dropzone from 'dropzone';
-import 'mousetrap';
+import Mousetrap from 'mousetrap';
 import 'mousetrap/plugins/pause/mousetrap-pause';
 
+Dropzone.autoDiscover = false;
+
 //
 // ### Events
 //

spec/features/copy_as_gfm_spec.rb

@@ -750,7 +750,7 @@ describe 'Copy as GFM', :js do
     js = <<-JS.strip_heredoc
       (function(selector) {
         var els = document.querySelectorAll(selector);
-        var htmls = _.map(els, function(el) { return el.outerHTML; });
+        var htmls = [].slice.call(els).map(function(el) { return el.outerHTML; });
         return htmls.join("\\n");
       })("#{escape_javascript(selector)}")
     JS

spec/javascripts/boards/list_spec.js

@@ -5,7 +5,7 @@
 
 import MockAdapter from 'axios-mock-adapter';
 import axios from '~/lib/utils/axios_utils';
-
+import _ from 'underscore';
 import '~/boards/models/issue';
 import '~/boards/models/label';
 import '~/boards/models/list';

spec/javascripts/boards/mock_data.js

 /* global BoardService */
 /* eslint-disable comma-dangle, no-unused-vars, quote-props */
+import _ from 'underscore';
 
 export const listObj = {
   id: 300,

spec/javascripts/commit/pipelines/pipelines_spec.js

+import _ from 'underscore';
 import Vue from 'vue';
 import pipelinesTable from '~/commit/pipelines/pipelines_table.vue';
 

spec/javascripts/deploy_keys/components/app_spec.js

+import _ from 'underscore';
 import Vue from 'vue';
 import eventHub from '~/deploy_keys/eventhub';
 import deployKeysApp from '~/deploy_keys/components/app.vue';

spec/javascripts/environments/environments_app_spec.js

+import _ from 'underscore';
 import Vue from 'vue';
 import environmentsComponent from '~/environments/components/environments_app.vue';
 import { environment, folder } from './mock_data';

spec/javascripts/environments/folder/environments_folder_view_spec.js

+import _ from 'underscore';
 import Vue from 'vue';
 import environmentsFolderViewComponent from '~/environments/folder/environments_folder_view.vue';
 import { environmentsList } from '../mock_data';

spec/javascripts/filtered_search/filtered_search_visual_tokens_spec.js

+import _ from 'underscore';
 import AjaxCache from '~/lib/utils/ajax_cache';
 import UsersCache from '~/lib/utils/users_cache';
 

spec/javascripts/issue_show/components/fields/description_template_spec.js

 import Vue from 'vue';
 import descriptionTemplate from '~/issue_show/components/fields/description_template.vue';
-import '~/templates/issuable_template_selector';
-import '~/templates/issuable_template_selectors';
 
 describe('Issue description template component', () => {
   let vm;

spec/javascripts/issue_show/components/form_spec.js

 import Vue from 'vue';
 import formComponent from '~/issue_show/components/form.vue';
-import '~/templates/issuable_template_selector';
-import '~/templates/issuable_template_selectors';
 
 describe('Inline edit form component', () => {
   let vm;

spec/javascripts/merge_request_notes_spec.js

+import _ from 'underscore';
 import 'autosize';
 import '~/gl_form';