diff options
Diffstat (limited to 'app/assets/javascripts/releases/components')
6 files changed, 47 insertions, 78 deletions
diff --git a/app/assets/javascripts/releases/components/app_index.vue b/app/assets/javascripts/releases/components/app_index.vue index 262b5614d65..31d335fa15d 100644 --- a/app/assets/javascripts/releases/components/app_index.vue +++ b/app/assets/javascripts/releases/components/app_index.vue @@ -51,12 +51,8 @@ export default { }), fetchReleases() { this.fetchReleasesStoreAction({ - // these two parameters are only used in "GraphQL mode" before: getParameterByName('before'), after: getParameterByName('after'), - - // this parameter is only used when in "REST mode" - page: getParameterByName('page'), }); }, }, @@ -73,17 +69,17 @@ export default { :aria-describedby="shouldRenderEmptyState && 'releases-description'" category="primary" variant="success" - class="js-new-release-btn" + data-testid="new-release-button" > {{ __('New release') }} </gl-button> </div> - <release-skeleton-loader v-if="isLoading" class="js-loading" /> + <release-skeleton-loader v-if="isLoading" /> <gl-empty-state v-else-if="shouldRenderEmptyState" - class="js-empty-state" + data-testid="empty-state" :title="__('Getting started with releases')" :svg-path="illustrationPath" > @@ -101,7 +97,7 @@ export default { </template> </gl-empty-state> - <div v-else-if="shouldRenderSuccessState" class="js-success-state"> + <div v-else-if="shouldRenderSuccessState" data-testid="success-state"> <release-block v-for="(release, index) in releases" :key="index" diff --git a/app/assets/javascripts/releases/components/app_show.vue b/app/assets/javascripts/releases/components/app_show.vue index c38e93d420b..fdb0f99b735 100644 --- a/app/assets/javascripts/releases/components/app_show.vue +++ b/app/assets/javascripts/releases/components/app_show.vue @@ -1,7 +1,7 @@ <script> import createFlash from '~/flash'; import { s__ } from '~/locale'; -import oneReleaseQuery from '../queries/one_release.query.graphql'; +import oneReleaseQuery from '../graphql/queries/one_release.query.graphql'; import { convertGraphQLRelease } from '../util'; import ReleaseBlock from './release_block.vue'; import ReleaseSkeletonLoader from './release_skeleton_loader.vue'; diff --git a/app/assets/javascripts/releases/components/releases_pagination.vue b/app/assets/javascripts/releases/components/releases_pagination.vue index 062c72b445b..fddf85ead1e 100644 --- a/app/assets/javascripts/releases/components/releases_pagination.vue +++ b/app/assets/javascripts/releases/components/releases_pagination.vue @@ -1,20 +1,37 @@ <script> -import { mapGetters } from 'vuex'; -import ReleasesPaginationGraphql from './releases_pagination_graphql.vue'; -import ReleasesPaginationRest from './releases_pagination_rest.vue'; +import { GlKeysetPagination } from '@gitlab/ui'; +import { mapActions, mapState } from 'vuex'; +import { historyPushState, buildUrlWithCurrentLocation } from '~/lib/utils/common_utils'; export default { - name: 'ReleasesPagination', - components: { ReleasesPaginationGraphql, ReleasesPaginationRest }, + name: 'ReleasesPaginationGraphql', + components: { GlKeysetPagination }, computed: { - ...mapGetters(['useGraphQLEndpoint']), + ...mapState('index', ['pageInfo']), + showPagination() { + return this.pageInfo.hasPreviousPage || this.pageInfo.hasNextPage; + }, + }, + methods: { + ...mapActions('index', ['fetchReleases']), + onPrev(before) { + historyPushState(buildUrlWithCurrentLocation(`?before=${before}`)); + this.fetchReleases({ before }); + }, + onNext(after) { + historyPushState(buildUrlWithCurrentLocation(`?after=${after}`)); + this.fetchReleases({ after }); + }, }, }; </script> - <template> <div class="gl-display-flex gl-justify-content-center"> - <releases-pagination-graphql v-if="useGraphQLEndpoint" /> - <releases-pagination-rest v-else /> + <gl-keyset-pagination + v-if="showPagination" + v-bind="pageInfo" + @prev="onPrev($event)" + @next="onNext($event)" + /> </div> </template> diff --git a/app/assets/javascripts/releases/components/releases_pagination_graphql.vue b/app/assets/javascripts/releases/components/releases_pagination_graphql.vue deleted file mode 100644 index 13cbf95b9af..00000000000 --- a/app/assets/javascripts/releases/components/releases_pagination_graphql.vue +++ /dev/null @@ -1,35 +0,0 @@ -<script> -import { GlKeysetPagination } from '@gitlab/ui'; -import { mapActions, mapState } from 'vuex'; -import { historyPushState, buildUrlWithCurrentLocation } from '~/lib/utils/common_utils'; - -export default { - name: 'ReleasesPaginationGraphql', - components: { GlKeysetPagination }, - computed: { - ...mapState('index', ['graphQlPageInfo']), - showPagination() { - return this.graphQlPageInfo.hasPreviousPage || this.graphQlPageInfo.hasNextPage; - }, - }, - methods: { - ...mapActions('index', ['fetchReleases']), - onPrev(before) { - historyPushState(buildUrlWithCurrentLocation(`?before=${before}`)); - this.fetchReleases({ before }); - }, - onNext(after) { - historyPushState(buildUrlWithCurrentLocation(`?after=${after}`)); - this.fetchReleases({ after }); - }, - }, -}; -</script> -<template> - <gl-keyset-pagination - v-if="showPagination" - v-bind="graphQlPageInfo" - @prev="onPrev($event)" - @next="onNext($event)" - /> -</template> diff --git a/app/assets/javascripts/releases/components/releases_pagination_rest.vue b/app/assets/javascripts/releases/components/releases_pagination_rest.vue deleted file mode 100644 index 5e97a5a0450..00000000000 --- a/app/assets/javascripts/releases/components/releases_pagination_rest.vue +++ /dev/null @@ -1,24 +0,0 @@ -<script> -import { mapActions, mapState } from 'vuex'; -import { historyPushState, buildUrlWithCurrentLocation } from '~/lib/utils/common_utils'; -import TablePagination from '~/vue_shared/components/pagination/table_pagination.vue'; - -export default { - name: 'ReleasesPaginationRest', - components: { TablePagination }, - computed: { - ...mapState('index', ['restPageInfo']), - }, - methods: { - ...mapActions('index', ['fetchReleases']), - onChangePage(page) { - historyPushState(buildUrlWithCurrentLocation(`?page=${page}`)); - this.fetchReleases({ page }); - }, - }, -}; -</script> - -<template> - <table-pagination :change="onChangePage" :page-info="restPageInfo" /> -</template> diff --git a/app/assets/javascripts/releases/components/tag_field_new.vue b/app/assets/javascripts/releases/components/tag_field_new.vue index 9df646ca798..80f59485426 100644 --- a/app/assets/javascripts/releases/components/tag_field_new.vue +++ b/app/assets/javascripts/releases/components/tag_field_new.vue @@ -74,6 +74,21 @@ export default { // we need to show the "create from" input. this.showCreateFrom = true; }, + shouldShowCreateTagOption(isLoading, matches, query) { + // Show the "create tag" option if: + return ( + // we're not currently loading any results, and + !isLoading && + // the search query isn't just whitespace, and + query.trim() && + // the `matches` object is non-null, and + matches && + // the tag name doesn't already exist + !matches.tags.list.some( + (tagInfo) => tagInfo.name.toUpperCase() === query.toUpperCase().trim(), + ) + ); + }, }, translations: { tagName: { @@ -111,7 +126,7 @@ export default { > <template #footer="{ isLoading, matches, query }"> <gl-dropdown-item - v-if="!isLoading && matches && matches.tags.totalCount === 0" + v-if="shouldShowCreateTagOption(isLoading, matches, query)" is-check-item :is-checked="tagName === query" @click="createTagClicked(query)" |