diff options
Diffstat (limited to 'app/assets/javascripts/environments/components')
7 files changed, 111 insertions, 16 deletions
diff --git a/app/assets/javascripts/environments/components/confirm_rollback_modal.vue b/app/assets/javascripts/environments/components/confirm_rollback_modal.vue index 5c03c008faf..f0723e96ddf 100644 --- a/app/assets/javascripts/environments/components/confirm_rollback_modal.vue +++ b/app/assets/javascripts/environments/components/confirm_rollback_modal.vue @@ -3,7 +3,7 @@ * Render modal to confirm rollback/redeploy. */ -import { escape as esc } from 'lodash'; +import { escape } from 'lodash'; import { GlModal } from '@gitlab/ui'; import { s__, sprintf } from '~/locale'; @@ -30,7 +30,7 @@ export default { : s__('Environments|Rollback environment %{name}?'); return sprintf(title, { - name: esc(this.environment.name), + name: escape(this.environment.name), }); }, @@ -50,10 +50,10 @@ export default { }, modalText() { - const linkStart = `<a class="commit-sha mr-0" href="${esc(this.commitUrl)}">`; - const commitId = esc(this.commitShortSha); + const linkStart = `<a class="commit-sha mr-0" href="${escape(this.commitUrl)}">`; + const commitId = escape(this.commitShortSha); const linkEnd = '</a>'; - const name = esc(this.name); + const name = escape(this.name); const body = this.environment.isLastDeployment ? s__( 'Environments|This action will relaunch the job for commit %{linkStart}%{commitId}%{linkEnd}, putting the environment in a previous version. Are you sure you want to continue?', diff --git a/app/assets/javascripts/environments/components/container.vue b/app/assets/javascripts/environments/components/container.vue index 0a978ab5869..899d7ec8521 100644 --- a/app/assets/javascripts/environments/components/container.vue +++ b/app/assets/javascripts/environments/components/container.vue @@ -1,8 +1,7 @@ <script> import { GlLoadingIcon } from '@gitlab/ui'; -import containerMixin from 'ee_else_ce/environments/mixins/container_mixin'; import TablePagination from '~/vue_shared/components/pagination/table_pagination.vue'; -import EnvironmentTable from '../components/environments_table.vue'; +import EnvironmentTable from './environments_table.vue'; export default { components: { @@ -10,8 +9,12 @@ export default { TablePagination, GlLoadingIcon, }, - mixins: [containerMixin], props: { + canaryDeploymentFeatureId: { + type: String, + required: false, + default: null, + }, isLoading: { type: Boolean, required: true, @@ -28,6 +31,31 @@ export default { type: Boolean, required: true, }, + deployBoardsHelpPath: { + type: String, + required: false, + default: '', + }, + helpCanaryDeploymentsPath: { + type: String, + required: false, + default: '', + }, + lockPromotionSvgPath: { + type: String, + required: false, + default: '', + }, + showCanaryDeploymentCallout: { + type: Boolean, + required: false, + default: false, + }, + userCalloutsPath: { + type: String, + required: false, + default: '', + }, }, methods: { onChangePage(page) { diff --git a/app/assets/javascripts/environments/components/delete_environment_modal.vue b/app/assets/javascripts/environments/components/delete_environment_modal.vue index f731dc49a5b..29aab268fd3 100644 --- a/app/assets/javascripts/environments/components/delete_environment_modal.vue +++ b/app/assets/javascripts/environments/components/delete_environment_modal.vue @@ -52,7 +52,7 @@ export default { footer-primary-button-variant="danger" @submit="onSubmit" > - <template slot="header"> + <template #header> <h4 class="modal-title d-flex mw-100"> {{ __('Delete') }} <span v-gl-tooltip :title="environment.name" class="text-truncate mx-1 flex-fill"> diff --git a/app/assets/javascripts/environments/components/environment_item.vue b/app/assets/javascripts/environments/components/environment_item.vue index 335c668474e..fa3d217f148 100644 --- a/app/assets/javascripts/environments/components/environment_item.vue +++ b/app/assets/javascripts/environments/components/environment_item.vue @@ -9,7 +9,6 @@ import UserAvatarLink from '~/vue_shared/components/user_avatar/user_avatar_link import CommitComponent from '~/vue_shared/components/commit.vue'; import Icon from '~/vue_shared/components/icon.vue'; import TooltipOnTruncate from '~/vue_shared/components/tooltip_on_truncate.vue'; -import environmentItemMixin from 'ee_else_ce/environments/mixins/environment_item_mixin'; import eventHub from '../event_hub'; import ActionsComponent from './environment_actions.vue'; import ExternalUrlComponent from './environment_external_url.vue'; @@ -44,7 +43,7 @@ export default { directives: { GlTooltip: GlTooltipDirective, }, - mixins: [environmentItemMixin, timeagoMixin], + mixins: [timeagoMixin], props: { canReadEnvironment: { @@ -65,6 +64,9 @@ export default { }, computed: { + deployIconName() { + return this.model.isDeployBoardVisible ? 'chevron-down' : 'chevron-right'; + }, /** * Verifies if `last_deployment` key exists in the current Environment. * This key is required to render most of the html - this method works has @@ -210,6 +212,10 @@ export default { })); }, + shouldRenderDeployBoard() { + return this.model.hasDeployBoard; + }, + /** * Builds the string used in the user image alt attribute. * @@ -501,6 +507,9 @@ export default { }, methods: { + toggleDeployBoard() { + eventHub.$emit('toggleDeployBoard', this.model); + }, onClickFolder() { eventHub.$emit('toggleFolder', this.model); }, diff --git a/app/assets/javascripts/environments/components/environments_app.vue b/app/assets/javascripts/environments/components/environments_app.vue index 0cc6f3df2d7..0a5538237f9 100644 --- a/app/assets/javascripts/environments/components/environments_app.vue +++ b/app/assets/javascripts/environments/components/environments_app.vue @@ -1,6 +1,5 @@ <script> import { GlDeprecatedButton } from '@gitlab/ui'; -import envrionmentsAppMixin from 'ee_else_ce/environments/mixins/environments_app_mixin'; import Flash from '~/flash'; import { s__ } from '~/locale'; import emptyState from './empty_state.vue'; @@ -22,13 +21,18 @@ export default { DeleteEnvironmentModal, }, - mixins: [CIPaginationMixin, environmentsMixin, envrionmentsAppMixin], + mixins: [CIPaginationMixin, environmentsMixin], props: { endpoint: { type: String, required: true, }, + canaryDeploymentFeatureId: { + type: String, + required: false, + default: '', + }, canCreateEnvironment: { type: Boolean, required: true, @@ -41,6 +45,11 @@ export default { type: String, required: true, }, + helpCanaryDeploymentsPath: { + type: String, + required: false, + default: '', + }, helpPagePath: { type: String, required: true, @@ -50,17 +59,37 @@ export default { required: false, default: '', }, + lockPromotionSvgPath: { + type: String, + required: false, + default: '', + }, + showCanaryDeploymentCallout: { + type: Boolean, + required: false, + default: false, + }, + userCalloutsPath: { + type: String, + required: false, + default: '', + }, }, created() { eventHub.$on('toggleFolder', this.toggleFolder); + eventHub.$on('toggleDeployBoard', this.toggleDeployBoard); }, beforeDestroy() { eventHub.$off('toggleFolder'); + eventHub.$off('toggleDeployBoard'); }, methods: { + toggleDeployBoard(model) { + this.store.toggleDeployBoard(model.id); + }, toggleFolder(folder) { this.store.toggleFolder(folder); diff --git a/app/assets/javascripts/environments/components/environments_table.vue b/app/assets/javascripts/environments/components/environments_table.vue index 89e40faa23e..380e16c7b71 100644 --- a/app/assets/javascripts/environments/components/environments_table.vue +++ b/app/assets/javascripts/environments/components/environments_table.vue @@ -4,7 +4,6 @@ */ import { GlLoadingIcon } from '@gitlab/ui'; import { flow, reverse, sortBy } from 'lodash/fp'; -import environmentTableMixin from 'ee_else_ce/environments/mixins/environments_table_mixin'; import { s__ } from '~/locale'; import EnvironmentItem from './environment_item.vue'; @@ -16,7 +15,6 @@ export default { CanaryDeploymentCallout: () => import('ee_component/environments/components/canary_deployment_callout.vue'), }, - mixins: [environmentTableMixin], props: { environments: { type: Array, @@ -33,6 +31,31 @@ export default { required: false, default: false, }, + canaryDeploymentFeatureId: { + type: String, + required: false, + default: '', + }, + helpCanaryDeploymentsPath: { + type: String, + required: false, + default: '', + }, + lockPromotionSvgPath: { + type: String, + required: false, + default: '', + }, + showCanaryDeploymentCallout: { + type: Boolean, + required: false, + default: false, + }, + userCalloutsPath: { + type: String, + required: false, + default: '', + }, }, computed: { sortedEnvironments() { @@ -79,9 +102,15 @@ export default { folderUrl(model) { return `${window.location.pathname}/folders/${model.folderName}`; }, + shouldRenderDeployBoard(model) { + return model.hasDeployBoard && model.isDeployBoardVisible; + }, shouldRenderFolderContent(env) { return env.isFolder && env.isOpen && env.children && env.children.length > 0; }, + shouldShowCanaryCallout(env) { + return env.showCanaryCallout && this.showCanaryDeploymentCallout; + }, sortEnvironments(environments) { /* * The sorting algorithm should sort in the following priorities: diff --git a/app/assets/javascripts/environments/components/stop_environment_modal.vue b/app/assets/javascripts/environments/components/stop_environment_modal.vue index d3e8fb7ff08..7448fd584c6 100644 --- a/app/assets/javascripts/environments/components/stop_environment_modal.vue +++ b/app/assets/javascripts/environments/components/stop_environment_modal.vue @@ -60,7 +60,7 @@ export default { footer-primary-button-variant="danger" @submit="onSubmit" > - <template slot="header"> + <template #header> <h4 class="modal-title d-flex mw-100"> Stopping <span v-gl-tooltip :title="environment.name" class="text-truncate ml-1 mr-1 flex-fill"> |