diff options
Diffstat (limited to 'app/assets/javascripts/search')
10 files changed, 53 insertions, 28 deletions
diff --git a/app/assets/javascripts/search/index.js b/app/assets/javascripts/search/index.js index ba12f31ef87..d4ee857c9c1 100644 --- a/app/assets/javascripts/search/index.js +++ b/app/assets/javascripts/search/index.js @@ -1,6 +1,7 @@ import setHighlightClass from 'ee_else_ce/search/highlight_blob_search_result'; import { queryToObject } from '~/lib/utils/url_utility'; import refreshCounts from '~/pages/search/show/refresh_counts'; +import syntaxHighlight from '~/syntax_highlight'; import { initSidebar, sidebarInitState } from './sidebar'; import { initSearchSort } from './sort'; import createStore from './store'; @@ -8,10 +9,14 @@ import { initTopbar } from './topbar'; import { initBlobRefSwitcher } from './under_topbar'; export const initSearchApp = () => { - const query = queryToObject(window.location.search); - const navigation = sidebarInitState(); + syntaxHighlight(document.querySelectorAll('.js-search-results')); + const query = queryToObject(window.location.search, { gatherArrays: true }); + const { navigationJsonParsed: navigation } = sidebarInitState() || {}; - const store = createStore({ query, navigation }); + const store = createStore({ + query, + navigation, + }); initTopbar(store); initSidebar(store); 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) => { diff --git a/app/assets/javascripts/search/store/constants.js b/app/assets/javascripts/search/store/constants.js index 678bd82c7a6..e4f67f624ca 100644 --- a/app/assets/javascripts/search/store/constants.js +++ b/app/assets/javascripts/search/store/constants.js @@ -10,3 +10,5 @@ export const GROUPS_LOCAL_STORAGE_KEY = 'global-search-frequent-groups'; export const PROJECTS_LOCAL_STORAGE_KEY = 'global-search-frequent-projects'; export const SIDEBAR_PARAMS = [stateFilterData.filterParam, confidentialFilterData.filterParam]; + +export const NUMBER_FORMATING_OPTIONS = { notation: 'compact', compactDisplay: 'short' }; diff --git a/app/assets/javascripts/search/store/utils.js b/app/assets/javascripts/search/store/utils.js index f8198017bf8..acb99c60426 100644 --- a/app/assets/javascripts/search/store/utils.js +++ b/app/assets/javascripts/search/store/utils.js @@ -1,5 +1,12 @@ import AccessorUtilities from '~/lib/utils/accessor'; -import { MAX_FREQUENT_ITEMS, MAX_FREQUENCY, SIDEBAR_PARAMS } from './constants'; +import { formatNumber } from '~/locale'; +import { joinPaths } from '~/lib/utils/url_utility'; +import { + MAX_FREQUENT_ITEMS, + MAX_FREQUENCY, + SIDEBAR_PARAMS, + NUMBER_FORMATING_OPTIONS, +} from './constants'; function extractKeys(object, keyList) { return Object.fromEntries(keyList.map((key) => [key, object[key]])); @@ -90,3 +97,18 @@ export const isSidebarDirty = (currentQuery, urlQuery) => { return userAddedParam || userChangedExistingParam; }); }; + +export const formatSearchResultCount = (count) => { + if (!count) { + return '0'; + } + + const countNumber = typeof count === 'string' ? parseInt(count.replace(/,/g, ''), 10) : count; + return formatNumber(countNumber, NUMBER_FORMATING_OPTIONS); +}; + +export const getAggregationsUrl = () => { + const currentUrl = new URL(window.location.href); + currentUrl.pathname = joinPaths('/search', 'aggregations'); + return currentUrl.toString(); +}; diff --git a/app/assets/javascripts/search/topbar/constants.js b/app/assets/javascripts/search/topbar/constants.js index 121c15199dd..5b1c5819f2b 100644 --- a/app/assets/javascripts/search/topbar/constants.js +++ b/app/assets/javascripts/search/topbar/constants.js @@ -20,4 +20,4 @@ export const PROJECT_DATA = { fullName: 'name_with_namespace', }; -export const SYNTAX_OPTIONS_DOCUMENT = 'drawers/user/search/advanced_search.md'; +export const SYNTAX_OPTIONS_DOCUMENT = 'drawers/drawers/advanced_search_syntax.md'; |