Merge remote-tracking branch 'upstream/master' into ce-to-ee-2018-10-17

app/assets/javascripts/behaviors/copy_to_clipboard.js

@@ -51,7 +51,7 @@ export default function initCopyToClipboard() {
    * the last minute to deconstruct this JSON hash and set the `text/plain` and `text/x-gfm` copy
    * data types to the intended values.
    */
-  $(document).on('copy', 'body > textarea[readonly]', (e) => {
+  $(document).on('copy', 'body > textarea[readonly]', e => {
     const { clipboardData } = e.originalEvent;
     if (!clipboardData) return;
 

app/assets/javascripts/behaviors/details_behavior.js

@@ -2,7 +2,9 @@ import $ from 'jquery';
 
 $(() => {
   $('body').on('click', '.js-details-target', function target() {
-    $(this).closest('.js-details-container').toggleClass('open');
+    $(this)
+      .closest('.js-details-container')
+      .toggleClass('open');
   });
 
   // Show details content. Hides link after click.
@@ -13,7 +15,9 @@ $(() => {
   //
   $('body').on('click', '.js-details-expand', function expand(e) {
     e.preventDefault();
-    $(this).next('.js-details-content').removeClass('hide');
+    $(this)
+      .next('.js-details-content')
+      .removeClass('hide');
     $(this).hide();
 
     const truncatedItem = $(this).siblings('.js-details-short');

app/assets/javascripts/behaviors/markdown/copy_as_gfm.js

@@ -34,7 +34,7 @@ const gfmRules = {
     },
   },
   AutolinkFilter: {
-    'a'(el, text) {
+    a(el, text) {
       // Fallback on the regular MarkdownFilter's `a` handler.
       if (text !== el.getAttribute('href')) return false;
 
@@ -60,7 +60,7 @@ const gfmRules = {
     },
   },
   ImageLazyLoadFilter: {
-    'img'(el, text) {
+    img(el, text) {
       return `![${el.getAttribute('alt')}](${el.getAttribute('src')})`;
     },
   },
@@ -71,7 +71,7 @@ const gfmRules = {
 
       return CopyAsGFM.nodeToGFM(videoEl);
     },
-    'video'(el) {
+    video(el) {
       return `![${el.dataset.title}](${el.getAttribute('src')})`;
     },
   },
@@ -118,11 +118,14 @@ const gfmRules = {
     'a[name]:not([href]):empty'(el) {
       return el.outerHTML;
     },
-    'dl'(el, text) {
-      let lines = text.replace(/\n\n/g, '\n').trim().split('\n');
+    dl(el, text) {
+      let lines = text
+        .replace(/\n\n/g, '\n')
+        .trim()
+        .split('\n');
       // Add two spaces to the front of subsequent list items lines,
       // or leave the line entirely blank.
-      lines = lines.map((l) => {
+      lines = lines.map(l => {
         const line = l.trim();
         if (line.length === 0) return '';
 
@@ -151,27 +154,30 @@ const gfmRules = {
 
       // Prefixes lines with 4 spaces if the code contains triple backticks
       if (lang === '' && text.match(/^```/gm)) {
-        return text.split('\n').map((l) => {
-          const line = l.trim();
-          if (line.length === 0) return '';
-
-          return `    ${line}`;
-        }).join('\n');
+        return text
+          .split('\n')
+          .map(l => {
+            const line = l.trim();
+            if (line.length === 0) return '';
+
+            return `    ${line}`;
+          })
+          .join('\n');
       }
 
       return `\`\`\`${lang}\n${text}\n\`\`\``;
     },
     'pre > code'(el, text) {
-       // Don't wrap code blocks in ``
+      // Don't wrap code blocks in ``
       return text;
     },
   },
   MarkdownFilter: {
-    'br'(el) {
+    br(el) {
       // Two spaces at the end of a line are turned into a BR
       return '  ';
     },
-    'code'(el, text) {
+    code(el, text) {
       let backtickCount = 1;
       const backtickMatch = text.match(/`+/);
       if (backtickMatch) {
@@ -183,27 +189,31 @@ const gfmRules = {
 
       return backticks + spaceOrNoSpace + text.trim() + spaceOrNoSpace + backticks;
     },
-    'blockquote'(el, text) {
-      return text.trim().split('\n').map(s => `> ${s}`.trim()).join('\n');
+    blockquote(el, text) {
+      return text
+        .trim()
+        .split('\n')
+        .map(s => `> ${s}`.trim())
+        .join('\n');
     },
-    'img'(el) {
+    img(el) {
       const imageSrc = el.src;
-      const imageUrl = imageSrc && imageSrc !== placeholderImage ? imageSrc : (el.dataset.src || '');
+      const imageUrl = imageSrc && imageSrc !== placeholderImage ? imageSrc : el.dataset.src || '';
       return `![${el.getAttribute('alt')}](${imageUrl})`;
     },
     'a.anchor'(el, text) {
       // Don't render a Markdown link for the anchor link inside a heading
       return text;
     },
-    'a'(el, text) {
+    a(el, text) {
       return `[${text}](${el.getAttribute('href')})`;
     },
-    'li'(el, text) {
+    li(el, text) {
       const lines = text.trim().split('\n');
       const firstLine = `- ${lines.shift()}`;
       // Add four spaces to the front of subsequent list items lines,
       // or leave the line entirely blank.
-      const nextLines = lines.map((s) => {
+      const nextLines = lines.map(s => {
         if (s.trim().length === 0) return '';
 
         return `    ${s}`;
@@ -211,49 +221,49 @@ const gfmRules = {
 
       return `${firstLine}\n${nextLines.join('\n')}`;
     },
-    'ul'(el, text) {
+    ul(el, text) {
       return text;
     },
-    'ol'(el, text) {
+    ol(el, text) {
       // LIs get a `- ` prefix by default, which we replace by `1. ` for ordered lists.
-      return text.replace(/^- /mg, '1. ');
+      return text.replace(/^- /gm, '1. ');
     },
-    'h1'(el, text) {
+    h1(el, text) {
       return `# ${text.trim()}\n`;
     },
-    'h2'(el, text) {
+    h2(el, text) {
       return `## ${text.trim()}\n`;
     },
-    'h3'(el, text) {
+    h3(el, text) {
       return `### ${text.trim()}\n`;
     },
-    'h4'(el, text) {
+    h4(el, text) {
       return `#### ${text.trim()}\n`;
     },
-    'h5'(el, text) {
+    h5(el, text) {
       return `##### ${text.trim()}\n`;
     },
-    'h6'(el, text) {
+    h6(el, text) {
       return `###### ${text.trim()}\n`;
     },
-    'strong'(el, text) {
+    strong(el, text) {
       return `**${text}**`;
     },
-    'em'(el, text) {
+    em(el, text) {
       return `_${text}_`;
     },
-    'del'(el, text) {
+    del(el, text) {
       return `~~${text}~~`;
     },
-    'hr'(el) {
+    hr(el) {
       // extra leading \n is to ensure that there is a blank line between
       // a list followed by an hr, otherwise this breaks old redcarpet rendering
       return '\n-----\n';
     },
-    'p'(el, text) {
+    p(el, text) {
       return `${text.trim()}\n`;
     },
-    'table'(el) {
+    table(el) {
       const theadEl = el.querySelector('thead');
       const tbodyEl = el.querySelector('tbody');
       if (!theadEl || !tbodyEl) return false;
@@ -263,8 +273,8 @@ const gfmRules = {
 
       return [theadText, tbodyText].join('\n');
     },
-    'thead'(el, text) {
-      const cells = _.map(el.querySelectorAll('th'), (cell) => {
+    thead(el, text) {
+      const cells = _.map(el.querySelectorAll('th'), cell => {
         let chars = CopyAsGFM.nodeToGFM(cell).length + 2;
 
         let before = '';
@@ -296,7 +306,7 @@ const gfmRules = {
 
       return [text, separatorRow].join('\n');
     },
-    'tr'(el) {
+    tr(el) {
       const cellEls = el.querySelectorAll('td, th');
       if (cellEls.length === 0) return false;
 
@@ -315,8 +325,12 @@ export class CopyAsGFM {
     const isIOS = /\b(iPad|iPhone|iPod)(?=;)/.test(userAgent);
     if (isIOS) return;
 
-    $(document).on('copy', '.md, .wiki', (e) => { CopyAsGFM.copyAsGFM(e, CopyAsGFM.transformGFMSelection); });
-    $(document).on('copy', 'pre.code.highlight, .diff-content .line_content', (e) => { CopyAsGFM.copyAsGFM(e, CopyAsGFM.transformCodeSelection); });
+    $(document).on('copy', '.md, .wiki', e => {
+      CopyAsGFM.copyAsGFM(e, CopyAsGFM.transformGFMSelection);
+    });
+    $(document).on('copy', 'pre.code.highlight, .diff-content .line_content', e => {
+      CopyAsGFM.copyAsGFM(e, CopyAsGFM.transformCodeSelection);
+    });
     $(document).on('paste', '.js-gfm-input', CopyAsGFM.pasteGFM);
   }
 
@@ -356,7 +370,7 @@ export class CopyAsGFM {
       // This will break down when the actual code block contains an uneven
       // number of backticks, but this is a rare edge case.
       const backtickMatch = textBefore.match(/`/g);
-      const insideCodeBlock = backtickMatch && (backtickMatch.length % 2) === 1;
+      const insideCodeBlock = backtickMatch && backtickMatch.length % 2 === 1;
 
       if (insideCodeBlock) {
         return text;
@@ -393,7 +407,9 @@ export class CopyAsGFM {
     let lineSelector = '.line';
 
     if (target) {
-      const lineClass = ['left-side', 'right-side'].filter(name => target.classList.contains(name))[0];
+      const lineClass = ['left-side', 'right-side'].filter(name =>
+        target.classList.contains(name),
+      )[0];
       if (lineClass) {
         lineSelector = `.line_content.${lineClass} ${lineSelector}`;
       }
@@ -436,7 +452,8 @@ export class CopyAsGFM {
       return node.textContent;
     }
 
-    const respectWhitespace = respectWhitespaceParam || (node.nodeName === 'PRE' || node.nodeName === 'CODE');
+    const respectWhitespace =
+      respectWhitespaceParam || (node.nodeName === 'PRE' || node.nodeName === 'CODE');
 
     const text = this.innerGFM(node, respectWhitespace);
 

app/assets/javascripts/behaviors/markdown/render_math.js

@@ -32,7 +32,9 @@ export default function renderMath($els) {
   Promise.all([
     import(/* webpackChunkName: 'katex' */ 'katex'),
     import(/* webpackChunkName: 'katex' */ 'katex/dist/katex.min.css'),
-  ]).then(([katex]) => {
-    renderWithKaTeX($els, katex);
-  }).catch(() => flash(__('An error occurred while rendering KaTeX')));
+  ])
+    .then(([katex]) => {
+      renderWithKaTeX($els, katex);
+    })
+    .catch(() => flash(__('An error occurred while rendering KaTeX')));
 }

app/assets/javascripts/behaviors/markdown/render_mermaid.js

@@ -17,41 +17,43 @@ import flash from '~/flash';
 export default function renderMermaid($els) {
   if (!$els.length) return;
 
-  import(/* webpackChunkName: 'mermaid' */ 'blackst0ne-mermaid').then((mermaid) => {
-    mermaid.initialize({
-      // mermaid core options
-      mermaid: {
-        startOnLoad: false,
-      },
-      // mermaidAPI options
-      theme: 'neutral',
-    });
+  import(/* webpackChunkName: 'mermaid' */ 'blackst0ne-mermaid')
+    .then(mermaid => {
+      mermaid.initialize({
+        // mermaid core options
+        mermaid: {
+          startOnLoad: false,
+        },
+        // mermaidAPI options
+        theme: 'neutral',
+      });
 
-    $els.each((i, el) => {
-      const source = el.textContent;
+      $els.each((i, el) => {
+        const source = el.textContent;
 
-      // Remove any extra spans added by the backend syntax highlighting.
-      Object.assign(el, { textContent: source });
+        // Remove any extra spans added by the backend syntax highlighting.
+        Object.assign(el, { textContent: source });
 
-      mermaid.init(undefined, el, (id) => {
-        const svg = document.getElementById(id);
+        mermaid.init(undefined, el, id => {
+          const svg = document.getElementById(id);
 
-        svg.classList.add('mermaid');
+          svg.classList.add('mermaid');
 
-        // pre > code > svg
-        svg.closest('pre').replaceWith(svg);
+          // pre > code > svg
+          svg.closest('pre').replaceWith(svg);
 
-        // We need to add the original source into the DOM to allow Copy-as-GFM
-        // to access it.
-        const sourceEl = document.createElement('text');
-        sourceEl.classList.add('source');
-        sourceEl.setAttribute('display', 'none');
-        sourceEl.textContent = source;
+          // We need to add the original source into the DOM to allow Copy-as-GFM
+          // to access it.
+          const sourceEl = document.createElement('text');
+          sourceEl.classList.add('source');
+          sourceEl.setAttribute('display', 'none');
+          sourceEl.textContent = source;
 
-        svg.appendChild(sourceEl);
+          svg.appendChild(sourceEl);
+        });
       });
+    })
+    .catch(err => {
+      flash(`Can't load mermaid module: ${err}`);
     });
-  }).catch((err) => {
-    flash(`Can't load mermaid module: ${err}`);
-  });
 }

app/assets/javascripts/behaviors/preview_markdown.js

@@ -26,7 +26,7 @@ MarkdownPreview.prototype.emptyMessage = 'Nothing to preview.';
 
 MarkdownPreview.prototype.ajaxCache = {};
 
-MarkdownPreview.prototype.showPreview = function ($form) {
+MarkdownPreview.prototype.showPreview = function($form) {
   var mdText;
   var markdownVersion;
   var url;
@@ -44,34 +44,40 @@ MarkdownPreview.prototype.showPreview = function ($form) {
     this.hideReferencedUsers($form);
   } else {
     preview.addClass('md-preview-loading').text('Loading...');
-    this.fetchMarkdownPreview(mdText, url, (function (response) {
-      var body;
-      if (response.body.length > 0) {
-        ({ body } = response);
-      } else {
-        body = this.emptyMessage;
-      }
-
-      preview.removeClass('md-preview-loading').html(body);
-      preview.renderGFM();
-      this.renderReferencedUsers(response.references.users, $form);
-
-      if (response.references.commands) {
-        this.renderReferencedCommands(response.references.commands, $form);
-      }
-    }).bind(this));
+    this.fetchMarkdownPreview(
+      mdText,
+      url,
+      function(response) {
+        var body;
+        if (response.body.length > 0) {
+          ({ body } = response);
+        } else {
+          body = this.emptyMessage;
+        }
+
+        preview.removeClass('md-preview-loading').html(body);
+        preview.renderGFM();
+        this.renderReferencedUsers(response.references.users, $form);
+
+        if (response.references.commands) {
+          this.renderReferencedCommands(response.references.commands, $form);
+        }
+      }.bind(this),
+    );
   }
 };
 
-MarkdownPreview.prototype.versionedPreviewPath = function (markdownPreviewPath, markdownVersion) {
+MarkdownPreview.prototype.versionedPreviewPath = function(markdownPreviewPath, markdownVersion) {
   if (typeof markdownVersion === 'undefined') {
     return markdownPreviewPath;
   }
 
-  return `${markdownPreviewPath}${markdownPreviewPath.indexOf('?') === -1 ? '?' : '&'}markdown_version=${markdownVersion}`;
+  return `${markdownPreviewPath}${
+    markdownPreviewPath.indexOf('?') === -1 ? '?' : '&'
+  }markdown_version=${markdownVersion}`;
 };
 
-MarkdownPreview.prototype.fetchMarkdownPreview = function (text, url, success) {
+MarkdownPreview.prototype.fetchMarkdownPreview = function(text, url, success) {
   if (!url) {
     return;
   }
@@ -79,24 +85,25 @@ MarkdownPreview.prototype.fetchMarkdownPreview = function (text, url, success) {
     success(this.ajaxCache.response);
     return;
   }
-  axios.post(url, {
-    text,
-  })
-  .then(({ data }) => {
-    this.ajaxCache = {
-      text: text,
-      response: data,
-    };
-    success(data);
-  })
-  .catch(() => flash(__('An error occurred while fetching markdown preview')));
+  axios
+    .post(url, {
+      text,
+    })
+    .then(({ data }) => {
+      this.ajaxCache = {
+        text: text,
+        response: data,
+      };
+      success(data);
+    })
+    .catch(() => flash(__('An error occurred while fetching markdown preview')));
 };
 
-MarkdownPreview.prototype.hideReferencedUsers = function ($form) {
+MarkdownPreview.prototype.hideReferencedUsers = function($form) {
   $form.find('.referenced-users').hide();
 };
 
-MarkdownPreview.prototype.renderReferencedUsers = function (users, $form) {
+MarkdownPreview.prototype.renderReferencedUsers = function(users, $form) {
   var referencedUsers;
   referencedUsers = $form.find('.referenced-users');
   if (referencedUsers.length) {
@@ -109,11 +116,11 @@ MarkdownPreview.prototype.renderReferencedUsers = function (users, $form) {
   }
 };
 
-MarkdownPreview.prototype.hideReferencedCommands = function ($form) {
+MarkdownPreview.prototype.hideReferencedCommands = function($form) {
   $form.find('.referenced-commands').hide();
 };
 
-MarkdownPreview.prototype.renderReferencedCommands = function (commands, $form) {
+MarkdownPreview.prototype.renderReferencedCommands = function(commands, $form) {
   var referencedCommands;
   referencedCommands = $form.find('.referenced-commands');
   if (commands.length > 0) {
@@ -132,14 +139,14 @@ writeButtonSelector = '.js-md-write-button';
 lastTextareaPreviewed = null;
 const markdownToolbar = $('.md-header-toolbar');
 
-$.fn.setupMarkdownPreview = function () {
+$.fn.setupMarkdownPreview = function() {
   var $form = $(this);
-  $form.find('textarea.markdown-area').on('input', function () {
+  $form.find('textarea.markdown-area').on('input', function() {
     markdownPreview.hideReferencedUsers($form);
   });
 };
 
-$(document).on('markdown-preview:show', function (e, $form) {
+$(document).on('markdown-preview:show', function(e, $form) {
   if (!$form) {
     return;
   }
@@ -148,8 +155,14 @@ $(document).on('markdown-preview:show', function (e, $form) {
   lastTextareaHeight = lastTextareaPreviewed.height();
 
   // toggle tabs
-  $form.find(writeButtonSelector).parent().removeClass('active');
-  $form.find(previewButtonSelector).parent().addClass('active');
+  $form
+    .find(writeButtonSelector)
+    .parent()
+    .removeClass('active');
+  $form
+    .find(previewButtonSelector)
+    .parent()
+    .addClass('active');
 
   // toggle content
   $form.find('.md-write-holder').hide();
@@ -158,7 +171,7 @@ $(document).on('markdown-preview:show', function (e, $form) {
   markdownPreview.showPreview($form);
 });
 
-$(document).on('markdown-preview:hide', function (e, $form) {
+$(document).on('markdown-preview:hide', function(e, $form) {
   if (!$form) {
     return;
   }
@@ -169,8 +182,14 @@ $(document).on('markdown-preview:hide', function (e, $form) {
   }
 
   // toggle tabs
-  $form.find(writeButtonSelector).parent().addClass('active');
-  $form.find(previewButtonSelector).parent().removeClass('active');
+  $form
+    .find(writeButtonSelector)
+    .parent()
+    .addClass('active');
+  $form
+    .find(previewButtonSelector)
+    .parent()
+    .removeClass('active');
 
   // toggle content
   $form.find('.md-write-holder').show();
@@ -181,7 +200,7 @@ $(document).on('markdown-preview:hide', function (e, $form) {
   markdownPreview.hideReferencedCommands($form);
 });
 
-$(document).on('markdown-preview:toggle', function (e, keyboardEvent) {
+$(document).on('markdown-preview:toggle', function(e, keyboardEvent) {
   var $target;
   $target = $(keyboardEvent.target);
   if ($target.is('textarea.markdown-area')) {
@@ -194,14 +213,14 @@ $(document).on('markdown-preview:toggle', function (e, keyboardEvent) {
   }
 });
 
-$(document).on('click', previewButtonSelector, function (e) {
+$(document).on('click', previewButtonSelector, function(e) {
   var $form;
   e.preventDefault();
   $form = $(this).closest('form');
   $(document).triggerHandler('markdown-preview:show', [$form]);
 });
 
-$(document).on('click', writeButtonSelector, function (e) {
+$(document).on('click', writeButtonSelector, function(e) {
   var $form;
   e.preventDefault();
   $form = $(this).closest('form');

app/assets/javascripts/behaviors/quick_submit.js

@@ -28,7 +28,7 @@ function keyCodeIs(e, keyCode) {
   return e.keyCode === keyCode;
 }
 
-$(document).on('keydown.quick_submit', '.js-quick-submit', (e) => {
+$(document).on('keydown.quick_submit', '.js-quick-submit', e => {
   // Enter
   if (!keyCodeIs(e, 13)) {
     return;
@@ -55,23 +55,25 @@ $(document).on('keydown.quick_submit', '.js-quick-submit', (e) => {
 
 // If the user tabs to a submit button on a `js-quick-submit` form, display a
 // tooltip to let them know they could've used the hotkey
-$(document).on('keyup.quick_submit', '.js-quick-submit input[type=submit], .js-quick-submit button[type=submit]', function displayTooltip(e) {
-  // Tab
-  if (!keyCodeIs(e, 9)) {
-    return;
-  }
+$(document).on(
+  'keyup.quick_submit',
+  '.js-quick-submit input[type=submit], .js-quick-submit button[type=submit]',
+  function displayTooltip(e) {
+    // Tab
+    if (!keyCodeIs(e, 9)) {
+      return;
+    }
 
-  const $this = $(this);
-  const title = isMac() ?
-    'You can also press ⌘-Enter' :
-    'You can also press Ctrl-Enter';
+    const $this = $(this);
+    const title = isMac() ? 'You can also press ⌘-Enter' : 'You can also press Ctrl-Enter';
 
-  $this.tooltip({
-    container: 'body',
-    html: 'true',
-    placement: 'top',
-    title,
-    trigger: 'manual',
-  });
-  $this.tooltip('show').one('blur click', () => $this.tooltip('hide'));
-});
+    $this.tooltip({
+      container: 'body',
+      html: 'true',
+      placement: 'top',
+      title,
+      trigger: 'manual',
+    });
+    $this.tooltip('show').one('blur click', () => $this.tooltip('hide'));
+  },
+);

app/assets/javascripts/behaviors/requires_input.js

@@ -18,7 +18,8 @@ import '../commons/bootstrap';
 $.fn.requiresInput = function requiresInput() {
   const $form = $(this);
   const $button = $('button[type=submit], input[type=submit]', $form);
-  const fieldSelector = 'input[required=required], select[required=required], textarea[required=required]';
+  const fieldSelector =
+    'input[required=required], select[required=required], textarea[required=required]';
 
   function requireInput() {
     // Collect the input values of *all* required fields

app/assets/javascripts/behaviors/secret_values.js

@@ -32,16 +32,18 @@ export default class SecretValues {
 
   updateDom(isRevealed) {
     const values = this.container.querySelectorAll(this.valueSelector);
-    values.forEach((value) => {
+    values.forEach(value => {
       value.classList.toggle('hide', !isRevealed);
     });
 
     const placeholders = this.container.querySelectorAll(this.placeholderSelector);
-    placeholders.forEach((placeholder) => {
+    placeholders.forEach(placeholder => {
       placeholder.classList.toggle('hide', isRevealed);
     });
 
-    this.revealButton.textContent = isRevealed ? n__('Hide value', 'Hide values', values.length) : n__('Reveal value', 'Reveal values', values.length);
+    this.revealButton.textContent = isRevealed
+      ? n__('Hide value', 'Hide values', values.length)
+      : n__('Reveal value', 'Reveal values', values.length);
     this.revealButton.dataset.secretRevealStatus = isRevealed;
   }
 }

app/assets/javascripts/behaviors/shortcuts/shortcuts.js

@@ -88,22 +88,24 @@ export default class Shortcuts {
       return null;
     }
 
-    return axios.get(gon.shortcuts_path, {
-      responseType: 'text',
-    }).then(({ data }) => {
-      $.globalEval(data);
-
-      if (location && location.length > 0) {
-        const results = [];
-        for (let i = 0, len = location.length; i < len; i += 1) {
-          results.push($(location[i]).show());
+    return axios
+      .get(gon.shortcuts_path, {
+        responseType: 'text',
+      })
+      .then(({ data }) => {
+        $.globalEval(data);
+
+        if (location && location.length > 0) {
+          const results = [];
+          for (let i = 0, len = location.length; i < len; i += 1) {
+            results.push($(location[i]).show());
+          }
+          return results;
         }
-        return results;
-      }
 
-      $('.hidden-shortcut').show();
-      return $('.js-more-help-button').remove();
-    });
+        $('.hidden-shortcut').show();
+        return $('.js-more-help-button').remove();
+      });
   }
 
   focusFilter(e) {

app/assets/javascripts/behaviors/toggler_behavior.js

@@ -18,9 +18,7 @@ $(() => {
       .toggleClass('fa-chevron-up', toggleState)
       .toggleClass('fa-chevron-down', toggleState !== undefined ? !toggleState : undefined);
 
-    $container
-      .find('.js-toggle-content')
-      .toggle(toggleState);
+    $container.find('.js-toggle-content').toggle(toggleState);
   }
 
   $('body').on('click', '.js-toggle-button', function toggleButton(e) {

app/assets/javascripts/blob/3d_viewer/index.js

@@ -18,12 +18,7 @@ export default class Renderer {
     this.loader = new STLLoader();
 
     this.fov = 45;
-    this.camera = new THREE.PerspectiveCamera(
-      this.fov,
-      this.width / this.height,
-      1,
-      1000,
-    );
+    this.camera = new THREE.PerspectiveCamera(this.fov, this.width / this.height, 1, 1000);
 
     this.scene = new THREE.Scene();
 
@@ -35,10 +30,7 @@ export default class Renderer {
     this.setupLight();
 
     // Set up OrbitControls
-    this.controls = new OrbitControls(
-      this.camera,
-      this.renderer.domElement,
-    );
+    this.controls = new OrbitControls(this.camera, this.renderer.domElement);
     this.controls.minDistance = 5;
     this.controls.maxDistance = 30;
     this.controls.enableKeys = false;
@@ -51,47 +43,32 @@ export default class Renderer {
       antialias: true,
     });
 
-    this.renderer.setClearColor(0xFFFFFF);
+    this.renderer.setClearColor(0xffffff);
     this.renderer.setPixelRatio(window.devicePixelRatio);
-    this.renderer.setSize(
-      this.width,
-      this.height,
-    );
+    this.renderer.setSize(this.width, this.height);
   }
 
   setupLight() {
     // Point light illuminates the object
-    const pointLight = new THREE.PointLight(
-      0xFFFFFF,
-      2,
-      0,
-    );
+    const pointLight = new THREE.PointLight(0xffffff, 2, 0);
 
     pointLight.castShadow = true;
 
     this.camera.add(pointLight);
 
     // Ambient light illuminates the scene
-    const ambientLight = new THREE.AmbientLight(
-      0xFFFFFF,
-      1,
-    );
+    const ambientLight = new THREE.AmbientLight(0xffffff, 1);
     this.scene.add(ambientLight);
   }
 
   setupGrid() {
-    this.grid = new THREE.GridHelper(
-      20,
-      20,
-      0x000000,
-      0x000000,
-    );
+    this.grid = new THREE.GridHelper(20, 20, 0x000000, 0x000000);
 
     this.scene.add(this.grid);
   }
 
   loadFile() {
-    this.loader.load(this.container.dataset.endpoint, (geo) => {
+    this.loader.load(this.container.dataset.endpoint, geo => {
       const obj = new MeshObject(geo);
 
       this.objects.push(obj);
@@ -116,30 +93,23 @@ export default class Renderer {
   }
 
   render() {
-    this.renderer.render(
-      this.scene,
-      this.camera,
-    );
+    this.renderer.render(this.scene, this.camera);
 
     requestAnimationFrame(this.renderWrapper);
   }
 
   changeObjectMaterials(type) {
-    this.objects.forEach((obj) => {
+    this.objects.forEach(obj => {
       obj.changeMaterial(type);
     });
   }
 
   setDefaultCameraPosition() {
     const obj = this.objects[0];
-    const radius = (obj.geometry.boundingSphere.radius / 1.5);
-    const dist = radius / (Math.sin((this.fov * (Math.PI / 180)) / 2));
-
-    this.camera.position.set(
-      0,
-      dist + 1,
-      dist,
-    );
+    const radius = obj.geometry.boundingSphere.radius / 1.5;
+    const dist = radius / Math.sin((this.fov * (Math.PI / 180)) / 2);
+
+    this.camera.position.set(0, dist + 1, dist);
 
     this.camera.lookAt(this.grid);
     this.controls.update();

app/assets/javascripts/blob/3d_viewer/mesh_object.js

-import {
-  Matrix4,
-  MeshLambertMaterial,
-  Mesh,
-} from 'three/build/three.module';
+import { Matrix4, MeshLambertMaterial, Mesh } from 'three/build/three.module';
 
-const defaultColor = 0xE24329;
+const defaultColor = 0xe24329;
 const materials = {
   default: new MeshLambertMaterial({
     color: defaultColor,
@@ -17,10 +13,7 @@ const materials = {
 
 export default class MeshObject extends Mesh {
   constructor(geo) {
-    super(
-      geo,
-      materials.default,
-    );
+    super(geo, materials.default);
 
     this.geometry.computeBoundingSphere();
 
@@ -29,13 +22,7 @@ export default class MeshObject extends Mesh {
     if (this.geometry.boundingSphere.radius > 4) {
       const scale = 4 / this.geometry.boundingSphere.radius;
 
-      this.geometry.applyMatrix(
-        new Matrix4().makeScale(
-          scale,
-          scale,
-          scale,
-        ),
-      );
+      this.geometry.applyMatrix(new Matrix4().makeScale(scale, scale, scale));
       this.geometry.computeBoundingSphere();
 
       this.position.x = -this.geometry.boundingSphere.center.x;

app/assets/javascripts/blob/balsamiq/balsamiq_viewer.js

@@ -42,7 +42,7 @@ class BalsamiqViewer {
     this.initDatabase(loadEvent.target.response);
 
     const previews = this.getPreviews();
-    previews.forEach((preview) => {
+    previews.forEach(preview => {
       const renderedPreview = this.renderPreview(preview);
 
       container.appendChild(renderedPreview);

app/assets/javascripts/blob/blob_file_dropzone.js

@@ -41,39 +41,45 @@ export default class BlobFileDropzone {
       addRemoveLinks: true,
       previewsContainer: '.dropzone-previews',
       headers: csrf.headers,
-      init: function () {
-        this.on('addedfile', function () {
+      init: function() {
+        this.on('addedfile', function() {
           toggleLoading(submitButton, submitButtonLoadingIcon, false);
           dropzoneMessage.addClass(HIDDEN_CLASS);
-          $('.dropzone-alerts').html('').hide();
+          $('.dropzone-alerts')
+            .html('')
+            .hide();
         });
-        this.on('removedfile', function () {
+        this.on('removedfile', function() {
           toggleLoading(submitButton, submitButtonLoadingIcon, false);
           dropzoneMessage.removeClass(HIDDEN_CLASS);
         });
-        this.on('success', function (header, response) {
+        this.on('success', function(header, response) {
           $('#modal-upload-blob').modal('hide');
           visitUrl(response.filePath);
         });
-        this.on('maxfilesexceeded', function (file) {
+        this.on('maxfilesexceeded', function(file) {
           dropzoneMessage.addClass(HIDDEN_CLASS);
           this.removeFile(file);
         });
-        this.on('sending', function (file, xhr, formData) {
+        this.on('sending', function(file, xhr, formData) {
           formData.append('branch_name', form.find('.js-branch-name').val());
           formData.append('create_merge_request', form.find('.js-create-merge-request').val());
           formData.append('commit_message', form.find('.js-commit-message').val());
         });
       },
       // Override behavior of adding error underneath preview
-      error: function (file, errorMessage) {
-        const stripped = $('<div/>').html(errorMessage).text();
-        $('.dropzone-alerts').html(`Error uploading file: "${stripped}"`).show();
+      error: function(file, errorMessage) {
+        const stripped = $('<div/>')
+          .html(errorMessage)
+          .text();
+        $('.dropzone-alerts')
+          .html(`Error uploading file: "${stripped}"`)
+          .show();
         this.removeFile(file);
       },
     });
 
-    submitButton.on('click', (e) => {
+    submitButton.on('click', e => {
       e.preventDefault();
       e.stopPropagation();
       if (dropzone[0].dropzone.getQueuedFiles().length === 0) {

app/assets/javascripts/blob/blob_line_permalink_updater.js

@@ -2,17 +2,19 @@ import { getLocationHash } from '../lib/utils/url_utility';
 
 const lineNumberRe = /^L[0-9]+/;
 
-const updateLineNumbersOnBlobPermalinks = (linksToUpdate) => {
+const updateLineNumbersOnBlobPermalinks = linksToUpdate => {
   const hash = getLocationHash();
   if (hash && lineNumberRe.test(hash)) {
     const hashUrlString = `#${hash}`;
 
-    [].concat(Array.prototype.slice.call(linksToUpdate)).forEach((permalinkButton) => {
-      const baseHref = permalinkButton.getAttribute('data-original-href') || (() => {
-        const href = permalinkButton.getAttribute('href');
-        permalinkButton.setAttribute('data-original-href', href);
-        return href;
-      })();
+    [].concat(Array.prototype.slice.call(linksToUpdate)).forEach(permalinkButton => {
+      const baseHref =
+        permalinkButton.getAttribute('data-original-href') ||
+        (() => {
+          const href = permalinkButton.getAttribute('href');
+          permalinkButton.setAttribute('data-original-href', href);
+          return href;
+        })();
       permalinkButton.setAttribute('href', `${baseHref}${hashUrlString}`);
     });
   }
@@ -26,7 +28,7 @@ function BlobLinePermalinkUpdater(blobContentHolder, lineNumberSelector, element
     }, 0);
   };
 
-  blobContentHolder.addEventListener('click', (e) => {
+  blobContentHolder.addEventListener('click', e => {
     if (e.target.matches(lineNumberSelector)) {
       updateBlameAndBlobPermalinkCb();
     }

app/assets/javascripts/blob/file_template_selector.js

@@ -45,15 +45,11 @@ export default class FileTemplateSelector {
   }
 
   renderLoading() {
-    this.$loadingIcon
-      .addClass('fa-spinner fa-spin')
-      .removeClass('fa-chevron-down');
+    this.$loadingIcon.addClass('fa-spinner fa-spin').removeClass('fa-chevron-down');
   }
 
   renderLoaded() {
-    this.$loadingIcon
-      .addClass('fa-chevron-down')
-      .removeClass('fa-spinner fa-spin');
+    this.$loadingIcon.addClass('fa-chevron-down').removeClass('fa-spinner fa-spin');
   }
 
   reportSelection(options) {

app/assets/javascripts/blob/notebook/index.js

@@ -40,13 +40,14 @@ export default () => {
     },
     methods: {
       loadFile() {
-        axios.get(el.dataset.endpoint)
+        axios
+          .get(el.dataset.endpoint)
           .then(res => res.data)
-          .then((data) => {
+          .then(data => {
             this.json = data;
             this.loading = false;
           })
-          .catch((e) => {
+          .catch(e => {
             if (e.status !== 200) {
               this.loadError = true;
             }

app/assets/javascripts/blob/sketch/index.js

@@ -13,7 +13,7 @@ export default class SketchLoader {
     return this.getZipFile()
       .then(data => JSZip.loadAsync(data))
       .then(asyncResult => asyncResult.files['previews/preview.png'].async('uint8array'))
-      .then((content) => {
+      .then(content => {
         const url = window.URL || window.webkitURL;
         const blob = new Blob([new Uint8Array(content)], {
           type: 'image/png',

app/assets/javascripts/blob/stl_viewer.js

@@ -3,8 +3,8 @@ import Renderer from './3d_viewer';
 export default () => {
   const viewer = new Renderer(document.getElementById('js-stl-viewer'));
 
-  [].slice.call(document.querySelectorAll('.js-material-changer')).forEach((el) => {
-    el.addEventListener('click', (e) => {
+  [].slice.call(document.querySelectorAll('.js-material-changer')).forEach(el => {
+    el.addEventListener('click', e => {
       const { target } = e;
 
       e.preventDefault();

app/assets/javascripts/blob/template_selector.js

@@ -81,14 +81,10 @@ export default class TemplateSelector {
   }
 
   startLoadingSpinner() {
-    this.$dropdownIcon
-      .addClass('fa-spinner fa-spin')
-      .removeClass('fa-chevron-down');
+    this.$dropdownIcon.addClass('fa-spinner fa-spin').removeClass('fa-chevron-down');
   }
 
   stopLoadingSpinner() {
-    this.$dropdownIcon
-      .addClass('fa-chevron-down')
-      .removeClass('fa-spinner fa-spin');
+    this.$dropdownIcon.addClass('fa-chevron-down').removeClass('fa-spinner fa-spin');
   }
 }

app/assets/javascripts/blob/template_selectors/license_selector.js

@@ -22,7 +22,7 @@ export default class BlobLicenseSelector extends FileTemplateSelector {
       search: {
         fields: ['name'],
       },
-      clicked: (options) => {
+      clicked: options => {
         const { e } = options;
         const el = options.$el;
         const query = options.selectedObj;

app/assets/javascripts/blob/template_selectors/type_selector.js

@@ -21,5 +21,4 @@ export default class FileTemplateTypeSelector extends FileTemplateSelector {
       text: item => item.name,
     });
   }
-
 }

app/assets/javascripts/blob/viewer/index.js

@@ -22,9 +22,8 @@ export default class BlobViewer {
     const viewer = document.querySelector('.blob-viewer[data-type="rich"]');
     if (!viewer || !viewer.dataset.richType) return;
 
-    const initViewer = promise => promise
-      .then(module => module.default(viewer))
-      .catch((error) => {
+    const initViewer = promise =>
+      promise.then(module => module.default(viewer)).catch(error => {
         Flash('Error loading file viewer.');
         throw error;
       });
@@ -79,10 +78,9 @@ export default class BlobViewer {
 
   initBindings() {
     if (this.switcherBtns.length) {
-      Array.from(this.switcherBtns)
-        .forEach((el) => {
-          el.addEventListener('click', this.switchViewHandler.bind(this));
-        });
+      Array.from(this.switcherBtns).forEach(el => {
+        el.addEventListener('click', this.switchViewHandler.bind(this));
+      });
     }
 
     if (this.copySourceBtn) {
@@ -109,7 +107,10 @@ export default class BlobViewer {
       this.copySourceBtn.setAttribute('title', 'Copy source to clipboard');
       this.copySourceBtn.classList.remove('disabled');
     } else if (this.activeViewer === this.simpleViewer) {
-      this.copySourceBtn.setAttribute('title', 'Wait for the source to load to copy it to the clipboard');
+      this.copySourceBtn.setAttribute(
+        'title',
+        'Wait for the source to load to copy it to the clipboard',
+      );
       this.copySourceBtn.classList.add('disabled');
     } else {
       this.copySourceBtn.setAttribute('title', 'Switch to the source to copy it to the clipboard');
@@ -147,15 +148,15 @@ export default class BlobViewer {
     this.toggleCopyButtonState();
 
     BlobViewer.loadViewer(newViewer)
-    .then((viewer) => {
-      $(viewer).renderGFM();
+      .then(viewer => {
+        $(viewer).renderGFM();
 
-      this.$fileHolder.trigger('highlight:line');
-      handleLocationHash();
+        this.$fileHolder.trigger('highlight:line');
+        handleLocationHash();
 
-      this.toggleCopyButtonState();
-    })
-    .catch(() => new Flash('Error loading viewer'));
+        this.toggleCopyButtonState();
+      })
+      .catch(() => new Flash('Error loading viewer'));
   }
 
   static loadViewer(viewerParam) {
@@ -168,12 +169,11 @@ export default class BlobViewer {
 
     viewer.setAttribute('data-loading', 'true');
 
-    return axios.get(url)
-      .then(({ data }) => {
-        viewer.innerHTML = data.html;
-        viewer.setAttribute('data-loaded', 'true');
+    return axios.get(url).then(({ data }) => {
+      viewer.innerHTML = data.html;
+      viewer.setAttribute('data-loaded', 'true');
 
-        return viewer;
-      });
+      return viewer;
+    });
   }
 }

app/assets/javascripts/cycle_analytics/components/banner.vue

 <script>
-  import Icon from '~/vue_shared/components/icon.vue';
-  import iconCycleAnalyticsSplash from 'icons/_icon_cycle_analytics_splash.svg';
+import Icon from '~/vue_shared/components/icon.vue';
+import iconCycleAnalyticsSplash from 'icons/_icon_cycle_analytics_splash.svg';
 
-  export default {
-    components: {
-      Icon,
+export default {
+  components: {
+    Icon,
+  },
+  props: {
+    documentationLink: {
+      type: String,
+      required: true,
     },
-    props: {
-      documentationLink: {
-        type: String,
-        required: true,
-      },
+  },
+  computed: {
+    iconCycleAnalyticsSplash() {
+      return iconCycleAnalyticsSplash;
     },
-    computed: {
-      iconCycleAnalyticsSplash() {
-        return iconCycleAnalyticsSplash;
-      },
+  },
+  methods: {
+    dismissOverviewDialog() {
+      this.$emit('dismiss-overview-dialog');
     },
-    methods: {
-      dismissOverviewDialog() {
-        this.$emit('dismiss-overview-dialog');
-      },
-    },
-  };
+  },
+};
 </script>
 <template>
   <div class="landing content-block">

app/assets/javascripts/cycle_analytics/components/limit_warning_component.vue

 <script>
-  import tooltip from '../../vue_shared/directives/tooltip';
+import tooltip from '../../vue_shared/directives/tooltip';
 
-  export default {
-    directives: {
-      tooltip,
+export default {
+  directives: {
+    tooltip,
+  },
+  props: {
+    count: {
+      type: Number,
+      required: true,
     },
-    props: {
-      count: {
-        type: Number,
-        required: true,
-      },
-    },
-  };
+  },
+};
 </script>
 <template>
   <span

app/assets/javascripts/cycle_analytics/components/stage_code_component.vue

 <script>
-  import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
-  import limitWarning from './limit_warning_component.vue';
-  import totalTime from './total_time_component.vue';
+import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
+import limitWarning from './limit_warning_component.vue';
+import totalTime from './total_time_component.vue';
 
-  export default {
-    components: {
-      userAvatarImage,
-      limitWarning,
-      totalTime,
+export default {
+  components: {
+    userAvatarImage,
+    limitWarning,
+    totalTime,
+  },
+  props: {
+    items: {
+      type: Array,
+      default: () => [],
     },
-    props: {
-      items: {
-        type: Array,
-        default: () => [],
-      },
-      stage: {
-        type: Object,
-        default: () => ({}),
-      },
+    stage: {
+      type: Object,
+      default: () => ({}),
     },
-  };
+  },
+};
 </script>
 <template>
   <div>

app/assets/javascripts/cycle_analytics/components/stage_component.vue

 <script>
-  import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
-  import limitWarning from './limit_warning_component.vue';
-  import totalTime from './total_time_component.vue';
+import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
+import limitWarning from './limit_warning_component.vue';
+import totalTime from './total_time_component.vue';
 
-  export default {
-    components: {
-      userAvatarImage,
-      limitWarning,
-      totalTime,
+export default {
+  components: {
+    userAvatarImage,
+    limitWarning,
+    totalTime,
+  },
+  props: {
+    items: {
+      type: Array,
+      default: () => [],
     },
-    props: {
-      items: {
-        type: Array,
-        default: () => [],
-      },
-      stage: {
-        type: Object,
-        default: () => ({}),
-      },
+    stage: {
+      type: Object,
+      default: () => ({}),
     },
-  };
+  },
+};
 </script>
 <template>
   <div>
@@ -73,4 +73,3 @@
     </ul>
   </div>
 </template>
-

app/assets/javascripts/cycle_analytics/components/stage_plan_component.vue

 <script>
-  import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
-  import iconCommit from '../svg/icon_commit.svg';
-  import limitWarning from './limit_warning_component.vue';
-  import totalTime from './total_time_component.vue';
+import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
+import iconCommit from '../svg/icon_commit.svg';
+import limitWarning from './limit_warning_component.vue';
+import totalTime from './total_time_component.vue';
 
-  export default {
-    components: {
-      userAvatarImage,
-      totalTime,
-      limitWarning,
+export default {
+  components: {
+    userAvatarImage,
+    totalTime,
+    limitWarning,
+  },
+  props: {
+    items: {
+      type: Array,
+      default: () => [],
     },
-    props: {
-      items: {
-        type: Array,
-        default: () => [],
-      },
-      stage: {
-        type: Object,
-        default: () => ({}),
-      },
+    stage: {
+      type: Object,
+      default: () => ({}),
     },
-    computed: {
-      iconCommit() {
-        return iconCommit;
-      },
+  },
+  computed: {
+    iconCommit() {
+      return iconCommit;
     },
-  };
+  },
+};
 </script>
 <template>
   <div>
@@ -74,4 +74,3 @@
     </ul>
   </div>
 </template>
-

app/assets/javascripts/cycle_analytics/components/stage_review_component.vue

 <script>
-  import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
-  import limitWarning from './limit_warning_component.vue';
-  import totalTime from './total_time_component.vue';
-  import icon from '../../vue_shared/components/icon.vue';
+import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
+import limitWarning from './limit_warning_component.vue';
+import totalTime from './total_time_component.vue';
+import icon from '../../vue_shared/components/icon.vue';
 
-  export default {
-    components: {
-      userAvatarImage,
-      totalTime,
-      limitWarning,
-      icon,
+export default {
+  components: {
+    userAvatarImage,
+    totalTime,
+    limitWarning,
+    icon,
+  },
+  props: {
+    items: {
+      type: Array,
+      default: () => [],
     },
-    props: {
-      items: {
-        type: Array,
-        default: () => [],
-      },
-      stage: {
-        type: Object,
-        default: () => ({}),
-      },
+    stage: {
+      type: Object,
+      default: () => ({}),
     },
-  };
+  },
+};
 </script>
 <template>
   <div>

app/assets/javascripts/cycle_analytics/components/stage_staging_component.vue

 <script>
-  import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
-  import iconBranch from '../svg/icon_branch.svg';
-  import limitWarning from './limit_warning_component.vue';
-  import totalTime from './total_time_component.vue';
-  import icon from '../../vue_shared/components/icon.vue';
+import userAvatarImage from '../../vue_shared/components/user_avatar/user_avatar_image.vue';
+import iconBranch from '../svg/icon_branch.svg';
+import limitWarning from './limit_warning_component.vue';
+import totalTime from './total_time_component.vue';
+import icon from '../../vue_shared/components/icon.vue';
 
-  export default {
-    components: {
-      userAvatarImage,
-      totalTime,
-      limitWarning,
-      icon,
+export default {
+  components: {
+    userAvatarImage,
+    totalTime,
+    limitWarning,
+    icon,
+  },
+  props: {
+    items: {
+      type: Array,
+      default: () => [],
     },
-    props: {
-      items: {
-        type: Array,
-        default: () => [],
-      },
-      stage: {
-        type: Object,
-        default: () => ({}),
-      },
+    stage: {
+      type: Object,
+      default: () => ({}),
     },
-    computed: {
-      iconBranch() {
-        return iconBranch;
-      },
+  },
+  computed: {
+    iconBranch() {
+      return iconBranch;
     },
-  };
+  },
+};
 </script>
 <template>
   <div>

app/assets/javascripts/cycle_analytics/components/stage_test_component.vue

 <script>
-  import iconBuildStatus from '../svg/icon_build_status.svg';
-  import iconBranch from '../svg/icon_branch.svg';
-  import limitWarning from './limit_warning_component.vue';
-  import totalTime from './total_time_component.vue';
-  import icon from '../../vue_shared/components/icon.vue';
+import iconBuildStatus from '../svg/icon_build_status.svg';
+import iconBranch from '../svg/icon_branch.svg';
+import limitWarning from './limit_warning_component.vue';
+import totalTime from './total_time_component.vue';
+import icon from '../../vue_shared/components/icon.vue';
 
-  export default {
-    components: {
-      totalTime,
-      limitWarning,
-      icon,
+export default {
+  components: {
+    totalTime,
+    limitWarning,
+    icon,
+  },
+  props: {
+    items: {
+      type: Array,
+      default: () => [],
     },
-    props: {
-      items: {
-        type: Array,
-        default: () => [],
-      },
-      stage: {
-        type: Object,
-        default: () => ({}),
-      },
+    stage: {
+      type: Object,
+      default: () => ({}),
     },
-    computed: {
-      iconBuildStatus() {
-        return iconBuildStatus;
-      },
-      iconBranch() {
-        return iconBranch;
-      },
+  },
+  computed: {
+    iconBuildStatus() {
+      return iconBuildStatus;
     },
-  };
+    iconBranch() {
+      return iconBranch;
+    },
+  },
+};
 </script>
 <template>
   <div>

app/assets/javascripts/cycle_analytics/components/total_time_component.vue

 <script>
-  export default {
-    props: {
-      time: {
-        type: Object,
-        required: false,
-        default: () => ({}),
-      },
+export default {
+  props: {
+    time: {
+      type: Object,
+      required: false,
+      default: () => ({}),
     },
-    computed: {
-      hasData() {
-        return Object.keys(this.time).length;
-      },
+  },
+  computed: {
+    hasData() {
+      return Object.keys(this.time).length;
     },
-  };
+  },
+};
 </script>
 <template>
   <span class="total-time">

app/assets/javascripts/cycle_analytics/cycle_analytics_bundle.js

@@ -18,7 +18,8 @@ Vue.use(Translate);
 export default () => {
   const OVERVIEW_DIALOG_COOKIE = 'cycle_analytics_help_dismissed';
 
-  new Vue({ // eslint-disable-line no-new
+  // eslint-disable-next-line no-new
+  new Vue({
     el: '#cycle-analytics',
     name: 'CycleAnalytics',
     components: {
@@ -66,14 +67,17 @@ export default () => {
         const $dropdown = $('.js-ca-dropdown');
         const $label = $dropdown.find('.dropdown-label');
 
-        $dropdown.find('li a').off('click').on('click', (e) => {
-          e.preventDefault();
-          const $target = $(e.currentTarget);
-          this.startDate = $target.data('value');
+        $dropdown
+          .find('li a')
+          .off('click')
+          .on('click', e => {
+            e.preventDefault();
+            const $target = $(e.currentTarget);
+            this.startDate = $target.data('value');
 
-          $label.text($target.text().trim());
-          this.fetchCycleAnalyticsData({ startDate: this.startDate });
-        });
+            $label.text($target.text().trim());
+            this.fetchCycleAnalyticsData({ startDate: this.startDate });
+          });
       },
       fetchCycleAnalyticsData(options) {
         const fetchOptions = options || { startDate: this.startDate };
@@ -82,7 +86,7 @@ export default () => {
 
         this.service
           .fetchCycleAnalyticsData(fetchOptions)
-          .then((response) => {
+          .then(response => {
             this.store.setCycleAnalyticsData(response);
             this.selectDefaultStage();
             this.initDropdown();
@@ -115,7 +119,7 @@ export default () => {
             stage,
             startDate: this.startDate,
           })
-          .then((response) => {
+          .then(response => {
             this.isEmptyStage = !response.events.length;
             this.store.setStageEvents(response.events, stage);
             this.isLoadingStage = false;

app/assets/javascripts/cycle_analytics/cycle_analytics_service.js

@@ -18,10 +18,7 @@ export default class CycleAnalyticsService {
   }
 
   fetchStageData(options) {
-    const {
-      stage,
-      startDate,
-    } = options;
+    const { stage, startDate } = options;
 
     return this.axios
       .get(`events/${stage.name}.json`, {

app/assets/javascripts/cycle_analytics/cycle_analytics_store.js

@@ -5,13 +5,27 @@ import { dasherize } from '../lib/utils/text_utility';
 import DEFAULT_EVENT_OBJECTS from './default_event_objects';
 
 const EMPTY_STAGE_TEXTS = {
-  issue: __('The issue stage shows the time it takes from creating an issue to assigning the issue to a milestone, or add the issue to a list on your Issue Board. Begin creating issues to see data for this stage.'),
-  plan: __('The planning stage shows the time from the previous step to pushing your first commit. This time will be added automatically once you push your first commit.'),
-  code: __('The coding stage shows the time from the first commit to creating the merge request. The data will automatically be added here once you create your first merge request.'),
-  test: __('The testing stage shows the time GitLab CI takes to run every pipeline for the related merge request. The data will automatically be added after your first pipeline finishes running.'),
-  review: __('The review stage shows the time from creating the merge request to merging it. The data will automatically be added after you merge your first merge request.'),
-  staging: __('The staging stage shows the time between merging the MR and deploying code to the production environment. The data will be automatically added once you deploy to production for the first time.'),
-  production: __('The production stage shows the total time it takes between creating an issue and deploying the code to production. The data will be automatically added once you have completed the full idea to production cycle.'),
+  issue: __(
+    'The issue stage shows the time it takes from creating an issue to assigning the issue to a milestone, or add the issue to a list on your Issue Board. Begin creating issues to see data for this stage.',
+  ),
+  plan: __(
+    'The planning stage shows the time from the previous step to pushing your first commit. This time will be added automatically once you push your first commit.',
+  ),
+  code: __(
+    'The coding stage shows the time from the first commit to creating the merge request. The data will automatically be added here once you create your first merge request.',
+  ),
+  test: __(
+    'The testing stage shows the time GitLab CI takes to run every pipeline for the related merge request. The data will automatically be added after your first pipeline finishes running.',
+  ),
+  review: __(
+    'The review stage shows the time from creating the merge request to merging it. The data will automatically be added after you merge your first merge request.',
+  ),
+  staging: __(
+    'The staging stage shows the time between merging the MR and deploying code to the production environment. The data will be automatically added once you deploy to production for the first time.',
+  ),
+  production: __(
+    'The production stage shows the total time it takes between creating an issue and deploying the code to production. The data will be automatically added once you have completed the full idea to production cycle.',
+  ),
 };
 
 export default {
@@ -31,11 +45,11 @@ export default {
     newData.stages = data.stats || [];
     newData.summary = data.summary || [];
 
-    newData.summary.forEach((item) => {
+    newData.summary.forEach(item => {
       item.value = item.value || '-';
     });
 
-    newData.stages.forEach((item) => {
+    newData.stages.forEach(item => {
       const stageSlug = dasherize(item.name.toLowerCase());
       item.active = false;
       item.isUserAllowed = data.permissions[stageSlug];
@@ -53,7 +67,7 @@ export default {
     this.state.hasError = state;
   },
   deactivateAllStages() {
-    this.state.stages.forEach((stage) => {
+    this.state.stages.forEach(stage => {
       stage.active = false;
     });
   },
@@ -67,7 +81,7 @@ export default {
   decorateEvents(events, stage) {
     const newEvents = [];
 
-    events.forEach((item) => {
+    events.forEach(item => {
       if (!item) return;
 
       const eventItem = Object.assign({}, DEFAULT_EVENT_OBJECTS[stage.slug], item);

app/assets/javascripts/diff_notes/components/comment_resolve_btn.js

@@ -18,52 +18,56 @@ const CommentAndResolveBtn = Vue.extend({
     };
   },
   computed: {
-    showButton: function () {
+    showButton: function() {
       if (this.discussion) {
         return this.discussion.isResolvable();
       } else {
         return false;
       }
     },
-    isDiscussionResolved: function () {
+    isDiscussionResolved: function() {
       return this.discussion.isResolved();
     },
-    buttonText: function () {
+    buttonText: function() {
       if (this.isDiscussionResolved) {
         if (this.textareaIsEmpty) {
-          return "Unresolve discussion";
+          return 'Unresolve discussion';
         } else {
-          return "Comment & unresolve discussion";
+          return 'Comment & unresolve discussion';
         }
       } else {
         if (this.textareaIsEmpty) {
-          return "Resolve discussion";
+          return 'Resolve discussion';
         } else {
-          return "Comment & resolve discussion";
+          return 'Comment & resolve discussion';
         }
       }
-    }
+    },
   },
   created() {
     if (this.discussionId) {
       this.discussion = CommentsStore.state[this.discussionId];
     }
   },
-  mounted: function () {
+  mounted: function() {
     if (!this.discussionId) return;
 
-    const $textarea = $(`.js-discussion-note-form[data-discussion-id=${this.discussionId}] .note-textarea`);
+    const $textarea = $(
+      `.js-discussion-note-form[data-discussion-id=${this.discussionId}] .note-textarea`,
+    );
     this.textareaIsEmpty = $textarea.val() === '';
 
     $textarea.on('input.comment-and-resolve-btn', () => {
       this.textareaIsEmpty = $textarea.val() === '';
     });
   },
-  destroyed: function () {
+  destroyed: function() {
     if (!this.discussionId) return;
 
-    $(`.js-discussion-note-form[data-discussion-id=${this.discussionId}] .note-textarea`).off('input.comment-and-resolve-btn');
-  }
+    $(`.js-discussion-note-form[data-discussion-id=${this.discussionId}] .note-textarea`).off(
+      'input.comment-and-resolve-btn',
+    );
+  },
 });
 
 Vue.component('comment-and-resolve-btn', CommentAndResolveBtn);

app/assets/javascripts/diff_notes/components/diff_note_avatars.js

@@ -83,7 +83,11 @@ const DiffNoteAvatars = Vue.extend({
       this.addNoCommentClass();
       this.setDiscussionVisible();
 
-      this.lineType = $(this.$el).closest('.diff-line-num').hasClass('old_line') ? 'old' : 'new';
+      this.lineType = $(this.$el)
+        .closest('.diff-line-num')
+        .hasClass('old_line')
+        ? 'old'
+        : 'new';
     });
 
     $(document).on('toggle.comments', () => {
@@ -113,20 +117,30 @@ const DiffNoteAvatars = Vue.extend({
     addNoCommentClass() {
       const { notesCount } = this;
 
-      $(this.$el).closest('.js-avatar-container')
+      $(this.$el)
+        .closest('.js-avatar-container')
         .toggleClass('no-comment-btn', notesCount > 0)
         .nextUntil('.js-avatar-container')
         .toggleClass('no-comment-btn', notesCount > 0);
     },
     toggleDiscussionsToggleState() {
-      const $notesHolders = $(this.$el).closest('.code').find('.notes_holder');
+      const $notesHolders = $(this.$el)
+        .closest('.code')
+        .find('.notes_holder');
       const $visibleNotesHolders = $notesHolders.filter(':visible');
-      const $toggleDiffCommentsBtn = $(this.$el).closest('.diff-file').find('.js-toggle-diff-comments');
-
-      $toggleDiffCommentsBtn.toggleClass('active', $notesHolders.length === $visibleNotesHolders.length);
+      const $toggleDiffCommentsBtn = $(this.$el)
+        .closest('.diff-file')
+        .find('.js-toggle-diff-comments');
+
+      $toggleDiffCommentsBtn.toggleClass(
+        'active',
+        $notesHolders.length === $visibleNotesHolders.length,
+      );
     },
     setDiscussionVisible() {
-      this.isVisible = $(`.diffs .notes[data-discussion-id="${this.discussion.id}"]`).is(':visible');
+      this.isVisible = $(`.diffs .notes[data-discussion-id="${this.discussion.id}"]`).is(
+        ':visible',
+      );
     },
     getTooltipText(note) {
       return `${note.authorName}: ${note.noteTruncated}`;

app/assets/javascripts/diff_notes/components/jump_to_discussion.js

@@ -14,24 +14,24 @@ const JumpToDiscussion = Vue.extend({
       required: true,
     },
   },
-  data: function () {
+  data: function() {
     return {
       discussions: CommentsStore.state,
       discussion: {},
     };
   },
   computed: {
-    buttonText: function () {
+    buttonText: function() {
       if (this.discussionId) {
         return 'Jump to next unresolved discussion';
       } else {
         return 'Jump to first unresolved discussion';
       }
     },
-    allResolved: function () {
+    allResolved: function() {
       return this.unresolvedDiscussionCount === 0;
     },
-    showButton: function () {
+    showButton: function() {
       if (this.discussionId) {
         if (this.unresolvedDiscussionCount > 1) {
           return true;
@@ -42,7 +42,7 @@ const JumpToDiscussion = Vue.extend({
         return this.unresolvedDiscussionCount >= 1;
       }
     },
-    lastResolvedId: function () {
+    lastResolvedId: function() {
       let lastId;
       for (const discussionId in this.discussions) {
         const discussion = this.discussions[discussionId];
@@ -52,13 +52,13 @@ const JumpToDiscussion = Vue.extend({
         }
       }
       return lastId;
-    }
+    },
   },
   created() {
     this.discussion = this.discussions[this.discussionId];
   },
   methods: {
-    jumpToNextUnresolvedDiscussion: function () {
+    jumpToNextUnresolvedDiscussion: function() {
       let discussionsSelector;
       let discussionIdsInScope;
       let firstUnresolvedDiscussionId;
@@ -68,9 +68,11 @@ const JumpToDiscussion = Vue.extend({
       let jumpToFirstDiscussion = !this.discussionId;
 
       const discussionIdsForElements = function(elements) {
-        return elements.map(function() {
-          return $(this).attr('data-discussion-id');
-        }).toArray();
+        return elements
+          .map(function() {
+            return $(this).attr('data-discussion-id');
+          })
+          .toArray();
       };
 
       const { discussions } = this;
@@ -144,8 +146,7 @@ const JumpToDiscussion = Vue.extend({
             if (!discussion.isResolved()) {
               nextUnresolvedDiscussionId = discussionId;
               break;
-            }
-            else {
+            } else {
               continue;
             }
           }
@@ -175,9 +176,9 @@ const JumpToDiscussion = Vue.extend({
         // Resolved discussions are hidden in the diffs tab by default.
         // If they are marked unresolved on the notes tab, they will still be hidden on the diffs tab.
         // When jumping between unresolved discussions on the diffs tab, we show them.
-        $target.closest(".content").show();
+        $target.closest('.content').show();
 
-        const $notesHolder = $target.closest("tr.notes_holder");
+        const $notesHolder = $target.closest('tr.notes_holder');
 
         // Image diff discussions does not use notes_holder
         // so we should keep original $target value in those cases
@@ -194,7 +195,7 @@ const JumpToDiscussion = Vue.extend({
           prevEl = $target.prev();
 
           // If the discussion doesn't have 4 lines above it, we'll have to do with fewer.
-          if (!prevEl.hasClass("line_holder")) {
+          if (!prevEl.hasClass('line_holder')) {
             break;
           }
 
@@ -203,9 +204,9 @@ const JumpToDiscussion = Vue.extend({
       }
 
       $.scrollTo($target, {
-        offset: -150
+        offset: -150,
       });
-    }
+    },
   },
 });
 

app/assets/javascripts/diff_notes/components/resolve_count.js

@@ -13,17 +13,17 @@ window.ResolveCount = Vue.extend({
       required: true,
     },
   },
-  data: function () {
+  data: function() {
     return {
-      discussions: CommentsStore.state
+      discussions: CommentsStore.state,
     };
   },
   computed: {
-    allResolved: function () {
+    allResolved: function() {
       return this.resolvedDiscussionCount === this.discussionCount;
     },
     resolvedCountText() {
       return this.discussionCount === 1 ? 'discussion' : 'discussions';
-    }
-  }
+    },
+  },
 });

app/assets/javascripts/diff_notes/mixins/discussion.js

@@ -2,10 +2,10 @@
 
 const DiscussionMixins = {
   computed: {
-    discussionCount: function () {
+    discussionCount: function() {
       return Object.keys(this.discussions).length;
     },
-    resolvedDiscussionCount: function () {
+    resolvedDiscussionCount: function() {
       let resolvedCount = 0;
 
       for (const discussionId in this.discussions) {
@@ -18,7 +18,7 @@ const DiscussionMixins = {
 
       return resolvedCount;
     },
-    unresolvedDiscussionCount: function () {
+    unresolvedDiscussionCount: function() {
       let unresolvedCount = 0;
 
       for (const discussionId in this.discussions) {
@@ -30,8 +30,8 @@ const DiscussionMixins = {
       }
 
       return unresolvedCount;
-    }
-  }
+    },
+  },
 };
 
 export default DiscussionMixins;

app/assets/javascripts/diff_notes/models/discussion.js

@@ -6,22 +6,22 @@ import Vue from 'vue';
 import { localTimeAgo } from '../../lib/utils/datetime_utility';
 
 class DiscussionModel {
-  constructor (discussionId) {
+  constructor(discussionId) {
     this.id = discussionId;
     this.notes = {};
     this.loading = false;
     this.canResolve = false;
   }
 
-  createNote (noteObj) {
+  createNote(noteObj) {
     Vue.set(this.notes, noteObj.noteId, new NoteModel(this.id, noteObj));
   }
 
-  deleteNote (noteId) {
+  deleteNote(noteId) {
     Vue.delete(this.notes, noteId);
   }
 
-  getNote (noteId) {
+  getNote(noteId) {
     return this.notes[noteId];
   }
 
@@ -29,7 +29,7 @@ class DiscussionModel {
     return Object.keys(this.notes).length;
   }
 
-  isResolved () {
+  isResolved() {
     for (const noteId in this.notes) {
       const note = this.notes[noteId];
 
@@ -40,7 +40,7 @@ class DiscussionModel {
     return true;
   }
 
-  resolveAllNotes (resolved_by) {
+  resolveAllNotes(resolved_by) {
     for (const noteId in this.notes) {
       const note = this.notes[noteId];
 
@@ -51,7 +51,7 @@ class DiscussionModel {
     }
   }
 
-  unResolveAllNotes () {
+  unResolveAllNotes() {
     for (const noteId in this.notes) {
       const note = this.notes[noteId];
 
@@ -62,7 +62,7 @@ class DiscussionModel {
     }
   }
 
-  updateHeadline (data) {
+  updateHeadline(data) {
     const discussionSelector = `.discussion[data-discussion-id="${this.id}"]`;
     const $discussionHeadline = $(`${discussionSelector} .js-discussion-headline`);
 
@@ -79,7 +79,7 @@ class DiscussionModel {
     }
   }
 
-  isResolvable () {
+  isResolvable() {
     if (!this.canResolve) {
       return false;
     }

app/assets/javascripts/diff_notes/stores/comments.js

@@ -5,10 +5,10 @@ import Vue from 'vue';
 
 window.CommentsStore = {
   state: {},
-  get: function (discussionId, noteId) {
+  get: function(discussionId, noteId) {
     return this.state[discussionId].getNote(noteId);
   },
-  createDiscussion: function (discussionId, canResolve) {
+  createDiscussion: function(discussionId, canResolve) {
     let discussion = this.state[discussionId];
     if (!this.state[discussionId]) {
       discussion = new DiscussionModel(discussionId);
@@ -21,18 +21,18 @@ window.CommentsStore = {
 
     return discussion;
   },
-  create: function (noteObj) {
+  create: function(noteObj) {
     const discussion = this.createDiscussion(noteObj.discussionId);
 
     discussion.createNote(noteObj);
   },
-  update: function (discussionId, noteId, resolved, resolved_by) {
+  update: function(discussionId, noteId, resolved, resolved_by) {
     const discussion = this.state[discussionId];
     const note = discussion.getNote(noteId);
     note.resolved = resolved;
     note.resolved_by = resolved_by;
   },
-  delete: function (discussionId, noteId) {
+  delete: function(discussionId, noteId) {
     const discussion = this.state[discussionId];
     discussion.deleteNote(noteId);
 
@@ -40,7 +40,7 @@ window.CommentsStore = {
       Vue.delete(this.state, discussionId);
     }
   },
-  unresolvedDiscussionIds: function () {
+  unresolvedDiscussionIds: function() {
     const ids = [];
 
     for (const discussionId in this.state) {
@@ -52,5 +52,5 @@ window.CommentsStore = {
     }
 
     return ids;
-  }
+  },
 };

app/assets/javascripts/diffs/components/commit_item.vue

@@ -43,7 +43,9 @@ export default {
       return (this.commit.author && this.commit.author.name) || this.commit.authorName;
     },
     authorUrl() {
-      return (this.commit.author && this.commit.author.webUrl) || `mailto:${this.commit.authorEmail}`;
+      return (
+        (this.commit.author && this.commit.author.webUrl) || `mailto:${this.commit.authorEmail}`
+      );
     },
     authorAvatar() {
       return (this.commit.author && this.commit.author.avatarUrl) || this.commit.authorGravatarUrl;

app/assets/javascripts/diffs/components/diff_file.vue

@@ -46,10 +46,10 @@ export default {
     showExpandMessage() {
       return (
         this.isCollapsed ||
-        !this.file.highlightedDiffLines &&
-        !this.isLoadingCollapsedDiff &&
-        !this.file.tooLarge &&
-        this.file.text
+        (!this.file.highlightedDiffLines &&
+          !this.isLoadingCollapsedDiff &&
+          !this.file.tooLarge &&
+          this.file.text)
       );
     },
     showLoadingIcon() {

app/assets/javascripts/droplab/constants.js

@@ -6,11 +6,4 @@ const IGNORE_CLASS = 'droplab-item-ignore';
 // Matches `{{anything}}` and `{{ everything }}`.
 const TEMPLATE_REGEX = /\{\{(.+?)\}\}/g;
 
-export {
-  DATA_TRIGGER,
-  DATA_DROPDOWN,
-  SELECTED_CLASS,
-  ACTIVE_CLASS,
-  TEMPLATE_REGEX,
-  IGNORE_CLASS,
-};
+export { DATA_TRIGGER, DATA_DROPDOWN, SELECTED_CLASS, ACTIVE_CLASS, TEMPLATE_REGEX, IGNORE_CLASS };

app/assets/javascripts/droplab/drop_down.js

@@ -2,7 +2,7 @@ import utils from './utils';
 import { SELECTED_CLASS, IGNORE_CLASS } from './constants';
 
 class DropDown {
-  constructor(list, config = { }) {
+  constructor(list, config = {}) {
     this.currentIndex = 0;
     this.hidden = true;
     this.list = typeof list === 'string' ? document.querySelector(list) : list;
@@ -157,7 +157,7 @@ class DropDown {
   static setImagesSrc(template) {
     const images = [...template.querySelectorAll('img[data-src]')];
 
-    images.forEach((image) => {
+    images.forEach(image => {
       const img = image;
 
       img.src = img.getAttribute('data-src');

app/assets/javascripts/droplab/drop_lab.js

@@ -51,7 +51,7 @@ class DropLab {
   }
 
   processData(trigger, data, methodName) {
-    this.hooks.forEach((hook) => {
+    this.hooks.forEach(hook => {
       if (Array.isArray(trigger)) hook.list[methodName](trigger);
 
       if (hook.trigger.id === trigger) hook.list[methodName](data);
@@ -78,7 +78,8 @@ class DropLab {
   }
 
   changeHookList(trigger, list, plugins, config) {
-    const availableTrigger = typeof trigger === 'string' ? document.getElementById(trigger) : trigger;
+    const availableTrigger =
+      typeof trigger === 'string' ? document.getElementById(trigger) : trigger;
 
     this.hooks.forEach((hook, i) => {
       const aHook = hook;

app/assets/javascripts/droplab/keyboard.js

@@ -2,15 +2,18 @@
 
 import { ACTIVE_CLASS } from './constants';
 
-const Keyboard = function () {
+const Keyboard = function() {
   var currentKey;
   var currentFocus;
   var isUpArrow = false;
   var isDownArrow = false;
   var removeHighlight = function removeHighlight(list) {
-    var itemElements = Array.prototype.slice.call(list.list.querySelectorAll('li:not(.divider):not(.hidden)'), 0);
+    var itemElements = Array.prototype.slice.call(
+      list.list.querySelectorAll('li:not(.divider):not(.hidden)'),
+      0,
+    );
     var listItems = [];
-    for(var i = 0; i < itemElements.length; i++) {
+    for (var i = 0; i < itemElements.length; i++) {
       var listItem = itemElements[i];
       listItem.classList.remove(ACTIVE_CLASS);
 
@@ -23,13 +26,13 @@ const Keyboard = function () {
 
   var setMenuForArrows = function setMenuForArrows(list) {
     var listItems = removeHighlight(list);
-    if(list.currentIndex>0){
-      if(!listItems[list.currentIndex-1]){
-        list.currentIndex = list.currentIndex-1;
+    if (list.currentIndex > 0) {
+      if (!listItems[list.currentIndex - 1]) {
+        list.currentIndex = list.currentIndex - 1;
       }
 
-      if (listItems[list.currentIndex-1]) {
-        var el = listItems[list.currentIndex-1];
+      if (listItems[list.currentIndex - 1]) {
+        var el = listItems[list.currentIndex - 1];
         var filterDropdownEl = el.closest('.filter-dropdown');
         el.classList.add(ACTIVE_CLASS);
 
@@ -55,7 +58,7 @@ const Keyboard = function () {
   };
   var selectItem = function selectItem(list) {
     var listItems = removeHighlight(list);
-    var currentItem = listItems[list.currentIndex-1];
+    var currentItem = listItems[list.currentIndex - 1];
     var listEvent = new CustomEvent('click.dl', {
       detail: {
         list: list,
@@ -65,43 +68,49 @@ const Keyboard = function () {
     });
     list.list.dispatchEvent(listEvent);
     list.hide();
-  }
+  };
 
-  var keydown = function keydown(e){
+  var keydown = function keydown(e) {
     var typedOn = e.target;
     var list = e.detail.hook.list;
     var currentIndex = list.currentIndex;
     isUpArrow = false;
     isDownArrow = false;
 
-    if(e.detail.which){
+    if (e.detail.which) {
       currentKey = e.detail.which;
-      if(currentKey === 13){
+      if (currentKey === 13) {
         selectItem(e.detail.hook.list);
         return;
       }
-      if(currentKey === 38) {
+      if (currentKey === 38) {
         isUpArrow = true;
       }
-      if(currentKey === 40) {
+      if (currentKey === 40) {
         isDownArrow = true;
       }
-    } else if(e.detail.key) {
+    } else if (e.detail.key) {
       currentKey = e.detail.key;
-      if(currentKey === 'Enter'){
+      if (currentKey === 'Enter') {
         selectItem(e.detail.hook.list);
         return;
       }
-      if(currentKey === 'ArrowUp') {
+      if (currentKey === 'ArrowUp') {
         isUpArrow = true;
       }
-      if(currentKey === 'ArrowDown') {
+      if (currentKey === 'ArrowDown') {
         isDownArrow = true;
       }
     }
-    if(isUpArrow){ currentIndex--; }
-    if(isDownArrow){ currentIndex++; }
-    if(currentIndex < 0){ currentIndex = 0; }
+    if (isUpArrow) {
+      currentIndex--;
+    }
+    if (isDownArrow) {
+      currentIndex++;
+    }
+    if (currentIndex < 0) {
+      currentIndex = 0;
+    }
     list.currentIndex = currentIndex;
     setMenuForArrows(e.detail.hook.list);
   };

app/assets/javascripts/droplab/plugins/ajax.js

@@ -43,12 +43,12 @@ const Ajax = {
 
     return AjaxCache.retrieve(config.endpoint)
       .then(self.preprocessing.bind(null, config))
-      .then((data) => self._loadData(data, config, self))
+      .then(data => self._loadData(data, config, self))
       .catch(config.onError);
   },
   destroy: function() {
     this.destroyed = true;
-  }
+  },
 };
 
 export default Ajax;

app/assets/javascripts/droplab/plugins/ajax_filter.js

@@ -41,8 +41,10 @@ const AjaxFilter = {
     if (config.searchValueFunction) {
       searchValue = config.searchValueFunction();
     }
-    if (config.loadingTemplate && this.hook.list.data === undefined ||
-      this.hook.list.data.length === 0) {
+    if (
+      (config.loadingTemplate && this.hook.list.data === undefined) ||
+      this.hook.list.data.length === 0
+    ) {
       var dynamicList = this.hook.list.list.querySelector('[data-dynamic]');
       var loadingTemplate = document.createElement('div');
       loadingTemplate.innerHTML = config.loadingTemplate;
@@ -61,7 +63,7 @@ const AjaxFilter = {
     params[config.searchKey] = searchValue;
     var url = config.endpoint + this.buildParams(params);
     return AjaxCache.retrieve(url)
-      .then((data) => {
+      .then(data => {
         this._loadData(data, config);
         if (config.onLoadingFinished) {
           config.onLoadingFinished(data);
@@ -72,8 +74,7 @@ const AjaxFilter = {
 
   _loadData(data, config) {
     const list = this.hook.list;
-    if (config.loadingTemplate && list.data === undefined ||
-      list.data.length === 0) {
+    if ((config.loadingTemplate && list.data === undefined) || list.data.length === 0) {
       const dataLoadingTemplate = list.list.querySelector('[data-loading-template]');
       if (dataLoadingTemplate) {
         dataLoadingTemplate.outerHTML = this.listTemplate;
@@ -81,7 +82,8 @@ const AjaxFilter = {
     }
     if (!this.destroyed) {
       var hookListChildren = list.list.children;
-      var onlyDynamicList = hookListChildren.length === 1 && hookListChildren[0].hasAttribute('data-dynamic');
+      var onlyDynamicList =
+        hookListChildren.length === 1 && hookListChildren[0].hasAttribute('data-dynamic');
       if (onlyDynamicList && data.length === 0) {
         list.hide();
       }
@@ -100,12 +102,12 @@ const AjaxFilter = {
   },
 
   destroy: function destroy() {
-    if (this.timeout)clearTimeout(this.timeout);
+    if (this.timeout) clearTimeout(this.timeout);
     this.destroyed = true;
 
     this.hook.trigger.removeEventListener('keydown.dl', this.eventWrapper.debounceTrigger);
     this.hook.trigger.removeEventListener('focus', this.eventWrapper.debounceTrigger);
-  }
+  },
 };
 
 export default AjaxFilter;

app/assets/javascripts/droplab/plugins/filter.js

 /* eslint-disable */
 
 const Filter = {
-  keydown: function(e){
+  keydown: function(e) {
     if (this.destroyed) return;
 
     var hiddenCount = 0;
@@ -14,14 +14,14 @@ const Filter = {
     var matches = [];
     var filterFunction;
     // will only work on dynamically set data
-    if(!data){
+    if (!data) {
       return;
     }
 
     if (config && config.filterFunction && typeof config.filterFunction === 'function') {
       filterFunction = config.filterFunction;
     } else {
-      filterFunction = function(o){
+      filterFunction = function(o) {
         // cheap string search
         o.droplab_hidden = o[config.template].toLowerCase().indexOf(value) === -1;
         return o;
@@ -47,20 +47,23 @@ const Filter = {
   },
 
   debounceKeydown: function debounceKeydown(e) {
-    if ([
-      13, // enter
-      16, // shift
-      17, // ctrl
-      18, // alt
-      20, // caps lock
-      37, // left arrow
-      38, // up arrow
-      39, // right arrow
-      40, // down arrow
-      91, // left window
-      92, // right window
-      93, // select
-    ].indexOf(e.detail.which || e.detail.keyCode) > -1) return;
+    if (
+      [
+        13, // enter
+        16, // shift
+        17, // ctrl
+        18, // alt
+        20, // caps lock
+        37, // left arrow
+        38, // up arrow
+        39, // right arrow
+        40, // down arrow
+        91, // left window
+        92, // right window
+        93, // select
+      ].indexOf(e.detail.which || e.detail.keyCode) > -1
+    )
+      return;
 
     if (this.timeout) clearTimeout(this.timeout);
     this.timeout = setTimeout(this.keydown.bind(this, e), 200);
@@ -87,7 +90,7 @@ const Filter = {
 
     this.hook.trigger.removeEventListener('keydown.dl', this.eventWrapper.debounceKeydown);
     this.hook.trigger.removeEventListener('mousedown.dl', this.eventWrapper.debounceKeydown);
-  }
+  },
 };
 
 export default Filter;

app/assets/javascripts/droplab/plugins/input_setter.js

@@ -36,8 +36,8 @@ const InputSetter = {
     const inputAttribute = config.inputAttribute;
 
     if (input.hasAttribute(inputAttribute)) return input.setAttribute(inputAttribute, newValue);
-    if (input.tagName === 'INPUT') return input.value = newValue;
-    return input.textContent = newValue;
+    if (input.tagName === 'INPUT') return (input.value = newValue);
+    return (input.textContent = newValue);
   },
 
   destroy() {

app/assets/javascripts/droplab/utils.js

@@ -5,7 +5,12 @@ import { DATA_TRIGGER, DATA_DROPDOWN, TEMPLATE_REGEX } from './constants';
 
 const utils = {
   toCamelCase(attr) {
-    return this.camelize(attr.split('-').slice(1).join(' '));
+    return this.camelize(
+      attr
+        .split('-')
+        .slice(1)
+        .join(' '),
+    );
   },
 
   template(templateString, data) {
@@ -17,9 +22,11 @@ const utils = {
   },
 
   camelize(str) {
-    return str.replace(/(?:^\w|[A-Z]|\b\w)/g, (letter, index) => {
-      return index === 0 ? letter.toLowerCase() : letter.toUpperCase();
-    }).replace(/\s+/g, '');
+    return str
+      .replace(/(?:^\w|[A-Z]|\b\w)/g, (letter, index) => {
+        return index === 0 ? letter.toLowerCase() : letter.toUpperCase();
+      })
+      .replace(/\s+/g, '');
   },
 
   closest(thisTag, stopTag) {

app/assets/javascripts/environments/components/container.vue

 <script>
-  import tablePagination from '../../vue_shared/components/table_pagination.vue';
-  import environmentTable from '../components/environments_table.vue';
+import tablePagination from '../../vue_shared/components/table_pagination.vue';
+import environmentTable from '../components/environments_table.vue';
 
-  export default {
-    components: {
-      environmentTable,
-      tablePagination,
+export default {
+  components: {
+    environmentTable,
+    tablePagination,
+  },
+  props: {
+    isLoading: {
+      type: Boolean,
+      required: true,
     },
-    props: {
-      isLoading: {
-        type: Boolean,
-        required: true,
-      },
-      environments: {
-        type: Array,
-        required: true,
-      },
-      pagination: {
-        type: Object,
-        required: true,
-      },
-      canCreateDeployment: {
-        type: Boolean,
-        required: true,
-      },
-      canReadEnvironment: {
-        type: Boolean,
-        required: true,
-      },
+    environments: {
+      type: Array,
+      required: true,
     },
-    methods: {
-      onChangePage(page) {
-        this.$emit('onChangePage', page);
-      },
+    pagination: {
+      type: Object,
+      required: true,
     },
-  };
+    canCreateDeployment: {
+      type: Boolean,
+      required: true,
+    },
+    canReadEnvironment: {
+      type: Boolean,
+      required: true,
+    },
+  },
+  methods: {
+    onChangePage(page) {
+      this.$emit('onChangePage', page);
+    },
+  },
+};
 </script>
 
 <template>

app/assets/javascripts/environments/components/empty_state.vue

 <script>
-  export default {
-    name: 'EnvironmentsEmptyState',
-    props: {
-      newPath: {
-        type: String,
-        required: true,
-      },
-      canCreateEnvironment: {
-        type: Boolean,
-        required: true,
-      },
-      helpPath: {
-        type: String,
-        required: true,
-      },
+export default {
+  name: 'EnvironmentsEmptyState',
+  props: {
+    newPath: {
+      type: String,
+      required: true,
     },
-  };
+    canCreateEnvironment: {
+      type: Boolean,
+      required: true,
+    },
+    helpPath: {
+      type: String,
+      required: true,
+    },
+  },
+};
 </script>
 <template>
   <div class="blank-state-row">

app/assets/javascripts/environments/components/environment_rollback.vue

@@ -38,7 +38,9 @@ export default {
 
   computed: {
     title() {
-      return this.isLastDeployment ? s__('Environments|Re-deploy to environment') : s__('Environments|Rollback environment');
+      return this.isLastDeployment
+        ? s__('Environments|Re-deploy to environment')
+        : s__('Environments|Rollback environment');
     },
   },
 

app/assets/javascripts/environments/folder/environments_folder_bundle.js

@@ -5,31 +5,32 @@ import Translate from '../../vue_shared/translate';
 
 Vue.use(Translate);
 
-export default () => new Vue({
-  el: '#environments-folder-list-view',
-  components: {
-    environmentsFolderApp,
-  },
-  data() {
-    const environmentsData = document.querySelector(this.$options.el).dataset;
+export default () =>
+  new Vue({
+    el: '#environments-folder-list-view',
+    components: {
+      environmentsFolderApp,
+    },
+    data() {
+      const environmentsData = document.querySelector(this.$options.el).dataset;
 
-    return {
-      endpoint: environmentsData.endpoint,
-      folderName: environmentsData.folderName,
-      cssContainerClass: environmentsData.cssClass,
-      canCreateDeployment: convertPermissionToBoolean(environmentsData.canCreateDeployment),
-      canReadEnvironment: convertPermissionToBoolean(environmentsData.canReadEnvironment),
-    };
-  },
-  render(createElement) {
-    return createElement('environments-folder-app', {
-      props: {
-        endpoint: this.endpoint,
-        folderName: this.folderName,
-        cssContainerClass: this.cssContainerClass,
-        canCreateDeployment: this.canCreateDeployment,
-        canReadEnvironment: this.canReadEnvironment,
-      },
-    });
-  },
-});
+      return {
+        endpoint: environmentsData.endpoint,
+        folderName: environmentsData.folderName,
+        cssContainerClass: environmentsData.cssClass,
+        canCreateDeployment: convertPermissionToBoolean(environmentsData.canCreateDeployment),
+        canReadEnvironment: convertPermissionToBoolean(environmentsData.canReadEnvironment),
+      };
+    },
+    render(createElement) {
+      return createElement('environments-folder-app', {
+        props: {
+          endpoint: this.endpoint,
+          folderName: this.folderName,
+          cssContainerClass: this.cssContainerClass,
+          canCreateDeployment: this.canCreateDeployment,
+          canReadEnvironment: this.canReadEnvironment,
+        },
+      });
+    },
+  });

app/assets/javascripts/environments/folder/environments_folder_view.vue

 <script>
-  import environmentsMixin from '../mixins/environments_mixin';
-  import CIPaginationMixin from '../../vue_shared/mixins/ci_pagination_api_mixin';
-  import StopEnvironmentModal from '../components/stop_environment_modal.vue';
+import environmentsMixin from '../mixins/environments_mixin';
+import CIPaginationMixin from '../../vue_shared/mixins/ci_pagination_api_mixin';
+import StopEnvironmentModal from '../components/stop_environment_modal.vue';
 
-  export default {
-    components: {
-      StopEnvironmentModal,
-    },
+export default {
+  components: {
+    StopEnvironmentModal,
+  },
 
-    mixins: [
-      environmentsMixin,
-      CIPaginationMixin,
-    ],
+  mixins: [environmentsMixin, CIPaginationMixin],
 
-    props: {
-      endpoint: {
-        type: String,
-        required: true,
-      },
-      folderName: {
-        type: String,
-        required: true,
-      },
-      cssContainerClass: {
-        type: String,
-        required: true,
-      },
-      canCreateDeployment: {
-        type: Boolean,
-        required: true,
-      },
-      canReadEnvironment: {
-        type: Boolean,
-        required: true,
-      },
+  props: {
+    endpoint: {
+      type: String,
+      required: true,
+    },
+    folderName: {
+      type: String,
+      required: true,
+    },
+    cssContainerClass: {
+      type: String,
+      required: true,
+    },
+    canCreateDeployment: {
+      type: Boolean,
+      required: true,
+    },
+    canReadEnvironment: {
+      type: Boolean,
+      required: true,
     },
-    methods: {
-      successCallback(resp) {
-        this.saveData(resp);
-      },
+  },
+  methods: {
+    successCallback(resp) {
+      this.saveData(resp);
     },
-  };
+  },
+};
 </script>
 <template>
   <div :class="cssContainerClass">

app/assets/javascripts/environments/index.js

@@ -5,35 +5,36 @@ import Translate from '../vue_shared/translate';
 
 Vue.use(Translate);
 
-export default () => new Vue({
-  el: '#environments-list-view',
-  components: {
-    environmentsComponent,
-  },
-  data() {
-    const environmentsData = document.querySelector(this.$options.el).dataset;
+export default () =>
+  new Vue({
+    el: '#environments-list-view',
+    components: {
+      environmentsComponent,
+    },
+    data() {
+      const environmentsData = document.querySelector(this.$options.el).dataset;
 
-    return {
-      endpoint: environmentsData.environmentsDataEndpoint,
-      newEnvironmentPath: environmentsData.newEnvironmentPath,
-      helpPagePath: environmentsData.helpPagePath,
-      cssContainerClass: environmentsData.cssClass,
-      canCreateEnvironment: convertPermissionToBoolean(environmentsData.canCreateEnvironment),
-      canCreateDeployment: convertPermissionToBoolean(environmentsData.canCreateDeployment),
-      canReadEnvironment: convertPermissionToBoolean(environmentsData.canReadEnvironment),
-    };
-  },
-  render(createElement) {
-    return createElement('environments-component', {
-      props: {
-        endpoint: this.endpoint,
-        newEnvironmentPath: this.newEnvironmentPath,
-        helpPagePath: this.helpPagePath,
-        cssContainerClass: this.cssContainerClass,
-        canCreateEnvironment: this.canCreateEnvironment,
-        canCreateDeployment: this.canCreateDeployment,
-        canReadEnvironment: this.canReadEnvironment,
-      },
-    });
-  },
-});
+      return {
+        endpoint: environmentsData.environmentsDataEndpoint,
+        newEnvironmentPath: environmentsData.newEnvironmentPath,
+        helpPagePath: environmentsData.helpPagePath,
+        cssContainerClass: environmentsData.cssClass,
+        canCreateEnvironment: convertPermissionToBoolean(environmentsData.canCreateEnvironment),
+        canCreateDeployment: convertPermissionToBoolean(environmentsData.canCreateDeployment),
+        canReadEnvironment: convertPermissionToBoolean(environmentsData.canReadEnvironment),
+      };
+    },
+    render(createElement) {
+      return createElement('environments-component', {
+        props: {
+          endpoint: this.endpoint,
+          newEnvironmentPath: this.newEnvironmentPath,
+          helpPagePath: this.helpPagePath,
+          cssContainerClass: this.cssContainerClass,
+          canCreateEnvironment: this.canCreateEnvironment,
+          canCreateDeployment: this.canCreateDeployment,
+          canReadEnvironment: this.canReadEnvironment,
+        },
+      });
+    },
+  });

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

@@ -4,9 +4,7 @@
 import _ from 'underscore';
 import Visibility from 'visibilityjs';
 import Poll from '../../lib/utils/poll';
-import {
-  getParameterByName,
-} from '../../lib/utils/common_utils';
+import { getParameterByName } from '../../lib/utils/common_utils';
 import { s__ } from '../../locale';
 import Flash from '../../flash';
 import eventHub from '../event_hub';
@@ -19,7 +17,6 @@ import tabs from '../../vue_shared/components/navigation_tabs.vue';
 import container from '../components/container.vue';
 
 export default {
-
   components: {
     environmentTable,
     container,
@@ -65,7 +62,8 @@ export default {
     updateContent(parameters) {
       this.updateInternalState(parameters);
       // fetch new data
-      return this.service.fetchEnvironments(this.requestData)
+      return this.service
+        .fetchEnvironments(this.requestData)
         .then(response => this.successCallback(response))
         .then(() => {
           // restart polling
@@ -88,7 +86,8 @@ export default {
       if (!this.isMakingRequest) {
         this.isLoading = true;
 
-        this.service.postAction(endpoint)
+        this.service
+          .postAction(endpoint)
           .then(() => this.fetchEnvironments())
           .catch(() => {
             this.isLoading = false;
@@ -100,7 +99,8 @@ export default {
     fetchEnvironments() {
       this.isLoading = true;
 
-      return this.service.fetchEnvironments(this.requestData)
+      return this.service
+        .fetchEnvironments(this.requestData)
         .then(this.successCallback)
         .catch(this.errorCallback);
     },
@@ -111,7 +111,9 @@ export default {
 
     stopEnvironment(environment) {
       const endpoint = environment.stop_path;
-      const errorMessage = s__('Environments|An error occurred while stopping the environment, please try again');
+      const errorMessage = s__(
+        'Environments|An error occurred while stopping the environment, please try again',
+      );
       this.postAction({ endpoint, errorMessage });
     },
   },
@@ -149,7 +151,7 @@ export default {
       data: this.requestData,
       successCallback: this.successCallback,
       errorCallback: this.errorCallback,
-      notificationCallback: (isMakingRequest) => {
+      notificationCallback: isMakingRequest => {
         this.isMakingRequest = isMakingRequest;
       },
     });

app/assets/javascripts/feature_highlight/feature_highlight.js

 import $ from 'jquery';
-import {
-  getSelector,
-  inserted,
-} from './feature_highlight_helper';
-import {
-  togglePopover,
-  mouseenter,
-  debouncedMouseleave,
-} from '../shared/popover';
+import { getSelector, inserted } from './feature_highlight_helper';
+import { togglePopover, mouseenter, debouncedMouseleave } from '../shared/popover';
 
 export function setupFeatureHighlightPopover(id, debounceTimeout = 300) {
   const $selector = $(getSelector(id));
@@ -41,8 +34,9 @@ export function setupFeatureHighlightPopover(id, debounceTimeout = 300) {
 export function findHighestPriorityFeature() {
   let priorityFeature;
 
-  const sortedFeatureEls = [].slice.call(document.querySelectorAll('.js-feature-highlight')).sort((a, b) =>
-    (a.dataset.highlightPriority || 0) < (b.dataset.highlightPriority || 0));
+  const sortedFeatureEls = [].slice
+    .call(document.querySelectorAll('.js-feature-highlight'))
+    .sort((a, b) => (a.dataset.highlightPriority || 0) < (b.dataset.highlightPriority || 0));
 
   const [priorityFeatureEl] = sortedFeatureEls;
   if (priorityFeatureEl) {

app/assets/javascripts/feature_highlight/feature_highlight_helper.js

@@ -8,10 +8,17 @@ import { togglePopover } from '../shared/popover';
 export const getSelector = highlightId => `.js-feature-highlight[data-highlight=${highlightId}]`;
 
 export function dismiss(highlightId) {
-  axios.post(this.attr('data-dismiss-endpoint'), {
-    feature_name: highlightId,
-  })
-    .catch(() => Flash(__('An error occurred while dismissing the feature highlight. Refresh the page and try dismissing again.')));
+  axios
+    .post(this.attr('data-dismiss-endpoint'), {
+      feature_name: highlightId,
+    })
+    .catch(() =>
+      Flash(
+        __(
+          'An error occurred while dismissing the feature highlight. Refresh the page and try dismissing again.',
+        ),
+      ),
+    );
 
   togglePopover.call(this, false);
   this.hide();
@@ -23,8 +30,7 @@ export function inserted() {
   const $popover = $(this);
   const dismissWrapper = dismiss.bind($popover, highlightId);
 
-  $(`#${popoverId} .dismiss-feature-highlight`)
-    .on('click', dismissWrapper);
+  $(`#${popoverId} .dismiss-feature-highlight`).on('click', dismissWrapper);
 
   const lazyImg = $(`#${popoverId} .feature-highlight-illustration`)[0];
   if (lazyImg) {

app/assets/javascripts/filtered_search/admin_runners_filtered_search_token_keys.js

 import FilteredSearchTokenKeys from './filtered_search_token_keys';
 
-const tokenKeys = [{
-  key: 'status',
-  type: 'string',
-  param: 'status',
-  symbol: '',
-  icon: 'messages',
-  tag: 'status',
-}, {
-  key: 'type',
-  type: 'string',
-  param: 'type',
-  symbol: '',
-  icon: 'cube',
-  tag: 'type',
-}];
+const tokenKeys = [
+  {
+    key: 'status',
+    type: 'string',
+    param: 'status',
+    symbol: '',
+    icon: 'messages',
+    tag: 'status',
+  },
+  {
+    key: 'type',
+    type: 'string',
+    param: 'type',
+    symbol: '',
+    icon: 'cube',
+    tag: 'type',
+  },
+];
 
 const AdminRunnersFilteredSearchTokenKeys = new FilteredSearchTokenKeys(tokenKeys);
 

app/assets/javascripts/filtered_search/components/recent_searches_dropdown_content.vue

@@ -21,9 +21,11 @@ export default {
   },
   computed: {
     processedItems() {
-      return this.items.map((item) => {
-        const { tokens, searchToken }
-          = FilteredSearchTokenizer.processTokens(item, this.allowedKeys);
+      return this.items.map(item => {
+        const { tokens, searchToken } = FilteredSearchTokenizer.processTokens(
+          item,
+          this.allowedKeys,
+        );
 
         const resultantTokens = tokens.map(token => ({
           prefix: `${token.key}:`,

app/assets/javascripts/filtered_search/dropdown_emoji.js

@@ -24,8 +24,12 @@ export default class DropdownEmoji extends FilteredSearchDropdown {
     };
 
     import(/* webpackChunkName: 'emoji' */ '~/emoji')
-      .then(({ glEmojiTag }) => { this.glEmojiTag = glEmojiTag; })
-      .catch(() => { /* ignore error and leave emoji name in the search bar */ });
+      .then(({ glEmojiTag }) => {
+        this.glEmojiTag = glEmojiTag;
+      })
+      .catch(() => {
+        /* ignore error and leave emoji name in the search bar */
+      });
 
     this.unbindEvents();
     this.bindEvents();
@@ -48,7 +52,7 @@ export default class DropdownEmoji extends FilteredSearchDropdown {
   }
 
   itemClicked(e) {
-    super.itemClicked(e, (selected) => {
+    super.itemClicked(e, selected => {
       const name = selected.querySelector('.js-data-value').innerText.trim();
       return DropdownUtils.getEscapedText(name);
     });
@@ -64,7 +68,7 @@ export default class DropdownEmoji extends FilteredSearchDropdown {
 
     // Replace empty gl-emoji tag to real content
     const dropdownItems = [...this.dropdown.querySelectorAll('.filter-dropdown-item')];
-    dropdownItems.forEach((dropdownItem) => {
+    dropdownItems.forEach(dropdownItem => {
       const name = dropdownItem.querySelector('.js-data-value').innerText;
       const emojiTag = this.glEmojiTag(name);
       const emojiElement = dropdownItem.querySelector('gl-emoji');
@@ -73,7 +77,6 @@ export default class DropdownEmoji extends FilteredSearchDropdown {
   }
 
   init() {
-    this.droplab
-      .addHook(this.input, this.dropdown, [Ajax, Filter], this.config).init();
+    this.droplab.addHook(this.input, this.dropdown, [Ajax, Filter], this.config).init();
   }
 }

app/assets/javascripts/filtered_search/dropdown_hint.js

@@ -41,8 +41,10 @@ export default class DropdownHint extends FilteredSearchDropdown {
           previousInputValues.forEach((value, index) => {
             searchTerms.push(value);
 
-            if (index === previousInputValues.length - 1
-              && token.indexOf(value.toLowerCase()) !== -1) {
+            if (
+              index === previousInputValues.length - 1 &&
+              token.indexOf(value.toLowerCase()) !== -1
+            ) {
               searchTerms.pop();
             }
           });
@@ -64,13 +66,12 @@ export default class DropdownHint extends FilteredSearchDropdown {
   }
 
   renderContent() {
-    const dropdownData = this.tokenKeys.get()
-      .map(tokenKey => ({
-        icon: `${gon.sprite_icons}#${tokenKey.icon}`,
-        hint: tokenKey.key,
-        tag: `:${tokenKey.tag}`,
-        type: tokenKey.type,
-      }));
+    const dropdownData = this.tokenKeys.get().map(tokenKey => ({
+      icon: `${gon.sprite_icons}#${tokenKey.icon}`,
+      hint: tokenKey.key,
+      tag: `:${tokenKey.tag}`,
+      type: tokenKey.type,
+    }));
 
     this.droplab.changeHookList(this.hookId, this.dropdown, [Filter], this.config);
     this.droplab.setData(this.hookId, dropdownData);

app/assets/javascripts/filtered_search/dropdown_non_user.js

@@ -29,20 +29,18 @@ export default class DropdownNonUser extends FilteredSearchDropdown {
   }
 
   itemClicked(e) {
-    super.itemClicked(e, (selected) => {
+    super.itemClicked(e, selected => {
       const title = selected.querySelector('.js-data-value').innerText.trim();
       return `${this.symbol}${DropdownUtils.getEscapedText(title)}`;
     });
   }
 
   renderContent(forceShowList = false) {
-    this.droplab
-      .changeHookList(this.hookId, this.dropdown, [Ajax, Filter], this.config);
+    this.droplab.changeHookList(this.hookId, this.dropdown, [Ajax, Filter], this.config);
     super.renderContent(forceShowList);
   }
 
   init() {
-    this.droplab
-      .addHook(this.input, this.dropdown, [Ajax, Filter], this.config).init();
+    this.droplab.addHook(this.input, this.dropdown, [Ajax, Filter], this.config).init();
   }
 }

app/assets/javascripts/filtered_search/dropdown_utils.js

@@ -41,7 +41,7 @@ export default class DropdownUtils {
 
     // Removes the first character if it is a quotation so that we can search
     // with multiple words
-    if ((value[0] === '"' || value[0] === '\'') && title.indexOf(' ') !== -1) {
+    if ((value[0] === '"' || value[0] === "'") && title.indexOf(' ') !== -1) {
       value = value.slice(1);
     }
 
@@ -82,11 +82,13 @@ export default class DropdownUtils {
     // Reduce the colors to 4
     colors.length = Math.min(colors.length, 4);
 
-    const color = colors.map((c, i) => {
-      const percentFirst = Math.floor(spacing * i);
-      const percentSecond = Math.floor(spacing * (i + 1));
-      return `${c} ${percentFirst}%, ${c} ${percentSecond}%`;
-    }).join(', ');
+    const color = colors
+      .map((c, i) => {
+        const percentFirst = Math.floor(spacing * i);
+        const percentSecond = Math.floor(spacing * (i + 1));
+        return `${c} ${percentFirst}%, ${c} ${percentSecond}%`;
+      })
+      .join(', ');
 
     return `linear-gradient(${color})`;
   }
@@ -97,17 +99,16 @@ export default class DropdownUtils {
 
     data.forEach(DropdownUtils.mergeDuplicateLabels.bind(null, dataMap));
 
-    Object.keys(dataMap)
-      .forEach((key) => {
-        const label = dataMap[key];
+    Object.keys(dataMap).forEach(key => {
+      const label = dataMap[key];
 
-        if (label.multipleColors) {
-          label.color = DropdownUtils.duplicateLabelColor(label.multipleColors);
-          label.text_color = '#000000';
-        }
+      if (label.multipleColors) {
+        label.color = DropdownUtils.duplicateLabelColor(label.multipleColors);
+        label.text_color = '#000000';
+      }
 
-        results.push(label);
-      });
+      results.push(label);
+    });
 
     results.preprocessed = true;
 
@@ -118,8 +119,7 @@ export default class DropdownUtils {
     const { input, allowedKeys } = config;
     const updatedItem = item;
     const searchInput = DropdownUtils.getSearchQuery(input);
-    const { lastToken, tokens } =
-      FilteredSearchTokenizer.processTokens(searchInput, allowedKeys);
+    const { lastToken, tokens } = FilteredSearchTokenizer.processTokens(searchInput, allowedKeys);
     const lastKey = lastToken.key || lastToken || '';
     const allowMultiple = item.type === 'array';
     const itemInExistingTokens = tokens.some(t => t.key === item.hint);
@@ -154,7 +154,10 @@ export default class DropdownUtils {
 
   static getVisualTokenValues(visualToken) {
     const tokenName = visualToken && visualToken.querySelector('.name').textContent.trim();
-    let tokenValue = visualToken && visualToken.querySelector('.value') && visualToken.querySelector('.value').textContent.trim();
+    let tokenValue =
+      visualToken &&
+      visualToken.querySelector('.value') &&
+      visualToken.querySelector('.value').textContent.trim();
     if (tokenName === 'label' && tokenValue) {
       // remove leading symbol and wrapping quotes
       tokenValue = tokenValue.replace(/^~("|')?(.*)/, '$2').replace(/("|')$/, '');
@@ -174,7 +177,7 @@ export default class DropdownUtils {
       tokens.splice(inputIndex + 1);
     }
 
-    tokens.forEach((token) => {
+    tokens.forEach(token => {
       if (token.classList.contains('js-visual-token')) {
         const name = token.querySelector('.name');
         const value = token.querySelector('.value');
@@ -194,8 +197,9 @@ export default class DropdownUtils {
           values.push(name.innerText);
         }
       } else if (token.classList.contains('input-token')) {
-        const { isLastVisualTokenValid } =
-          FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
+        const {
+          isLastVisualTokenValid,
+        } = FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
 
         const input = FilteredSearchContainer.container.querySelector('.filtered-search');
         const inputValue = input && input.value;
@@ -209,9 +213,7 @@ export default class DropdownUtils {
       }
     });
 
-    return values
-      .map(value => value.trim())
-      .join(' ');
+    return values.map(value => value.trim()).join(' ');
   }
 
   static getSearchInput(filteredSearchInput) {
@@ -227,7 +229,9 @@ export default class DropdownUtils {
     // Replace all spaces inside quote marks with underscores
     // (will continue to match entire string until an end quote is found if any)
     // This helps with matching the beginning & end of a token:key
-    inputValue = inputValue.replace(/(('[^']*'{0,1})|("[^"]*"{0,1})|:\s+)/g, str => str.replace(/\s/g, '_'));
+    inputValue = inputValue.replace(/(('[^']*'{0,1})|("[^"]*"{0,1})|:\s+)/g, str =>
+      str.replace(/\s/g, '_'),
+    );
 
     // Get the right position for the word selected
     // Regex matches first space

app/assets/javascripts/filtered_search/filtered_search_dropdown.js

@@ -87,10 +87,12 @@ export default class FilteredSearchDropdown {
   dispatchInputEvent() {
     // Propogate input change to FilteredSearchDropdownManager
     // so that it can determine which dropdowns to open
-    this.input.dispatchEvent(new CustomEvent('input', {
-      bubbles: true,
-      cancelable: true,
-    }));
+    this.input.dispatchEvent(
+      new CustomEvent('input', {
+        bubbles: true,
+        cancelable: true,
+      }),
+    );
   }
 
   dispatchFormSubmitEvent() {
@@ -114,7 +116,7 @@ export default class FilteredSearchDropdown {
 
       if (!data) return;
 
-      const results = data.map((o) => {
+      const results = data.map(o => {
         const updated = o;
         updated.droplab_hidden = false;
         return updated;

app/assets/javascripts/filtered_search/filtered_search_token_keys.js

@@ -42,19 +42,21 @@ export default class FilteredSearchTokenKeys {
   }
 
   searchByKeyParam(keyParam) {
-    return this.tokenKeysWithAlternative.find((tokenKey) => {
-      let tokenKeyParam = tokenKey.key;
+    return (
+      this.tokenKeysWithAlternative.find(tokenKey => {
+        let tokenKeyParam = tokenKey.key;
 
-      // Replace hyphen with underscore to compare keyParam with tokenKeyParam
-      // e.g. 'my-reaction' => 'my_reaction'
-      tokenKeyParam = tokenKeyParam.replace('-', '_');
+        // Replace hyphen with underscore to compare keyParam with tokenKeyParam
+        // e.g. 'my-reaction' => 'my_reaction'
+        tokenKeyParam = tokenKeyParam.replace('-', '_');
 
-      if (tokenKey.param) {
-        tokenKeyParam += `_${tokenKey.param}`;
-      }
+        if (tokenKey.param) {
+          tokenKeyParam += `_${tokenKey.param}`;
+        }
 
-      return keyParam === tokenKeyParam;
-    }) || null;
+        return keyParam === tokenKeyParam;
+      }) || null
+    );
   }
 
   searchByConditionUrl(url) {
@@ -62,8 +64,10 @@ export default class FilteredSearchTokenKeys {
   }
 
   searchByConditionKeyValue(key, value) {
-    return this.conditions
-      .find(condition => condition.tokenKey === key && condition.value === value) || null;
+    return (
+      this.conditions.find(condition => condition.tokenKey === key && condition.value === value) ||
+      null
+    );
   }
 
   addExtraTokensForMergeRequests() {

app/assets/javascripts/filtered_search/filtered_search_tokenizer.js

@@ -4,41 +4,48 @@ export default class FilteredSearchTokenizer {
   static processTokens(input, allowedKeys) {
     // Regex extracts `(token):(symbol)(value)`
     // Values that start with a double quote must end in a double quote (same for single)
-    const tokenRegex = new RegExp(`(${allowedKeys.join('|')}):([~%@]?)(?:('[^']*'{0,1})|("[^"]*"{0,1})|(\\S+))`, 'g');
+    const tokenRegex = new RegExp(
+      `(${allowedKeys.join('|')}):([~%@]?)(?:('[^']*'{0,1})|("[^"]*"{0,1})|(\\S+))`,
+      'g',
+    );
     const tokens = [];
     const tokenIndexes = []; // stores key+value for simple search
     let lastToken = null;
-    const searchToken = input.replace(tokenRegex, (match, key, symbol, v1, v2, v3) => {
-      let tokenValue = v1 || v2 || v3;
-      let tokenSymbol = symbol;
-      let tokenIndex = '';
-
-      if (tokenValue === '~' || tokenValue === '%' || tokenValue === '@') {
-        tokenSymbol = tokenValue;
-        tokenValue = '';
-      }
-
-      tokenIndex = `${key}:${tokenValue}`;
-
-      // Prevent adding duplicates
-      if (tokenIndexes.indexOf(tokenIndex) === -1) {
-        tokenIndexes.push(tokenIndex);
-
-        tokens.push({
-          key,
-          value: tokenValue || '',
-          symbol: tokenSymbol || '',
-        });
-      }
-
-      return '';
-    }).replace(/\s{2,}/g, ' ').trim() || '';
+    const searchToken =
+      input
+        .replace(tokenRegex, (match, key, symbol, v1, v2, v3) => {
+          let tokenValue = v1 || v2 || v3;
+          let tokenSymbol = symbol;
+          let tokenIndex = '';
+
+          if (tokenValue === '~' || tokenValue === '%' || tokenValue === '@') {
+            tokenSymbol = tokenValue;
+            tokenValue = '';
+          }
+
+          tokenIndex = `${key}:${tokenValue}`;
+
+          // Prevent adding duplicates
+          if (tokenIndexes.indexOf(tokenIndex) === -1) {
+            tokenIndexes.push(tokenIndex);
+
+            tokens.push({
+              key,
+              value: tokenValue || '',
+              symbol: tokenSymbol || '',
+            });
+          }
+
+          return '';
+        })
+        .replace(/\s{2,}/g, ' ')
+        .trim() || '';
 
     if (tokens.length > 0) {
       const last = tokens[tokens.length - 1];
       const lastString = `${last.key}:${last.symbol}${last.value}`;
-      lastToken = input.lastIndexOf(lastString) ===
-        input.length - lastString.length ? last : searchToken;
+      lastToken =
+        input.lastIndexOf(lastString) === input.length - lastString.length ? last : searchToken;
     } else {
       lastToken = searchToken;
     }

app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js

@@ -13,7 +13,10 @@ export default class FilteredSearchVisualTokens {
 
     return {
       lastVisualToken,
-      isLastVisualTokenValid: lastVisualToken === null || lastVisualToken.className.indexOf('filtered-search-term') !== -1 || (lastVisualToken && lastVisualToken.querySelector('.value') !== null),
+      isLastVisualTokenValid:
+        lastVisualToken === null ||
+        lastVisualToken.className.indexOf('filtered-search-term') !== -1 ||
+        (lastVisualToken && lastVisualToken.querySelector('.value') !== null),
     };
   }
 
@@ -33,7 +36,9 @@ export default class FilteredSearchVisualTokens {
   }
 
   static unselectTokens() {
-    const otherTokens = FilteredSearchContainer.container.querySelectorAll('.js-visual-token .selectable.selected');
+    const otherTokens = FilteredSearchContainer.container.querySelectorAll(
+      '.js-visual-token .selectable.selected',
+    );
     [].forEach.call(otherTokens, t => t.classList.remove('selected'));
   }
 
@@ -56,11 +61,7 @@ export default class FilteredSearchVisualTokens {
   }
 
   static createVisualTokenElementHTML(options = {}) {
-    const {
-      canEdit = true,
-      uppercaseTokenName = false,
-      capitalizeTokenValue = false,
-    } = options;
+    const { canEdit = true, uppercaseTokenName = false, capitalizeTokenValue = false } = options;
 
     return `
       <div class="${canEdit ? 'selectable' : 'hidden'}" role="button">
@@ -115,15 +116,20 @@ export default class FilteredSearchVisualTokens {
 
     return AjaxCache.retrieve(labelsEndpoint)
       .then(FilteredSearchVisualTokens.preprocessLabel.bind(null, labelsEndpoint))
-      .then((labels) => {
-        const matchingLabel = (labels || []).find(label => `~${DropdownUtils.getEscapedText(label.title)}` === tokenValue);
+      .then(labels => {
+        const matchingLabel = (labels || []).find(
+          label => `~${DropdownUtils.getEscapedText(label.title)}` === tokenValue,
+        );
 
         if (!matchingLabel) {
           return;
         }
 
-        FilteredSearchVisualTokens
-          .setTokenStyle(tokenValueContainer, matchingLabel.color, matchingLabel.text_color);
+        FilteredSearchVisualTokens.setTokenStyle(
+          tokenValueContainer,
+          matchingLabel.color,
+          matchingLabel.text_color,
+        );
       })
       .catch(() => new Flash('An error occurred while fetching label colors.'));
   }
@@ -134,39 +140,43 @@ export default class FilteredSearchVisualTokens {
     }
 
     const username = tokenValue.replace(/^@/, '');
-    return UsersCache.retrieve(username)
-      .then((user) => {
-        if (!user) {
-          return;
-        }
-
-        /* eslint-disable no-param-reassign */
-        tokenValueContainer.dataset.originalValue = tokenValue;
-        tokenValueElement.innerHTML = `
+    return (
+      UsersCache.retrieve(username)
+        .then(user => {
+          if (!user) {
+            return;
+          }
+
+          /* eslint-disable no-param-reassign */
+          tokenValueContainer.dataset.originalValue = tokenValue;
+          tokenValueElement.innerHTML = `
           <img class="avatar s20" src="${user.avatar_url}" alt="">
           ${_.escape(user.name)}
         `;
-        /* eslint-enable no-param-reassign */
-      })
-      // ignore error and leave username in the search bar
-      .catch(() => { });
+          /* eslint-enable no-param-reassign */
+        })
+        // ignore error and leave username in the search bar
+        .catch(() => {})
+    );
   }
 
   static updateEmojiTokenAppearance(tokenValueContainer, tokenValueElement, tokenValue) {
     const container = tokenValueContainer;
     const element = tokenValueElement;
 
-    return import(/* webpackChunkName: 'emoji' */ '../emoji')
-      .then((Emoji) => {
-        if (!Emoji.isEmojiNameValid(tokenValue)) {
-          return;
-        }
-
-        container.dataset.originalValue = tokenValue;
-        element.innerHTML = Emoji.glEmojiTag(tokenValue);
-      })
-      // ignore error and leave emoji name in the search bar
-      .catch(() => { });
+    return (
+      import(/* webpackChunkName: 'emoji' */ '../emoji')
+        .then(Emoji => {
+          if (!Emoji.isEmojiNameValid(tokenValue)) {
+            return;
+          }
+
+          container.dataset.originalValue = tokenValue;
+          element.innerHTML = Emoji.glEmojiTag(tokenValue);
+        })
+        // ignore error and leave emoji name in the search bar
+        .catch(() => {})
+    );
   }
 
   static renderVisualTokenValue(parentElement, tokenName, tokenValue) {
@@ -177,24 +187,23 @@ export default class FilteredSearchVisualTokens {
     const tokenType = tokenName.toLowerCase();
     if (tokenType === 'label') {
       FilteredSearchVisualTokens.updateLabelTokenColor(tokenValueContainer, tokenValue);
-    } else if ((tokenType === 'author') || (tokenType === 'assignee')) {
+    } else if (tokenType === 'author' || tokenType === 'assignee') {
       FilteredSearchVisualTokens.updateUserTokenAppearance(
-        tokenValueContainer, tokenValueElement, tokenValue,
+        tokenValueContainer,
+        tokenValueElement,
+        tokenValue,
       );
     } else if (tokenType === 'my-reaction') {
       FilteredSearchVisualTokens.updateEmojiTokenAppearance(
-        tokenValueContainer, tokenValueElement, tokenValue,
+        tokenValueContainer,
+        tokenValueElement,
+        tokenValue,
       );
     }
   }
 
   static addVisualTokenElement(name, value, options = {}) {
-    const {
-      isSearchTerm = false,
-      canEdit,
-      uppercaseTokenName,
-      capitalizeTokenValue,
-    } = options;
+    const { isSearchTerm = false, canEdit, uppercaseTokenName, capitalizeTokenValue } = options;
     const li = document.createElement('li');
     li.classList.add('js-visual-token');
     li.classList.add(isSearchTerm ? 'filtered-search-term' : 'filtered-search-token');
@@ -217,8 +226,10 @@ export default class FilteredSearchVisualTokens {
   }
 
   static addValueToPreviousVisualTokenElement(value) {
-    const { lastVisualToken, isLastVisualTokenValid } =
-      FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
+    const {
+      lastVisualToken,
+      isLastVisualTokenValid,
+    } = FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
 
     if (!isLastVisualTokenValid && lastVisualToken.classList.contains('filtered-search-token')) {
       const name = FilteredSearchVisualTokens.getLastTokenPartial();
@@ -228,13 +239,15 @@ export default class FilteredSearchVisualTokens {
     }
   }
 
-  static addFilterVisualToken(tokenName, tokenValue, {
-    canEdit,
-    uppercaseTokenName = false,
-    capitalizeTokenValue = false,
-  } = {}) {
-    const { lastVisualToken, isLastVisualTokenValid }
-      = FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
+  static addFilterVisualToken(
+    tokenName,
+    tokenValue,
+    { canEdit, uppercaseTokenName = false, capitalizeTokenValue = false } = {},
+  ) {
+    const {
+      lastVisualToken,
+      isLastVisualTokenValid,
+    } = FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
     const { addVisualTokenElement } = FilteredSearchVisualTokens;
 
     if (isLastVisualTokenValid) {
@@ -308,8 +321,7 @@ export default class FilteredSearchVisualTokens {
 
   static tokenizeInput() {
     const input = FilteredSearchContainer.container.querySelector('.filtered-search');
-    const { isLastVisualTokenValid } =
-      FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
+    const { isLastVisualTokenValid } = FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
 
     if (input.value) {
       if (isLastVisualTokenValid) {
@@ -375,8 +387,7 @@ export default class FilteredSearchVisualTokens {
     FilteredSearchVisualTokens.tokenizeInput();
 
     if (!tokenContainer.lastElementChild.isEqualNode(inputLi)) {
-      const { isLastVisualTokenValid } =
-        FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
+      const { isLastVisualTokenValid } = FilteredSearchVisualTokens.getLastVisualTokenBeforeInput();
 
       if (!isLastVisualTokenValid) {
         const lastPartial = FilteredSearchVisualTokens.getLastTokenPartial();

app/assets/javascripts/filtered_search/issuable_filtered_search_token_keys.js

 import FilteredSearchTokenKeys from './filtered_search_token_keys';
 
-export const tokenKeys = [{
-  key: 'author',
-  type: 'string',
-  param: 'username',
-  symbol: '@',
-  icon: 'pencil',
-  tag: '@author',
-}, {
-  key: 'assignee',
-  type: 'string',
-  param: 'username',
-  symbol: '@',
-  icon: 'user',
-  tag: '@assignee',
-}, {
-  key: 'milestone',
-  type: 'string',
-  param: 'title',
-  symbol: '%',
-  icon: 'clock',
-  tag: '%milestone',
-}, {
-  key: 'label',
-  type: 'array',
-  param: 'name[]',
-  symbol: '~',
-  icon: 'labels',
-  tag: '~label',
-}];
+export const tokenKeys = [
+  {
+    key: 'author',
+    type: 'string',
+    param: 'username',
+    symbol: '@',
+    icon: 'pencil',
+    tag: '@author',
+  },
+  {
+    key: 'assignee',
+    type: 'string',
+    param: 'username',
+    symbol: '@',
+    icon: 'user',
+    tag: '@assignee',
+  },
+  {
+    key: 'milestone',
+    type: 'string',
+    param: 'title',
+    symbol: '%',
+    icon: 'clock',
+    tag: '%milestone',
+  },
+  {
+    key: 'label',
+    type: 'array',
+    param: 'name[]',
+    symbol: '~',
+    icon: 'labels',
+    tag: '~label',
+  },
+];
 
 if (gon.current_user_id) {
   // Appending tokenkeys only logged-in
@@ -42,36 +47,47 @@ if (gon.current_user_id) {
   });
 }
 
-export const alternativeTokenKeys = [{
-  key: 'label',
-  type: 'string',
-  param: 'name',
-  symbol: '~',
-}];
+export const alternativeTokenKeys = [
+  {
+    key: 'label',
+    type: 'string',
+    param: 'name',
+    symbol: '~',
+  },
+];
 
-export const conditions = [{
-  url: 'assignee_id=0',
-  tokenKey: 'assignee',
-  value: 'none',
-}, {
-  url: 'milestone_title=No+Milestone',
-  tokenKey: 'milestone',
-  value: 'none',
-}, {
-  url: 'milestone_title=%23upcoming',
-  tokenKey: 'milestone',
-  value: 'upcoming',
-}, {
-  url: 'milestone_title=%23started',
-  tokenKey: 'milestone',
-  value: 'started',
-}, {
-  url: 'label_name[]=No+Label',
-  tokenKey: 'label',
-  value: 'none',
-}];
+export const conditions = [
+  {
+    url: 'assignee_id=0',
+    tokenKey: 'assignee',
+    value: 'none',
+  },
+  {
+    url: 'milestone_title=No+Milestone',
+    tokenKey: 'milestone',
+    value: 'none',
+  },
+  {
+    url: 'milestone_title=%23upcoming',
+    tokenKey: 'milestone',
+    value: 'upcoming',
+  },
+  {
+    url: 'milestone_title=%23started',
+    tokenKey: 'milestone',
+    value: 'started',
+  },
+  {
+    url: 'label_name[]=No+Label',
+    tokenKey: 'label',
+    value: 'none',
+  },
+];
 
-const IssuableFilteredSearchTokenKeys =
-  new FilteredSearchTokenKeys(tokenKeys, alternativeTokenKeys, conditions);
+const IssuableFilteredSearchTokenKeys = new FilteredSearchTokenKeys(
+  tokenKeys,
+  alternativeTokenKeys,
+  conditions,
+);
 
 export default IssuableFilteredSearchTokenKeys;

app/assets/javascripts/filtered_search/recent_searches_root.js

@@ -3,11 +3,7 @@ import RecentSearchesDropdownContent from './components/recent_searches_dropdown
 import eventHub from './event_hub';
 
 class RecentSearchesRoot {
-  constructor(
-    recentSearchesStore,
-    recentSearchesService,
-    wrapperElement,
-  ) {
+  constructor(recentSearchesStore, recentSearchesService, wrapperElement) {
     this.store = recentSearchesStore;
     this.service = recentSearchesService;
     this.wrapperElement = wrapperElement;
@@ -35,7 +31,9 @@ class RecentSearchesRoot {
       components: {
         RecentSearchesDropdownContent,
       },
-      data() { return state; },
+      data() {
+        return state;
+      },
       template: `
         <recent-searches-dropdown-content
           :items="recentSearches"
@@ -57,7 +55,6 @@ class RecentSearchesRoot {
       this.vm.$destroy();
     }
   }
-
 }
 
 export default RecentSearchesRoot;

app/assets/javascripts/filtered_search/stores/recent_searches_store.js

@@ -2,11 +2,14 @@ import _ from 'underscore';
 
 class RecentSearchesStore {
   constructor(initialState = {}, allowedKeys) {
-    this.state = Object.assign({
-      isLocalStorageAvailable: true,
-      recentSearches: [],
-      allowedKeys,
-    }, initialState);
+    this.state = Object.assign(
+      {
+        isLocalStorageAvailable: true,
+        recentSearches: [],
+        allowedKeys,
+      },
+      initialState,
+    );
   }
 
   addRecentSearch(newSearch) {

app/assets/javascripts/issuable_index.js

@@ -26,14 +26,17 @@ export default class IssuableIndex {
   static resetIncomingEmailToken() {
     const $resetToken = $('.incoming-email-token-reset');
 
-    $resetToken.on('click', (e) => {
+    $resetToken.on('click', e => {
       e.preventDefault();
 
       $resetToken.text('resetting...');
 
-      axios.put($resetToken.attr('href'))
+      axios
+        .put($resetToken.attr('href'))
         .then(({ data }) => {
-          $('#issuable_email').val(data.new_address).focus();
+          $('#issuable_email')
+            .val(data.new_address)
+            .focus();
 
           $resetToken.text('reset it');
         })

app/assets/javascripts/issue.js

@@ -28,7 +28,7 @@ export default class Issue {
     }
 
     // Listen to state changes in the Vue app
-    document.addEventListener('issuable_vue_app:change', (event) => {
+    document.addEventListener('issuable_vue_app:change', event => {
       this.updateTopState(event.detail.isClosed, event.detail.data);
     });
   }
@@ -55,7 +55,13 @@ export default class Issue {
       $(document).trigger('issuable:change', isClosed);
       this.toggleCloseReopenButton(isClosed);
 
-      let numProjectIssues = Number(projectIssuesCounter.first().text().trim().replace(/[^\d]/, ''));
+      let numProjectIssues = Number(
+        projectIssuesCounter
+          .first()
+          .text()
+          .trim()
+          .replace(/[^\d]/, ''),
+      );
       numProjectIssues = isClosed ? numProjectIssues - 1 : numProjectIssues + 1;
       projectIssuesCounter.text(addDelimiter(numProjectIssues));
 
@@ -76,29 +82,34 @@ export default class Issue {
   initIssueBtnEventListeners() {
     const issueFailMessage = 'Unable to update this issue at this time.';
 
-    return $(document).on('click', '.js-issuable-actions a.btn-close, .js-issuable-actions a.btn-reopen', (e) => {
-      var $button, shouldSubmit, url;
-      e.preventDefault();
-      e.stopImmediatePropagation();
-      $button = $(e.currentTarget);
-      shouldSubmit = $button.hasClass('btn-comment');
-      if (shouldSubmit) {
-        Issue.submitNoteForm($button.closest('form'));
-      }
-
-      this.disableCloseReopenButton($button);
+    return $(document).on(
+      'click',
+      '.js-issuable-actions a.btn-close, .js-issuable-actions a.btn-reopen',
+      e => {
+        var $button, shouldSubmit, url;
+        e.preventDefault();
+        e.stopImmediatePropagation();
+        $button = $(e.currentTarget);
+        shouldSubmit = $button.hasClass('btn-comment');
+        if (shouldSubmit) {
+          Issue.submitNoteForm($button.closest('form'));
+        }
 
-      url = $button.attr('href');
-      return axios.put(url)
-      .then(({ data }) => {
-        const isClosed = $button.hasClass('btn-close');
-        this.updateTopState(isClosed, data);
-      })
-      .catch(() => flash(issueFailMessage))
-      .then(() => {
-        this.disableCloseReopenButton($button, false);
-      });
-    });
+        this.disableCloseReopenButton($button);
+
+        url = $button.attr('href');
+        return axios
+          .put(url)
+          .then(({ data }) => {
+            const isClosed = $button.hasClass('btn-close');
+            this.updateTopState(isClosed, data);
+          })
+          .catch(() => flash(issueFailMessage))
+          .then(() => {
+            this.disableCloseReopenButton($button, false);
+          });
+      },
+    );
   }
 
   initCloseReopenReport() {
@@ -124,7 +135,7 @@ export default class Issue {
 
   static submitNoteForm(form) {
     var noteText;
-    noteText = form.find("textarea.js-note-text").val();
+    noteText = form.find('textarea.js-note-text').val();
     if (noteText && noteText.trim().length > 0) {
       return form.submit();
     }
@@ -133,22 +144,26 @@ export default class Issue {
   static initMergeRequests() {
     var $container;
     $container = $('#merge-requests');
-    return axios.get($container.data('url'))
+    return axios
+      .get($container.data('url'))
       .then(({ data }) => {
         if ('html' in data) {
           $container.html(data.html);
         }
-      }).catch(() => flash('Failed to load referenced merge requests'));
+      })
+      .catch(() => flash('Failed to load referenced merge requests'));
   }
 
   static initRelatedBranches() {
     var $container;
     $container = $('#related-branches');
-    return axios.get($container.data('url'))
+    return axios
+      .get($container.data('url'))
       .then(({ data }) => {
         if ('html' in data) {
           $container.html(data.html);
         }
-      }).catch(() => flash('Failed to load related branches'));
+      })
+      .catch(() => flash('Failed to load related branches'));
   }
 }

app/assets/javascripts/job.js

@@ -42,16 +42,14 @@ export default class Job extends LogOutputBehaviours {
 
     this.scrollThrottled = _.throttle(this.toggleScroll.bind(this), 100);
 
-    this.$window
-      .off('scroll')
-      .on('scroll', () => {
-        if (!isScrolledToBottom()) {
-          this.toggleScrollAnimation(false);
-        } else if (isScrolledToBottom() && !this.isLogComplete) {
-          this.toggleScrollAnimation(true);
-        }
-        this.scrollThrottled();
-      });
+    this.$window.off('scroll').on('scroll', () => {
+      if (!isScrolledToBottom()) {
+        this.toggleScrollAnimation(false);
+      } else if (isScrolledToBottom() && !this.isLogComplete) {
+        this.toggleScrollAnimation(true);
+      }
+      this.scrollThrottled();
+    });
 
     this.$window
       .off('resize.build')
@@ -87,10 +85,11 @@ export default class Job extends LogOutputBehaviours {
   }
 
   getBuildTrace() {
-    return axios.get(`${this.pagePath}/trace.json`, {
-      params: { state: this.state },
-    })
-      .then((res) => {
+    return axios
+      .get(`${this.pagePath}/trace.json`, {
+        params: { state: this.state },
+      })
+      .then(res => {
         const log = res.data;
 
         if (!this.fetchingStatusFavicon) {
@@ -186,5 +185,4 @@ export default class Job extends LogOutputBehaviours {
   sidebarOnClick() {
     if (this.shouldHideSidebarForViewport()) this.toggleSidebar();
   }
-
 }

app/assets/javascripts/label_manager.js

@@ -47,7 +47,10 @@ export default class LabelManager {
   }
 
   toggleEmptyState($label, $btn, action) {
-    this.emptyState.classList.toggle('hidden', !!this.prioritizedLabels[0].querySelector(':scope > li'));
+    this.emptyState.classList.toggle(
+      'hidden',
+      !!this.prioritizedLabels[0].querySelector(':scope > li'),
+    );
   }
 
   toggleLabelPriority($label, action, persistState) {
@@ -80,16 +83,14 @@ export default class LabelManager {
       return;
     }
     if (action === 'remove') {
-      axios.delete(url)
-        .catch(rollbackLabelPosition);
+      axios.delete(url).catch(rollbackLabelPosition);
 
       // Restore empty message
       if (!$from.find('li').length) {
         $from.find('.empty-message').removeClass('hidden');
       }
     } else {
-      this.savePrioritySort($label, action)
-        .catch(rollbackLabelPosition);
+      this.savePrioritySort($label, action).catch(rollbackLabelPosition);
     }
   }
 
@@ -102,8 +103,7 @@ export default class LabelManager {
   }
 
   onPrioritySortUpdate() {
-    this.savePrioritySort()
-      .catch(() => flash(this.errorMessage));
+    this.savePrioritySort().catch(() => flash(this.errorMessage));
   }
 
   savePrioritySort() {

app/assets/javascripts/labels.js

@@ -22,7 +22,7 @@ export default class Labels {
   updateColorPreview() {
     const previewColor = $('input#label_color').val();
     return $('div.label-color-preview').css('background-color', previewColor);
-  // Updates the the preview color with the hex-color input
+    // Updates the the preview color with the hex-color input
   }
 
   // Updates the preview color with a click on a suggested color

app/assets/javascripts/layout_nav.js

@@ -5,7 +5,9 @@ import initFlyOutNav from './fly_out_nav';
 function hideEndFade($scrollingTabs) {
   $scrollingTabs.each(function scrollTabsLoop() {
     const $this = $(this);
-    $this.siblings('.fade-right').toggleClass('scrolling', Math.round($this.width()) < $this.prop('scrollWidth'));
+    $this
+      .siblings('.fade-right')
+      .toggleClass('scrolling', Math.round($this.width()) < $this.prop('scrollWidth'));
   });
 }
 
@@ -15,38 +17,42 @@ export default function initLayoutNav() {
 
   initFlyOutNav();
 
-  $(document).on('init.scrolling-tabs', () => {
-    const $scrollingTabs = $('.scrolling-tabs').not('.is-initialized');
-    $scrollingTabs.addClass('is-initialized');
+  $(document)
+    .on('init.scrolling-tabs', () => {
+      const $scrollingTabs = $('.scrolling-tabs').not('.is-initialized');
+      $scrollingTabs.addClass('is-initialized');
 
-    $(window).on('resize.nav', () => {
-      hideEndFade($scrollingTabs);
-    }).trigger('resize.nav');
+      $(window)
+        .on('resize.nav', () => {
+          hideEndFade($scrollingTabs);
+        })
+        .trigger('resize.nav');
 
-    $scrollingTabs.on('scroll', function tabsScrollEvent() {
-      const $this = $(this);
-      const currentPosition = $this.scrollLeft();
-      const maxPosition = $this.prop('scrollWidth') - $this.outerWidth();
+      $scrollingTabs.on('scroll', function tabsScrollEvent() {
+        const $this = $(this);
+        const currentPosition = $this.scrollLeft();
+        const maxPosition = $this.prop('scrollWidth') - $this.outerWidth();
 
-      $this.siblings('.fade-left').toggleClass('scrolling', currentPosition > 0);
-      $this.siblings('.fade-right').toggleClass('scrolling', currentPosition < maxPosition - 1);
-    });
+        $this.siblings('.fade-left').toggleClass('scrolling', currentPosition > 0);
+        $this.siblings('.fade-right').toggleClass('scrolling', currentPosition < maxPosition - 1);
+      });
 
-    $scrollingTabs.each(function scrollTabsEachLoop() {
-      const $this = $(this);
-      const scrollingTabWidth = $this.width();
-      const $active = $this.find('.active');
-      const activeWidth = $active.width();
+      $scrollingTabs.each(function scrollTabsEachLoop() {
+        const $this = $(this);
+        const scrollingTabWidth = $this.width();
+        const $active = $this.find('.active');
+        const activeWidth = $active.width();
 
-      if ($active.length) {
-        const offset = $active.offset().left + activeWidth;
+        if ($active.length) {
+          const offset = $active.offset().left + activeWidth;
 
-        if (offset > scrollingTabWidth - 30) {
-          const scrollLeft = (offset - (scrollingTabWidth / 2)) - (activeWidth / 2);
+          if (offset > scrollingTabWidth - 30) {
+            const scrollLeft = offset - scrollingTabWidth / 2 - activeWidth / 2;
 
-          $this.scrollLeft(scrollLeft);
+            $this.scrollLeft(scrollLeft);
+          }
         }
-      }
-    });
-  }).trigger('init.scrolling-tabs');
+      });
+    })
+    .trigger('init.scrolling-tabs');
 }

app/assets/javascripts/line_highlighter.js

@@ -70,7 +70,7 @@ LineHighlighter.prototype.highlightHash = function(newHash) {
       const scrollOptions = {
         // Scroll to the first highlighted line on initial load
         // Offset -50 for the sticky top bar, and another -100 for some context
-        offset: -150
+        offset: -150,
       };
       if (this.options.scrollFileHolder) {
         $(this.options.fileHolderSelector).scrollTo(lineSelector, scrollOptions);
@@ -85,7 +85,9 @@ LineHighlighter.prototype.clickHandler = function(event) {
   var current, lineNumber, range;
   event.preventDefault();
   this.clearHighlight();
-  lineNumber = $(event.target).closest('a').data('lineNumber');
+  lineNumber = $(event.target)
+    .closest('a')
+    .data('lineNumber');
   current = this.hashToRange(this._hash);
   if (!(current[0] && event.shiftKey)) {
     // If there's no current selection, or there is but Shift wasn't held,
@@ -104,7 +106,7 @@ LineHighlighter.prototype.clickHandler = function(event) {
 };
 
 LineHighlighter.prototype.clearHighlight = function() {
-  return $("." + this.highlightLineClass).removeClass(this.highlightLineClass);
+  return $('.' + this.highlightLineClass).removeClass(this.highlightLineClass);
 };
 
 // Convert a URL hash String into line numbers
@@ -135,7 +137,7 @@ LineHighlighter.prototype.hashToRange = function(hash) {
 //
 // lineNumber - Line number to highlight
 LineHighlighter.prototype.highlightLine = function(lineNumber) {
-  return $("#LC" + lineNumber).addClass(this.highlightLineClass);
+  return $('#LC' + lineNumber).addClass(this.highlightLineClass);
 };
 
 // Highlight all lines within a range
@@ -160,9 +162,9 @@ LineHighlighter.prototype.highlightRange = function(range) {
 LineHighlighter.prototype.setHash = function(firstLineNumber, lastLineNumber) {
   var hash;
   if (lastLineNumber) {
-    hash = "#L" + firstLineNumber + "-" + lastLineNumber;
+    hash = '#L' + firstLineNumber + '-' + lastLineNumber;
   } else {
-    hash = "#L" + firstLineNumber;
+    hash = '#L' + firstLineNumber;
   }
   this._hash = hash;
   return this.__setLocationHash__(hash);
@@ -172,11 +174,15 @@ LineHighlighter.prototype.setHash = function(firstLineNumber, lastLineNumber) {
 //
 // This method is stubbed in tests.
 LineHighlighter.prototype.__setLocationHash__ = function(value) {
-  return window.history.pushState({
-    url: value
-  // We're using pushState instead of assigning location.hash directly to
-  // prevent the page from scrolling on the hashchange event
-  }, document.title, value);
+  return window.history.pushState(
+    {
+      url: value,
+      // We're using pushState instead of assigning location.hash directly to
+      // prevent the page from scrolling on the hashchange event
+    },
+    document.title,
+    value,
+  );
 };
 
 export default LineHighlighter;

app/assets/javascripts/locale/sprintf.js

@@ -15,7 +15,7 @@ export default (input, parameters, escapeParameters = true) => {
   let output = input;
 
   if (parameters) {
-    Object.keys(parameters).forEach((parameterName) => {
+    Object.keys(parameters).forEach(parameterName => {
       const parameterValue = parameters[parameterName];
       const escapedParameterValue = escapeParameters ? _.escape(parameterValue) : parameterValue;
       output = output.replace(new RegExp(`%{${parameterName}}`, 'g'), escapedParameterValue);

app/assets/javascripts/member_expiration_date.js

@@ -9,7 +9,9 @@ import { parsePikadayDate, pikadayToString } from './lib/utils/datefix';
 //
 export default function memberExpirationDate(selector = '.js-access-expiration-date') {
   function toggleClearInput() {
-    $(this).closest('.clearable-input').toggleClass('has-value', $(this).val() !== '');
+    $(this)
+      .closest('.clearable-input')
+      .toggleClass('has-value', $(this).val() !== '');
   }
   const inputs = $(selector);
 
@@ -40,7 +42,9 @@ export default function memberExpirationDate(selector = '.js-access-expiration-d
   inputs.next('.js-clear-input').on('click', function clicked(event) {
     event.preventDefault();
 
-    const input = $(this).closest('.clearable-input').find(selector);
+    const input = $(this)
+      .closest('.clearable-input')
+      .find(selector);
     const calendar = input.data('pikaday');
 
     calendar.setDate(null);

app/assets/javascripts/merge_request.js

@@ -16,26 +16,29 @@ function MergeRequest(opts) {
   this.opts = opts != null ? opts : {};
   this.submitNoteForm = this.submitNoteForm.bind(this);
   this.$el = $('.merge-request');
-  this.$('.show-all-commits').on('click', (function(_this) {
-    return function() {
-      return _this.showAllCommits();
-    };
-  })(this));
+  this.$('.show-all-commits').on(
+    'click',
+    (function(_this) {
+      return function() {
+        return _this.showAllCommits();
+      };
+    })(this),
+  );
 
   this.initTabs();
   this.initMRBtnListeners();
   this.initCommitMessageListeners();
   this.closeReopenReportToggle = IssuablesHelper.initCloseReopenReport();
 
-  if ($("a.btn-close").length) {
+  if ($('a.btn-close').length) {
     this.taskList = new TaskList({
       dataType: 'merge_request',
       fieldName: 'description',
       selector: '.detail-page-description',
-      onSuccess: (result) => {
+      onSuccess: result => {
         document.querySelector('#task_status').innerText = result.task_status;
         document.querySelector('#task_status_short').innerText = result.task_status_short;
-      }
+      },
     });
   }
 }
@@ -84,7 +87,7 @@ MergeRequest.prototype.initMRBtnListeners = function() {
 
 MergeRequest.prototype.submitNoteForm = function(form, $button) {
   var noteText;
-  noteText = form.find("textarea.js-note-text").val();
+  noteText = form.find('textarea.js-note-text').val();
   if (noteText.trim().length > 0) {
     form.submit();
     $button.data('submitted', true);
@@ -122,7 +125,7 @@ MergeRequest.setStatusBoxToMerged = function() {
 
 MergeRequest.decreaseCounter = function(by = 1) {
   const $el = $('.js-merge-counter');
-  const count = Math.max((parseInt($el.text().replace(/[^\d]/, ''), 10) - by), 0);
+  const count = Math.max(parseInt($el.text().replace(/[^\d]/, ''), 10) - by, 0);
 
   $el.text(addDelimiter(count));
 };

app/assets/javascripts/milestone.js

@@ -15,7 +15,7 @@ export default class Milestone {
   }
 
   bindTabsSwitching() {
-    return $('a[data-toggle="tab"]').on('show.bs.tab', (e) => {
+    return $('a[data-toggle="tab"]').on('show.bs.tab', e => {
       const $target = $(e.target);
 
       window.location.hash = $target.attr('href');
@@ -36,7 +36,8 @@ export default class Milestone {
     const tabElId = $target.attr('href');
 
     if (endpoint && !$target.hasClass('is-loaded')) {
-      axios.get(endpoint)
+      axios
+        .get(endpoint)
         .then(({ data }) => {
           $(tabElId).html(data.html);
           $target.addClass('is-loaded');
@@ -46,23 +47,28 @@ export default class Milestone {
   }
 
   static initDeprecationMessage() {
-    const deprecationMesssageContainer = document.querySelector('.js-milestone-deprecation-message');
+    const deprecationMesssageContainer = document.querySelector(
+      '.js-milestone-deprecation-message',
+    );
 
     if (!deprecationMesssageContainer) return;
 
-    const deprecationMessage = deprecationMesssageContainer.querySelector('.js-milestone-deprecation-message-template').innerHTML;
+    const deprecationMessage = deprecationMesssageContainer.querySelector(
+      '.js-milestone-deprecation-message-template',
+    ).innerHTML;
     const $popover = $('.js-popover-link', deprecationMesssageContainer);
     const hideOnScroll = togglePopover.bind($popover, false);
 
-    $popover.popover({
-      content: deprecationMessage,
-      html: true,
-      placement: 'bottom',
-    })
-    .on('mouseenter', mouseenter)
-    .on('mouseleave', debouncedMouseleave())
-    .on('show.bs.popover', () => {
-      window.addEventListener('scroll', hideOnScroll, { once: true });
-    });
+    $popover
+      .popover({
+        content: deprecationMessage,
+        html: true,
+        placement: 'bottom',
+      })
+      .on('mouseenter', mouseenter)
+      .on('mouseleave', debouncedMouseleave())
+      .on('show.bs.popover', () => {
+        window.addEventListener('scroll', hideOnScroll, { once: true });
+      });
   }
 }

app/assets/javascripts/mini_pipeline_graph_dropdown.js

@@ -46,7 +46,7 @@ export default class MiniPipelineGraph {
     $(document).on(
       'click',
       `${this.container} .js-builds-dropdown-list a.mini-pipeline-graph-dropdown-item`,
-      (e) => {
+      e => {
         e.stopPropagation();
       },
     );
@@ -82,7 +82,8 @@ export default class MiniPipelineGraph {
     this.renderBuildsList(button, '');
     this.toggleLoading(button);
 
-    axios.get(endpoint)
+    axios
+      .get(endpoint)
       .then(({ data }) => {
         this.toggleLoading(button);
         this.renderBuildsList(button, data.html);
@@ -90,7 +91,11 @@ export default class MiniPipelineGraph {
       })
       .catch(() => {
         this.toggleLoading(button);
-        if ($(button).parent().hasClass('open')) {
+        if (
+          $(button)
+            .parent()
+            .hasClass('open')
+        ) {
           $(button).dropdown('toggle');
         }
         flash('An error occurred while fetching the builds.', 'alert');
@@ -104,8 +109,8 @@ export default class MiniPipelineGraph {
    * @return {type}
    */
   toggleLoading(stageContainer) {
-    stageContainer.parentElement.querySelector(
-      `${this.dropdownListSelector} .js-builds-dropdown-loading`,
-    ).classList.toggle('hidden');
+    stageContainer.parentElement
+      .querySelector(`${this.dropdownListSelector} .js-builds-dropdown-loading`)
+      .classList.toggle('hidden');
   }
 }

app/assets/javascripts/namespace_select.js

@@ -14,14 +14,14 @@ export default class NamespaceSelect {
       selectable: true,
       filterRemote: true,
       search: {
-        fields: ['path']
+        fields: ['path'],
       },
       fieldName: fieldName,
       toggleLabel: function(selected) {
         if (selected.id == null) {
           return selected.text;
         } else {
-          return selected.kind + ": " + selected.full_path;
+          return selected.kind + ': ' + selected.full_path;
         }
       },
       data: function(term, dataCallback) {
@@ -29,7 +29,7 @@ export default class NamespaceSelect {
           if (isFilter) {
             const anyNamespace = {
               text: 'Any namespace',
-              id: null
+              id: null,
             };
             namespaces.unshift(anyNamespace);
             namespaces.splice(1, 0, 'divider');
@@ -41,7 +41,7 @@ export default class NamespaceSelect {
         if (namespace.id == null) {
           return namespace.text;
         } else {
-          return namespace.kind + ": " + namespace.full_path;
+          return namespace.kind + ': ' + namespace.full_path;
         }
       },
       renderRow: this.renderRow,

app/assets/javascripts/network/branch_graph.js

@@ -20,7 +20,7 @@ export default (function() {
     this.mtime = 0;
     this.mspace = 0;
     this.parents = {};
-    this.colors = ["#000"];
+    this.colors = ['#000'];
     this.offsetX = 150;
     this.offsetY = 20;
     this.unitTime = 30;
@@ -30,9 +30,10 @@ export default (function() {
   }
 
   BranchGraph.prototype.load = function() {
-    axios.get(this.options.url)
+    axios
+      .get(this.options.url)
       .then(({ data }) => {
-        $(".loading", this.element).hide();
+        $('.loading', this.element).hide();
         this.prepareData(data.days, data.commits);
         this.buildGraph();
       })
@@ -71,17 +72,19 @@ export default (function() {
       c = ref[j];
       this.mtime = Math.max(this.mtime, c.time);
       this.mspace = Math.max(this.mspace, c.space);
-      results.push((function() {
-        var l, len1, ref1, results1;
-        ref1 = c.parents;
-        results1 = [];
-        for (l = 0, len1 = ref1.length; l < len1; l += 1) {
-          p = ref1[l];
-          this.parents[p[0]] = true;
-          results1.push(this.mspace = Math.max(this.mspace, p[1]));
-        }
-        return results1;
-      }).call(this));
+      results.push(
+        function() {
+          var l, len1, ref1, results1;
+          ref1 = c.parents;
+          results1 = [];
+          for (l = 0, len1 = ref1.length; l < len1; l += 1) {
+            p = ref1[l];
+            this.parents[p[0]] = true;
+            results1.push((this.mspace = Math.max(this.mspace, p[1])));
+          }
+          return results1;
+        }.call(this),
+      );
     }
     return results;
   };
@@ -91,11 +94,11 @@ export default (function() {
     k = 0;
     results = [];
     while (k < this.mspace) {
-      this.colors.push(Raphael.getColor(.8));
+      this.colors.push(Raphael.getColor(0.8));
       // Skipping a few colors in the spectrum to get more contrast between colors
       Raphael.getColor();
       Raphael.getColor();
-      results.push(k += 1);
+      results.push((k += 1));
     }
     return results;
   };
@@ -104,12 +107,12 @@ export default (function() {
     var cuday, cumonth, day, j, len, mm, ref;
     const { r } = this;
     cuday = 0;
-    cumonth = "";
+    cumonth = '';
     r.rect(0, 0, 40, this.barHeight).attr({
-      fill: "#222"
+      fill: '#222',
     });
     r.rect(40, 0, 30, this.barHeight).attr({
-      fill: "#444"
+      fill: '#444',
     });
     ref = this.days;
 
@@ -118,16 +121,16 @@ export default (function() {
       if (cuday !== day[0] || cumonth !== day[1]) {
         // Dates
         r.text(55, this.offsetY + this.unitTime * mm, day[0]).attr({
-          font: "12px Monaco, monospace",
-          fill: "#BBB"
+          font: '12px Monaco, monospace',
+          fill: '#BBB',
         });
         [cuday] = day;
       }
       if (cumonth !== day[1]) {
         // Months
         r.text(20, this.offsetY + this.unitTime * mm, day[1]).attr({
-          font: "12px Monaco, monospace",
-          fill: "#EEE"
+          font: '12px Monaco, monospace',
+          fill: '#EEE',
         });
 
         // eslint-disable-next-line prefer-destructuring
@@ -173,11 +176,13 @@ export default (function() {
   BranchGraph.prototype.bindEvents = function() {
     const { element } = this;
 
-    return $(element).scroll((function(_this) {
-      return function(event) {
-        return _this.renderPartialGraph();
-      };
-    })(this));
+    return $(element).scroll(
+      (function(_this) {
+        return function(event) {
+          return _this.renderPartialGraph();
+        };
+      })(this),
+    );
   };
 
   BranchGraph.prototype.scrollDown = function() {
@@ -219,46 +224,53 @@ export default (function() {
     shortrefs = commit.refs;
     // Truncate if longer than 15 chars
     if (shortrefs.length > 17) {
-      shortrefs = shortrefs.substr(0, 15) + "…";
+      shortrefs = shortrefs.substr(0, 15) + '…';
     }
     text = r.text(x + 4, y, shortrefs).attr({
-      "text-anchor": "start",
-      font: "10px Monaco, monospace",
-      fill: "#FFF",
-      title: commit.refs
+      'text-anchor': 'start',
+      font: '10px Monaco, monospace',
+      fill: '#FFF',
+      title: commit.refs,
     });
     textbox = text.getBBox();
     // Create rectangle based on the size of the textbox
     rect = r.rect(x, y - 7, textbox.width + 5, textbox.height + 5, 4).attr({
-      fill: "#000",
-      "fill-opacity": .5,
-      stroke: "none"
+      fill: '#000',
+      'fill-opacity': 0.5,
+      stroke: 'none',
     });
-    triangle = r.path(["M", x - 5, y, "L", x - 15, y - 4, "L", x - 15, y + 4, "Z"]).attr({
-      fill: "#000",
-      "fill-opacity": .5,
-      stroke: "none"
+    triangle = r.path(['M', x - 5, y, 'L', x - 15, y - 4, 'L', x - 15, y + 4, 'Z']).attr({
+      fill: '#000',
+      'fill-opacity': 0.5,
+      stroke: 'none',
     });
     label = r.set(rect, text);
-    label.transform(["t", -rect.getBBox().width - 15, 0]);
+    label.transform(['t', -rect.getBBox().width - 15, 0]);
     // Set text to front
     return text.toFront();
   };
 
   BranchGraph.prototype.appendAnchor = function(x, y, commit) {
     const { r, top, options } = this;
-    const anchor = r.circle(x, y, 10).attr({
-      fill: "#000",
-      opacity: 0,
-      cursor: "pointer"
-    }).click(function() {
-      return window.open(options.commit_url.replace("%s", commit.id), "_blank");
-    }).hover(function() {
-      this.tooltip = r.commitTooltip(x + 5, y, commit);
-      return top.push(this.tooltip.insertBefore(this));
-    }, function() {
-      return this.tooltip && this.tooltip.remove() && delete this.tooltip;
-    });
+    const anchor = r
+      .circle(x, y, 10)
+      .attr({
+        fill: '#000',
+        opacity: 0,
+        cursor: 'pointer',
+      })
+      .click(function() {
+        return window.open(options.commit_url.replace('%s', commit.id), '_blank');
+      })
+      .hover(
+        function() {
+          this.tooltip = r.commitTooltip(x + 5, y, commit);
+          return top.push(this.tooltip.insertBefore(this));
+        },
+        function() {
+          return this.tooltip && this.tooltip.remove() && delete this.tooltip;
+        },
+      );
     return top.push(anchor);
   };
 
@@ -266,7 +278,7 @@ export default (function() {
     const { r } = this;
     r.circle(x, y, 3).attr({
       fill: this.colors[commit.space],
-      stroke: "none"
+      stroke: 'none',
     });
 
     const avatar_box_x = this.offsetX + this.unitSpace * this.mspace + 10;
@@ -274,13 +286,15 @@ export default (function() {
 
     r.rect(avatar_box_x, avatar_box_y, 20, 20).attr({
       stroke: this.colors[commit.space],
-      "stroke-width": 2
+      'stroke-width': 2,
     });
     r.image(commit.author.icon, avatar_box_x, avatar_box_y, 20, 20);
-    return r.text(this.offsetX + this.unitSpace * this.mspace + 35, y, commit.message.split("\n")[0]).attr({
-      "text-anchor": "start",
-      font: "14px Monaco, monospace"
-    });
+    return r
+      .text(this.offsetX + this.unitSpace * this.mspace + 35, y, commit.message.split('\n')[0])
+      .attr({
+        'text-anchor': 'start',
+        font: '14px Monaco, monospace',
+      });
   };
 
   BranchGraph.prototype.drawLines = function(x, y, commit) {
@@ -304,30 +318,32 @@ export default (function() {
       // Build line shape
       if (parent[1] === commit.space) {
         offset = [0, 5];
-        arrow = "l-2,5,4,0,-2,-5,0,5";
+        arrow = 'l-2,5,4,0,-2,-5,0,5';
       } else if (parent[1] < commit.space) {
         offset = [3, 3];
-        arrow = "l5,0,-2,4,-3,-4,4,2";
+        arrow = 'l5,0,-2,4,-3,-4,4,2';
       } else {
         offset = [-3, 3];
-        arrow = "l-5,0,2,4,3,-4,-4,2";
+        arrow = 'l-5,0,2,4,3,-4,-4,2';
       }
       // Start point
-      route = ["M", x + offset[0], y + offset[1]];
+      route = ['M', x + offset[0], y + offset[1]];
       // Add arrow if not first parent
       if (i > 0) {
         route.push(arrow);
       }
       // Circumvent if overlap
       if (commit.space !== parentCommit.space || commit.space !== parent[1]) {
-        route.push("L", parentX2, y + 10, "L", parentX2, parentY - 5);
+        route.push('L', parentX2, y + 10, 'L', parentX2, parentY - 5);
       }
       // End point
-      route.push("L", parentX1, parentY);
-      results.push(r.path(route).attr({
-        stroke: color,
-        "stroke-width": 2
-      }));
+      route.push('L', parentX1, parentY);
+      results.push(
+        r.path(route).attr({
+          stroke: color,
+          'stroke-width': 2,
+        }),
+      );
     }
     return results;
   };
@@ -337,10 +353,10 @@ export default (function() {
       const { r } = this;
       const x = this.offsetX + this.unitSpace * (this.mspace - commit.space);
       const y = this.offsetY + this.unitTime * commit.time;
-      r.path(["M", x + 5, y, "L", x + 15, y + 4, "L", x + 15, y - 4, "Z"]).attr({
-        fill: "#000",
-        "fill-opacity": .5,
-        stroke: "none"
+      r.path(['M', x + 5, y, 'L', x + 15, y + 4, 'L', x + 15, y - 4, 'Z']).attr({
+        fill: '#000',
+        'fill-opacity': 0.5,
+        stroke: 'none',
       });
       // Displayed in the center
       return this.element.scrollTop(y - this.graphHeight / 2);

app/assets/javascripts/network/raphael.js

@@ -49,7 +49,7 @@ Raphael.prototype.textWrap = function testWrap(t, width) {
   const s = [];
   for (let j = 0, len = words.length; j < len; j += 1) {
     const word = words[j];
-    if (x + (word.length * letterWidth) > width) {
+    if (x + word.length * letterWidth > width) {
       s.push('\n');
       x = 0;
     }

app/assets/javascripts/new_branch_form.js

@@ -30,24 +30,24 @@ export default class NewBranchForm {
     startsWith = {
       pattern: /^(\/|\.)/g,
       prefix: "can't start with",
-      conjunction: "or"
+      conjunction: 'or',
     };
     endsWith = {
       pattern: /(\/|\.|\.lock)$/g,
       prefix: "can't end in",
-      conjunction: "or"
+      conjunction: 'or',
     };
     invalid = {
       pattern: /(\s|~|\^|:|\?|\*|\[|\\|\.\.|@\{|\/{2,}){1}/g,
       prefix: "can't contain",
-      conjunction: ", "
+      conjunction: ', ',
     };
     single = {
       pattern: /^@+$/g,
       prefix: "can't be",
-      conjunction: "or"
+      conjunction: 'or',
     };
-    return this.restrictions = [startsWith, invalid, endsWith, single];
+    return (this.restrictions = [startsWith, invalid, endsWith, single]);
   }
 
   validate() {
@@ -73,7 +73,7 @@ export default class NewBranchForm {
             return "'" + value + "'";
         }
       });
-      return restriction.prefix + " " + (formatted.join(restriction.conjunction));
+      return restriction.prefix + ' ' + formatted.join(restriction.conjunction);
     };
     validator = (function(_this) {
       return function(errors, restriction) {
@@ -88,7 +88,7 @@ export default class NewBranchForm {
     })(this);
     errors = this.restrictions.reduce(validator, []);
     if (errors.length > 0) {
-      errorMessage = $("<span/>").text(errors.join(', '));
+      errorMessage = $('<span/>').text(errors.join(', '));
       return this.branchNameError.append(errorMessage);
     }
   }

app/assets/javascripts/new_commit_form.js

@@ -6,9 +6,7 @@ export default class NewCommitForm {
     this.branchName = form.find('.js-branch-name');
     this.originalBranch = form.find('.js-original-branch');
     this.createMergeRequest = form.find('.js-create-merge-request');
-    this.createMergeRequestContainer = form.find(
-      '.js-create-merge-request-container',
-    );
+    this.createMergeRequestContainer = form.find('.js-create-merge-request-container');
     this.branchName.keyup(this.renderDestination);
     this.renderDestination();
   }

app/assets/javascripts/notifications_dropdown.js

@@ -18,7 +18,9 @@ export default function notificationsDropdown() {
 
   $(document).on('ajax:success', '.notification-form', (e, data) => {
     if (data.saved) {
-      $(e.currentTarget).closest('.js-notification-dropdown').replaceWith(data.html);
+      $(e.currentTarget)
+        .closest('.js-notification-dropdown')
+        .replaceWith(data.html);
     } else {
       Flash('Failed to save new settings', 'alert');
     }

app/assets/javascripts/notifications_form.js

@@ -22,7 +22,8 @@ export default class NotificationsForm {
 
   // eslint-disable-next-line class-methods-use-this
   showCheckboxLoadingSpinner($parent) {
-    $parent.addClass('is-loading')
+    $parent
+      .addClass('is-loading')
       .find('.custom-notification-event-loading')
       .removeClass('fa-check')
       .addClass('fa-spin fa-spinner')
@@ -38,9 +39,12 @@ export default class NotificationsForm {
       .then(({ data }) => {
         $checkbox.enable();
         if (data.saved) {
-          $parent.find('.custom-notification-event-loading').toggleClass('fa-spin fa-spinner fa-check is-done');
+          $parent
+            .find('.custom-notification-event-loading')
+            .toggleClass('fa-spin fa-spinner fa-check is-done');
           setTimeout(() => {
-            $parent.removeClass('is-loading')
+            $parent
+              .removeClass('is-loading')
               .find('.custom-notification-event-loading')
               .toggleClass('fa-spin fa-spinner fa-check is-done');
           }, 2000);

app/assets/javascripts/pager.js

@@ -24,22 +24,25 @@ export default {
 
   getOld() {
     this.loading.show();
-    axios.get(this.url, {
-      params: {
-        limit: this.limit,
-        offset: this.offset,
-      },
-    }).then(({ data }) => {
-      this.append(data.count, this.prepareData(data.html));
-      this.callback();
+    axios
+      .get(this.url, {
+        params: {
+          limit: this.limit,
+          offset: this.offset,
+        },
+      })
+      .then(({ data }) => {
+        this.append(data.count, this.prepareData(data.html));
+        this.callback();
 
-      // keep loading until we've filled the viewport height
-      if (!this.disable && !this.isScrollable()) {
-        this.getOld();
-      } else {
-        this.loading.hide();
-      }
-    }).catch(() => this.loading.hide());
+        // keep loading until we've filled the viewport height
+        if (!this.disable && !this.isScrollable()) {
+          this.getOld();
+        } else {
+          this.loading.hide();
+        }
+      })
+      .catch(() => this.loading.hide());
   },
 
   append(count, html) {

app/assets/javascripts/pdf/index.vue

 <script>
-  import pdfjsLib from 'vendor/pdf';
-  import workerSrc from 'vendor/pdf.worker.min';
+import pdfjsLib from 'vendor/pdf';
+import workerSrc from 'vendor/pdf.worker.min';
 
-  import page from './page/index.vue';
+import page from './page/index.vue';
 
-  export default {
-    components: { page },
-    props: {
-      pdf: {
-        type: [String, Uint8Array],
-        required: true,
-      },
+export default {
+  components: { page },
+  props: {
+    pdf: {
+      type: [String, Uint8Array],
+      required: true,
     },
-    data() {
-      return {
-        loading: false,
-        pages: [],
-      };
+  },
+  data() {
+    return {
+      loading: false,
+      pages: [],
+    };
+  },
+  computed: {
+    document() {
+      return typeof this.pdf === 'string' ? this.pdf : { data: this.pdf };
     },
-    computed: {
-      document() {
-        return typeof this.pdf === 'string' ? this.pdf : { data: this.pdf };
-      },
-      hasPDF() {
-        return this.pdf && this.pdf.length > 0;
-      },
+    hasPDF() {
+      return this.pdf && this.pdf.length > 0;
     },
-    watch: { pdf: 'load' },
-    mounted() {
-      pdfjsLib.PDFJS.workerSrc = workerSrc;
-      if (this.hasPDF) this.load();
+  },
+  watch: { pdf: 'load' },
+  mounted() {
+    pdfjsLib.PDFJS.workerSrc = workerSrc;
+    if (this.hasPDF) this.load();
+  },
+  methods: {
+    load() {
+      this.pages = [];
+      return pdfjsLib
+        .getDocument(this.document)
+        .then(this.renderPages)
+        .then(() => this.$emit('pdflabload'))
+        .catch(error => this.$emit('pdflaberror', error))
+        .then(() => {
+          this.loading = false;
+        });
     },
-    methods: {
-      load() {
-        this.pages = [];
-        return pdfjsLib.getDocument(this.document)
-          .then(this.renderPages)
-          .then(() => this.$emit('pdflabload'))
-          .catch(error => this.$emit('pdflaberror', error))
-          .then(() => { this.loading = false; });
-      },
-      renderPages(pdf) {
-        const pagePromises = [];
-        this.loading = true;
-        for (let num = 1; num <= pdf.numPages; num += 1) {
-          pagePromises.push(
-            pdf.getPage(num).then(p => this.pages.push(p)),
-          );
-        }
-        return Promise.all(pagePromises);
-      },
+    renderPages(pdf) {
+      const pagePromises = [];
+      this.loading = true;
+      for (let num = 1; num <= pdf.numPages; num += 1) {
+        pagePromises.push(pdf.getPage(num).then(p => this.pages.push(p)));
+      }
+      return Promise.all(pagePromises);
     },
-  };
+  },
+};
 </script>
 
 <template>
@@ -69,9 +70,9 @@
 </template>
 
 <style>
-  .pdf-viewer {
-    background: url('./assets/img/bg.gif');
-    display: flex;
-    flex-flow: column nowrap;
-  }
+.pdf-viewer {
+  background: url('./assets/img/bg.gif');
+  display: flex;
+  flex-flow: column nowrap;
+}
 </style>

app/assets/javascripts/pdf/page/index.vue

 <script>
-  export default {
-    props: {
-      page: {
-        type: Object,
-        required: true,
-      },
-      number: {
-        type: Number,
-        required: true,
-      },
+export default {
+  props: {
+    page: {
+      type: Object,
+      required: true,
     },
-    data() {
-      return {
-        scale: 4,
-        rendering: false,
-      };
+    number: {
+      type: Number,
+      required: true,
+    },
+  },
+  data() {
+    return {
+      scale: 4,
+      rendering: false,
+    };
+  },
+  computed: {
+    viewport() {
+      return this.page.getViewport(this.scale);
     },
-    computed: {
-      viewport() {
-        return this.page.getViewport(this.scale);
-      },
-      context() {
-        return this.$refs.canvas.getContext('2d');
-      },
-      renderContext() {
-        return {
-          canvasContext: this.context,
-          viewport: this.viewport,
-        };
-      },
+    context() {
+      return this.$refs.canvas.getContext('2d');
     },
-    mounted() {
-      this.$refs.canvas.height = this.viewport.height;
-      this.$refs.canvas.width = this.viewport.width;
-      this.rendering = true;
-      this.page.render(this.renderContext)
-        .then(() => { this.rendering = false; })
-        .catch(error => this.$emit('pdflaberror', error));
+    renderContext() {
+      return {
+        canvasContext: this.context,
+        viewport: this.viewport,
+      };
     },
-  };
+  },
+  mounted() {
+    this.$refs.canvas.height = this.viewport.height;
+    this.$refs.canvas.width = this.viewport.width;
+    this.rendering = true;
+    this.page
+      .render(this.renderContext)
+      .then(() => {
+        this.rendering = false;
+      })
+      .catch(error => this.$emit('pdflaberror', error));
+  },
+};
 </script>
 
 <template>
@@ -51,20 +54,20 @@
 </template>
 
 <style>
-  .pdf-page {
-    margin: 8px auto 0 auto;
-    border-top: 1px #ddd solid;
-    border-bottom: 1px #ddd solid;
-    width: 100%;
-  }
+.pdf-page {
+  margin: 8px auto 0 auto;
+  border-top: 1px #ddd solid;
+  border-bottom: 1px #ddd solid;
+  width: 100%;
+}
 
-  .pdf-page:first-child {
-    margin-top: 0px;
-    border-top: 0px;
-  }
+.pdf-page:first-child {
+  margin-top: 0px;
+  border-top: 0px;
+}
 
-  .pdf-page:last-child {
-    margin-bottom: 0px;
-    border-bottom: 0px;
-  }
+.pdf-page:last-child {
+  margin-bottom: 0px;
+  border-bottom: 0px;
+}
 </style>

app/assets/javascripts/pipelines/components/pipelines_table_row.vue

@@ -64,10 +64,7 @@ export default {
         return [];
       }
       const { details } = this.pipeline;
-      return [
-        ...(details.manual_actions || []),
-        ...(details.scheduled_actions || []),
-      ];
+      return [...(details.manual_actions || []), ...(details.scheduled_actions || [])];
     },
     /**
      * If provided, returns the commit tag.

app/assets/javascripts/project_find_file.js

@@ -10,14 +10,14 @@ import { __ } from '~/locale';
 const highlighter = function(element, text, matches) {
   var highlightText, j, lastIndex, len, matchIndex, matchedChars, unmatched;
   lastIndex = 0;
-  highlightText = "";
+  highlightText = '';
   matchedChars = [];
   for (j = 0, len = matches.length; j < len; j += 1) {
     matchIndex = matches[j];
     unmatched = text.substring(lastIndex, matchIndex);
     if (unmatched) {
       if (matchedChars.length) {
-        element.append(matchedChars.join("").bold());
+        element.append(matchedChars.join('').bold());
       }
       matchedChars = [];
       element.append(document.createTextNode(unmatched));
@@ -26,7 +26,7 @@ const highlighter = function(element, text, matches) {
     lastIndex = matchIndex + 1;
   }
   if (matchedChars.length) {
-    element.append(matchedChars.join("").bold());
+    element.append(matchedChars.join('').bold());
   }
   return element.append(document.createTextNode(text.substring(lastIndex)));
 };
@@ -40,7 +40,7 @@ export default class ProjectFindFile {
     this.selectRowDown = this.selectRowDown.bind(this);
     this.selectRowUp = this.selectRowUp.bind(this);
     this.filePaths = {};
-    this.inputElement = this.element.find(".file-finder-input");
+    this.inputElement = this.element.find('.file-finder-input');
     // init event
     this.initEvent();
     // focus text input box
@@ -50,38 +50,51 @@ export default class ProjectFindFile {
   }
 
   initEvent() {
-    this.inputElement.off("keyup");
-    this.inputElement.on("keyup", (function(_this) {
-      return function(event) {
-        var oldValue, ref, target, value;
-        target = $(event.target);
-        value = target.val();
-        oldValue = (ref = target.data("oldValue")) != null ? ref : "";
-        if (value !== oldValue) {
-          target.data("oldValue", value);
-          _this.findFile();
-          return _this.element.find("tr.tree-item").eq(0).addClass("selected").focus();
-        }
-      };
-    })(this));
+    this.inputElement.off('keyup');
+    this.inputElement.on(
+      'keyup',
+      (function(_this) {
+        return function(event) {
+          var oldValue, ref, target, value;
+          target = $(event.target);
+          value = target.val();
+          oldValue = (ref = target.data('oldValue')) != null ? ref : '';
+          if (value !== oldValue) {
+            target.data('oldValue', value);
+            _this.findFile();
+            return _this.element
+              .find('tr.tree-item')
+              .eq(0)
+              .addClass('selected')
+              .focus();
+          }
+        };
+      })(this),
+    );
   }
 
   findFile() {
     var result, searchText;
     searchText = this.inputElement.val();
-    result = searchText.length > 0 ? fuzzaldrinPlus.filter(this.filePaths, searchText) : this.filePaths;
+    result =
+      searchText.length > 0 ? fuzzaldrinPlus.filter(this.filePaths, searchText) : this.filePaths;
     return this.renderList(result, searchText);
-  // find file
+    // find file
   }
 
   // files pathes load
   load(url) {
-    axios.get(url)
+    axios
+      .get(url)
       .then(({ data }) => {
         this.element.find('.loading').hide();
         this.filePaths = data;
         this.findFile();
-        this.element.find('.files-slider tr.tree-item').eq(0).addClass('selected').focus();
+        this.element
+          .find('.files-slider tr.tree-item')
+          .eq(0)
+          .addClass('selected')
+          .focus();
       })
       .catch(() => flash(__('An error occurred while loading filenames')));
   }
@@ -89,7 +102,7 @@ export default class ProjectFindFile {
   // render result
   renderList(filePaths, searchText) {
     var blobItemUrl, filePath, html, i, len, matches, results;
-    this.element.find(".tree-table > tbody").empty();
+    this.element.find('.tree-table > tbody').empty();
     results = [];
 
     for (i = 0, len = filePaths.length; i < len; i += 1) {
@@ -100,9 +113,9 @@ export default class ProjectFindFile {
       if (searchText) {
         matches = fuzzaldrinPlus.match(filePath, searchText);
       }
-      blobItemUrl = this.options.blobUrlTemplate + "/" + filePath;
+      blobItemUrl = this.options.blobUrlTemplate + '/' + filePath;
       html = ProjectFindFile.makeHtml(filePath, matches, blobItemUrl);
-      results.push(this.element.find(".tree-table > tbody").append(html));
+      results.push(this.element.find('.tree-table > tbody').append(html));
     }
     return results;
   }
@@ -110,52 +123,56 @@ export default class ProjectFindFile {
   // make tbody row html
   static makeHtml(filePath, matches, blobItemUrl) {
     var $tr;
-    $tr = $("<tr class='tree-item'><td class='tree-item-file-name link-container'><a><i class='fa fa-file-text-o fa-fw'></i><span class='str-truncated'></span></a></td></tr>");
+    $tr = $(
+      "<tr class='tree-item'><td class='tree-item-file-name link-container'><a><i class='fa fa-file-text-o fa-fw'></i><span class='str-truncated'></span></a></td></tr>",
+    );
     if (matches) {
-      $tr.find("a").replaceWith(highlighter($tr.find("a"), filePath, matches).attr("href", blobItemUrl));
+      $tr
+        .find('a')
+        .replaceWith(highlighter($tr.find('a'), filePath, matches).attr('href', blobItemUrl));
     } else {
-      $tr.find("a").attr("href", blobItemUrl);
-      $tr.find(".str-truncated").text(filePath);
+      $tr.find('a').attr('href', blobItemUrl);
+      $tr.find('.str-truncated').text(filePath);
     }
     return $tr;
   }
 
   selectRow(type) {
     var next, rows, selectedRow;
-    rows = this.element.find(".files-slider tr.tree-item");
-    selectedRow = this.element.find(".files-slider tr.tree-item.selected");
+    rows = this.element.find('.files-slider tr.tree-item');
+    selectedRow = this.element.find('.files-slider tr.tree-item.selected');
     if (rows && rows.length > 0) {
       if (selectedRow && selectedRow.length > 0) {
-        if (type === "UP") {
+        if (type === 'UP') {
           next = selectedRow.prev();
-        } else if (type === "DOWN") {
+        } else if (type === 'DOWN') {
           next = selectedRow.next();
         }
         if (next.length > 0) {
-          selectedRow.removeClass("selected");
+          selectedRow.removeClass('selected');
           selectedRow = next;
         }
       } else {
         selectedRow = rows.eq(0);
       }
-      return selectedRow.addClass("selected").focus();
+      return selectedRow.addClass('selected').focus();
     }
   }
 
   selectRowUp() {
-    return this.selectRow("UP");
+    return this.selectRow('UP');
   }
 
   selectRowDown() {
-    return this.selectRow("DOWN");
+    return this.selectRow('DOWN');
   }
 
   goToTree() {
-    return window.location.href = this.options.treeUrl;
+    return (window.location.href = this.options.treeUrl);
   }
 
   goToBlob() {
-    var $link = this.element.find(".tree-item.selected .tree-item-file-name a");
+    var $link = this.element.find('.tree-item.selected .tree-item-file-name a');
 
     if ($link.length) {
       $link.get(0).click();

app/assets/javascripts/project_import.js

@@ -5,4 +5,3 @@ export default function projectImport() {
     visitUrl(window.location.href);
   }, 5000);
 }
-

app/assets/javascripts/project_label_subscription.js

@@ -31,32 +31,35 @@ export default class ProjectLabelSubscription {
 
     $btn.addClass('disabled');
 
-    axios.post(url).then(() => {
-      let newStatus;
-      let newAction;
+    axios
+      .post(url)
+      .then(() => {
+        let newStatus;
+        let newAction;
 
-      if (oldStatus === 'unsubscribed') {
-        [newStatus, newAction] = ['subscribed', 'Unsubscribe'];
-      } else {
-        [newStatus, newAction] = ['unsubscribed', 'Subscribe'];
-      }
+        if (oldStatus === 'unsubscribed') {
+          [newStatus, newAction] = ['subscribed', 'Unsubscribe'];
+        } else {
+          [newStatus, newAction] = ['unsubscribed', 'Subscribe'];
+        }
 
-      $btn.removeClass('disabled');
+        $btn.removeClass('disabled');
 
-      this.$buttons.attr('data-status', newStatus);
-      this.$buttons.find('> span').text(newAction);
+        this.$buttons.attr('data-status', newStatus);
+        this.$buttons.find('> span').text(newAction);
 
-      this.$buttons.map((i, button) => {
-        const $button = $(button);
-        const originalTitle = $button.attr('data-original-title');
+        this.$buttons.map((i, button) => {
+          const $button = $(button);
+          const originalTitle = $button.attr('data-original-title');
 
-        if (originalTitle) {
-          ProjectLabelSubscription.setNewTitle($button, originalTitle, newStatus, newAction);
-        }
+          if (originalTitle) {
+            ProjectLabelSubscription.setNewTitle($button, originalTitle, newStatus, newAction);
+          }
 
-        return button;
-      });
-    }).catch(() => flash(__('There was an error subscribing to this label.')));
+          return button;
+        });
+      })
+      .catch(() => flash(__('There was an error subscribing to this label.')));
   }
 
   static setNewTitle($button, originalTitle, newStatus) {

app/assets/javascripts/project_select.js

@@ -16,28 +16,28 @@ export default function projectSelect() {
     this.withMergeRequestsEnabled = $(select).data('withMergeRequestsEnabled');
     this.allowClear = $(select).data('allowClear') || false;
 
-    placeholder = "Search for project";
+    placeholder = 'Search for project';
     if (this.includeGroups) {
-      placeholder += " or group";
+      placeholder += ' or group';
     }
 
     $(select).select2({
       placeholder: placeholder,
       minimumInputLength: 0,
-      query: (function (_this) {
-        return function (query) {
+      query: (function(_this) {
+        return function(query) {
           var finalCallback, projectsCallback;
-          finalCallback = function (projects) {
+          finalCallback = function(projects) {
             var data;
             data = {
-              results: projects
+              results: projects,
             };
             return query.callback(data);
           };
           if (_this.includeGroups) {
-            projectsCallback = function (projects) {
+            projectsCallback = function(projects) {
               var groupsCallback;
-              groupsCallback = function (groups) {
+              groupsCallback = function(groups) {
                 var data;
                 data = groups.concat(projects);
                 return finalCallback(data);
@@ -48,17 +48,26 @@ export default function projectSelect() {
             projectsCallback = finalCallback;
           }
           if (_this.groupId) {
-            return Api.groupProjects(_this.groupId, query.term, {
-              with_issues_enabled: _this.withIssuesEnabled,
-              with_merge_requests_enabled: _this.withMergeRequestsEnabled,
-            }, projectsCallback);
+            return Api.groupProjects(
+              _this.groupId,
+              query.term,
+              {
+                with_issues_enabled: _this.withIssuesEnabled,
+                with_merge_requests_enabled: _this.withMergeRequestsEnabled,
+              },
+              projectsCallback,
+            );
           } else {
-            return Api.projects(query.term, {
-              order_by: _this.orderBy,
-              with_issues_enabled: _this.withIssuesEnabled,
-              with_merge_requests_enabled: _this.withMergeRequestsEnabled,
-              membership: !_this.allProjects,
-            }, projectsCallback);
+            return Api.projects(
+              query.term,
+              {
+                order_by: _this.orderBy,
+                with_issues_enabled: _this.withIssuesEnabled,
+                with_merge_requests_enabled: _this.withMergeRequestsEnabled,
+                membership: !_this.allProjects,
+              },
+              projectsCallback,
+            );
           }
         };
       })(this),
@@ -69,7 +78,7 @@ export default function projectSelect() {
           url: project.web_url,
         });
       },
-      text: function (project) {
+      text: function(project) {
         return project.name_with_namespace || project.name;
       },
 
@@ -79,7 +88,7 @@ export default function projectSelect() {
 
       allowClear: this.allowClear,
 
-      dropdownCssClass: "ajax-project-dropdown"
+      dropdownCssClass: 'ajax-project-dropdown',
     });
     if (simpleFilter) return select;
     return new ProjectSelectComboButton(select);

app/assets/javascripts/project_select_combo_button.js

@@ -14,10 +14,11 @@ export default class ProjectSelectComboButton {
   }
 
   bindEvents() {
-    this.projectSelectInput.siblings('.new-project-item-select-button')
+    this.projectSelectInput
+      .siblings('.new-project-item-select-button')
       .on('click', e => this.openDropdown(e));
 
-    this.newItemBtn.on('click', (e) => {
+    this.newItemBtn.on('click', e => {
       if (!this.getProjectFromLocalStorage()) {
         e.preventDefault();
         this.openDropdown(e);
@@ -31,14 +32,21 @@ export default class ProjectSelectComboButton {
     const localStorageIsSafe = AccessorUtilities.isLocalStorageAccessSafe();
 
     if (localStorageIsSafe) {
-      this.localStorageKey = ['group', this.groupId, this.formattedText.localStorageItemType, 'recent-project'].join('-');
+      this.localStorageKey = [
+        'group',
+        this.groupId,
+        this.formattedText.localStorageItemType,
+        'recent-project',
+      ].join('-');
       this.setBtnTextFromLocalStorage();
     }
   }
 
   // eslint-disable-next-line class-methods-use-this
   openDropdown(event) {
-    $(event.currentTarget).siblings('.project-item-select').select2('open');
+    $(event.currentTarget)
+      .siblings('.project-item-select')
+      .select2('open');
   }
 
   selectProject() {
@@ -86,8 +94,14 @@ export default class ProjectSelectComboButton {
     const defaultTextPrefix = this.resourceLabel;
 
     // the trailing slice call depluralizes each of these strings (e.g. new-issues -> new-issue)
-    const localStorageItemType = `new-${this.resourceType.split('_').join('-').slice(0, -1)}`;
-    const presetTextSuffix = this.resourceType.split('_').join(' ').slice(0, -1);
+    const localStorageItemType = `new-${this.resourceType
+      .split('_')
+      .join('-')
+      .slice(0, -1)}`;
+    const presetTextSuffix = this.resourceType
+      .split('_')
+      .join(' ')
+      .slice(0, -1);
 
     return {
       localStorageItemType, // new-issue / new-merge-request
@@ -96,4 +110,3 @@ export default class ProjectSelectComboButton {
     };
   }
 }
-

app/assets/javascripts/project_visibility.js

@@ -7,7 +7,7 @@ function setVisibilityOptions(namespaceSelector) {
   const selectedNamespace = namespaceSelector.options[namespaceSelector.selectedIndex];
   const { name, visibility, visibilityLevel, showPath, editPath } = selectedNamespace.dataset;
 
-  document.querySelectorAll('.visibility-level-setting .form-check').forEach((option) => {
+  document.querySelectorAll('.visibility-level-setting .form-check').forEach(option => {
     const optionInput = option.querySelector('input[type=radio]');
     const optionValue = optionInput ? optionInput.value : 0;
     const optionTitle = option.querySelector('.option-title');
@@ -20,8 +20,7 @@ function setVisibilityOptions(namespaceSelector) {
         optionInput.disabled = true;
         const reason = option.querySelector('.option-disabled-reason');
         if (reason) {
-          reason.innerHTML =
-            `This project cannot be ${optionName} because the visibility of
+          reason.innerHTML = `This project cannot be ${optionName} because the visibility of
             <a href="${showPath}">${name}</a> is ${visibility}. To make this project
             ${optionName}, you must first <a href="${editPath}">change the visibility</a>
             of the parent group.`;

app/assets/javascripts/prometheus_metrics/prometheus_metrics.js

@@ -65,10 +65,14 @@ export default class PrometheusMetrics {
     let totalMissingEnvVarMetrics = 0;
     let totalExporters = 0;
 
-    metrics.forEach((metric) => {
+    metrics.forEach(metric => {
       if (metric.active_metrics > 0) {
         totalExporters += 1;
-        this.$monitoredMetricsList.append(`<li>${_.escape(metric.group)}<span class="badge">${_.escape(metric.active_metrics)}</span></li>`);
+        this.$monitoredMetricsList.append(
+          `<li>${_.escape(metric.group)}<span class="badge">${_.escape(
+            metric.active_metrics,
+          )}</span></li>`,
+        );
         totalMonitoredMetrics += metric.active_metrics;
         if (metric.metrics_missing_requirements > 0) {
           this.$missingEnvVarMetricsList.append(`<li>${_.escape(metric.group)}</li>`);
@@ -78,17 +82,26 @@ export default class PrometheusMetrics {
     });
 
     if (totalMonitoredMetrics === 0) {
-      const emptyCommonMetricsText = sprintf(s__('PrometheusService|<p class="text-tertiary">No <a href="%{docsUrl}">common metrics</a> were found</p>'), {
-        docsUrl: this.helpMetricsPath,
-      }, false);
+      const emptyCommonMetricsText = sprintf(
+        s__(
+          'PrometheusService|<p class="text-tertiary">No <a href="%{docsUrl}">common metrics</a> were found</p>',
+        ),
+        {
+          docsUrl: this.helpMetricsPath,
+        },
+        false,
+      );
       this.$monitoredMetricsEmpty.empty();
       this.$monitoredMetricsEmpty.append(emptyCommonMetricsText);
       this.showMonitoringMetricsPanelState(PANEL_STATE.EMPTY);
     } else {
-      const metricsCountText = sprintf(s__('PrometheusService|%{exporters} with %{metrics} were found'), {
-        exporters: n__('%d exporter', '%d exporters', totalExporters),
-        metrics: n__('%d metric', '%d metrics', totalMonitoredMetrics),
-      });
+      const metricsCountText = sprintf(
+        s__('PrometheusService|%{exporters} with %{metrics} were found'),
+        {
+          exporters: n__('%d exporter', '%d exporters', totalExporters),
+          metrics: n__('%d metric', '%d metrics', totalMonitoredMetrics),
+        },
+      );
       this.$monitoredMetricsCount.text(metricsCountText);
       this.showMonitoringMetricsPanelState(PANEL_STATE.LIST);
 
@@ -102,7 +115,8 @@ export default class PrometheusMetrics {
   loadActiveMetrics() {
     this.showMonitoringMetricsPanelState(PANEL_STATE.LOADING);
     backOff((next, stop) => {
-      axios.get(this.activeMetricsEndpoint)
+      axios
+        .get(this.activeMetricsEndpoint)
         .then(({ data }) => {
           if (data && data.success) {
             stop(data);
@@ -117,7 +131,7 @@ export default class PrometheusMetrics {
         })
         .catch(stop);
     })
-      .then((res) => {
+      .then(res => {
         if (res && res.data && res.data.length) {
           this.populateActiveMetrics(res.data);
         } else {

app/assets/javascripts/raven/raven_config.js

@@ -9,7 +9,7 @@ const IGNORE_ERRORS = [
   'canvas.contentDocument',
   'MyApp_RemoveAllHighlights',
   'http://tt.epicplay.com',
-  'Can\'t find variable: ZiteReader',
+  "Can't find variable: ZiteReader",
   'jigsaw is not defined',
   'ComboSearch is not defined',
   'http://loading.retry.widdit.com/',

app/assets/javascripts/ref_select_dropdown.js

@@ -2,7 +2,8 @@ import $ from 'jquery';
 
 class RefSelectDropdown {
   constructor($dropdownButton, availableRefs) {
-    const availableRefsValue = availableRefs || JSON.parse(document.getElementById('availableRefs').innerHTML);
+    const availableRefsValue =
+      availableRefs || JSON.parse(document.getElementById('availableRefs').innerHTML);
     $dropdownButton.glDropdown({
       data: availableRefsValue,
       filterable: true,
@@ -29,7 +30,7 @@ class RefSelectDropdown {
     const $fieldInput = $(`input[name="${$dropdownButton.data('fieldName')}"]`, $dropdownContainer);
     const $filterInput = $('input[type="search"]', $dropdownContainer);
 
-    $filterInput.on('keyup', (e) => {
+    $filterInput.on('keyup', e => {
       const keyCode = e.keyCode || e.which;
       if (keyCode !== 13) return;
 

app/assets/javascripts/settings_panels.js

@@ -3,10 +3,14 @@ import { __ } from './locale';
 
 function expandSection($section) {
   $section.find('.js-settings-toggle:not(.js-settings-toggle-trigger-only)').text(__('Collapse'));
-  $section.find('.settings-content').off('scroll.expandSection').scrollTop(0);
+  $section
+    .find('.settings-content')
+    .off('scroll.expandSection')
+    .scrollTop(0);
   $section.addClass('expanded');
   if (!$section.hasClass('no-animate')) {
-    $section.addClass('animating')
+    $section
+      .addClass('animating')
       .one('animationend.animateSection', () => $section.removeClass('animating'));
   }
 }
@@ -16,7 +20,8 @@ function closeSection($section) {
   $section.find('.settings-content').on('scroll.expandSection', () => expandSection($section));
   $section.removeClass('expanded');
   if (!$section.hasClass('no-animate')) {
-    $section.addClass('animating')
+    $section
+      .addClass('animating')
       .one('animationend.animateSection', () => $section.removeClass('animating'));
   }
 }

app/assets/javascripts/single_file_diff.js

@@ -10,8 +10,10 @@ import syntaxHighlight from './syntax_highlight';
 
 const WRAPPER = '<div class="diff-content"></div>';
 const LOADING_HTML = '<i class="fa fa-spinner fa-spin"></i>';
-const ERROR_HTML = '<div class="nothing-here-block"><i class="fa fa-warning"></i> Could not load diff</div>';
-const COLLAPSED_HTML = '<div class="nothing-here-block diff-collapsed">This diff is collapsed. <button class="click-to-expand btn btn-link">Click to expand it.</button></div>';
+const ERROR_HTML =
+  '<div class="nothing-here-block"><i class="fa fa-warning"></i> Could not load diff</div>';
+const COLLAPSED_HTML =
+  '<div class="nothing-here-block diff-collapsed">This diff is collapsed. <button class="click-to-expand btn btn-link">Click to expand it.</button></div>';
 
 export default class SingleFileDiff {
   constructor(file) {
@@ -23,23 +25,36 @@ export default class SingleFileDiff {
     this.isOpen = !this.diffForPath;
     if (this.diffForPath) {
       this.collapsedContent = this.content;
-      this.loadingContent = $(WRAPPER).addClass('loading').html(LOADING_HTML).hide();
+      this.loadingContent = $(WRAPPER)
+        .addClass('loading')
+        .html(LOADING_HTML)
+        .hide();
       this.content = null;
       this.collapsedContent.after(this.loadingContent);
       this.$toggleIcon.addClass('fa-caret-right');
     } else {
-      this.collapsedContent = $(WRAPPER).html(COLLAPSED_HTML).hide();
+      this.collapsedContent = $(WRAPPER)
+        .html(COLLAPSED_HTML)
+        .hide();
       this.content.after(this.collapsedContent);
       this.$toggleIcon.addClass('fa-caret-down');
     }
 
-    $('.js-file-title, .click-to-expand', this.file).on('click', (function (e) {
-      this.toggleDiff($(e.target));
-    }).bind(this));
+    $('.js-file-title, .click-to-expand', this.file).on(
+      'click',
+      function(e) {
+        this.toggleDiff($(e.target));
+      }.bind(this),
+    );
   }
 
   toggleDiff($target, cb) {
-    if (!$target.hasClass('js-file-title') && !$target.hasClass('click-to-expand') && !$target.hasClass('diff-toggle-caret')) return;
+    if (
+      !$target.hasClass('js-file-title') &&
+      !$target.hasClass('click-to-expand') &&
+      !$target.hasClass('diff-toggle-caret')
+    )
+      return;
     this.isOpen = !this.isOpen;
     if (!this.isOpen && !this.hasError) {
       this.content.hide();
@@ -65,7 +80,8 @@ export default class SingleFileDiff {
     this.collapsedContent.hide();
     this.loadingContent.show();
 
-    axios.get(this.diffForPath)
+    axios
+      .get(this.diffForPath)
       .then(({ data }) => {
         this.loadingContent.hide();
         if (data.html) {

app/assets/javascripts/smart_interval.js

@@ -93,7 +93,9 @@ export default class SmartInterval {
   destroy() {
     this.cancel();
     document.removeEventListener('visibilitychange', this.handleVisibilityChange);
-    $(document).off('visibilitychange').off('beforeunload');
+    $(document)
+      .off('visibilitychange')
+      .off('beforeunload');
   }
 
   /* private */
@@ -111,11 +113,12 @@ export default class SmartInterval {
 
   triggerCallback() {
     this.isLoading = true;
-    this.cfg.callback()
+    this.cfg
+      .callback()
       .then(() => {
         this.isLoading = false;
       })
-      .catch((err) => {
+      .catch(err => {
         this.isLoading = false;
         throw err;
       });
@@ -134,9 +137,9 @@ export default class SmartInterval {
 
   handleVisibilityChange(e) {
     this.state.pageVisibility = e.target.visibilityState;
-    const intervalAction = this.isPageVisible() ?
-      this.onVisibilityVisible :
-      this.onVisibilityHidden;
+    const intervalAction = this.isPageVisible()
+      ? this.onVisibilityVisible
+      : this.onVisibilityHidden;
 
     intervalAction.apply(this);
   }
@@ -162,7 +165,9 @@ export default class SmartInterval {
     this.setCurrentInterval(nextInterval);
   }
 
-  isPageVisible() { return this.state.pageVisibility === 'visible'; }
+  isPageVisible() {
+    return this.state.pageVisibility === 'visible';
+  }
 
   stopTimer() {
     const { state } = this;
@@ -170,4 +175,3 @@ export default class SmartInterval {
     state.intervalId = window.clearInterval(state.intervalId);
   }
 }
-

app/assets/javascripts/star.js

@@ -11,10 +11,14 @@ export default class Star {
       const $starSpan = $this.find('span');
       const $startIcon = $this.find('svg');
 
-      axios.post($this.data('endpoint'))
+      axios
+        .post($this.data('endpoint'))
         .then(({ data }) => {
           const isStarred = $starSpan.hasClass('starred');
-          $this.parent().find('.star-count').text(data.star_count);
+          $this
+            .parent()
+            .find('.star-count')
+            .text(data.star_count);
 
           if (isStarred) {
             $starSpan.removeClass('starred').text(s__('StarProject|Star'));

app/assets/javascripts/task_list.js

@@ -26,7 +26,11 @@ export default class TaskList {
     // Prevent duplicate event bindings
     this.disable();
     $(`${this.selector} .js-task-list-container`).taskList('enable');
-    $(document).on('tasklist:changed', `${this.selector} .js-task-list-container`, this.update.bind(this));
+    $(document).on(
+      'tasklist:changed',
+      `${this.selector} .js-task-list-container`,
+      this.update.bind(this),
+    );
   }
 
   disable() {
@@ -41,7 +45,8 @@ export default class TaskList {
       [this.fieldName]: $target.val(),
     };
 
-    return axios.patch($target.data('updateUrl') || $('form.js-issuable-update').attr('action'), patchData)
+    return axios
+      .patch($target.data('updateUrl') || $('form.js-issuable-update').attr('action'), patchData)
       .then(({ data }) => this.onSuccess(data))
       .catch(err => this.onError(err));
   }

app/assets/javascripts/templates/issuable_template_selector.js

@@ -31,12 +31,18 @@ export default class IssuableTemplateSelector extends TemplateSelector {
 
   requestFile(query) {
     this.startLoadingSpinner();
-    Api.issueTemplate(this.namespacePath, this.projectPath, query.name, this.issuableType, (err, currentTemplate) => {
-      this.currentTemplate = currentTemplate;
-      this.stopLoadingSpinner();
-      if (err) return; // Error handled by global AJAX error handler
-      this.setInputValueToTemplateContent();
-    });
+    Api.issueTemplate(
+      this.namespacePath,
+      this.projectPath,
+      query.name,
+      this.issuableType,
+      (err, currentTemplate) => {
+        this.currentTemplate = currentTemplate;
+        this.stopLoadingSpinner();
+        if (err) return; // Error handled by global AJAX error handler
+        this.setInputValueToTemplateContent();
+      },
+    );
     return;
   }
 

app/assets/javascripts/terminal/terminal.js

@@ -4,10 +4,14 @@ import * as fit from 'xterm/lib/addons/fit/fit';
 
 export default class GLTerminal {
   constructor(options = {}) {
-    this.options = Object.assign({}, {
-      cursorBlink: true,
-      screenKeys: true,
-    }, options);
+    this.options = Object.assign(
+      {},
+      {
+        cursorBlink: true,
+        screenKeys: true,
+      },
+      options,
+    );
 
     this.container = document.querySelector(options.selector);
 

app/assets/javascripts/test_utils/simulate_drag.js

@@ -4,15 +4,43 @@ function simulateEvent(el, type, options = {}) {
 
   if (/^mouse/.test(type)) {
     event = el.ownerDocument.createEvent('MouseEvents');
-    event.initMouseEvent(type, true, true, el.ownerDocument.defaultView,
-    options.button, options.screenX, options.screenY, options.clientX, options.clientY,
-    options.ctrlKey, options.altKey, options.shiftKey, options.metaKey, options.button, el);
+    event.initMouseEvent(
+      type,
+      true,
+      true,
+      el.ownerDocument.defaultView,
+      options.button,
+      options.screenX,
+      options.screenY,
+      options.clientX,
+      options.clientY,
+      options.ctrlKey,
+      options.altKey,
+      options.shiftKey,
+      options.metaKey,
+      options.button,
+      el,
+    );
   } else {
     event = el.ownerDocument.createEvent('CustomEvent');
 
-    event.initCustomEvent(type, true, true, el.ownerDocument.defaultView,
-    options.button, options.screenX, options.screenY, options.clientX, options.clientY,
-    options.ctrlKey, options.altKey, options.shiftKey, options.metaKey, options.button, el);
+    event.initCustomEvent(
+      type,
+      true,
+      true,
+      el.ownerDocument.defaultView,
+      options.button,
+      options.screenX,
+      options.screenY,
+      options.clientX,
+      options.clientY,
+      options.ctrlKey,
+      options.altKey,
+      options.shiftKey,
+      options.metaKey,
+      options.button,
+      el,
+    );
 
     event.dataTransfer = {
       data: {},
@@ -37,14 +65,16 @@ function simulateEvent(el, type, options = {}) {
 }
 
 function isLast(target) {
-  const el = typeof target.el === 'string' ? document.getElementById(target.el.substr(1)) : target.el;
+  const el =
+    typeof target.el === 'string' ? document.getElementById(target.el.substr(1)) : target.el;
   const { children } = el;
 
   return children.length - 1 === target.index;
 }
 
 function getTarget(target) {
-  const el = typeof target.el === 'string' ? document.getElementById(target.el.substr(1)) : target.el;
+  const el =
+    typeof target.el === 'string' ? document.getElementById(target.el.substr(1)) : target.el;
   const { children } = el;
 
   return (
@@ -58,13 +88,13 @@ function getTarget(target) {
 function getRect(el) {
   const rect = el.getBoundingClientRect();
   const width = rect.right - rect.left;
-  const height = (rect.bottom - rect.top) + 10;
+  const height = rect.bottom - rect.top + 10;
 
   return {
     x: rect.left,
     y: rect.top,
-    cx: rect.left + (width / 2),
-    cy: rect.top + (height / 2),
+    cx: rect.left + width / 2,
+    cy: rect.top + height / 2,
     w: width,
     h: height,
     hw: width / 2,
@@ -112,8 +142,8 @@ export default function simulateDrag(options) {
 
   const dragInterval = setInterval(() => {
     const progress = (new Date().getTime() - startTime) / duration;
-    const x = (fromRect.cx + ((toRect.cx - fromRect.cx) * progress));
-    const y = (fromRect.cy + ((toRect.cy - fromRect.cy) * progress));
+    const x = fromRect.cx + (toRect.cx - fromRect.cx) * progress;
+    const y = fromRect.cy + (toRect.cy - fromRect.cy) * progress;
     const overEl = fromEl.ownerDocument.elementFromPoint(x, y);
 
     simulateEvent(overEl, 'mousemove', {

app/assets/javascripts/test_utils/simulate_input.js

@@ -12,7 +12,7 @@ export default function simulateInput(target, text) {
   }
 
   if (text.length > 0) {
-    Array.prototype.forEach.call(text, (char) => {
+    Array.prototype.forEach.call(text, char => {
       input.value += char;
       triggerEvents(input);
     });

app/assets/javascripts/toggle_buttons.js

@@ -49,7 +49,7 @@ function onToggleClicked(toggle, input, clickCallback) {
 export default function setupToggleButtons(container, clickCallback = () => {}) {
   const toggles = container.querySelectorAll('.js-project-feature-toggle');
 
-  toggles.forEach((toggle) => {
+  toggles.forEach(toggle => {
     const input = toggle.querySelector('.js-project-feature-toggle-input');
     const isOn = convertPermissionToBoolean(input.value);
 

app/assets/javascripts/tree.js

@@ -8,7 +8,7 @@ export default class TreeView {
     this.initKeyNav();
     // Code browser tree slider
     // Make the entire tree-item row clickable, but not if clicking another link (like a commit message)
-    $(".tree-content-holder .tree-item").on('click', function(e) {
+    $('.tree-content-holder .tree-item').on('click', function(e) {
       var $clickedEl, path;
       $clickedEl = $(e.target);
       path = $('.tree-item-file-name a', this).attr('href');
@@ -27,33 +27,33 @@ export default class TreeView {
 
   initKeyNav() {
     var li, liSelected;
-    li = $("tr.tree-item");
+    li = $('tr.tree-item');
     liSelected = null;
     return $('body').keydown(function(e) {
       var next, path;
-      if ($("input:focus").length > 0 && (e.which === 38 || e.which === 40)) {
+      if ($('input:focus').length > 0 && (e.which === 38 || e.which === 40)) {
         return false;
       }
       if (e.which === 40) {
         if (liSelected) {
           next = liSelected.next();
           if (next.length > 0) {
-            liSelected.removeClass("selected");
-            liSelected = next.addClass("selected");
+            liSelected.removeClass('selected');
+            liSelected = next.addClass('selected');
           }
         } else {
-          liSelected = li.eq(0).addClass("selected");
+          liSelected = li.eq(0).addClass('selected');
         }
         return $(liSelected).focus();
       } else if (e.which === 38) {
         if (liSelected) {
           next = liSelected.prev();
           if (next.length > 0) {
-            liSelected.removeClass("selected");
-            liSelected = next.addClass("selected");
+            liSelected.removeClass('selected');
+            liSelected = next.addClass('selected');
           }
         } else {
-          liSelected = li.last().addClass("selected");
+          liSelected = li.last().addClass('selected');
         }
         return $(liSelected).focus();
       } else if (e.which === 13) {

app/assets/javascripts/u2f/authenticate.js

@@ -49,7 +49,7 @@ export default class U2FAuthenticate {
 
   start() {
     return importU2FLibrary()
-      .then((utils) => {
+      .then(utils => {
         this.u2fUtils = utils;
         this.renderInProgress();
       })
@@ -57,14 +57,19 @@ export default class U2FAuthenticate {
   }
 
   authenticate() {
-    return this.u2fUtils.sign(this.appId, this.challenge, this.signRequests,
-      (response) => {
+    return this.u2fUtils.sign(
+      this.appId,
+      this.challenge,
+      this.signRequests,
+      response => {
         if (response.errorCode) {
           const error = new U2FError(response.errorCode, 'authenticate');
           return this.renderError(error);
         }
         return this.renderAuthenticated(JSON.stringify(response));
-      }, 10);
+      },
+      10,
+    );
   }
 
   renderTemplate(name, params) {
@@ -99,5 +104,4 @@ export default class U2FAuthenticate {
     this.container[0].classList.add('hidden');
     this.fallbackUI.classList.remove('hidden');
   }
-
 }

app/assets/javascripts/u2f/register.js

@@ -34,7 +34,7 @@ export default class U2FRegister {
 
   start() {
     return importU2FLibrary()
-      .then((utils) => {
+      .then(utils => {
         this.u2fUtils = utils;
         this.renderSetup();
       })
@@ -42,14 +42,19 @@ export default class U2FRegister {
   }
 
   register() {
-    return this.u2fUtils.register(this.appId, this.registerRequests, this.signRequests,
-      (response) => {
+    return this.u2fUtils.register(
+      this.appId,
+      this.registerRequests,
+      this.signRequests,
+      response => {
         if (response.errorCode) {
           const error = new U2FError(response.errorCode, 'register');
           return this.renderError(error);
         }
         return this.renderRegistered(JSON.stringify(response));
-      }, 10);
+      },
+      10,
+    );
   }
 
   renderTemplate(name, params) {

app/assets/javascripts/u2f/util.js

@@ -19,11 +19,10 @@ function getChromeVersion(userAgent) {
 export function canInjectU2fApi(userAgent) {
   const isSupportedChrome = isChrome(userAgent) && getChromeVersion(userAgent) >= 41;
   const isSupportedOpera = isOpera(userAgent) && getOperaVersion(userAgent) >= 40;
-  const isMobile = (
+  const isMobile =
     userAgent.indexOf('droid') >= 0 ||
     userAgent.indexOf('CriOS') >= 0 ||
-    /\b(iPad|iPhone|iPod)(?=;)/.test(userAgent)
-  );
+    /\b(iPad|iPhone|iPod)(?=;)/.test(userAgent);
   return (isSupportedChrome || isSupportedOpera) && !isMobile;
 }
 

app/assets/javascripts/ui_development_kit.js

@@ -4,13 +4,17 @@ import Api from './api';
 export default () => {
   $('#js-project-dropdown').glDropdown({
     data: (term, callback) => {
-      Api.projects(term, {
-        order_by: 'last_activity_at',
-      }, (data) => {
-        callback(data);
-      });
+      Api.projects(
+        term,
+        {
+          order_by: 'last_activity_at',
+        },
+        data => {
+          callback(data);
+        },
+      );
     },
-    text: project => (project.name_with_namespace || project.name),
+    text: project => project.name_with_namespace || project.name,
     selectable: true,
     fieldName: 'author_id',
     filterable: true,
@@ -18,6 +22,6 @@ export default () => {
       fields: ['name_with_namespace'],
     },
     id: data => data.id,
-    isSelected: data => (data.id === 2),
+    isSelected: data => data.id === 2,
   });
 };

app/assets/javascripts/usage_ping_consent.js

@@ -4,7 +4,7 @@ import Flash, { hideFlash } from './flash';
 import { convertPermissionToBoolean } from './lib/utils/common_utils';
 
 export default () => {
-  $('body').on('click', '.js-usage-consent-action', (e) => {
+  $('body').on('click', '.js-usage-consent-action', e => {
     e.preventDefault();
     e.stopImmediatePropagation(); // overwrite rails listener
 
@@ -18,7 +18,8 @@ export default () => {
 
     const hideConsentMessage = () => hideFlash(document.querySelector('.ping-consent-message'));
 
-    axios.put(url, data)
+    axios
+      .put(url, data)
       .then(() => {
         hideConsentMessage();
       })

app/assets/javascripts/users_select.js

@@ -15,8 +15,8 @@ function UsersSelect(currentUser, els, options = {}) {
   var $els;
   this.users = this.users.bind(this);
   this.user = this.user.bind(this);
-  this.usersPath = "/autocomplete/users.json";
-  this.userPath = "/autocomplete/users/:id.json";
+  this.usersPath = '/autocomplete/users.json';
+  this.userPath = '/autocomplete/users/:id.json';
   if (currentUser != null) {
     if (typeof currentUser === 'object') {
       this.currentUser = currentUser;
@@ -33,156 +33,180 @@ function UsersSelect(currentUser, els, options = {}) {
     $els = $('.js-user-search');
   }
 
-  $els.each((function(_this) {
-    return function(i, dropdown) {
-      var options = {};
-      var $block, $collapsedSidebar, $dropdown, $loading, $selectbox, $value, abilityName, assignTo, assigneeTemplate, collapsedAssigneeTemplate, defaultLabel, defaultNullUser, firstUser, issueURL, selectedId, selectedIdDefault, showAnyUser, showNullUser, showMenuAbove;
-      $dropdown = $(dropdown);
-      options.projectId = $dropdown.data('projectId');
-      options.groupId = $dropdown.data('groupId');
-      options.showCurrentUser = $dropdown.data('currentUser');
-      options.todoFilter = $dropdown.data('todoFilter');
-      options.todoStateFilter = $dropdown.data('todoStateFilter');
-      showNullUser = $dropdown.data('nullUser');
-      defaultNullUser = $dropdown.data('nullUserDefault');
-      showMenuAbove = $dropdown.data('showMenuAbove');
-      showAnyUser = $dropdown.data('anyUser');
-      firstUser = $dropdown.data('firstUser');
-      options.authorId = $dropdown.data('authorId');
-      defaultLabel = $dropdown.data('defaultLabel');
-      issueURL = $dropdown.data('issueUpdate');
-      $selectbox = $dropdown.closest('.selectbox');
-      $block = $selectbox.closest('.block');
-      abilityName = $dropdown.data('abilityName');
-      $value = $block.find('.value');
-      $collapsedSidebar = $block.find('.sidebar-collapsed-user');
-      $loading = $block.find('.block-loading').fadeOut();
-      selectedIdDefault = (defaultNullUser && showNullUser) ? 0 : null;
-      selectedId = $dropdown.data('selected');
-
-      if (selectedId === undefined) {
-        selectedId = selectedIdDefault;
-      }
-
-      const assignYourself = function () {
-        const unassignedSelected = $dropdown.closest('.selectbox')
-          .find(`input[name='${$dropdown.data('fieldName')}'][value=0]`);
-
-        if (unassignedSelected) {
-          unassignedSelected.remove();
+  $els.each(
+    (function(_this) {
+      return function(i, dropdown) {
+        var options = {};
+        var $block,
+          $collapsedSidebar,
+          $dropdown,
+          $loading,
+          $selectbox,
+          $value,
+          abilityName,
+          assignTo,
+          assigneeTemplate,
+          collapsedAssigneeTemplate,
+          defaultLabel,
+          defaultNullUser,
+          firstUser,
+          issueURL,
+          selectedId,
+          selectedIdDefault,
+          showAnyUser,
+          showNullUser,
+          showMenuAbove;
+        $dropdown = $(dropdown);
+        options.projectId = $dropdown.data('projectId');
+        options.groupId = $dropdown.data('groupId');
+        options.showCurrentUser = $dropdown.data('currentUser');
+        options.todoFilter = $dropdown.data('todoFilter');
+        options.todoStateFilter = $dropdown.data('todoStateFilter');
+        showNullUser = $dropdown.data('nullUser');
+        defaultNullUser = $dropdown.data('nullUserDefault');
+        showMenuAbove = $dropdown.data('showMenuAbove');
+        showAnyUser = $dropdown.data('anyUser');
+        firstUser = $dropdown.data('firstUser');
+        options.authorId = $dropdown.data('authorId');
+        defaultLabel = $dropdown.data('defaultLabel');
+        issueURL = $dropdown.data('issueUpdate');
+        $selectbox = $dropdown.closest('.selectbox');
+        $block = $selectbox.closest('.block');
+        abilityName = $dropdown.data('abilityName');
+        $value = $block.find('.value');
+        $collapsedSidebar = $block.find('.sidebar-collapsed-user');
+        $loading = $block.find('.block-loading').fadeOut();
+        selectedIdDefault = defaultNullUser && showNullUser ? 0 : null;
+        selectedId = $dropdown.data('selected');
+
+        if (selectedId === undefined) {
+          selectedId = selectedIdDefault;
         }
 
-        // Save current selected user to the DOM
-        const input = document.createElement('input');
-        input.type = 'hidden';
-        input.name = $dropdown.data('fieldName');
+        const assignYourself = function() {
+          const unassignedSelected = $dropdown
+            .closest('.selectbox')
+            .find(`input[name='${$dropdown.data('fieldName')}'][value=0]`);
 
-        const currentUserInfo = $dropdown.data('currentUserInfo');
-
-        if (currentUserInfo) {
-          input.value = currentUserInfo.id;
-          input.dataset.meta = _.escape(currentUserInfo.name);
-        } else if (_this.currentUser) {
-          input.value = _this.currentUser.id;
-        }
-
-        if ($selectbox) {
-          $dropdown.parent().before(input);
-        } else {
-          $dropdown.after(input);
-        }
-      };
-
-      if ($block[0]) {
-        $block[0].addEventListener('assignYourself', assignYourself);
-      }
-
-      const getSelectedUserInputs = function() {
-        return $selectbox
-          .find(`input[name="${$dropdown.data('fieldName')}"]`);
-      };
+          if (unassignedSelected) {
+            unassignedSelected.remove();
+          }
 
-      const getSelected = function() {
-        return getSelectedUserInputs()
-          .map((index, input) => parseInt(input.value, 10))
-          .get();
-      };
+          // Save current selected user to the DOM
+          const input = document.createElement('input');
+          input.type = 'hidden';
+          input.name = $dropdown.data('fieldName');
 
-      const checkMaxSelect = function() {
-        const maxSelect = $dropdown.data('maxSelect');
-        if (maxSelect) {
-          const selected = getSelected();
+          const currentUserInfo = $dropdown.data('currentUserInfo');
 
-          if (selected.length > maxSelect) {
-            const firstSelectedId = selected[0];
-            const firstSelected = $dropdown.closest('.selectbox')
-              .find(`input[name='${$dropdown.data('fieldName')}'][value=${firstSelectedId}]`);
+          if (currentUserInfo) {
+            input.value = currentUserInfo.id;
+            input.dataset.meta = _.escape(currentUserInfo.name);
+          } else if (_this.currentUser) {
+            input.value = _this.currentUser.id;
+          }
 
-            firstSelected.remove();
-            emitSidebarEvent('sidebar.removeAssignee', {
-              id: firstSelectedId,
-            });
+          if ($selectbox) {
+            $dropdown.parent().before(input);
+          } else {
+            $dropdown.after(input);
           }
-        }
-      };
+        };
 
-      const getMultiSelectDropdownTitle = function(selectedUser, isSelected) {
-        const selectedUsers = getSelected()
-          .filter(u => u !== 0);
-
-        const firstUser = getSelectedUserInputs()
-          .map((index, input) => ({
-            name: input.dataset.meta,
-            value: parseInt(input.value, 10),
-          }))
-          .filter(u => u.id !== 0)
-          .get(0);
-
-        if (selectedUsers.length === 0) {
-          return 'Unassigned';
-        } else if (selectedUsers.length === 1) {
-          return firstUser.name;
-        } else if (isSelected) {
-          const otherSelected = selectedUsers.filter(s => s !== selectedUser.id);
-          return `${selectedUser.name} + ${otherSelected.length} more`;
-        } else {
-          return `${firstUser.name} + ${selectedUsers.length - 1} more`;
+        if ($block[0]) {
+          $block[0].addEventListener('assignYourself', assignYourself);
         }
-      };
 
-      $('.assign-to-me-link').on('click', (e) => {
-        e.preventDefault();
-        $(e.currentTarget).hide();
+        const getSelectedUserInputs = function() {
+          return $selectbox.find(`input[name="${$dropdown.data('fieldName')}"]`);
+        };
+
+        const getSelected = function() {
+          return getSelectedUserInputs()
+            .map((index, input) => parseInt(input.value, 10))
+            .get();
+        };
+
+        const checkMaxSelect = function() {
+          const maxSelect = $dropdown.data('maxSelect');
+          if (maxSelect) {
+            const selected = getSelected();
+
+            if (selected.length > maxSelect) {
+              const firstSelectedId = selected[0];
+              const firstSelected = $dropdown
+                .closest('.selectbox')
+                .find(`input[name='${$dropdown.data('fieldName')}'][value=${firstSelectedId}]`);
+
+              firstSelected.remove();
+              emitSidebarEvent('sidebar.removeAssignee', {
+                id: firstSelectedId,
+              });
+            }
+          }
+        };
+
+        const getMultiSelectDropdownTitle = function(selectedUser, isSelected) {
+          const selectedUsers = getSelected().filter(u => u !== 0);
+
+          const firstUser = getSelectedUserInputs()
+            .map((index, input) => ({
+              name: input.dataset.meta,
+              value: parseInt(input.value, 10),
+            }))
+            .filter(u => u.id !== 0)
+            .get(0);
+
+          if (selectedUsers.length === 0) {
+            return 'Unassigned';
+          } else if (selectedUsers.length === 1) {
+            return firstUser.name;
+          } else if (isSelected) {
+            const otherSelected = selectedUsers.filter(s => s !== selectedUser.id);
+            return `${selectedUser.name} + ${otherSelected.length} more`;
+          } else {
+            return `${firstUser.name} + ${selectedUsers.length - 1} more`;
+          }
+        };
 
-        if ($dropdown.data('multiSelect')) {
-          assignYourself();
-          checkMaxSelect();
+        $('.assign-to-me-link').on('click', e => {
+          e.preventDefault();
+          $(e.currentTarget).hide();
 
-          const currentUserInfo = $dropdown.data('currentUserInfo');
-          $dropdown.find('.dropdown-toggle-text').text(getMultiSelectDropdownTitle(currentUserInfo)).removeClass('is-default');
-        } else {
-          const $input = $(`input[name="${$dropdown.data('fieldName')}"]`);
-          $input.val(gon.current_user_id);
-          selectedId = $input.val();
-          $dropdown.find('.dropdown-toggle-text').text(gon.current_user_fullname).removeClass('is-default');
-        }
-      });
-
-      $block.on('click', '.js-assign-yourself', (e) => {
-        e.preventDefault();
-        return assignTo(_this.currentUser.id);
-      });
-
-      assignTo = function(selected) {
-        var data;
-        data = {};
-        data[abilityName] = {};
-        data[abilityName].assignee_id = selected != null ? selected : null;
-        $loading.removeClass('hidden').fadeIn();
-        $dropdown.trigger('loading.gl.dropdown');
-
-        return axios.put(issueURL, data)
-          .then(({ data }) => {
+          if ($dropdown.data('multiSelect')) {
+            assignYourself();
+            checkMaxSelect();
+
+            const currentUserInfo = $dropdown.data('currentUserInfo');
+            $dropdown
+              .find('.dropdown-toggle-text')
+              .text(getMultiSelectDropdownTitle(currentUserInfo))
+              .removeClass('is-default');
+          } else {
+            const $input = $(`input[name="${$dropdown.data('fieldName')}"]`);
+            $input.val(gon.current_user_id);
+            selectedId = $input.val();
+            $dropdown
+              .find('.dropdown-toggle-text')
+              .text(gon.current_user_fullname)
+              .removeClass('is-default');
+          }
+        });
+
+        $block.on('click', '.js-assign-yourself', e => {
+          e.preventDefault();
+          return assignTo(_this.currentUser.id);
+        });
+
+        assignTo = function(selected) {
+          var data;
+          data = {};
+          data[abilityName] = {};
+          data[abilityName].assignee_id = selected != null ? selected : null;
+          $loading.removeClass('hidden').fadeIn();
+          $dropdown.trigger('loading.gl.dropdown');
+
+          return axios.put(issueURL, data).then(({ data }) => {
             var user, tooltipTitle;
             $dropdown.trigger('loaded.gl.dropdown');
             $loading.fadeOut();
@@ -190,14 +214,14 @@ function UsersSelect(currentUser, els, options = {}) {
               user = {
                 name: data.assignee.name,
                 username: data.assignee.username,
-                avatar: data.assignee.avatar_url
+                avatar: data.assignee.avatar_url,
               };
               tooltipTitle = _.escape(user.name);
             } else {
               user = {
                 name: 'Unassigned',
                 username: '',
-                avatar: ''
+                avatar: '',
               };
               tooltipTitle = __('Assignee');
             }
@@ -205,319 +229,341 @@ function UsersSelect(currentUser, els, options = {}) {
             $collapsedSidebar.attr('title', tooltipTitle).tooltip('_fixTitle');
             return $collapsedSidebar.html(collapsedAssigneeTemplate(user));
           });
-      };
-      collapsedAssigneeTemplate = _.template('<% if( avatar ) { %> <a class="author-link" href="/<%- username %>"> <img width="24" class="avatar avatar-inline s24" alt="" src="<%- avatar %>"> </a> <% } else { %> <i class="fa fa-user"></i> <% } %>');
-      assigneeTemplate = _.template('<% if (username) { %> <a class="author-link bold" href="/<%- username %>"> <% if( avatar ) { %> <img width="32" class="avatar avatar-inline s32" alt="" src="<%- avatar %>"> <% } %> <span class="author"><%- name %></span> <span class="username"> @<%- username %> </span> </a> <% } else { %> <span class="no-value assign-yourself"> No assignee - <a href="#" class="js-assign-yourself"> assign yourself </a> </span> <% } %>');
-      return $dropdown.glDropdown({
-        showMenuAbove: showMenuAbove,
-        data: function(term, callback) {
-          return _this.users(term, options, function(users) {
-            // GitLabDropdownFilter returns this.instance
-            // GitLabDropdownRemote returns this.options.instance
-            const glDropdown = this.instance || this.options.instance;
-            glDropdown.options.processData(term, users, callback);
-          }.bind(this));
-        },
-        processData: function(term, data, callback) {
-          let users = data;
-
-          // Only show assigned user list when there is no search term
-          if ($dropdown.hasClass('js-multiselect') && term.length === 0) {
-            const selectedInputs = getSelectedUserInputs();
-
-            // Potential duplicate entries when dealing with issue board
-            // because issue board is also managed by vue
-            const selectedUsers = _.uniq(selectedInputs, false, a => a.value)
-              .filter((input) => {
-                const userId = parseInt(input.value, 10);
-                const inUsersArray = users.find(u => u.id === userId);
-
-                return !inUsersArray && userId !== 0;
-              })
-              .map((input) => {
-                const userId = parseInt(input.value, 10);
-                const { avatarUrl, avatar_url, name, username } = input.dataset;
-                return {
-                  avatar_url: avatarUrl || avatar_url,
-                  id: userId,
-                  name,
-                  username,
-                };
-              });
+        };
+        collapsedAssigneeTemplate = _.template(
+          '<% if( avatar ) { %> <a class="author-link" href="/<%- username %>"> <img width="24" class="avatar avatar-inline s24" alt="" src="<%- avatar %>"> </a> <% } else { %> <i class="fa fa-user"></i> <% } %>',
+        );
+        assigneeTemplate = _.template(
+          '<% if (username) { %> <a class="author-link bold" href="/<%- username %>"> <% if( avatar ) { %> <img width="32" class="avatar avatar-inline s32" alt="" src="<%- avatar %>"> <% } %> <span class="author"><%- name %></span> <span class="username"> @<%- username %> </span> </a> <% } else { %> <span class="no-value assign-yourself"> No assignee - <a href="#" class="js-assign-yourself"> assign yourself </a> </span> <% } %>',
+        );
+        return $dropdown.glDropdown({
+          showMenuAbove: showMenuAbove,
+          data: function(term, callback) {
+            return _this.users(
+              term,
+              options,
+              function(users) {
+                // GitLabDropdownFilter returns this.instance
+                // GitLabDropdownRemote returns this.options.instance
+                const glDropdown = this.instance || this.options.instance;
+                glDropdown.options.processData(term, users, callback);
+              }.bind(this),
+            );
+          },
+          processData: function(term, data, callback) {
+            let users = data;
+
+            // Only show assigned user list when there is no search term
+            if ($dropdown.hasClass('js-multiselect') && term.length === 0) {
+              const selectedInputs = getSelectedUserInputs();
+
+              // Potential duplicate entries when dealing with issue board
+              // because issue board is also managed by vue
+              const selectedUsers = _.uniq(selectedInputs, false, a => a.value)
+                .filter(input => {
+                  const userId = parseInt(input.value, 10);
+                  const inUsersArray = users.find(u => u.id === userId);
+
+                  return !inUsersArray && userId !== 0;
+                })
+                .map(input => {
+                  const userId = parseInt(input.value, 10);
+                  const { avatarUrl, avatar_url, name, username } = input.dataset;
+                  return {
+                    avatar_url: avatarUrl || avatar_url,
+                    id: userId,
+                    name,
+                    username,
+                  };
+                });
 
-            users = data.concat(selectedUsers);
-          }
+              users = data.concat(selectedUsers);
+            }
 
-          let anyUser;
-          let index;
-          let len;
-          let name;
-          let obj;
-          let showDivider;
-          if (term.length === 0) {
-            showDivider = 0;
-            if (firstUser) {
-              // Move current user to the front of the list
-              for (index = 0, len = users.length; index < len; index += 1) {
-                obj = users[index];
-                if (obj.username === firstUser) {
-                  users.splice(index, 1);
-                  users.unshift(obj);
-                  break;
+            let anyUser;
+            let index;
+            let len;
+            let name;
+            let obj;
+            let showDivider;
+            if (term.length === 0) {
+              showDivider = 0;
+              if (firstUser) {
+                // Move current user to the front of the list
+                for (index = 0, len = users.length; index < len; index += 1) {
+                  obj = users[index];
+                  if (obj.username === firstUser) {
+                    users.splice(index, 1);
+                    users.unshift(obj);
+                    break;
+                  }
                 }
               }
-            }
-            if (showNullUser) {
-              showDivider += 1;
-              users.unshift({
-                beforeDivider: true,
-                name: 'Unassigned',
-                id: 0
-              });
-            }
-            if (showAnyUser) {
-              showDivider += 1;
-              name = showAnyUser;
-              if (name === true) {
-                name = 'Any User';
+              if (showNullUser) {
+                showDivider += 1;
+                users.unshift({
+                  beforeDivider: true,
+                  name: 'Unassigned',
+                  id: 0,
+                });
+              }
+              if (showAnyUser) {
+                showDivider += 1;
+                name = showAnyUser;
+                if (name === true) {
+                  name = 'Any User';
+                }
+                anyUser = {
+                  beforeDivider: true,
+                  name: name,
+                  id: null,
+                };
+                users.unshift(anyUser);
               }
-              anyUser = {
-                beforeDivider: true,
-                name: name,
-                id: null
-              };
-              users.unshift(anyUser);
-            }
 
-            if (showDivider) {
-              users.splice(showDivider, 0, 'divider');
-            }
+              if (showDivider) {
+                users.splice(showDivider, 0, 'divider');
+              }
 
-            if ($dropdown.hasClass('js-multiselect')) {
-              const selected = getSelected().filter(i => i !== 0);
+              if ($dropdown.hasClass('js-multiselect')) {
+                const selected = getSelected().filter(i => i !== 0);
 
-              if (selected.length > 0) {
-                if ($dropdown.data('dropdownHeader')) {
-                  showDivider += 1;
-                  users.splice(showDivider, 0, {
-                    header: $dropdown.data('dropdownHeader'),
-                  });
-                }
+                if (selected.length > 0) {
+                  if ($dropdown.data('dropdownHeader')) {
+                    showDivider += 1;
+                    users.splice(showDivider, 0, {
+                      header: $dropdown.data('dropdownHeader'),
+                    });
+                  }
 
-                const selectedUsers = users
-                  .filter(u => selected.indexOf(u.id) !== -1)
-                  .sort((a, b) => a.name > b.name);
+                  const selectedUsers = users
+                    .filter(u => selected.indexOf(u.id) !== -1)
+                    .sort((a, b) => a.name > b.name);
 
-                users = users.filter(u => selected.indexOf(u.id) === -1);
+                  users = users.filter(u => selected.indexOf(u.id) === -1);
 
-                selectedUsers.forEach((selectedUser) => {
-                  showDivider += 1;
-                  users.splice(showDivider, 0, selectedUser);
-                });
+                  selectedUsers.forEach(selectedUser => {
+                    showDivider += 1;
+                    users.splice(showDivider, 0, selectedUser);
+                  });
 
-                users.splice(showDivider + 1, 0, 'divider');
+                  users.splice(showDivider + 1, 0, 'divider');
+                }
               }
             }
-          }
 
-          callback(users);
-          if (showMenuAbove) {
-            $dropdown.data('glDropdown').positionMenuAbove();
-          }
-        },
-        filterable: true,
-        filterRemote: true,
-        search: {
-          fields: ['name', 'username']
-        },
-        selectable: true,
-        fieldName: $dropdown.data('fieldName'),
-        toggleLabel: function(selected, el, glDropdown) {
-          const inputValue = glDropdown.filterInput.val();
-
-          if (this.multiSelect && inputValue === '') {
-            // Remove non-users from the fullData array
-            const users = glDropdown.filteredFullData();
-            const callback = glDropdown.parseData.bind(glDropdown);
-
-            // Update the data model
-            this.processData(inputValue, users, callback);
-          }
+            callback(users);
+            if (showMenuAbove) {
+              $dropdown.data('glDropdown').positionMenuAbove();
+            }
+          },
+          filterable: true,
+          filterRemote: true,
+          search: {
+            fields: ['name', 'username'],
+          },
+          selectable: true,
+          fieldName: $dropdown.data('fieldName'),
+          toggleLabel: function(selected, el, glDropdown) {
+            const inputValue = glDropdown.filterInput.val();
+
+            if (this.multiSelect && inputValue === '') {
+              // Remove non-users from the fullData array
+              const users = glDropdown.filteredFullData();
+              const callback = glDropdown.parseData.bind(glDropdown);
+
+              // Update the data model
+              this.processData(inputValue, users, callback);
+            }
 
-          if (this.multiSelect) {
-            return getMultiSelectDropdownTitle(selected, $(el).hasClass('is-active'));
-          }
+            if (this.multiSelect) {
+              return getMultiSelectDropdownTitle(selected, $(el).hasClass('is-active'));
+            }
 
-          if (selected && 'id' in selected && $(el).hasClass('is-active')) {
-            $dropdown.find('.dropdown-toggle-text').removeClass('is-default');
-            if (selected.text) {
-              return selected.text;
+            if (selected && 'id' in selected && $(el).hasClass('is-active')) {
+              $dropdown.find('.dropdown-toggle-text').removeClass('is-default');
+              if (selected.text) {
+                return selected.text;
+              } else {
+                return selected.name;
+              }
             } else {
-              return selected.name;
+              $dropdown.find('.dropdown-toggle-text').addClass('is-default');
+              return defaultLabel;
+            }
+          },
+          defaultLabel: defaultLabel,
+          hidden: function(e) {
+            if ($dropdown.hasClass('js-multiselect')) {
+              emitSidebarEvent('sidebar.saveAssignees');
             }
-          } else {
-            $dropdown.find('.dropdown-toggle-text').addClass('is-default');
-            return defaultLabel;
-          }
-        },
-        defaultLabel: defaultLabel,
-        hidden: function(e) {
-          if ($dropdown.hasClass('js-multiselect')) {
-            emitSidebarEvent('sidebar.saveAssignees');
-          }
-
-          if (!$dropdown.data('alwaysShowSelectbox')) {
-            $selectbox.hide();
 
-            // Recalculate where .value is because vue might have changed it
-            $block = $selectbox.closest('.block');
-            $value = $block.find('.value');
-            // display:block overrides the hide-collapse rule
-            $value.css('display', '');
-          }
-        },
-        multiSelect: $dropdown.hasClass('js-multiselect'),
-        inputMeta: $dropdown.data('inputMeta'),
-        clicked: function(options) {
-          const { $el, e, isMarking } = options;
-          const user = options.selectedObj;
-
-          if ($dropdown.hasClass('js-multiselect')) {
-            const isActive = $el.hasClass('is-active');
-            const previouslySelected = $dropdown.closest('.selectbox')
-                .find("input[name='" + ($dropdown.data('fieldName')) + "'][value!=0]");
-
-            // Enables support for limiting the number of users selected
-            // Automatically removes the first on the list if more users are selected
-            checkMaxSelect();
+            if (!$dropdown.data('alwaysShowSelectbox')) {
+              $selectbox.hide();
 
-            if (user.beforeDivider && user.name.toLowerCase() === 'unassigned') {
-              // Unassigned selected
-              previouslySelected.each((index, element) => {
-                const id = parseInt(element.value, 10);
-                element.remove();
-              });
-              emitSidebarEvent('sidebar.removeAllAssignees');
-            } else if (isActive) {
-              // user selected
-              emitSidebarEvent('sidebar.addAssignee', user);
+              // Recalculate where .value is because vue might have changed it
+              $block = $selectbox.closest('.block');
+              $value = $block.find('.value');
+              // display:block overrides the hide-collapse rule
+              $value.css('display', '');
+            }
+          },
+          multiSelect: $dropdown.hasClass('js-multiselect'),
+          inputMeta: $dropdown.data('inputMeta'),
+          clicked: function(options) {
+            const { $el, e, isMarking } = options;
+            const user = options.selectedObj;
 
-              // Remove unassigned selection (if it was previously selected)
-              const unassignedSelected = $dropdown.closest('.selectbox')
-                .find("input[name='" + ($dropdown.data('fieldName')) + "'][value=0]");
+            if ($dropdown.hasClass('js-multiselect')) {
+              const isActive = $el.hasClass('is-active');
+              const previouslySelected = $dropdown
+                .closest('.selectbox')
+                .find("input[name='" + $dropdown.data('fieldName') + "'][value!=0]");
+
+              // Enables support for limiting the number of users selected
+              // Automatically removes the first on the list if more users are selected
+              checkMaxSelect();
+
+              if (user.beforeDivider && user.name.toLowerCase() === 'unassigned') {
+                // Unassigned selected
+                previouslySelected.each((index, element) => {
+                  const id = parseInt(element.value, 10);
+                  element.remove();
+                });
+                emitSidebarEvent('sidebar.removeAllAssignees');
+              } else if (isActive) {
+                // user selected
+                emitSidebarEvent('sidebar.addAssignee', user);
+
+                // Remove unassigned selection (if it was previously selected)
+                const unassignedSelected = $dropdown
+                  .closest('.selectbox')
+                  .find("input[name='" + $dropdown.data('fieldName') + "'][value=0]");
+
+                if (unassignedSelected) {
+                  unassignedSelected.remove();
+                }
+              } else {
+                if (previouslySelected.length === 0) {
+                  // Select unassigned because there is no more selected users
+                  this.addInput($dropdown.data('fieldName'), 0, {});
+                }
 
-              if (unassignedSelected) {
-                unassignedSelected.remove();
-              }
-            } else {
-              if (previouslySelected.length === 0) {
-              // Select unassigned because there is no more selected users
-                this.addInput($dropdown.data('fieldName'), 0, {});
+                // User unselected
+                emitSidebarEvent('sidebar.removeAssignee', user);
               }
 
-              // User unselected
-              emitSidebarEvent('sidebar.removeAssignee', user);
+              if (getSelected().find(u => u === gon.current_user_id)) {
+                $('.assign-to-me-link').hide();
+              } else {
+                $('.assign-to-me-link').show();
+              }
             }
 
-            if (getSelected().find(u => u === gon.current_user_id)) {
-              $('.assign-to-me-link').hide();
-            } else {
-              $('.assign-to-me-link').show();
+            var isIssueIndex, isMRIndex, page, selected;
+            page = $('body').attr('data-page');
+            isIssueIndex = page === 'projects:issues:index';
+            isMRIndex = page === page && page === 'projects:merge_requests:index';
+            if (
+              $dropdown.hasClass('js-filter-bulk-update') ||
+              $dropdown.hasClass('js-issuable-form-dropdown')
+            ) {
+              e.preventDefault();
+
+              const isSelecting = user.id !== selectedId;
+              selectedId = isSelecting ? user.id : selectedIdDefault;
+
+              if (selectedId === gon.current_user_id) {
+                $('.assign-to-me-link').hide();
+              } else {
+                $('.assign-to-me-link').show();
+              }
+              return;
+            }
+            if ($el.closest('.add-issues-modal').length) {
+              ModalStore.store.filter[$dropdown.data('fieldName')] = user.id;
+            } else if (handleClick) {
+              e.preventDefault();
+              handleClick(user, isMarking);
+            } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
+              return Issuable.filterResults($dropdown.closest('form'));
+            } else if ($dropdown.hasClass('js-filter-submit')) {
+              return $dropdown.closest('form').submit();
+            } else if (!$dropdown.hasClass('js-multiselect')) {
+              selected = $dropdown
+                .closest('.selectbox')
+                .find("input[name='" + $dropdown.data('fieldName') + "']")
+                .val();
+              return assignTo(selected);
             }
-          }
 
-          var isIssueIndex, isMRIndex, page, selected;
-          page = $('body').attr('data-page');
-          isIssueIndex = page === 'projects:issues:index';
-          isMRIndex = (page === page && page === 'projects:merge_requests:index');
-          if ($dropdown.hasClass('js-filter-bulk-update') || $dropdown.hasClass('js-issuable-form-dropdown')) {
-            e.preventDefault();
+            // Automatically close dropdown after assignee is selected
+            // since CE has no multiple assignees
+            // EE does not have a max-select
+            if (
+              $dropdown.data('maxSelect') &&
+              getSelected().length === $dropdown.data('maxSelect')
+            ) {
+              // Close the dropdown
+              $dropdown.dropdown('toggle');
+            }
+          },
+          id: function(user) {
+            return user.id;
+          },
+          opened: function(e) {
+            const $el = $(e.currentTarget);
+            const selected = getSelected();
+            if ($dropdown.hasClass('js-issue-board-sidebar') && selected.length === 0) {
+              this.addInput($dropdown.data('fieldName'), 0, {});
+            }
+            $el.find('.is-active').removeClass('is-active');
 
-            const isSelecting = (user.id !== selectedId);
-            selectedId = isSelecting ? user.id : selectedIdDefault;
+            function highlightSelected(id) {
+              $el.find(`li[data-user-id="${id}"] .dropdown-menu-user-link`).addClass('is-active');
+            }
 
-            if (selectedId === gon.current_user_id) {
-              $('.assign-to-me-link').hide();
+            if (selected.length > 0) {
+              getSelected().forEach(selectedId => highlightSelected(selectedId));
+            } else if ($dropdown.hasClass('js-issue-board-sidebar')) {
+              highlightSelected(0);
             } else {
-              $('.assign-to-me-link').show();
+              highlightSelected(selectedId);
             }
-            return;
-          }
-          if ($el.closest('.add-issues-modal').length) {
-            ModalStore.store.filter[$dropdown.data('fieldName')] = user.id;
-          } else if (handleClick) {
-            e.preventDefault();
-            handleClick(user, isMarking);
-          } else if ($dropdown.hasClass('js-filter-submit') && (isIssueIndex || isMRIndex)) {
-            return Issuable.filterResults($dropdown.closest('form'));
-          } else if ($dropdown.hasClass('js-filter-submit')) {
-            return $dropdown.closest('form').submit();
-          } else if (!$dropdown.hasClass('js-multiselect')) {
-            selected = $dropdown.closest('.selectbox').find("input[name='" + ($dropdown.data('fieldName')) + "']").val();
-            return assignTo(selected);
-          }
-
-          // Automatically close dropdown after assignee is selected
-          // since CE has no multiple assignees
-          // EE does not have a max-select
-          if ($dropdown.data('maxSelect') &&
-              getSelected().length === $dropdown.data('maxSelect')) {
-            // Close the dropdown
-            $dropdown.dropdown('toggle');
-          }
-        },
-        id: function (user) {
-          return user.id;
-        },
-        opened: function(e) {
-          const $el = $(e.currentTarget);
-          const selected = getSelected();
-          if ($dropdown.hasClass('js-issue-board-sidebar') && selected.length === 0) {
-            this.addInput($dropdown.data('fieldName'), 0, {});
-          }
-          $el.find('.is-active').removeClass('is-active');
-
-          function highlightSelected(id) {
-            $el.find(`li[data-user-id="${id}"] .dropdown-menu-user-link`).addClass('is-active');
-          }
+          },
+          updateLabel: $dropdown.data('dropdownTitle'),
+          renderRow: function(user) {
+            var avatar, img, listClosingTags, listWithName, listWithUserName, username;
+            username = user.username ? '@' + user.username : '';
+            avatar = user.avatar_url ? user.avatar_url : gon.default_avatar_url;
 
-          if (selected.length > 0) {
-            getSelected().forEach(selectedId => highlightSelected(selectedId));
-          } else if ($dropdown.hasClass('js-issue-board-sidebar')) {
-            highlightSelected(0);
-          } else {
-            highlightSelected(selectedId);
-          }
-        },
-        updateLabel: $dropdown.data('dropdownTitle'),
-        renderRow: function(user) {
-          var avatar, img, listClosingTags, listWithName, listWithUserName, username;
-          username = user.username ? "@" + user.username : "";
-          avatar = user.avatar_url ? user.avatar_url : gon.default_avatar_url;
+            let selected = false;
 
-          let selected = false;
+            if (this.multiSelect) {
+              selected = getSelected().find(u => user.id === u);
 
-          if (this.multiSelect) {
-            selected = getSelected().find(u => user.id === u);
+              const { fieldName } = this;
+              const field = $dropdown
+                .closest('.selectbox')
+                .find("input[name='" + fieldName + "'][value='" + user.id + "']");
 
-            const { fieldName } = this;
-            const field = $dropdown.closest('.selectbox').find("input[name='" + fieldName + "'][value='" + user.id + "']");
-
-            if (field.length) {
-              selected = true;
+              if (field.length) {
+                selected = true;
+              }
+            } else {
+              selected = user.id === selectedId;
             }
-          } else {
-            selected = user.id === selectedId;
-          }
 
-          img = "";
-          if (user.beforeDivider != null) {
-            `<li><a href='#' class='${selected === true ? 'is-active' : ''}'>${_.escape(user.name)}</a></li>`;
-          } else {
-            img = "<img src='" + avatar + "' class='avatar avatar-inline' width='32' />";
-          }
+            img = '';
+            if (user.beforeDivider != null) {
+              `<li><a href='#' class='${selected === true ? 'is-active' : ''}'>${_.escape(
+                user.name,
+              )}</a></li>`;
+            } else {
+              img = "<img src='" + avatar + "' class='avatar avatar-inline' width='32' />";
+            }
 
-          return `
+            return `
             <li data-user-id=${user.id}>
               <a href='#' class='dropdown-menu-user-link ${selected === true ? 'is-active' : ''}'>
                 ${img}
@@ -528,114 +574,117 @@ function UsersSelect(currentUser, els, options = {}) {
               </a>
             </li>
           `;
-        }
-      });
-    };
-  })(this));
-  $('.ajax-users-select').each((function(_this) {
-    return function(i, select) {
-      var firstUser, showAnyUser, showEmailUser, showNullUser;
-      var options = {};
-      options.skipLdap = $(select).hasClass('skip_ldap');
-      options.projectId = $(select).data('projectId');
-      options.groupId = $(select).data('groupId');
-      options.showCurrentUser = $(select).data('currentUser');
-      options.authorId = $(select).data('authorId');
-      options.skipUsers = $(select).data('skipUsers');
-      showNullUser = $(select).data('nullUser');
-      showAnyUser = $(select).data('anyUser');
-      showEmailUser = $(select).data('emailUser');
-      firstUser = $(select).data('firstUser');
-      return $(select).select2({
-        placeholder: "Search for a user",
-        multiple: $(select).hasClass('multiselect'),
-        minimumInputLength: 0,
-        query: function(query) {
-          return _this.users(query.term, options, function(users) {
-            var anyUser, data, emailUser, index, len, name, nullUser, obj, ref;
-            data = {
-              results: users
-            };
-            if (query.term.length === 0) {
-              if (firstUser) {
-                // Move current user to the front of the list
-                ref = data.results;
-
-                for (index = 0, len = ref.length; index < len; index += 1) {
-                  obj = ref[index];
-                  if (obj.username === firstUser) {
-                    data.results.splice(index, 1);
-                    data.results.unshift(obj);
-                    break;
+          },
+        });
+      };
+    })(this),
+  );
+  $('.ajax-users-select').each(
+    (function(_this) {
+      return function(i, select) {
+        var firstUser, showAnyUser, showEmailUser, showNullUser;
+        var options = {};
+        options.skipLdap = $(select).hasClass('skip_ldap');
+        options.projectId = $(select).data('projectId');
+        options.groupId = $(select).data('groupId');
+        options.showCurrentUser = $(select).data('currentUser');
+        options.authorId = $(select).data('authorId');
+        options.skipUsers = $(select).data('skipUsers');
+        showNullUser = $(select).data('nullUser');
+        showAnyUser = $(select).data('anyUser');
+        showEmailUser = $(select).data('emailUser');
+        firstUser = $(select).data('firstUser');
+        return $(select).select2({
+          placeholder: 'Search for a user',
+          multiple: $(select).hasClass('multiselect'),
+          minimumInputLength: 0,
+          query: function(query) {
+            return _this.users(query.term, options, function(users) {
+              var anyUser, data, emailUser, index, len, name, nullUser, obj, ref;
+              data = {
+                results: users,
+              };
+              if (query.term.length === 0) {
+                if (firstUser) {
+                  // Move current user to the front of the list
+                  ref = data.results;
+
+                  for (index = 0, len = ref.length; index < len; index += 1) {
+                    obj = ref[index];
+                    if (obj.username === firstUser) {
+                      data.results.splice(index, 1);
+                      data.results.unshift(obj);
+                      break;
+                    }
                   }
                 }
-              }
-              if (showNullUser) {
-                nullUser = {
-                  name: 'Unassigned',
-                  id: 0
-                };
-                data.results.unshift(nullUser);
-              }
-              if (showAnyUser) {
-                name = showAnyUser;
-                if (name === true) {
-                  name = 'Any User';
+                if (showNullUser) {
+                  nullUser = {
+                    name: 'Unassigned',
+                    id: 0,
+                  };
+                  data.results.unshift(nullUser);
                 }
-                anyUser = {
-                  name: name,
-                  id: null
+                if (showAnyUser) {
+                  name = showAnyUser;
+                  if (name === true) {
+                    name = 'Any User';
+                  }
+                  anyUser = {
+                    name: name,
+                    id: null,
+                  };
+                  data.results.unshift(anyUser);
+                }
+              }
+              if (showEmailUser && data.results.length === 0 && query.term.match(/^[^@]+@[^@]+$/)) {
+                var trimmed = query.term.trim();
+                emailUser = {
+                  name: 'Invite "' + trimmed + '" by email',
+                  username: trimmed,
+                  id: trimmed,
+                  invite: true,
                 };
-                data.results.unshift(anyUser);
+                data.results.unshift(emailUser);
               }
-            }
-            if (showEmailUser && data.results.length === 0 && query.term.match(/^[^@]+@[^@]+$/)) {
-              var trimmed = query.term.trim();
-              emailUser = {
-                name: "Invite \"" + trimmed + "\" by email",
-                username: trimmed,
-                id: trimmed,
-                invite: true
-              };
-              data.results.unshift(emailUser);
-            }
-            return query.callback(data);
-          });
-        },
-        initSelection: function() {
-          var args;
-          args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
-          return _this.initSelection.apply(_this, args);
-        },
-        formatResult: function() {
-          var args;
-          args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
-          return _this.formatResult.apply(_this, args);
-        },
-        formatSelection: function() {
-          var args;
-          args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
-          return _this.formatSelection.apply(_this, args);
-        },
-        dropdownCssClass: "ajax-users-dropdown",
-        // we do not want to escape markup since we are displaying html in results
-        escapeMarkup: function(m) {
-          return m;
-        }
-      });
-    };
-  })(this));
+              return query.callback(data);
+            });
+          },
+          initSelection: function() {
+            var args;
+            args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
+            return _this.initSelection.apply(_this, args);
+          },
+          formatResult: function() {
+            var args;
+            args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
+            return _this.formatResult.apply(_this, args);
+          },
+          formatSelection: function() {
+            var args;
+            args = 1 <= arguments.length ? [].slice.call(arguments, 0) : [];
+            return _this.formatSelection.apply(_this, args);
+          },
+          dropdownCssClass: 'ajax-users-dropdown',
+          // we do not want to escape markup since we are displaying html in results
+          escapeMarkup: function(m) {
+            return m;
+          },
+        });
+      };
+    })(this),
+  );
 }
 
 UsersSelect.prototype.initSelection = function(element, callback) {
   var id, nullUser;
   id = $(element).val();
-  if (id === "0") {
+  if (id === '0') {
     nullUser = {
-      name: 'Unassigned'
+      name: 'Unassigned',
     };
     return callback(nullUser);
-  } else if (id !== "") {
+  } else if (id !== '') {
     return this.user(id, callback);
   }
 };
@@ -647,7 +696,17 @@ UsersSelect.prototype.formatResult = function(user) {
   } else {
     avatar = gon.default_avatar_url;
   }
-  return "<div class='user-result " + (!user.username ? 'no-username' : void 0) + "'> <div class='user-image'><img class='avatar avatar-inline s32' src='" + avatar + "'></div> <div class='user-name dropdown-menu-user-full-name'>" + _.escape(user.name) + "</div> <div class='user-username dropdown-menu-user-username'>" + (!user.invite ? "@" + _.escape(user.username) : "") + "</div> </div>";
+  return (
+    "<div class='user-result " +
+    (!user.username ? 'no-username' : void 0) +
+    "'> <div class='user-image'><img class='avatar avatar-inline s32' src='" +
+    avatar +
+    "'></div> <div class='user-name dropdown-menu-user-full-name'>" +
+    _.escape(user.name) +
+    "</div> <div class='user-username dropdown-menu-user-username'>" +
+    (!user.invite ? '@' + _.escape(user.username) : '') +
+    '</div> </div>'
+  );
 };
 
 UsersSelect.prototype.formatSelection = function(user) {
@@ -662,10 +721,9 @@ UsersSelect.prototype.user = function(user_id, callback) {
   var url;
   url = this.buildUrl(this.userPath);
   url = url.replace(':id', user_id);
-  return axios.get(url)
-    .then(({ data }) => {
-      callback(data);
-    });
+  return axios.get(url).then(({ data }) => {
+    callback(data);
+  });
 };
 
 // Return users list. Filtered by query
@@ -682,12 +740,11 @@ UsersSelect.prototype.users = function(query, options, callback) {
     todo_state_filter: options.todoStateFilter || null,
     current_user: options.showCurrentUser || null,
     author_id: options.authorId || null,
-    skip_users: options.skipUsers || null
+    skip_users: options.skipUsers || null,
   };
-  return axios.get(url, { params })
-    .then(({ data }) => {
-      callback(data);
-    });
+  return axios.get(url, { params }).then(({ data }) => {
+    callback(data);
+  });
 };
 
 UsersSelect.prototype.buildUrl = function(url) {

app/assets/javascripts/zen_mode.js

@@ -47,16 +47,26 @@ export default class ZenMode {
       e.preventDefault();
       return $(e.currentTarget).trigger('zen_mode:leave');
     });
-    $(document).on('zen_mode:enter', (function(_this) {
-      return function(e) {
-        return _this.enter($(e.target).closest('.md-area').find('.zen-backdrop'));
-      };
-    })(this));
-    $(document).on('zen_mode:leave', (function(_this) {
-      return function(e) {
-        return _this.exit();
-      };
-    })(this));
+    $(document).on(
+      'zen_mode:enter',
+      (function(_this) {
+        return function(e) {
+          return _this.enter(
+            $(e.target)
+              .closest('.md-area')
+              .find('.zen-backdrop'),
+          );
+        };
+      })(this),
+    );
+    $(document).on(
+      'zen_mode:leave',
+      (function(_this) {
+        return function(e) {
+          return _this.exit();
+        };
+      })(this),
+    );
     $(document).on('keydown', function(e) {
       // Esc
       if (e.keyCode === 27) {
@@ -93,7 +103,7 @@ export default class ZenMode {
 
   scrollTo(zen_area) {
     return $.scrollTo(zen_area, 0, {
-      offset: -150
+      offset: -150,
     });
   }
 }