diff options
Diffstat (limited to 'app/assets/javascripts/packages/list/components/package_search.vue')
-rw-r--r-- | app/assets/javascripts/packages/list/components/package_search.vue | 30 |
1 files changed, 18 insertions, 12 deletions
diff --git a/app/assets/javascripts/packages/list/components/package_search.vue b/app/assets/javascripts/packages/list/components/package_search.vue index cd61d323d83..2e183b1b978 100644 --- a/app/assets/javascripts/packages/list/components/package_search.vue +++ b/app/assets/javascripts/packages/list/components/package_search.vue @@ -2,7 +2,8 @@ import { mapState, mapActions } from 'vuex'; import { __, s__ } from '~/locale'; import RegistrySearch from '~/vue_shared/components/registry/registry_search.vue'; -import getTableHeaders from '../utils'; +import UrlSync from '~/vue_shared/components/url_sync.vue'; +import { sortableFields } from '../utils'; import PackageTypeToken from './tokens/package_type_token.vue'; export default { @@ -16,7 +17,7 @@ export default { operators: [{ value: '=', description: __('is'), default: 'true' }], }, ], - components: { RegistrySearch }, + components: { RegistrySearch, UrlSync }, computed: { ...mapState({ isGroupPage: (state) => state.config.isGroupPage, @@ -24,7 +25,7 @@ export default { filter: (state) => state.filter, }), sortableFields() { - return getTableHeaders(this.isGroupPage); + return sortableFields(this.isGroupPage); }, }, methods: { @@ -38,13 +39,18 @@ export default { </script> <template> - <registry-search - :filter="filter" - :sorting="sorting" - :tokens="$options.tokens" - :sortable-fields="sortableFields" - @sorting:changed="updateSorting" - @filter:changed="setFilter" - @filter:submit="$emit('update')" - /> + <url-sync> + <template #default="{ updateQuery }"> + <registry-search + :filter="filter" + :sorting="sorting" + :tokens="$options.tokens" + :sortable-fields="sortableFields" + @sorting:changed="updateSorting" + @filter:changed="setFilter" + @filter:submit="$emit('update')" + @query:changed="updateQuery" + /> + </template> + </url-sync> </template> |