Changes after review
This commit is contained in:
parent
b187426720
commit
84c4834fb4
|
@ -30,44 +30,14 @@
|
|||
...mapActions([
|
||||
'setMainEndpoint',
|
||||
'fetchRepos',
|
||||
'fetchList',
|
||||
'deleteRepo',
|
||||
'deleteRegistry',
|
||||
'toggleLoading',
|
||||
]),
|
||||
|
||||
fetchRegistryList(repo) {
|
||||
this.fetchList({ repo })
|
||||
.catch(() => this.showError(errorMessagesTypes.FETCH_REGISTRY));
|
||||
},
|
||||
|
||||
deleteRegistry(repo, registry) {
|
||||
this.deleteRegistry(registry)
|
||||
.then(() => this.fetchRegistry(repo))
|
||||
.catch(() => this.showError(errorMessagesTypes.DELETE_REGISTRY));
|
||||
},
|
||||
|
||||
deleteRepository(repo) {
|
||||
this.deleteRepo(repo)
|
||||
.then(() => this.fetchRepos())
|
||||
.catch(() => this.showError(errorMessagesTypes.DELETE_REPO));
|
||||
},
|
||||
|
||||
showError(message) {
|
||||
Flash(this.__(errorMessages[message]));
|
||||
},
|
||||
|
||||
onPageChange(repo, page) {
|
||||
this.fetchList({ repo, page })
|
||||
.catch(() => this.showError(errorMessagesTypes.FETCH_REGISTRY));
|
||||
},
|
||||
},
|
||||
created() {
|
||||
this.setMainEndpoint(this.endpoint);
|
||||
},
|
||||
mounted() {
|
||||
this.fetchRepos()
|
||||
.catch(() => this.showError(errorMessagesTypes.FETCH_REPOS));
|
||||
.catch(() => Flash(errorMessagesTypes.FETCH_REPOS));
|
||||
},
|
||||
};
|
||||
</script>
|
||||
|
@ -83,10 +53,6 @@
|
|||
v-for="(item, index) in repos"
|
||||
:key="index"
|
||||
:repo="item"
|
||||
@fetchRegistryList="fetchRegistryList"
|
||||
@deleteRepository="deleteRepository"
|
||||
@deleteRegistry="deleteRegistry"
|
||||
@pageChange="onPageChange"
|
||||
/>
|
||||
|
||||
<p v-else-if="!isLoading && !repos.length">
|
||||
|
|
|
@ -1,9 +1,12 @@
|
|||
<script>
|
||||
import { mapActions } from 'vuex';
|
||||
import { n__, s__ } from '../../locale';
|
||||
import clipboardButton from '../../vue_shared/components/clipboard_button.vue';
|
||||
import loadingIcon from '../../vue_shared/components/loading_icon.vue';
|
||||
import tablePagination from '../../vue_shared/components/table_pagination.vue';
|
||||
import tooltip from '../../vue_shared/directives/tooltip';
|
||||
import timeagoMixin from '../../vue_shared/mixins/timeago';
|
||||
import { errorMessages, errorMessagesTypes } from '../constants';
|
||||
|
||||
export default {
|
||||
name: 'collapsibeContainerRegisty',
|
||||
|
@ -35,28 +38,49 @@
|
|||
},
|
||||
},
|
||||
methods: {
|
||||
...mapActions([
|
||||
'fetchList',
|
||||
'deleteRepo',
|
||||
'deleteRegistry',
|
||||
'toggleLoading',
|
||||
]),
|
||||
|
||||
layers(item) {
|
||||
const pluralize = gl.text.pluralize('layer', item.layers);
|
||||
const pluralize = n__('layer', 'layers', item.layers);
|
||||
return `${item.layers} ${pluralize}`;
|
||||
},
|
||||
|
||||
toggleRepo() {
|
||||
if (this.isOpen === false) {
|
||||
this.$emit('fetchRegistryList', this.repo);
|
||||
this.fetchList({ repo: this.repo })
|
||||
.catch(() => this.showError(errorMessagesTypes.FETCH_REGISTRY));
|
||||
}
|
||||
this.isOpen = !this.isOpen;
|
||||
},
|
||||
|
||||
handleDeleteRepository() {
|
||||
this.$emit('deleteRepository', this.repo);
|
||||
this.deleteRepo(this.repo)
|
||||
.then(() => this.fetchRepos())
|
||||
.catch(() => this.showError(errorMessagesTypes.DELETE_REPO));
|
||||
},
|
||||
|
||||
handleDeleteRegistry(registry) {
|
||||
this.$emit('deleteRegistry', this.repo, registry);
|
||||
this.deleteRegistry(registry)
|
||||
.then(() => this.fetchRegistry(this.repo))
|
||||
.catch(() => this.showError(errorMessagesTypes.DELETE_REGISTRY));
|
||||
},
|
||||
|
||||
onPageChange(pageNumber) {
|
||||
this.$emit('pageChange', this.repo, pageNumber);
|
||||
this.fetchList({ repo: this.repo, page })
|
||||
.catch(() => this.showError(errorMessagesTypes.FETCH_REGISTRY));
|
||||
},
|
||||
|
||||
clipboardText(text) {
|
||||
return `docker pull ${text}`;
|
||||
},
|
||||
|
||||
showError(message) {
|
||||
Flash((errorMessages[message]));
|
||||
},
|
||||
},
|
||||
};
|
||||
|
@ -66,10 +90,10 @@
|
|||
<div class="container-image">
|
||||
<div
|
||||
class="container-image-head">
|
||||
<a
|
||||
role="button"
|
||||
<button
|
||||
type="button"
|
||||
@click="toggleRepo"
|
||||
class="js-toggle-repo">
|
||||
class="js-toggle-repo btn-link">
|
||||
<i
|
||||
class="fa"
|
||||
:class="{
|
||||
|
@ -79,11 +103,11 @@
|
|||
aria-hidden="true">
|
||||
</i>
|
||||
{{repo.name}}
|
||||
</a>
|
||||
</button>
|
||||
|
||||
<clipboard-button
|
||||
v-if="repo.location"
|
||||
:text="__(`docker pull ${repo.location}`)"
|
||||
:text="clipboardText(repo.location)"
|
||||
:title="repo.location"
|
||||
/>
|
||||
|
||||
|
@ -91,8 +115,9 @@
|
|||
<button
|
||||
v-if="repo.canDelete"
|
||||
type="button"
|
||||
class="js-remove-repo btn btn-remove"
|
||||
:title="__('Remove repository')"
|
||||
class="js-remove-repo btn btn-danger"
|
||||
:title="s__('ContainerRegistry|Remove repository')"
|
||||
:aria-label="s__('ContainerRegistry|Remove repository')"
|
||||
v-tooltip
|
||||
@click="handleDeleteRepository">
|
||||
<i
|
||||
|
@ -116,10 +141,10 @@
|
|||
<table class="table tags">
|
||||
<thead>
|
||||
<tr>
|
||||
<th>{{__("Tag")}}</th>
|
||||
<th>{{__("Tag ID")}}</th>
|
||||
<th>{{__("Size")}}</th>
|
||||
<th>{{__("Created")}}</th>
|
||||
<th>{{s__('ContainerRegistry|Tag')}}</th>
|
||||
<th>{{s__('ContainerRegistry|Tag ID')}}</th>
|
||||
<th>{{s__("ContainerRegistry|Size")}}</th>
|
||||
<th>{{s__("ContainerRegistry|Created")}}</th>
|
||||
<th></th>
|
||||
</tr>
|
||||
</thead>
|
||||
|
@ -134,7 +159,7 @@
|
|||
<clipboard-button
|
||||
v-if="item.location"
|
||||
:title="item.location"
|
||||
:text="__(`docker pull ${item.location}`)"
|
||||
:text="clipboardText(item.location)"
|
||||
/>
|
||||
</td>
|
||||
<td>
|
||||
|
@ -173,8 +198,9 @@
|
|||
<button
|
||||
v-if="item.canDelete"
|
||||
type="button"
|
||||
class="js-delete-registry btn btn-remove hidden-xs pull-right"
|
||||
:title="__('Remove tag')"
|
||||
class="js-delete-registry btn btn-danger hidden-xs pull-right"
|
||||
:title="s__('ContainerRegistry|Remove tag')"
|
||||
:aria-label="s__('ContainerRegistry|Remove tag')"
|
||||
data-container="body"
|
||||
v-tooltip
|
||||
@click="handleDeleteRegistry(item)">
|
||||
|
@ -197,7 +223,7 @@
|
|||
<div
|
||||
v-else
|
||||
class="nothing-here-block">
|
||||
{{__("No tags in Container Registry for this container image.")}}
|
||||
{{s__("ContainerRegistry|No tags in Container Registry for this container image.")}}
|
||||
</div>
|
||||
</div>
|
||||
</div>
|
||||
|
|
|
@ -1,3 +1,5 @@
|
|||
import { __ } from '../locale';
|
||||
|
||||
export const errorMessagesTypes = {
|
||||
FETCH_REGISTRY: 'FETCH_REGISTRY',
|
||||
FETCH_REPOS: 'FETCH_REPOS',
|
||||
|
@ -6,8 +8,8 @@ export const errorMessagesTypes = {
|
|||
};
|
||||
|
||||
export const errorMessages = {
|
||||
[errorMessagesTypes.FETCH_REGISTRY]: 'Something went wrong while fetching the registry list.',
|
||||
[errorMessagesTypes.FETCH_REPOS]: 'Something went wrong while fetching the repositories.',
|
||||
[errorMessagesTypes.DELETE_REPO]: 'Something went wrong while deleting the repository.',
|
||||
[errorMessagesTypes.DELETE_REGISTRY]: 'Something went wrong while deleting registry.',
|
||||
[errorMessagesTypes.FETCH_REGISTRY]: __('Something went wrong while fetching the registry list.'),
|
||||
[errorMessagesTypes.FETCH_REPOS]: __('Something went wrong while fetching the repositories.'),
|
||||
[errorMessagesTypes.DELETE_REPO]: __('Something went wrong while deleting the repository.'),
|
||||
[errorMessagesTypes.DELETE_REGISTRY]: __('Something went wrong while deleting registry.'),
|
||||
};
|
||||
|
|
|
@ -9,6 +9,14 @@
|
|||
.container-image-head {
|
||||
padding: 0 16px;
|
||||
line-height: 4em;
|
||||
|
||||
.btn-link {
|
||||
padding: 0;
|
||||
|
||||
&:focus {
|
||||
outline: none;
|
||||
}
|
||||
}
|
||||
}
|
||||
|
||||
.table.tags {
|
||||
|
|
|
@ -15,4 +15,4 @@
|
|||
|
||||
.registry-placeholder {
|
||||
min-height: 60px;
|
||||
}
|
||||
}
|
||||
|
|
|
@ -5,10 +5,10 @@
|
|||
%h4
|
||||
= page_title
|
||||
%p
|
||||
= _('With the Docker Container Registry integrated into GitLab, every project can have its own space to store its Docker images.')
|
||||
= s_('ContainerRegistry|With the Docker Container Registry integrated into GitLab, every project can have its own space to store its Docker images.')
|
||||
%p.append-bottom-0
|
||||
= succeed '.' do
|
||||
= _('Learn more about')
|
||||
= s_('ContainerRegistry|Learn more about')
|
||||
= link_to _('Container Registry'), help_page_path('user/project/container_registry'), target: '_blank'
|
||||
.row.registry-placeholder.prepend-bottom-10
|
||||
.col-lg-12
|
||||
|
@ -22,7 +22,7 @@
|
|||
.panel.panel-default
|
||||
.panel-heading
|
||||
%h4.panel-title
|
||||
= _('How to use the Container Registry')
|
||||
= s_('ContainerRegistry|How to use the Container Registry')
|
||||
.panel-body
|
||||
%p
|
||||
= _('First log in to GitLab’s Container Registry using your GitLab username and password. If you have').html_safe
|
||||
|
|
Loading…
Reference in New Issue