diff options
Diffstat (limited to 'app/assets/javascripts/jobs/components/table/jobs_table_app.vue')
-rw-r--r-- | app/assets/javascripts/jobs/components/table/jobs_table_app.vue | 24 |
1 files changed, 18 insertions, 6 deletions
diff --git a/app/assets/javascripts/jobs/components/table/jobs_table_app.vue b/app/assets/javascripts/jobs/components/table/jobs_table_app.vue index c2f460cb647..0a4757d11a8 100644 --- a/app/assets/javascripts/jobs/components/table/jobs_table_app.vue +++ b/app/assets/javascripts/jobs/components/table/jobs_table_app.vue @@ -2,7 +2,9 @@ import { GlAlert, GlSkeletonLoader, GlIntersectionObserver, GlLoadingIcon } from '@gitlab/ui'; import { __ } from '~/locale'; import createFlash from '~/flash'; +import { setUrlParams, updateHistory, queryToObject } from '~/lib/utils/url_utility'; import JobsFilteredSearch from '../filtered_search/jobs_filtered_search.vue'; +import { validateQueryString } from '../filtered_search/utils'; import GetJobs from './graphql/queries/get_jobs.query.graphql'; import JobsTable from './jobs_table.vue'; import JobsTableEmptyState from './jobs_table_empty_state.vue'; @@ -37,6 +39,7 @@ export default { variables() { return { fullPath: this.fullPath, + ...this.validatedQueryString, }; }, update(data) { @@ -95,6 +98,11 @@ export default { jobsCount() { return this.jobs.count; }, + validatedQueryString() { + const queryStringObject = queryToObject(window.location.search); + + return validateQueryString(queryStringObject); + }, }, watch: { // this watcher ensures that the count on the all tab @@ -133,6 +141,10 @@ export default { } if (filter.type === 'status') { + updateHistory({ + url: setUrlParams({ statuses: filter.value.data }, window.location.href, true), + }); + this.$apollo.queries.jobs.refetch({ statuses: filter.value.data }); } }); @@ -171,12 +183,12 @@ export default { :loading="loading" @fetchJobsByStatus="fetchJobsByStatus" /> - - <jobs-filtered-search - v-if="showFilteredSearch" - :class="$options.filterSearchBoxStyles" - @filterJobsBySearch="filterJobsBySearch" - /> + <div v-if="showFilteredSearch" :class="$options.filterSearchBoxStyles"> + <jobs-filtered-search + :query-string="validatedQueryString" + @filterJobsBySearch="filterJobsBySearch" + /> + </div> <div v-if="showSkeletonLoader" class="gl-mt-5"> <gl-skeleton-loader :width="1248" :height="73"> |