diff options
Diffstat (limited to 'app/assets/javascripts/pages/import')
8 files changed, 66 insertions, 60 deletions
diff --git a/app/assets/javascripts/pages/import/bitbucket/status/index.js b/app/assets/javascripts/pages/import/bitbucket/status/index.js index 6e9c26bf930..0b0f222ab76 100644 --- a/app/assets/javascripts/pages/import/bitbucket/status/index.js +++ b/app/assets/javascripts/pages/import/bitbucket/status/index.js @@ -1,21 +1,6 @@ -import Vue from 'vue'; -import { initStoreFromElement, initPropsFromElement } from '~/import_entities/import_projects'; +import mountImportProjectsTable from '~/import_entities/import_projects'; import BitbucketStatusTable from '~/import_entities/import_projects/components/bitbucket_status_table.vue'; -function importBitBucket() { - const mountElement = document.getElementById('import-projects-mount-element'); - if (!mountElement) return undefined; +const mountElement = document.getElementById('import-projects-mount-element'); - const store = initStoreFromElement(mountElement); - const attrs = initPropsFromElement(mountElement); - - return new Vue({ - el: mountElement, - store, - render(createElement) { - return createElement(BitbucketStatusTable, { attrs }); - }, - }); -} - -importBitBucket(); +mountImportProjectsTable({ mountElement, Component: BitbucketStatusTable }); diff --git a/app/assets/javascripts/pages/import/bitbucket_server/status/index.js b/app/assets/javascripts/pages/import/bitbucket_server/status/index.js index 90eb423c7a7..680ff0ddcde 100644 --- a/app/assets/javascripts/pages/import/bitbucket_server/status/index.js +++ b/app/assets/javascripts/pages/import/bitbucket_server/status/index.js @@ -1,24 +1,10 @@ -import Vue from 'vue'; -import { initStoreFromElement, initPropsFromElement } from '~/import_entities/import_projects'; -import BitbucketServerStatusTable from './components/bitbucket_server_status_table.vue'; - -function BitbucketServerStatus() { - const mountElement = document.getElementById('import-projects-mount-element'); - if (!mountElement) return undefined; +import mountImportProjectsTable from '~/import_entities/import_projects'; - const store = initStoreFromElement(mountElement); - const attrs = initPropsFromElement(mountElement); - const { reconfigurePath } = mountElement.dataset; - - return new Vue({ - el: mountElement, - store, - render(createElement) { - return createElement(BitbucketServerStatusTable, { - attrs: { ...attrs, reconfigurePath }, - }); - }, - }); -} +import BitbucketServerStatusTable from './components/bitbucket_server_status_table.vue'; -BitbucketServerStatus(); +const mountElement = document.getElementById('import-projects-mount-element'); +mountImportProjectsTable({ + mountElement, + Component: BitbucketServerStatusTable, + extraProps: ({ reconfigurePath }) => ({ reconfigurePath }), +}); 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" diff --git a/app/assets/javascripts/pages/import/fogbugz/status/index.js b/app/assets/javascripts/pages/import/fogbugz/status/index.js index 4c427b72372..30ee468734d 100644 --- a/app/assets/javascripts/pages/import/fogbugz/status/index.js +++ b/app/assets/javascripts/pages/import/fogbugz/status/index.js @@ -2,4 +2,4 @@ import mountImportProjectsTable from '~/import_entities/import_projects'; const mountElement = document.getElementById('import-projects-mount-element'); -mountImportProjectsTable(mountElement); +mountImportProjectsTable({ mountElement }); diff --git a/app/assets/javascripts/pages/import/gitea/status/index.js b/app/assets/javascripts/pages/import/gitea/status/index.js index 4c427b72372..30ee468734d 100644 --- a/app/assets/javascripts/pages/import/gitea/status/index.js +++ b/app/assets/javascripts/pages/import/gitea/status/index.js @@ -2,4 +2,4 @@ import mountImportProjectsTable from '~/import_entities/import_projects'; const mountElement = document.getElementById('import-projects-mount-element'); -mountImportProjectsTable(mountElement); +mountImportProjectsTable({ mountElement }); diff --git a/app/assets/javascripts/pages/import/github/status/index.js b/app/assets/javascripts/pages/import/github/status/index.js index 4c427b72372..30ee468734d 100644 --- a/app/assets/javascripts/pages/import/github/status/index.js +++ b/app/assets/javascripts/pages/import/github/status/index.js @@ -2,4 +2,4 @@ import mountImportProjectsTable from '~/import_entities/import_projects'; const mountElement = document.getElementById('import-projects-mount-element'); -mountImportProjectsTable(mountElement); +mountImportProjectsTable({ mountElement }); diff --git a/app/assets/javascripts/pages/import/gitlab/status/index.js b/app/assets/javascripts/pages/import/gitlab/status/index.js index 4c427b72372..30ee468734d 100644 --- a/app/assets/javascripts/pages/import/gitlab/status/index.js +++ b/app/assets/javascripts/pages/import/gitlab/status/index.js @@ -2,4 +2,4 @@ import mountImportProjectsTable from '~/import_entities/import_projects'; const mountElement = document.getElementById('import-projects-mount-element'); -mountImportProjectsTable(mountElement); +mountImportProjectsTable({ mountElement }); diff --git a/app/assets/javascripts/pages/import/manifest/status/index.js b/app/assets/javascripts/pages/import/manifest/status/index.js index 4c427b72372..30ee468734d 100644 --- a/app/assets/javascripts/pages/import/manifest/status/index.js +++ b/app/assets/javascripts/pages/import/manifest/status/index.js @@ -2,4 +2,4 @@ import mountImportProjectsTable from '~/import_entities/import_projects'; const mountElement = document.getElementById('import-projects-mount-element'); -mountImportProjectsTable(mountElement); +mountImportProjectsTable({ mountElement }); |