diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-03-02 21:12:20 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-03-02 21:12:20 +0300 |
commit | 3c4d101de003ea292be5ac5baf5d73c6c2747367 (patch) | |
tree | 5918d12b69c4bfd84f05a585d62174586a80fd18 /app/assets/javascripts/search | |
parent | b2c21b99c7eb52b5fd906b1e7b4b08d4eb7a296c (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/search')
5 files changed, 25 insertions, 26 deletions
diff --git a/app/assets/javascripts/search/sidebar/components/app.vue b/app/assets/javascripts/search/sidebar/components/app.vue index 7c9e30a2d97..928cd46c9eb 100644 --- a/app/assets/javascripts/search/sidebar/components/app.vue +++ b/app/assets/javascripts/search/sidebar/components/app.vue @@ -1,5 +1,5 @@ <script> -import { mapState } from 'vuex'; +import { mapState, mapGetters } from 'vuex'; import ScopeNavigation from '~/search/sidebar/components/scope_navigation.vue'; import glFeatureFlagsMixin from '~/vue_shared/mixins/gl_feature_flags_mixin'; import { SCOPE_ISSUES, SCOPE_MERGE_REQUESTS, SCOPE_BLOB } from '../constants'; @@ -16,11 +16,12 @@ export default { mixins: [glFeatureFlagsMixin()], computed: { ...mapState(['urlQuery']), + ...mapGetters(['currentScope']), showIssueAndMergeFilters() { - return this.urlQuery.scope === SCOPE_ISSUES || this.urlQuery.scope === SCOPE_MERGE_REQUESTS; + return this.currentScope === SCOPE_ISSUES || this.currentScope === SCOPE_MERGE_REQUESTS; }, showBlobFilter() { - return this.urlQuery.scope === SCOPE_BLOB && this.glFeatures.searchBlobsLanguageAggregation; + return this.currentScope === SCOPE_BLOB && this.glFeatures.searchBlobsLanguageAggregation; }, }, }; diff --git a/app/assets/javascripts/search/sidebar/components/checkbox_filter.vue b/app/assets/javascripts/search/sidebar/components/checkbox_filter.vue index 36cbe9ce693..3784f08adcc 100644 --- a/app/assets/javascripts/search/sidebar/components/checkbox_filter.vue +++ b/app/assets/javascripts/search/sidebar/components/checkbox_filter.vue @@ -19,7 +19,7 @@ export default { }, computed: { ...mapState(['query']), - ...mapGetters(['queryLangugageFilters']), + ...mapGetters(['queryLanguageFilters']), scope() { return this.query.scope; }, @@ -31,7 +31,7 @@ export default { }, selectedFilter: { get() { - return intersection(this.flatDataFilterValues, this.queryLangugageFilters); + return intersection(this.flatDataFilterValues, this.queryLanguageFilters); }, set(value) { this.setQuery({ key: this.filtersData?.filterParam, value }); diff --git a/app/assets/javascripts/search/sidebar/components/language_filter.vue b/app/assets/javascripts/search/sidebar/components/language_filter.vue index e5306cd7b79..b2f8d3e1f5f 100644 --- a/app/assets/javascripts/search/sidebar/components/language_filter.vue +++ b/app/assets/javascripts/search/sidebar/components/language_filter.vue @@ -32,19 +32,19 @@ export default { computed: { ...mapState(['aggregations', 'sidebarDirty']), ...mapGetters([ - 'langugageAggregationBuckets', + 'languageAggregationBuckets', 'currentUrlQueryHasLanguageFilters', - 'queryLangugageFilters', + 'queryLanguageFilters', ]), hasBuckets() { - return this.langugageAggregationBuckets.length > 0; + return this.languageAggregationBuckets.length > 0; }, filtersData() { return convertFiltersData(this.shortenedLanguageFilters); }, shortenedLanguageFilters() { if (!this.hasShowMore) { - return this.langugageAggregationBuckets; + return this.languageAggregationBuckets; } if (this.showAll) { return this.trimBuckets(MAX_ITEM_LENGTH); @@ -52,16 +52,16 @@ export default { return this.trimBuckets(DEFAULT_ITEM_LENGTH); }, hasShowMore() { - return this.langugageAggregationBuckets.length > DEFAULT_ITEM_LENGTH; + return this.languageAggregationBuckets.length > DEFAULT_ITEM_LENGTH; }, hasOverMax() { - return this.langugageAggregationBuckets.length > MAX_ITEM_LENGTH; + return this.languageAggregationBuckets.length > MAX_ITEM_LENGTH; }, dividerClasses() { return [...HR_DEFAULT_CLASSES, ...ONLY_SHOW_MD]; }, hasQueryFilters() { - return this.queryLangugageFilters.length > 0; + return this.queryLanguageFilters.length > 0; }, }, async created() { @@ -78,7 +78,7 @@ export default { this.showAll = true; }, trimBuckets(length) { - return this.langugageAggregationBuckets.slice(0, length); + return this.languageAggregationBuckets.slice(0, length); }, cleanResetFilters() { if (this.currentUrlQueryHasLanguageFilters) { diff --git a/app/assets/javascripts/search/sidebar/components/scope_navigation.vue b/app/assets/javascripts/search/sidebar/components/scope_navigation.vue index 5863381e2ef..02a3870f499 100644 --- a/app/assets/javascripts/search/sidebar/components/scope_navigation.vue +++ b/app/assets/javascripts/search/sidebar/components/scope_navigation.vue @@ -44,9 +44,6 @@ export default { isHighlighted ? 'gl-text-gray-900' : 'gl-text-gray-500', ]; }, - isActive(scope, index) { - return this.urlQuery.scope ? this.urlQuery.scope === scope : index === 0; - }, qaSelectorValue(item) { return `${slugifyWithUnderscore(item.label)}_tab`; }, @@ -60,16 +57,17 @@ export default { <nav data-testid="search-filter"> <gl-nav vertical pills> <gl-nav-item - v-for="(item, scope, index) in navigation" + v-for="(item, scope) in navigation" :key="scope" - :link-classes="linkClasses(isActive(scope, index))" + :link-classes="linkClasses(item.active)" class="gl-mb-1" :href="item.link" - :active="isActive(scope, index)" + :active="item.active" :data-qa-selector="qaSelectorValue(item)" + :data-testid="qaSelectorValue(item)" @click="handleClick(scope)" - ><span>{{ item.label }}</span - ><span v-if="item.count" :class="countClasses(isActive(scope, index))"> + ><span data-testid="label">{{ item.label }}</span + ><span v-if="item.count" data-testid="count" :class="countClasses(item.active)"> {{ showFormatedCount(item.count) }}<gl-icon v-if="isCountOverLimit(item.count)" diff --git a/app/assets/javascripts/search/store/getters.js b/app/assets/javascripts/search/store/getters.js index 853c83b07ee..36d98233e28 100644 --- a/app/assets/javascripts/search/store/getters.js +++ b/app/assets/javascripts/search/store/getters.js @@ -1,4 +1,4 @@ -import { has } from 'lodash'; +import { findKey, has } from 'lodash'; import { languageFilterData } from '~/search/sidebar/constants/language_filter_data'; import { GROUPS_LOCAL_STORAGE_KEY, PROJECTS_LOCAL_STORAGE_KEY } from './constants'; @@ -11,7 +11,7 @@ export const frequentProjects = (state) => { return state.frequentItems[PROJECTS_LOCAL_STORAGE_KEY]; }; -export const langugageAggregationBuckets = (state) => { +export const languageAggregationBuckets = (state) => { return ( state.aggregations.data.find( (aggregation) => aggregation.name === languageFilterData.filterParam, @@ -19,9 +19,9 @@ export const langugageAggregationBuckets = (state) => { ); }; -export const queryLangugageFilters = (state) => { - return state.query[languageFilterData.filterParam] || []; -}; +export const currentScope = (state) => findKey(state.navigation, { active: true }); + +export const queryLanguageFilters = (state) => state.query[languageFilterData.filterParam] || []; export const currentUrlQueryHasLanguageFilters = (state) => has(state.urlQuery, languageFilterData.filterParam) && |