1 files changed, 68 insertions, 57 deletions

diff --git a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js b/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
index 0854c1822fb..c23d4c484a5 100644
--- a/app/assets/javascripts/filtered_search/filtered_search_visual_tokens.js
+++ b/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();