Update filtered search constants and extract i18n

This commit:
- Extracts i18n strings out of issues_list_app.vue to constants file
- Extracts some constants to filtered search constants file
  and updates various usages of them across the codebase

app/assets/javascripts/issues_list/components/issues_list_app.vue

@@ -33,8 +33,19 @@ import {
 } from '~/issues_list/utils';
 import axios from '~/lib/utils/axios_utils';
 import { convertObjectPropsToCamelCase, getParameterByName } from '~/lib/utils/common_utils';
-import { __ } from '~/locale';
-import { DEFAULT_NONE_ANY } from '~/vue_shared/components/filtered_search_bar/constants';
+import {
+  DEFAULT_NONE_ANY,
+  OPERATOR_IS_ONLY,
+  TOKEN_TITLE_ASSIGNEE,
+  TOKEN_TITLE_AUTHOR,
+  TOKEN_TITLE_CONFIDENTIAL,
+  TOKEN_TITLE_EPIC,
+  TOKEN_TITLE_ITERATION,
+  TOKEN_TITLE_LABEL,
+  TOKEN_TITLE_MILESTONE,
+  TOKEN_TITLE_MY_REACTION,
+  TOKEN_TITLE_WEIGHT,
+} 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 EpicToken from '~/vue_shared/components/filtered_search_bar/tokens/epic_token.vue';
@@ -176,7 +187,7 @@ export default {
       const tokens = [
         {
           type: 'author_username',
-          title: __('Author'),
+          title: TOKEN_TITLE_AUTHOR,
           icon: 'pencil',
           token: AuthorToken,
           dataType: 'user',
@@ -186,7 +197,7 @@ export default {
         },
         {
           type: 'assignee_username',
-          title: __('Assignee'),
+          title: TOKEN_TITLE_ASSIGNEE,
           icon: 'user',
           token: AuthorToken,
           dataType: 'user',
@@ -196,7 +207,7 @@ export default {
         },
         {
           type: 'milestone',
-          title: __('Milestone'),
+          title: TOKEN_TITLE_MILESTONE,
           icon: 'clock',
           token: MilestoneToken,
           unique: true,
@@ -205,7 +216,7 @@ export default {
         },
         {
           type: 'labels',
-          title: __('Label'),
+          title: TOKEN_TITLE_LABEL,
           icon: 'labels',
           token: LabelToken,
           defaultLabels: [],
@@ -213,23 +224,23 @@ export default {
         },
         {
           type: 'my_reaction_emoji',
-          title: __('My-Reaction'),
+          title: TOKEN_TITLE_MY_REACTION,
           icon: 'thumb-up',
           token: EmojiToken,
           unique: true,
-          operators: [{ value: '=', description: __('is') }],
+          operators: OPERATOR_IS_ONLY,
           fetchEmojis: this.fetchEmojis,
         },
         {
           type: 'confidential',
-          title: __('Confidential'),
+          title: TOKEN_TITLE_CONFIDENTIAL,
           icon: 'eye-slash',
           token: GlFilteredSearchToken,
           unique: true,
-          operators: [{ value: '=', description: __('is') }],
+          operators: OPERATOR_IS_ONLY,
           options: [
-            { icon: 'eye-slash', value: 'yes', title: __('Yes') },
-            { icon: 'eye', value: 'no', title: __('No') },
+            { icon: 'eye-slash', value: 'yes', title: this.$options.i18n.confidentialYes },
+            { icon: 'eye', value: 'no', title: this.$options.i18n.confidentialNo },
           ],
         },
       ];
@@ -237,7 +248,7 @@ export default {
       if (this.projectIterationsPath) {
         tokens.push({
           type: 'iteration',
-          title: __('Iteration'),
+          title: TOKEN_TITLE_ITERATION,
           icon: 'iteration',
           token: IterationToken,
           unique: true,
@@ -248,7 +259,7 @@ export default {
       if (this.groupEpicsPath) {
         tokens.push({
           type: 'epic_id',
-          title: __('Epic'),
+          title: TOKEN_TITLE_EPIC,
           icon: 'epic',
           token: EpicToken,
           unique: true,
@@ -259,7 +270,7 @@ export default {
       if (this.hasIssueWeightsFeature) {
         tokens.push({
           type: 'weight',
-          title: __('Weight'),
+          title: TOKEN_TITLE_WEIGHT,
           icon: 'weight',
           token: WeightToken,
           unique: true,
@@ -369,7 +380,7 @@ export default {
           this.exportCsvPathWithQuery = this.getExportCsvPathWithQuery();
         })
         .catch(() => {
-          createFlash({ message: __('An error occurred while loading issues') });
+          createFlash({ message: this.$options.i18n.errorFetchingIssues });
         })
         .finally(() => {
           this.isLoading = false;
@@ -380,10 +391,10 @@ export default {
     },
     getStatus(issue) {
       if (issue.closedAt && issue.movedToId) {
-        return __('CLOSED (MOVED)');
+        return this.$options.i18n.closedMoved;
       }
       if (issue.closedAt) {
-        return __('CLOSED');
+        return this.$options.i18n.closed;
       }
       return undefined;
     },
@@ -472,7 +483,7 @@ export default {
     <issuable-list
       :namespace="projectPath"
       recent-searches-storage-key="issues"
-      :search-input-placeholder="__('Search or filter results…')"
+      :search-input-placeholder="$options.i18n.searchPlaceholder"
       :search-tokens="searchTokens"
       :initial-filter-value="filterTokens"
       :sort-options="sortOptions"
@@ -523,7 +534,7 @@ export default {
           :disabled="isBulkEditButtonDisabled"
           @click="handleBulkUpdateClick"
         >
-          {{ __('Edit issues') }}
+          {{ $options.i18n.editIssues }}
         </gl-button>
         <gl-button v-if="showNewIssueLink" :href="newIssuePath" variant="confirm">
           {{ $options.i18n.newIssueLabel }}
@@ -543,7 +554,7 @@ export default {
           v-if="issuable.mergeRequestsCount"
           v-gl-tooltip
           class="gl-display-none gl-sm-display-block"
-          :title="__('Related merge requests')"
+          :title="$options.i18n.relatedMergeRequests"
           data-testid="issuable-mr"
         >
           <gl-icon name="merge-request" />
@@ -553,7 +564,7 @@ export default {
           v-if="issuable.upvotes"
           v-gl-tooltip
           class="gl-display-none gl-sm-display-block"
-          :title="__('Upvotes')"
+          :title="$options.i18n.upvotes"
           data-testid="issuable-upvotes"
         >
           <gl-icon name="thumb-up" />
@@ -563,7 +574,7 @@ export default {
           v-if="issuable.downvotes"
           v-gl-tooltip
           class="gl-display-none gl-sm-display-block"
-          :title="__('Downvotes')"
+          :title="$options.i18n.downvotes"
           data-testid="issuable-downvotes"
         >
           <gl-icon name="thumb-down" />

app/assets/javascripts/issues_list/constants.js

@@ -3,6 +3,8 @@ import {
   FILTER_ANY,
   FILTER_CURRENT,
   FILTER_NONE,
+  OPERATOR_IS,
+  OPERATOR_IS_NOT,
 } from '~/vue_shared/components/filtered_search_bar/constants';
 
 // Maps sort order as it appears in the URL query to API `order_by` and `sort` params.
@@ -60,6 +62,13 @@ export const availableSortOptionsJira = [
 
 export const i18n = {
   calendarLabel: __('Subscribe to calendar'),
+  closed: __('CLOSED'),
+  closedMoved: __('CLOSED (MOVED)'),
+  confidentialNo: __('No'),
+  confidentialYes: __('Yes'),
+  downvotes: __('Downvotes'),
+  editIssues: __('Edit issues'),
+  errorFetchingIssues: __('An error occurred while loading issues'),
   jiraIntegrationMessage: s__(
     'JiraService|%{jiraDocsLinkStart}Enable the Jira integration%{jiraDocsLinkEnd} to view your Jira issues in GitLab.',
   ),
@@ -82,8 +91,11 @@ export const i18n = {
   noIssuesSignedOutTitle: __('There are no issues to show'),
   noSearchResultsDescription: __('To widen your search, change or remove filters above'),
   noSearchResultsTitle: __('Sorry, your filter produced no results'),
+  relatedMergeRequests: __('Related merge requests'),
   reorderError: __('An error occurred while reordering issues.'),
   rssLabel: __('Subscribe to RSS feed'),
+  searchPlaceholder: __('Search or filter results…'),
+  upvotes: __('Upvotes'),
 };
 
 export const JIRA_IMPORT_SUCCESS_ALERT_HIDE_MAP_KEY = 'jira-import-success-alert-hide-map';
@@ -195,10 +207,6 @@ export const sortParams = {
 
 export const MAX_LIST_SIZE = 10;
 
-export const FILTERED_SEARCH_TERM = 'filtered-search-term';
-export const OPERATOR_IS = '=';
-export const OPERATOR_IS_NOT = '!=';
-
 export const NORMAL_FILTER = 'normalFilter';
 export const SPECIAL_FILTER = 'specialFilter';
 export const SPECIAL_FILTER_VALUES = [FILTER_NONE, FILTER_ANY, FILTER_CURRENT];

app/assets/javascripts/issues_list/utils.js

@@ -5,7 +5,6 @@ import {
   CREATED_DESC,
   DUE_DATE_ASC,
   DUE_DATE_DESC,
-  FILTERED_SEARCH_TERM,
   filters,
   LABEL_PRIORITY_ASC,
   LABEL_PRIORITY_DESC,
@@ -26,6 +25,7 @@ import {
   WEIGHT_DESC,
 } from '~/issues_list/constants';
 import { __ } from '~/locale';
+import { FILTERED_SEARCH_TERM } from '~/vue_shared/components/filtered_search_bar/constants';
 
 export const getSortKey = (orderBy, sort) =>
   Object.keys(sortParams).find(

app/assets/javascripts/logs/components/log_advanced_filters.vue

 <script>
 import { GlFilteredSearch } from '@gitlab/ui';
 import { mapActions, mapState } from 'vuex';
-import { __, s__ } from '~/locale';
+import { s__ } from '~/locale';
 import DateTimePicker from '~/vue_shared/components/date_time_picker/date_time_picker.vue';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import { timeRanges } from '~/vue_shared/constants';
 import { TOKEN_TYPE_POD_NAME } from '../constants';
 import TokenWithLoadingState from './tokens/token_with_loading_state.vue';
@@ -54,7 +55,7 @@ export default {
           type: TOKEN_TYPE_POD_NAME,
           title: s__('Environments|Pod name'),
           token: TokenWithLoadingState,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           unique: true,
           options: this.podOptions,
           loading: this.logs.isLoading,

app/assets/javascripts/members/components/filter_sort/members_filtered_search_bar.vue

@@ -5,6 +5,7 @@ import { getParameterByName, urlParamsToObject } from '~/lib/utils/common_utils'
 import { setUrlParams } from '~/lib/utils/url_utility';
 import { s__ } from '~/locale';
 import { SEARCH_TOKEN_TYPE, SORT_PARAM } from '~/members/constants';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 
 export default {
@@ -17,7 +18,7 @@ export default {
       title: s__('Members|2FA'),
       token: GlFilteredSearchToken,
       unique: true,
-      operators: [{ value: '=', description: 'is' }],
+      operators: OPERATOR_IS_ONLY,
       options: [
         { value: 'enabled', title: s__('Members|Enabled') },
         { value: 'disabled', title: s__('Members|Disabled') },
@@ -30,7 +31,7 @@ export default {
       title: s__('Members|Membership'),
       token: GlFilteredSearchToken,
       unique: true,
-      operators: [{ value: '=', description: 'is' }],
+      operators: OPERATOR_IS_ONLY,
       options: [
         { value: 'exclude', title: s__('Members|Direct') },
         { value: 'only', title: s__('Members|Inherited') },

app/assets/javascripts/packages/list/components/package_search.vue

 <script>
 import { mapState, mapActions } from 'vuex';
-import { __, s__ } from '~/locale';
+import { s__ } from '~/locale';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import RegistrySearch from '~/vue_shared/components/registry/registry_search.vue';
 import UrlSync from '~/vue_shared/components/url_sync.vue';
 import { sortableFields } from '../utils';
@@ -14,7 +15,7 @@ export default {
       title: s__('PackageRegistry|Type'),
       unique: true,
       token: PackageTypeToken,
-      operators: [{ value: '=', description: __('is'), default: 'true' }],
+      operators: OPERATOR_IS_ONLY,
     },
   ],
   components: { RegistrySearch, UrlSync },

app/assets/javascripts/pipelines/components/pipelines_list/pipelines_filtered_search.vue

 <script>
 import { GlFilteredSearch } from '@gitlab/ui';
 import { map } from 'lodash';
-import { __, s__ } from '~/locale';
+import { s__ } from '~/locale';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import PipelineBranchNameToken from './tokens/pipeline_branch_name_token.vue';
 import PipelineStatusToken from './tokens/pipeline_status_token.vue';
 import PipelineTagNameToken from './tokens/pipeline_tag_name_token.vue';
@@ -43,7 +44,7 @@ export default {
           title: s__('Pipeline|Trigger author'),
           unique: true,
           token: PipelineTriggerAuthorToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           projectId: this.projectId,
         },
         {
@@ -52,7 +53,7 @@ export default {
           title: s__('Pipeline|Branch name'),
           unique: true,
           token: PipelineBranchNameToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           projectId: this.projectId,
           disabled: this.selectedTypes.includes(this.$options.tagType),
         },
@@ -62,7 +63,7 @@ export default {
           title: s__('Pipeline|Tag name'),
           unique: true,
           token: PipelineTagNameToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           projectId: this.projectId,
           disabled: this.selectedTypes.includes(this.$options.branchType),
         },
@@ -72,7 +73,7 @@ export default {
           title: s__('Pipeline|Status'),
           unique: true,
           token: PipelineStatusToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
         },
       ];
     },

app/assets/javascripts/vue_shared/components/filtered_search_bar/constants.js

-/* eslint-disable @gitlab/require-i18n-strings */
 import { __ } from '~/locale';
 
 export const DEBOUNCE_DELAY = 200;
@@ -7,6 +6,12 @@ export const FILTER_NONE = 'None';
 export const FILTER_ANY = 'Any';
 export const FILTER_CURRENT = 'Current';
 
+export const OPERATOR_IS = '=';
+export const OPERATOR_IS_TEXT = __('is');
+export const OPERATOR_IS_NOT = '!=';
+
+export const OPERATOR_IS_ONLY = [{ value: OPERATOR_IS, description: OPERATOR_IS_TEXT }];
+
 export const DEFAULT_LABEL_NONE = { value: FILTER_NONE, text: __(FILTER_NONE) };
 export const DEFAULT_LABEL_ANY = { value: FILTER_ANY, text: __(FILTER_ANY) };
 export const DEFAULT_NONE_ANY = [DEFAULT_LABEL_NONE, DEFAULT_LABEL_ANY];
@@ -15,15 +20,26 @@ export const DEFAULT_ITERATIONS = DEFAULT_NONE_ANY.concat([
   { value: FILTER_CURRENT, text: __(FILTER_CURRENT) },
 ]);
 
-export const DEFAULT_LABELS = [{ value: 'No label', text: __('No label') }];
+export const DEFAULT_LABELS = [{ value: 'No label', text: __('No label') }]; // eslint-disable-line @gitlab/require-i18n-strings
 
 export const DEFAULT_MILESTONES = DEFAULT_NONE_ANY.concat([
-  { value: 'Upcoming', text: __('Upcoming') },
-  { value: 'Started', text: __('Started') },
+  { value: 'Upcoming', text: __('Upcoming') }, // eslint-disable-line @gitlab/require-i18n-strings
+  { value: 'Started', text: __('Started') }, // eslint-disable-line @gitlab/require-i18n-strings
 ]);
 
 export const SortDirection = {
   descending: 'descending',
   ascending: 'ascending',
 };
-/* eslint-enable @gitlab/require-i18n-strings */
+
+export const FILTERED_SEARCH_TERM = 'filtered-search-term';
+
+export const TOKEN_TITLE_AUTHOR = __('Author');
+export const TOKEN_TITLE_ASSIGNEE = __('Assignee');
+export const TOKEN_TITLE_MILESTONE = __('Milestone');
+export const TOKEN_TITLE_LABEL = __('Label');
+export const TOKEN_TITLE_MY_REACTION = __('My-Reaction');
+export const TOKEN_TITLE_CONFIDENTIAL = __('Confidential');
+export const TOKEN_TITLE_ITERATION = __('Iteration');
+export const TOKEN_TITLE_EPIC = __('Epic');
+export const TOKEN_TITLE_WEIGHT = __('Weight');

app/assets/javascripts/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs.vue

@@ -4,6 +4,7 @@ import Api from '~/api';
 import { updateHistory, setUrlParams } from '~/lib/utils/url_utility';
 import { __ } from '~/locale';
 import Tracking from '~/tracking';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 import AuthorToken from '~/vue_shared/components/filtered_search_bar/tokens/author_token.vue';
 import { initialPaginationState, defaultI18n, defaultPageSize } from './constants';
@@ -105,7 +106,7 @@ export default {
           unique: true,
           symbol: '@',
           token: AuthorToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchPath: this.projectPath,
           fetchAuthors: Api.projectUsers.bind(Api),
         },
@@ -116,7 +117,7 @@ export default {
           unique: true,
           symbol: '@',
           token: AuthorToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchPath: this.projectPath,
           fetchAuthors: Api.projectUsers.bind(Api),
         },

ee/app/assets/javascripts/analytics/code_review_analytics/components/filter_bar.vue

 <script>
 import { mapState, mapActions } from 'vuex';
 import { __ } from '~/locale';
-import {
-  DEFAULT_LABEL_NONE,
-  DEFAULT_LABEL_ANY,
-} from '~/vue_shared/components/filtered_search_bar/constants';
+import { DEFAULT_NONE_ANY } from '~/vue_shared/components/filtered_search_bar/constants';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 import {
   prepareTokens,
@@ -50,7 +47,7 @@ export default {
           title: __('Label'),
           type: 'labels',
           token: LabelToken,
-          defaultLabels: [DEFAULT_LABEL_NONE, DEFAULT_LABEL_ANY],
+          defaultLabels: DEFAULT_NONE_ANY,
           initialLabels: this.labelsData,
           unique: false,
           symbol: '~',

ee/app/assets/javascripts/analytics/cycle_analytics/components/filter_bar.vue

@@ -2,8 +2,8 @@
 import { mapActions, mapState } from 'vuex';
 import { __ } from '~/locale';
 import {
-  DEFAULT_LABEL_NONE,
-  DEFAULT_LABEL_ANY,
+  OPERATOR_IS_ONLY,
+  DEFAULT_NONE_ANY,
 } from '~/vue_shared/components/filtered_search_bar/constants';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 import {
@@ -49,7 +49,7 @@ export default {
           initialMilestones: this.milestonesData,
           unique: true,
           symbol: '%',
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchMilestones: this.fetchMilestones,
         },
         {
@@ -57,11 +57,11 @@ export default {
           title: __('Label'),
           type: 'labels',
           token: LabelToken,
-          defaultLabels: [DEFAULT_LABEL_NONE, DEFAULT_LABEL_ANY],
+          defaultLabels: DEFAULT_NONE_ANY,
           initialLabels: this.labelsData,
           unique: false,
           symbol: '~',
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchLabels: this.fetchLabels,
         },
         {
@@ -71,7 +71,7 @@ export default {
           token: AuthorToken,
           initialAuthors: this.authorsData,
           unique: true,
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchAuthors: this.fetchAuthors,
         },
         {
@@ -82,7 +82,7 @@ export default {
           defaultAuthors: [],
           initialAuthors: this.assigneesData,
           unique: false,
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchAuthors: this.fetchAssignees,
         },
       ];

ee/app/assets/javascripts/analytics/merge_request_analytics/components/filter_bar.vue

@@ -2,8 +2,8 @@
 import { mapActions, mapState } from 'vuex';
 import { __ } from '~/locale';
 import {
-  DEFAULT_LABEL_NONE,
-  DEFAULT_LABEL_ANY,
+  OPERATOR_IS_ONLY,
+  DEFAULT_NONE_ANY,
 } from '~/vue_shared/components/filtered_search_bar/constants';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 import {
@@ -47,7 +47,7 @@ export default {
           token: BranchToken,
           initialBranches: this.branchesData,
           unique: true,
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchBranches: this.fetchBranches,
         },
         {
@@ -57,7 +57,7 @@ export default {
           token: BranchToken,
           initialBranches: this.branchesData,
           unique: true,
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchBranches: this.fetchBranches,
         },
         {
@@ -68,7 +68,7 @@ export default {
           initialMilestones: this.milestonesData,
           unique: true,
           symbol: '%',
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchMilestones: this.fetchMilestones,
         },
         {
@@ -76,11 +76,11 @@ export default {
           title: __('Label'),
           type: 'labels',
           token: LabelToken,
-          defaultLabels: [DEFAULT_LABEL_NONE, DEFAULT_LABEL_ANY],
+          defaultLabels: DEFAULT_NONE_ANY,
           initialLabels: this.labelsData,
           unique: false,
           symbol: '~',
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchLabels: this.fetchLabels,
         },
         {
@@ -91,7 +91,7 @@ export default {
           defaultAuthors: [],
           initialAuthors: this.authorsData,
           unique: true,
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchAuthors: this.fetchAuthors,
         },
         {
@@ -102,7 +102,7 @@ export default {
           defaultAuthors: [],
           initialAuthors: this.assigneesData,
           unique: false,
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchAuthors: this.fetchAssignees,
         },
       ];

ee/app/assets/javascripts/audit_events/constants.js

-import { __, s__ } from '~/locale';
-
+import { s__ } from '~/locale';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import GroupToken from './components/tokens/group_token.vue';
 import MemberToken from './components/tokens/member_token.vue';
 import ProjectToken from './components/tokens/project_token.vue';
 import UserToken from './components/tokens/user_token.vue';
 
 const DEFAULT_TOKEN_OPTIONS = {
-  operators: [{ value: '=', description: __('is'), default: 'true' }],
+  operators: OPERATOR_IS_ONLY,
   unique: true,
 };
 

ee/app/assets/javascripts/requirements/components/requirements_root.vue

@@ -8,7 +8,10 @@ import { updateHistory, setUrlParams } from '~/lib/utils/url_utility';
 import { __, sprintf } from '~/locale';
 import Tracking from '~/tracking';
 
-import { DEFAULT_LABEL_ANY } from '~/vue_shared/components/filtered_search_bar/constants';
+import {
+  DEFAULT_LABEL_ANY,
+  OPERATOR_IS_ONLY,
+} from '~/vue_shared/components/filtered_search_bar/constants';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 import AuthorToken from '~/vue_shared/components/filtered_search_bar/tokens/author_token.vue';
 
@@ -286,7 +289,7 @@ export default {
           unique: false,
           symbol: '@',
           token: AuthorToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchPath: this.projectPath,
           fetchAuthors: Api.projectUsers.bind(Api),
         },
@@ -296,7 +299,7 @@ export default {
           title: __('Status'),
           unique: true,
           token: StatusToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
         },
       ];
     },

ee/app/assets/javascripts/roadmap/constants.js

-import { s__, __ } from '~/locale';
+import { s__ } from '~/locale';
 
 /*
   Update the counterparts in roadmap.scss when making changes.
@@ -71,11 +71,6 @@ export const EPIC_LEVEL_MARGIN = {
   4: 'ml-10',
 };
 
-export const FilterTokenOperators = [
-  { value: '=', description: __('is'), default: 'true' },
-  // { value: '!=', description: __('is not') },
-];
-
 export const EPICS_LIMIT_DISMISSED_COOKIE_NAME = 'epics_limit_warning_dismissed';
 
 export const EPICS_LIMIT_DISMISSED_COOKIE_TIMEOUT = 365;

ee/app/assets/javascripts/roadmap/mixins/filtered_search_mixin.js

@@ -5,14 +5,13 @@ import axios from '~/lib/utils/axios_utils';
 import { joinPaths } from '~/lib/utils/url_utility';
 import { __ } from '~/locale';
 
+import { 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 EpicToken from '~/vue_shared/components/filtered_search_bar/tokens/epic_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 { FilterTokenOperators } from '../constants';
-
 export default {
   inject: ['groupFullPath', 'groupMilestonesPath', 'listEpicsPath'],
   computed: {
@@ -52,7 +51,7 @@ export default {
           unique: true,
           symbol: '@',
           token: AuthorToken,
-          operators: FilterTokenOperators,
+          operators: OPERATOR_IS_ONLY,
           fetchAuthors: Api.users.bind(Api),
         },
         {
@@ -62,7 +61,7 @@ export default {
           unique: false,
           symbol: '~',
           token: LabelToken,
-          operators: FilterTokenOperators,
+          operators: OPERATOR_IS_ONLY,
           fetchLabels: (search = '') => {
             const params = {
               only_group_labels: true,
@@ -86,7 +85,7 @@ export default {
           unique: true,
           symbol: '%',
           token: MilestoneToken,
-          operators: FilterTokenOperators,
+          operators: OPERATOR_IS_ONLY,
           fetchMilestones: (search = '') => {
             return axios.get(this.groupMilestonesPath).then(({ data }) => {
               // TODO: Remove below condition check once either of the following is supported.
@@ -107,7 +106,7 @@ export default {
           title: __('Confidential'),
           unique: true,
           token: GlFilteredSearchToken,
-          operators: FilterTokenOperators,
+          operators: OPERATOR_IS_ONLY,
           options: [
             { icon: 'eye-slash', value: true, title: __('Yes') },
             { icon: 'eye', value: false, title: __('No') },
@@ -120,7 +119,7 @@ export default {
           unique: true,
           symbol: '&',
           token: EpicToken,
-          operators: FilterTokenOperators,
+          operators: OPERATOR_IS_ONLY,
           idProperty: 'iid',
           defaultEpics: [],
           fetchEpics: (search = '') => {
@@ -140,7 +139,7 @@ export default {
           title: __('My-Reaction'),
           unique: true,
           token: EmojiToken,
-          operators: FilterTokenOperators,
+          operators: OPERATOR_IS_ONLY,
           fetchEmojis: (search = '') => {
             return axios
               .get(`${gon.relative_url_root || ''}/-/autocomplete/award_emojis`)

ee/app/assets/javascripts/test_case_list/components/test_case_list_root.vue

@@ -9,6 +9,7 @@ import { urlParamsToObject } from '~/lib/utils/common_utils';
 import { updateHistory, setUrlParams } from '~/lib/utils/url_utility';
 
 import { s__, __ } from '~/locale';
+import { 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 LabelToken from '~/vue_shared/components/filtered_search_bar/tokens/label_token.vue';
 
@@ -197,7 +198,7 @@ export default {
           unique: true,
           symbol: '@',
           token: AuthorToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchPath: this.projectFullPath,
           fetchAuthors: Api.projectUsers.bind(Api),
         },
@@ -208,7 +209,7 @@ export default {
           unique: false,
           symbol: '~',
           token: LabelToken,
-          operators: [{ value: '=', description: __('is'), default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchLabels: (search = '') => {
             const params = {
               include_ancestor_groups: true,

ee/spec/frontend/audit_events/components/audit_events_filter_spec.js

@@ -3,6 +3,7 @@ import { shallowMount } from '@vue/test-utils';
 
 import AuditEventsFilter from 'ee/audit_events/components/audit_events_filter.vue';
 import { AVAILABLE_TOKEN_TYPES } from 'ee/audit_events/constants';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 
 describe('AuditEventsFilter', () => {
   let wrapper;
@@ -38,7 +39,7 @@ describe('AuditEventsFilter', () => {
       expect(getAvailableTokenProps(type)).toMatchObject({
         title,
         unique: true,
-        operators: [expect.objectContaining({ value: '=' })],
+        operators: OPERATOR_IS_ONLY,
       });
     });
   });

ee/spec/frontend/requirements/mock_data.js

 import StatusToken from 'ee/requirements/components/tokens/status_token.vue';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import AuthorToken from '~/vue_shared/components/filtered_search_bar/tokens/author_token.vue';
 
 export const mockUserPermissions = {
@@ -161,7 +162,7 @@ export const mockAuthorToken = {
   unique: false,
   symbol: '@',
   token: AuthorToken,
-  operators: [{ value: '=', description: 'is', default: 'true' }],
+  operators: OPERATOR_IS_ONLY,
   fetchPath: 'gitlab-org/gitlab-shell',
   fetchAuthors: expect.any(Function),
 };
@@ -172,10 +173,10 @@ export const mockStatusToken = {
   title: 'Status',
   unique: true,
   token: StatusToken,
-  operators: [{ value: '=', description: 'is', default: 'true' }],
+  operators: OPERATOR_IS_ONLY,
 };
 
-/* 
+/*
   Mock data used for testing with mock apollo client
 */
 

ee/spec/frontend/roadmap/components/roadmap_filters_spec.js

@@ -10,6 +10,7 @@ import { mockSortedBy, mockTimeframeInitialDate } from 'ee_jest/roadmap/mock_dat
 
 import { TEST_HOST } from 'helpers/test_constants';
 import { visitUrl, mergeUrlParams, updateHistory } from '~/lib/utils/url_utility';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 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';
@@ -163,7 +164,7 @@ describe('RoadmapFilters', () => {
       ];
       let filteredSearchBar;
 
-      const operators = [{ value: '=', description: 'is', default: 'true' }];
+      const operators = OPERATOR_IS_ONLY;
 
       const filterTokens = [
         {

spec/frontend/issues_list/mock_data.js

-import { OPERATOR_IS, OPERATOR_IS_NOT } from '~/issues_list/constants';
+import {
+  OPERATOR_IS,
+  OPERATOR_IS_NOT,
+} from '~/vue_shared/components/filtered_search_bar/constants';
 
 export const locationSearch = [
   '?search=find+issues',

spec/frontend/logs/components/log_advanced_filters_spec.js

@@ -4,6 +4,7 @@ import { convertToFixedRange } from '~/lib/utils/datetime_range';
 import LogAdvancedFilters from '~/logs/components/log_advanced_filters.vue';
 import { TOKEN_TYPE_POD_NAME } from '~/logs/constants';
 import { createStore } from '~/logs/stores';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import { defaultTimeRange } from '~/vue_shared/constants';
 import { mockPods, mockSearch } from '../mock_data';
 
@@ -77,7 +78,7 @@ describe('LogAdvancedFilters', () => {
     expect(getSearchToken(TOKEN_TYPE_POD_NAME)).toMatchObject({
       title: 'Pod name',
       unique: true,
-      operators: [expect.objectContaining({ value: '=' })],
+      operators: OPERATOR_IS_ONLY,
     });
   });
 

spec/frontend/members/components/filter_sort/members_filtered_search_bar_spec.js

@@ -3,6 +3,7 @@ import { shallowMount, createLocalVue } from '@vue/test-utils';
 import Vuex from 'vuex';
 import MembersFilteredSearchBar from '~/members/components/filter_sort/members_filtered_search_bar.vue';
 import { MEMBER_TYPES } from '~/members/constants';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 
 const localVue = createLocalVue();
@@ -65,7 +66,7 @@ describe('MembersFilteredSearchBar', () => {
           title: '2FA',
           token: GlFilteredSearchToken,
           unique: true,
-          operators: [{ value: '=', description: 'is' }],
+          operators: OPERATOR_IS_ONLY,
           options: [
             { value: 'enabled', title: 'Enabled' },
             { value: 'disabled', title: 'Disabled' },
@@ -99,7 +100,7 @@ describe('MembersFilteredSearchBar', () => {
             title: 'Membership',
             token: GlFilteredSearchToken,
             unique: true,
-            operators: [{ value: '=', description: 'is' }],
+            operators: OPERATOR_IS_ONLY,
             options: [
               { value: 'exclude', title: 'Direct' },
               { value: 'only', title: 'Inherited' },

spec/frontend/pipelines/components/pipelines_filtered_search_spec.js

@@ -4,6 +4,7 @@ import MockAdapter from 'axios-mock-adapter';
 import Api from '~/api';
 import axios from '~/lib/utils/axios_utils';
 import PipelinesFilteredSearch from '~/pipelines/components/pipelines_list/pipelines_filtered_search.vue';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import { users, mockSearch, branches, tags } from '../mock_data';
 
 describe('Pipelines filtered search', () => {
@@ -57,7 +58,7 @@ describe('Pipelines filtered search', () => {
       title: 'Trigger author',
       unique: true,
       projectId: '21',
-      operators: [expect.objectContaining({ value: '=' })],
+      operators: OPERATOR_IS_ONLY,
     });
 
     expect(findBranchToken()).toMatchObject({
@@ -66,7 +67,7 @@ describe('Pipelines filtered search', () => {
       title: 'Branch name',
       unique: true,
       projectId: '21',
-      operators: [expect.objectContaining({ value: '=' })],
+      operators: OPERATOR_IS_ONLY,
     });
 
     expect(findStatusToken()).toMatchObject({
@@ -74,7 +75,7 @@ describe('Pipelines filtered search', () => {
       icon: 'status',
       title: 'Status',
       unique: true,
-      operators: [expect.objectContaining({ value: '=' })],
+      operators: OPERATOR_IS_ONLY,
     });
 
     expect(findTagToken()).toMatchObject({
@@ -82,7 +83,7 @@ describe('Pipelines filtered search', () => {
       icon: 'tag',
       title: 'Tag name',
       unique: true,
-      operators: [expect.objectContaining({ value: '=' })],
+      operators: OPERATOR_IS_ONLY,
     });
   });
 

spec/frontend/vue_shared/components/filtered_search_bar/mock_data.js

 import { GlFilteredSearchToken } from '@gitlab/ui';
 import { mockLabels } from 'jest/vue_shared/components/sidebar/labels_select_vue/mock_data';
 import Api from '~/api';
+import { 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 BranchToken from '~/vue_shared/components/filtered_search_bar/tokens/branch_token.vue';
 import EmojiToken from '~/vue_shared/components/filtered_search_bar/tokens/emoji_token.vue';
@@ -84,7 +85,7 @@ export const mockBranchToken = {
   title: 'Source Branch',
   unique: true,
   token: BranchToken,
-  operators: [{ value: '=', description: 'is', default: 'true' }],
+  operators: OPERATOR_IS_ONLY,
   fetchBranches: Api.branches.bind(Api),
 };
 
@@ -95,7 +96,7 @@ export const mockAuthorToken = {
   unique: false,
   symbol: '@',
   token: AuthorToken,
-  operators: [{ value: '=', description: 'is', default: 'true' }],
+  operators: OPERATOR_IS_ONLY,
   fetchPath: 'gitlab-org/gitlab-test',
   fetchAuthors: Api.projectUsers.bind(Api),
 };
@@ -116,7 +117,7 @@ export const mockLabelToken = {
   unique: false,
   symbol: '~',
   token: LabelToken,
-  operators: [{ value: '=', description: 'is', default: 'true' }],
+  operators: OPERATOR_IS_ONLY,
   fetchLabels: () => Promise.resolve(mockLabels),
 };
 
@@ -127,7 +128,7 @@ export const mockMilestoneToken = {
   unique: true,
   symbol: '%',
   token: MilestoneToken,
-  operators: [{ value: '=', description: 'is', default: 'true' }],
+  operators: OPERATOR_IS_ONLY,
   fetchMilestones: () => Promise.resolve({ data: mockMilestones }),
 };
 
@@ -138,7 +139,7 @@ export const mockEpicToken = {
   unique: true,
   symbol: '&',
   token: EpicToken,
-  operators: [{ value: '=', description: 'is', default: 'true' }],
+  operators: OPERATOR_IS_ONLY,
   idProperty: 'iid',
   fetchEpics: () => Promise.resolve({ data: mockEpics }),
 };
@@ -149,7 +150,7 @@ export const mockReactionEmojiToken = {
   title: 'My-Reaction',
   unique: true,
   token: EmojiToken,
-  operators: [{ value: '=', description: 'is', default: 'true' }],
+  operators: OPERATOR_IS_ONLY,
   fetchEmojis: () => Promise.resolve(mockEmojis),
 };
 
@@ -159,7 +160,7 @@ export const mockMembershipToken = {
   title: 'Membership',
   token: GlFilteredSearchToken,
   unique: true,
-  operators: [{ value: '=', description: 'is' }],
+  operators: OPERATOR_IS_ONLY,
   options: [
     { value: 'exclude', title: 'Direct' },
     { value: 'only', title: 'Inherited' },

spec/frontend/vue_shared/components/filtered_search_bar/tokens/author_token_spec.js

@@ -11,8 +11,8 @@ import { deprecatedCreateFlash as createFlash } from '~/flash';
 import axios from '~/lib/utils/axios_utils';
 
 import {
-  DEFAULT_LABEL_NONE,
   DEFAULT_LABEL_ANY,
+  DEFAULT_NONE_ANY,
 } from '~/vue_shared/components/filtered_search_bar/constants';
 import AuthorToken from '~/vue_shared/components/filtered_search_bar/tokens/author_token.vue';
 
@@ -159,7 +159,7 @@ describe('AuthorToken', () => {
     });
 
     it('renders provided defaultAuthors as suggestions', async () => {
-      const defaultAuthors = [DEFAULT_LABEL_NONE, DEFAULT_LABEL_ANY];
+      const defaultAuthors = DEFAULT_NONE_ANY;
       wrapper = createComponent({
         active: true,
         config: { ...mockAuthorToken, defaultAuthors },

spec/frontend/vue_shared/components/filtered_search_bar/tokens/branch_token_spec.js

@@ -10,10 +10,7 @@ import waitForPromises from 'helpers/wait_for_promises';
 
 import createFlash from '~/flash';
 import axios from '~/lib/utils/axios_utils';
-import {
-  DEFAULT_LABEL_NONE,
-  DEFAULT_LABEL_ANY,
-} from '~/vue_shared/components/filtered_search_bar/constants';
+import { DEFAULT_NONE_ANY } from '~/vue_shared/components/filtered_search_bar/constants';
 import BranchToken from '~/vue_shared/components/filtered_search_bar/tokens/branch_token.vue';
 
 import { mockBranches, mockBranchToken } from '../mock_data';
@@ -137,7 +134,7 @@ describe('BranchToken', () => {
   });
 
   describe('template', () => {
-    const defaultBranches = [DEFAULT_LABEL_NONE, DEFAULT_LABEL_ANY];
+    const defaultBranches = DEFAULT_NONE_ANY;
     async function showSuggestions() {
       const tokenSegments = wrapper.findAll(GlFilteredSearchTokenSegment);
       const suggestionsSegment = tokenSegments.at(2);

spec/frontend/vue_shared/components/filtered_search_bar/tokens/emoji_token_spec.js

@@ -13,6 +13,7 @@ import axios from '~/lib/utils/axios_utils';
 import {
   DEFAULT_LABEL_NONE,
   DEFAULT_LABEL_ANY,
+  DEFAULT_NONE_ANY,
 } from '~/vue_shared/components/filtered_search_bar/constants';
 import EmojiToken from '~/vue_shared/components/filtered_search_bar/tokens/emoji_token.vue';
 
@@ -137,7 +138,7 @@ describe('EmojiToken', () => {
   });
 
   describe('template', () => {
-    const defaultEmojis = [DEFAULT_LABEL_NONE, DEFAULT_LABEL_ANY];
+    const defaultEmojis = DEFAULT_NONE_ANY;
 
     beforeEach(async () => {
       wrapper = createComponent({

spec/frontend/vue_shared/components/filtered_search_bar/tokens/label_token_spec.js

@@ -16,8 +16,7 @@ import axios from '~/lib/utils/axios_utils';
 
 import {
   DEFAULT_LABELS,
-  DEFAULT_LABEL_NONE,
-  DEFAULT_LABEL_ANY,
+  DEFAULT_NONE_ANY,
 } from '~/vue_shared/components/filtered_search_bar/constants';
 import LabelToken from '~/vue_shared/components/filtered_search_bar/tokens/label_token.vue';
 
@@ -176,7 +175,7 @@ describe('LabelToken', () => {
   });
 
   describe('template', () => {
-    const defaultLabels = [DEFAULT_LABEL_NONE, DEFAULT_LABEL_ANY];
+    const defaultLabels = DEFAULT_NONE_ANY;
 
     beforeEach(async () => {
       wrapper = createComponent({ value: { data: `"${mockRegularLabel.title}"` } });

spec/frontend/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs_spec.js

 import { GlAlert, GlBadge, GlPagination, GlTabs, GlTab } from '@gitlab/ui';
 import { mount } from '@vue/test-utils';
 import Tracking from '~/tracking';
+import { OPERATOR_IS_ONLY } from '~/vue_shared/components/filtered_search_bar/constants';
 import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
 import AuthorToken from '~/vue_shared/components/filtered_search_bar/tokens/author_token.vue';
 import PageWrapper from '~/vue_shared/components/paginated_table_with_search_and_tabs/paginated_table_with_search_and_tabs.vue';
@@ -291,7 +292,7 @@ describe('AlertManagementEmptyState', () => {
           unique: true,
           symbol: '@',
           token: AuthorToken,
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchPath: '/link',
           fetchAuthors: expect.any(Function),
         },
@@ -302,7 +303,7 @@ describe('AlertManagementEmptyState', () => {
           unique: true,
           symbol: '@',
           token: AuthorToken,
-          operators: [{ value: '=', description: 'is', default: 'true' }],
+          operators: OPERATOR_IS_ONLY,
           fetchPath: '/link',
           fetchAuthors: expect.any(Function),
         },