diff options
Diffstat (limited to 'app/assets/javascripts/search/sidebar')
6 files changed, 19 insertions, 23 deletions
diff --git a/app/assets/javascripts/search/sidebar/components/confidentiality_filter.vue b/app/assets/javascripts/search/sidebar/components/confidentiality_filter.vue index 4ddf695f61a..fbfc24a94ae 100644 --- a/app/assets/javascripts/search/sidebar/components/confidentiality_filter.vue +++ b/app/assets/javascripts/search/sidebar/components/confidentiality_filter.vue @@ -21,6 +21,6 @@ export default { <template> <div> <radio-filter :class="ffBasedXPadding" :filter-data="$options.confidentialFilterData" /> - <hr class="gl-my-5 gl-border-gray-100" /> + <hr class="gl-my-5 gl-mx-5 gl-border-gray-100" /> </div> </template> diff --git a/app/assets/javascripts/search/sidebar/components/results_filters.vue b/app/assets/javascripts/search/sidebar/components/results_filters.vue index 9b993ab9a86..ff7a044736d 100644 --- a/app/assets/javascripts/search/sidebar/components/results_filters.vue +++ b/app/assets/javascripts/search/sidebar/components/results_filters.vue @@ -44,7 +44,7 @@ export default { <form class="gl-pt-5 gl-md-pt-0" @submit.prevent="applyQuery"> <hr v-if="searchPageVerticalNavFeatureFlag" - class="gl-my-5 gl-border-gray-100 gl-display-none gl-md-display-block" + class="gl-my-5 gl-mx-5 gl-border-gray-100 gl-display-none gl-md-display-block" /> <status-filter v-if="showStatusFilter" /> <confidentiality-filter v-if="showConfidentialityFilter" /> diff --git a/app/assets/javascripts/search/sidebar/components/scope_navigation.vue b/app/assets/javascripts/search/sidebar/components/scope_navigation.vue index 7a03306e2f9..3c280a5d696 100644 --- a/app/assets/javascripts/search/sidebar/components/scope_navigation.vue +++ b/app/assets/javascripts/search/sidebar/components/scope_navigation.vue @@ -1,13 +1,10 @@ <script> import { GlNav, GlNavItem, GlIcon } from '@gitlab/ui'; import { mapActions, mapState } from 'vuex'; -import { formatNumber, s__ } from '~/locale'; +import { s__ } from '~/locale'; import Tracking from '~/tracking'; -import { - NAV_LINK_DEFAULT_CLASSES, - NUMBER_FORMATING_OPTIONS, - NAV_LINK_COUNT_DEFAULT_CLASSES, -} from '../constants'; +import { NAV_LINK_DEFAULT_CLASSES, NAV_LINK_COUNT_DEFAULT_CLASSES } from '../constants'; +import { formatSearchResultCount } from '../../store/utils'; export default { name: 'ScopeNavigation', @@ -29,11 +26,7 @@ export default { methods: { ...mapActions(['fetchSidebarCount']), showFormatedCount(count) { - if (!count) { - return '0'; - } - const countNumber = parseInt(count.replace(/,/g, ''), 10); - return formatNumber(countNumber, NUMBER_FORMATING_OPTIONS); + return formatSearchResultCount(count); }, isCountOverLimit(count) { return count.includes('+'); @@ -82,6 +75,6 @@ export default { </span> </gl-nav-item> </gl-nav> - <hr class="gl-mt-5 gl-mb-0 gl-border-gray-100 gl-md-display-none" /> + <hr class="gl-mt-5 gl-mx-5 gl-mb-0 gl-border-gray-100 gl-md-display-none" /> </nav> </template> diff --git a/app/assets/javascripts/search/sidebar/components/status_filter.vue b/app/assets/javascripts/search/sidebar/components/status_filter.vue index eaf7d95822a..4da96a41ef7 100644 --- a/app/assets/javascripts/search/sidebar/components/status_filter.vue +++ b/app/assets/javascripts/search/sidebar/components/status_filter.vue @@ -21,6 +21,6 @@ export default { <template> <div> <radio-filter :class="ffBasedXPadding" :filter-data="$options.stateFilterData" /> - <hr class="gl-my-5 gl-border-gray-100" /> + <hr class="gl-my-5 gl-mx-5 gl-border-gray-100" /> </div> </template> diff --git a/app/assets/javascripts/search/sidebar/constants/index.js b/app/assets/javascripts/search/sidebar/constants/index.js index a9c031f91a4..19b1ad0905b 100644 --- a/app/assets/javascripts/search/sidebar/constants/index.js +++ b/app/assets/javascripts/search/sidebar/constants/index.js @@ -1,13 +1,16 @@ export const SCOPE_ISSUES = 'issues'; export const SCOPE_MERGE_REQUESTS = 'merge_requests'; - -export const NUMBER_FORMATING_OPTIONS = { notation: 'compact', compactDisplay: 'short' }; -export const NAV_LINK_DEFAULT_CLASSES = [ +export const SCOPE_BLOB = 'blobs'; +export const LABEL_DEFAULT_CLASSES = [ 'gl-display-flex', 'gl-flex-direction-row', 'gl-flex-wrap-nowrap', - 'gl-justify-content-space-between', 'gl-text-gray-900', ]; - +export const NAV_LINK_DEFAULT_CLASSES = [ + ...LABEL_DEFAULT_CLASSES, + 'gl-justify-content-space-between', +]; export const NAV_LINK_COUNT_DEFAULT_CLASSES = ['gl-font-sm', 'gl-font-weight-normal']; +export const HR_DEFAULT_CLASSES = ['gl-my-5', 'gl-mx-5', 'gl-border-gray-100']; +export const ONLY_SHOW_MD = ['gl-display-none', 'gl-md-display-block']; diff --git a/app/assets/javascripts/search/sidebar/index.js b/app/assets/javascripts/search/sidebar/index.js index c6b1257c4ef..415f6f7454c 100644 --- a/app/assets/javascripts/search/sidebar/index.js +++ b/app/assets/javascripts/search/sidebar/index.js @@ -6,11 +6,11 @@ Vue.use(Translate); export const sidebarInitState = () => { const el = document.getElementById('js-search-sidebar'); - if (!el) return {}; - const { navigation } = el.dataset; - return JSON.parse(navigation); + const { navigationJson } = el.dataset; + const navigationJsonParsed = JSON.parse(navigationJson); + return { navigationJsonParsed }; }; export const initSidebar = (store) => { |