diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-03-13 12:09:22 +0000 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-03-13 12:09:22 +0000 |
commit | 286fe61013674fe2d245ffc8d2233baf09923e70 (patch) | |
tree | 2037291f5863105e54e75be056b49f7d62007cae /app/assets/javascripts/releases | |
parent | 4cb5e5011abfe8d50ac3a7ebd0018c563c6d7af4 (diff) | |
download | gitlab-ce-286fe61013674fe2d245ffc8d2233baf09923e70.tar.gz |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/releases')
-rw-r--r-- | app/assets/javascripts/releases/components/app_index.vue | 49 | ||||
-rw-r--r-- | app/assets/javascripts/releases/mount_index.js | 6 |
2 files changed, 39 insertions, 16 deletions
diff --git a/app/assets/javascripts/releases/components/app_index.vue b/app/assets/javascripts/releases/components/app_index.vue index b9e80899e25..511b3cda9c8 100644 --- a/app/assets/javascripts/releases/components/app_index.vue +++ b/app/assets/javascripts/releases/components/app_index.vue @@ -1,11 +1,12 @@ <script> import { mapState, mapActions } from 'vuex'; -import { GlSkeletonLoading, GlEmptyState } from '@gitlab/ui'; +import { GlSkeletonLoading, GlEmptyState, GlLink } from '@gitlab/ui'; import { getParameterByName, historyPushState, buildUrlWithCurrentLocation, } from '~/lib/utils/common_utils'; +import { __ } from '~/locale'; import TablePagination from '~/vue_shared/components/pagination/table_pagination.vue'; import ReleaseBlock from './release_block.vue'; @@ -16,13 +17,14 @@ export default { GlEmptyState, ReleaseBlock, TablePagination, + GlLink, }, props: { projectId: { type: String, required: true, }, - documentationLink: { + documentationPath: { type: String, required: true, }, @@ -30,6 +32,11 @@ export default { type: String, required: true, }, + newReleasePath: { + type: String, + required: false, + default: '', + }, }, computed: { ...mapState('list', ['isLoading', 'releases', 'hasError', 'pageInfo']), @@ -39,6 +46,11 @@ export default { shouldRenderSuccessState() { return this.releases.length && !this.isLoading && !this.hasError; }, + emptyStateText() { + return __( + "Releases are based on Git tags and mark specific points in a project's development history. They can contain information about the type of changes and can also deliver binaries, like compiled versions of your software.", + ); + }, }, created() { this.fetchReleases({ @@ -56,7 +68,16 @@ export default { }; </script> <template> - <div class="prepend-top-default"> + <div class="flex flex-column mt-2"> + <gl-link + v-if="newReleasePath" + :href="newReleasePath" + :aria-describedby="shouldRenderEmptyState && 'releases-description'" + class="btn btn-success align-self-end mb-2 js-new-release-btn" + > + {{ __('New release') }} + </gl-link> + <gl-skeleton-loading v-if="isLoading" class="js-loading" /> <gl-empty-state @@ -64,14 +85,20 @@ export default { class="js-empty-state" :title="__('Getting started with releases')" :svg-path="illustrationPath" - :description=" - __( - 'Releases are based on Git tags and mark specific points in a project\'s development history. They can contain information about the type of changes and can also deliver binaries, like compiled versions of your software.', - ) - " - :primary-button-link="documentationLink" - :primary-button-text="__('Open Documentation')" - /> + > + <template #description> + <span id="releases-description"> + {{ emptyStateText }} + <gl-link + :href="documentationPath" + :aria-label="__('Releases documentation')" + target="_blank" + > + {{ __('More information') }} + </gl-link> + </span> + </template> + </gl-empty-state> <div v-else-if="shouldRenderSuccessState" class="js-success-state"> <release-block diff --git a/app/assets/javascripts/releases/mount_index.js b/app/assets/javascripts/releases/mount_index.js index ad82d9a65d6..5f0bf3b6459 100644 --- a/app/assets/javascripts/releases/mount_index.js +++ b/app/assets/javascripts/releases/mount_index.js @@ -15,11 +15,7 @@ export default () => { }), render: h => h(ReleaseListApp, { - props: { - projectId: el.dataset.projectId, - documentationLink: el.dataset.documentationPath, - illustrationPath: el.dataset.illustrationPath, - }, + props: el.dataset, }), }); }; |