diff options
Diffstat (limited to 'app/assets/javascripts/import_projects/components/provider_repo_table_row.vue')
-rw-r--r-- | app/assets/javascripts/import_projects/components/provider_repo_table_row.vue | 48 |
1 files changed, 42 insertions, 6 deletions
diff --git a/app/assets/javascripts/import_projects/components/provider_repo_table_row.vue b/app/assets/javascripts/import_projects/components/provider_repo_table_row.vue index d8cffc6a7d5..18971313dfe 100644 --- a/app/assets/javascripts/import_projects/components/provider_repo_table_row.vue +++ b/app/assets/javascripts/import_projects/components/provider_repo_table_row.vue @@ -1,9 +1,11 @@ <script> import { mapState, mapGetters, mapActions } from 'vuex'; -import { GlIcon } from '@gitlab/ui'; +import { GlIcon, GlBadge } from '@gitlab/ui'; import Select2Select from '~/vue_shared/components/select2_select.vue'; import { __ } from '~/locale'; import ImportStatus from './import_status.vue'; +import { STATUSES } from '../constants'; +import { isProjectImportable, isIncompatible, getImportStatus } from '../utils'; export default { name: 'ProviderRepoTableRow', @@ -11,6 +13,7 @@ export default { Select2Select, ImportStatus, GlIcon, + GlBadge, }, props: { repo: { @@ -27,6 +30,26 @@ export default { ...mapState(['ciCdOnly']), ...mapGetters(['getImportTarget']), + displayFullPath() { + return this.repo.importedProject.fullPath.replace(/^\//, ''); + }, + + isFinished() { + return this.repo.importedProject?.importStatus === STATUSES.FINISHED; + }, + + isImportNotStarted() { + return isProjectImportable(this.repo); + }, + + isIncompatible() { + return isIncompatible(this.repo); + }, + + importStatus() { + return getImportStatus(this.repo); + }, + importTarget() { return this.getImportTarget(this.repo.importSource.id); }, @@ -85,9 +108,9 @@ export default { <gl-icon v-if="repo.importSource.providerLink" name="external-link" /> </a> </td> - <td class="d-flex flex-wrap flex-lg-nowrap"> - <template v-if="repo.target">{{ repo.target }}</template> - <template v-else> + <td class="d-flex flex-wrap flex-lg-nowrap" data-testid="fullPath"> + <template v-if="repo.importSource.target">{{ repo.importSource.target }}</template> + <template v-else-if="isImportNotStarted"> <select2-select v-model="targetNamespaceSelect" :options="select2Options" /> <span class="px-2 import-slash-divider d-flex justify-content-center align-items-center" >/</span @@ -98,18 +121,31 @@ export default { class="form-control import-project-name-input qa-project-path-field" /> </template> + <template v-else-if="repo.importedProject">{{ displayFullPath }}</template> </td> <td> - <import-status :status="repo.importStatus" /> + <import-status :status="importStatus" /> </td> - <td> + <td data-testid="actions"> + <a + v-if="isFinished" + class="btn btn-default" + :href="repo.importedProject.fullPath" + rel="noreferrer noopener" + target="_blank" + >{{ __('Go to project') }} + </a> <button + v-if="isImportNotStarted" type="button" class="qa-import-button btn btn-default" @click="fetchImport(repo.importSource.id)" > {{ importButtonText }} </button> + <gl-badge v-else-if="isIncompatible" variant="danger">{{ + __('Incompatible project') + }}</gl-badge> </td> </tr> </template> |