1 files changed, 51 insertions, 34 deletions

diff --git a/app/assets/javascripts/boards/components/issue_board_filtered_search.vue b/app/assets/javascripts/boards/components/issue_board_filtered_search.vue
index bdb9c2be836..7fc87f9f672 100644
--- a/app/assets/javascripts/boards/components/issue_board_filtered_search.vue
+++ b/app/assets/javascripts/boards/components/issue_board_filtered_search.vue
@@ -2,22 +2,25 @@
 import { GlFilteredSearchToken } from '@gitlab/ui';
 import fuzzaldrinPlus from 'fuzzaldrin-plus';
 import { mapActions } from 'vuex';
+import { orderBy } from 'lodash';
 import BoardFilteredSearch from 'ee_else_ce/boards/components/board_filtered_search.vue';
 import { BoardType } from '~/boards/constants';
 import axios from '~/lib/utils/axios_utils';
+import { joinPaths } from '~/lib/utils/url_utility';
 import issueBoardFilters from '~/boards/issue_board_filters';
 import { TYPE_USER } from '~/graphql_shared/constants';
 import { convertToGraphQLId } from '~/graphql_shared/utils';
 import { __ } from '~/locale';
 import {
-  DEFAULT_MILESTONES_GRAPHQL,
   TOKEN_TITLE_MY_REACTION,
+  OPERATOR_IS_AND_IS_NOT,
+  OPERATOR_IS_ONLY,
 } from '~/vue_shared/components/filtered_search_bar/constants';
 import AuthorToken from '~/vue_shared/components/filtered_search_bar/tokens/author_token.vue';
 import EmojiToken from '~/vue_shared/components/filtered_search_bar/tokens/emoji_token.vue';
 import LabelToken from '~/vue_shared/components/filtered_search_bar/tokens/label_token.vue';
 import MilestoneToken from '~/vue_shared/components/filtered_search_bar/tokens/milestone_token.vue';
-import WeightToken from '~/vue_shared/components/filtered_search_bar/tokens/weight_token.vue';
+import ReleaseToken from '~/vue_shared/components/filtered_search_bar/tokens/release_token.vue';
 
 export default {
   types: {
@@ -34,12 +37,11 @@ export default {
     incident: __('Incident'),
     issue: __('Issue'),
     milestone: __('Milestone'),
-    weight: __('Weight'),
-    is: __('is'),
-    isNot: __('is not'),
+    release: __('Release'),
+    confidential: __('Confidential'),
   },
   components: { BoardFilteredSearch },
-  inject: ['isSignedIn'],
+  inject: ['isSignedIn', 'releasesFetchPath'],
   props: {
     fullPath: {
       type: String,
@@ -62,15 +64,14 @@ export default {
     tokensCE() {
       const {
         label,
-        is,
-        isNot,
         author,
         assignee,
         issue,
         incident,
         type,
         milestone,
-        weight,
+        release,
+        confidential,
       } = this.$options.i18n;
       const { types } = this.$options;
       const { fetchAuthors, fetchLabels } = issueBoardFilters(
@@ -79,15 +80,12 @@ export default {
         this.boardType,
       );
 
-      return [
+      const tokens = [
         {
           icon: 'user',
           title: assignee,
-          type: 'assignee_username',
-          operators: [
-            { value: '=', description: is },
-            { value: '!=', description: isNot },
-          ],
+          type: 'assignee',
+          operators: OPERATOR_IS_AND_IS_NOT,
           token: AuthorToken,
           unique: true,
           fetchAuthors,
@@ -96,11 +94,8 @@ export default {
         {
           icon: 'pencil',
           title: author,
-          type: 'author_username',
-          operators: [
-            { value: '=', description: is },
-            { value: '!=', description: isNot },
-          ],
+          type: 'author',
+          operators: OPERATOR_IS_AND_IS_NOT,
           symbol: '@',
           token: AuthorToken,
           unique: true,
@@ -110,11 +105,8 @@ export default {
         {
           icon: 'labels',
           title: label,
-          type: 'label_name',
-          operators: [
-            { value: '=', description: is },
-            { value: '!=', description: isNot },
-          ],
+          type: 'label',
+          operators: OPERATOR_IS_AND_IS_NOT,
           token: LabelToken,
           unique: false,
           symbol: '~',
@@ -123,7 +115,7 @@ export default {
         ...(this.isSignedIn
           ? [
               {
-                type: 'my_reaction_emoji',
+                type: 'my-reaction',
                 title: TOKEN_TITLE_MY_REACTION,
                 icon: 'thumb-up',
                 token: EmojiToken,
@@ -144,22 +136,33 @@ export default {
                     });
                 },
               },
+              {
+                type: 'confidential',
+                icon: 'eye-slash',
+                title: confidential,
+                unique: true,
+                token: GlFilteredSearchToken,
+                operators: OPERATOR_IS_ONLY,
+                options: [
+                  { icon: 'eye-slash', value: 'yes', title: __('Yes') },
+                  { icon: 'eye', value: 'no', title: __('No') },
+                ],
+              },
             ]
           : []),
         {
-          type: 'milestone_title',
+          type: 'milestone',
           title: milestone,
           icon: 'clock',
           symbol: '%',
           token: MilestoneToken,
           unique: true,
-          defaultMilestones: DEFAULT_MILESTONES_GRAPHQL,
           fetchMilestones: this.fetchMilestones,
         },
         {
           icon: 'issues',
           title: type,
-          type: 'types',
+          type: 'type',
           token: GlFilteredSearchToken,
           unique: true,
           options: [
@@ -168,13 +171,27 @@ export default {
           ],
         },
         {
-          type: 'weight',
-          title: weight,
-          icon: 'weight',
-          token: WeightToken,
-          unique: true,
+          type: 'release',
+          title: release,
+          icon: 'rocket',
+          token: ReleaseToken,
+          fetchReleases: (search) => {
+            // TODO: Switch to GraphQL query when backend is ready: https://gitlab.com/gitlab-org/gitlab/-/issues/337686
+            return axios
+              .get(joinPaths(gon.relative_url_root, this.releasesFetchPath))
+              .then(({ data }) => {
+                if (search) {
+                  return fuzzaldrinPlus.filter(data, search, {
+                    key: ['tag'],
+                  });
+                }
+                return data;
+              });
+          },
         },
       ];
+
+      return orderBy(tokens, ['title']);
     },
     tokens() {
       return this.tokensCE;