diff options
Diffstat (limited to 'app/assets/javascripts/pages/import/bulk_imports/history/components')
-rw-r--r-- | app/assets/javascripts/pages/import/bulk_imports/history/components/bulk_imports_history_app.vue | 65 |
1 files changed, 50 insertions, 15 deletions
diff --git a/app/assets/javascripts/pages/import/bulk_imports/history/components/bulk_imports_history_app.vue b/app/assets/javascripts/pages/import/bulk_imports/history/components/bulk_imports_history_app.vue index 6feb4c2188f..3dcababb4fd 100644 --- a/app/assets/javascripts/pages/import/bulk_imports/history/components/bulk_imports_history_app.vue +++ b/app/assets/javascripts/pages/import/bulk_imports/history/components/bulk_imports_history_app.vue @@ -1,5 +1,13 @@ <script> -import { GlButton, GlEmptyState, GlLink, GlLoadingIcon, GlTable } from '@gitlab/ui'; +import { + GlButton, + GlEmptyState, + GlIcon, + GlLink, + GlLoadingIcon, + GlTableLite, + GlTooltipDirective as GlTooltip, +} from '@gitlab/ui'; import { s__, __ } from '~/locale'; import { createAlert } from '~/flash'; @@ -34,15 +42,20 @@ export default { components: { GlButton, GlEmptyState, + GlIcon, GlLink, GlLoadingIcon, - GlTable, + GlTableLite, PaginationBar, ImportStatus, TimeAgo, LocalStorageSync, }, + directives: { + GlTooltip, + }, + data() { return { loading: true, @@ -58,12 +71,12 @@ export default { fields: [ tableCell({ key: 'source_full_path', - label: s__('BulkImport|Source group'), + label: s__('BulkImport|Source'), thClass: `${DEFAULT_TH_CLASSES} gl-w-30p`, }), tableCell({ key: 'destination_name', - label: s__('BulkImport|Destination group'), + label: s__('BulkImport|Destination'), thClass: `${DEFAULT_TH_CLASSES} gl-w-40p`, }), tableCell({ @@ -113,12 +126,24 @@ export default { } }, - getDestinationUrl({ destination_name: name, destination_namespace: namespace }) { - return [namespace, name].filter(Boolean).join('/'); + getFullDestinationUrl(params) { + return joinPaths(gon.relative_url_root || '', '/', params.destination_full_path); }, - getFullDestinationUrl(params) { - return joinPaths(gon.relative_url_root || '', '/', this.getDestinationUrl(params)); + getPresentationUrl(item) { + const suffix = item.entity_type === 'group' ? '/' : ''; + return `${item.destination_full_path}${suffix}`; + }, + + getEntityTooltip(item) { + switch (item.entity_type) { + case 'project': + return __('Project'); + case 'group': + return __('Group'); + default: + return ''; + } }, }, @@ -134,26 +159,36 @@ export default { > <h1 class="gl-my-0 gl-py-4 gl-font-size-h1"> <img :src="$options.gitlabLogo" class="gl-w-6 gl-h-6 gl-mb-2 gl-display-inline gl-mr-2" /> - {{ s__('BulkImport|Group import history') }} + {{ s__('BulkImport|GitLab Migration history') }} </h1> </div> <gl-loading-icon v-if="loading" size="lg" class="gl-mt-5" /> <gl-empty-state v-else-if="!hasHistoryItems" :title="s__('BulkImport|No history is available')" - :description="s__('BulkImport|Your imported groups will appear here.')" + :description="s__('BulkImport|Your imported groups and projects will appear here.')" /> <template v-else> - <gl-table + <gl-table-lite :fields="$options.fields" :items="historyItems" data-qa-selector="import_history_table" class="gl-w-full" > <template #cell(destination_name)="{ item }"> - <gl-link :href="getFullDestinationUrl(item)" target="_blank"> - {{ getDestinationUrl(item) }} - </gl-link> + <template v-if="item.destination_full_path"> + <gl-icon + v-gl-tooltip + :name="item.entity_type" + :title="getEntityTooltip(item)" + :aria-label="getEntityTooltip(item)" + class="gl-text-gray-500" + /> + <gl-link :href="getFullDestinationUrl(item)" target="_blank"> + {{ getPresentationUrl(item) }} + </gl-link> + </template> + <gl-loading-icon v-else inline /> </template> <template #cell(created_at)="{ value }"> <time-ago :time="value" /> @@ -171,7 +206,7 @@ export default { <template #row-details="{ item }"> <pre><code>{{ item.failures }}</code></pre> </template> - </gl-table> + </gl-table-lite> <pagination-bar :page-info="pageInfo" class="gl-m-0 gl-mt-3" |