summaryrefslogtreecommitdiff
path: root/app/assets/javascripts/cycle_analytics/components/filter_bar.vue
diff options
context:
space:
mode:
Diffstat (limited to 'app/assets/javascripts/cycle_analytics/components/filter_bar.vue')
-rw-r--r--app/assets/javascripts/cycle_analytics/components/filter_bar.vue144
1 files changed, 0 insertions, 144 deletions
diff --git a/app/assets/javascripts/cycle_analytics/components/filter_bar.vue b/app/assets/javascripts/cycle_analytics/components/filter_bar.vue
deleted file mode 100644
index 0ad325a8523..00000000000
--- a/app/assets/javascripts/cycle_analytics/components/filter_bar.vue
+++ /dev/null
@@ -1,144 +0,0 @@
-<script>
-import { mapActions, mapState } from 'vuex';
-import {
- OPERATOR_IS_ONLY,
- DEFAULT_NONE_ANY,
- TOKEN_TITLE_ASSIGNEE,
- TOKEN_TITLE_AUTHOR,
- TOKEN_TITLE_LABEL,
- TOKEN_TITLE_MILESTONE,
-} from '~/vue_shared/components/filtered_search_bar/constants';
-import FilteredSearchBar from '~/vue_shared/components/filtered_search_bar/filtered_search_bar_root.vue';
-import {
- prepareTokens,
- processFilters,
- filterToQueryObject,
-} from '~/vue_shared/components/filtered_search_bar/filtered_search_utils';
-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';
-import MilestoneToken from '~/vue_shared/components/filtered_search_bar/tokens/milestone_token.vue';
-import UrlSync from '~/vue_shared/components/url_sync.vue';
-
-export default {
- name: 'FilterBar',
- components: {
- FilteredSearchBar,
- UrlSync,
- },
- props: {
- groupPath: {
- type: String,
- required: true,
- },
- },
- computed: {
- ...mapState('filters', {
- selectedMilestone: (state) => state.milestones.selected,
- selectedAuthor: (state) => state.authors.selected,
- selectedLabelList: (state) => state.labels.selectedList,
- selectedAssigneeList: (state) => state.assignees.selectedList,
- milestonesData: (state) => state.milestones.data,
- labelsData: (state) => state.labels.data,
- authorsData: (state) => state.authors.data,
- assigneesData: (state) => state.assignees.data,
- }),
- tokens() {
- return [
- {
- icon: 'clock',
- title: TOKEN_TITLE_MILESTONE,
- type: 'milestone',
- token: MilestoneToken,
- initialMilestones: this.milestonesData,
- unique: true,
- symbol: '%',
- operators: OPERATOR_IS_ONLY,
- fetchMilestones: this.fetchMilestones,
- },
- {
- icon: 'labels',
- title: TOKEN_TITLE_LABEL,
- type: 'labels',
- token: LabelToken,
- defaultLabels: DEFAULT_NONE_ANY,
- initialLabels: this.labelsData,
- unique: false,
- symbol: '~',
- operators: OPERATOR_IS_ONLY,
- fetchLabels: this.fetchLabels,
- },
- {
- icon: 'pencil',
- title: TOKEN_TITLE_AUTHOR,
- type: 'author',
- token: AuthorToken,
- initialAuthors: this.authorsData,
- unique: true,
- operators: OPERATOR_IS_ONLY,
- fetchAuthors: this.fetchAuthors,
- },
- {
- icon: 'user',
- title: TOKEN_TITLE_ASSIGNEE,
- type: 'assignees',
- token: AuthorToken,
- initialAuthors: this.assigneesData,
- unique: false,
- operators: OPERATOR_IS_ONLY,
- fetchAuthors: this.fetchAssignees,
- },
- ];
- },
- query() {
- return filterToQueryObject({
- milestone_title: this.selectedMilestone,
- author_username: this.selectedAuthor,
- label_name: this.selectedLabelList,
- assignee_username: this.selectedAssigneeList,
- });
- },
- },
- methods: {
- ...mapActions('filters', [
- 'setFilters',
- 'fetchMilestones',
- 'fetchLabels',
- 'fetchAuthors',
- 'fetchAssignees',
- ]),
- initialFilterValue() {
- return prepareTokens({
- milestone: this.selectedMilestone,
- author: this.selectedAuthor,
- assignees: this.selectedAssigneeList,
- labels: this.selectedLabelList,
- });
- },
- handleFilter(filters) {
- const { labels, milestone, author, assignees } = processFilters(filters);
-
- this.setFilters({
- selectedAuthor: author ? author[0] : null,
- selectedMilestone: milestone ? milestone[0] : null,
- selectedAssigneeList: assignees || [],
- selectedLabelList: labels || [],
- });
- },
- },
-};
-</script>
-
-<template>
- <div>
- <filtered-search-bar
- class="gl-flex-grow-1"
- :namespace="groupPath"
- recent-searches-storage-key="value-stream-analytics"
- :search-input-placeholder="__('Filter results')"
- :tokens="tokens"
- :initial-filter-value="initialFilterValue()"
- @onFilter="handleFilter"
- />
- <url-sync :query="query" />
- </div>
-</template>