diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2023-04-19 03:08:30 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2023-04-19 03:08:30 +0300 |
commit | 8c80b21468c5c969644c9ea83fec7b43dba1eb3c (patch) | |
tree | efdc69f22231ae472f0264dee21001e595c4f86d /app/assets/javascripts/environments | |
parent | a407a618ae21dce15c85ae15c465a531811a69b9 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/environments')
9 files changed, 107 insertions, 22 deletions
diff --git a/app/assets/javascripts/environments/components/new_environment_item.vue b/app/assets/javascripts/environments/components/new_environment_item.vue index b5ef7d00cc3..ee197bbcd45 100644 --- a/app/assets/javascripts/environments/components/new_environment_item.vue +++ b/app/assets/javascripts/environments/components/new_environment_item.vue @@ -148,6 +148,9 @@ export default { return now < autoStopDate; }, + upcomingDeploymentIid() { + return this.environment.upcomingDeployment?.iid.toString() || ''; + }, autoStopPath() { return this.environment?.cancelAutoStopPath ?? ''; }, @@ -351,7 +354,11 @@ export default { class="gl-pl-4" > <template #approval> - <environment-approval :environment="environment" @change="$emit('change')" /> + <environment-approval + :deployment-iid="upcomingDeploymentIid" + :environment="environment" + @change="$emit('change')" + /> </template> </deployment> </div> diff --git a/app/assets/javascripts/environments/environment_details/components/deployment_actions.vue b/app/assets/javascripts/environments/environment_details/components/deployment_actions.vue index 94804f3eb6e..92a0b0e550e 100644 --- a/app/assets/javascripts/environments/environment_details/components/deployment_actions.vue +++ b/app/assets/javascripts/environments/environment_details/components/deployment_actions.vue @@ -4,10 +4,15 @@ import { translations } from '~/environments/environment_details/constants'; import ActionsComponent from '~/environments/components/environment_actions.vue'; import setEnvironmentToRollback from '~/environments/graphql/mutations/set_environment_to_rollback.mutation.graphql'; +const EnvironmentApprovalComponent = import( + 'ee_component/environments/components/environment_approval.vue' +); + export default { components: { GlButton, ActionsComponent, + EnvironmentApproval: () => EnvironmentApprovalComponent, }, directives: { GlModal: GlModalDirective, @@ -43,6 +48,23 @@ export default { required: false, default: null, }, + // approvalEnvironment shape: + /* { + isApprovalActionAvailable: boolean, + deploymentIid: string, + environment: { + name: string, + tier: string, + requiredApprovalCount: number, + }, + */ + approvalEnvironment: { + type: Object, + required: false, + default: () => ({ + isApprovalActionAvailable: false, + }), + }, }, computed: { isRollbackAvailable() { @@ -54,6 +76,12 @@ export default { isActionsShown() { return this.actions.length > 0; }, + deploymentIid() { + return this.approvalEnvironment.deploymentIid; + }, + environment() { + return this.approvalEnvironment.environment; + }, rollbackButtonTitle() { return this.rollback.lastDeployment?.isLast ? translations.redeployButtonTitle @@ -84,5 +112,11 @@ export default { :icon="rollbackIcon" @click="onRollbackClick" /> + <environment-approval + v-if="approvalEnvironment.isApprovalActionAvailable" + :environment="environment" + :deployment-iid="deploymentIid" + :show-text="false" + /> </div> </template> diff --git a/app/assets/javascripts/environments/environment_details/constants.js b/app/assets/javascripts/environments/environment_details/constants.js index d3683613d8c..07579092e23 100644 --- a/app/assets/javascripts/environments/environment_details/constants.js +++ b/app/assets/javascripts/environments/environment_details/constants.js @@ -30,7 +30,7 @@ export const ENVIRONMENT_DETAILS_TABLE_FIELDS = [ { key: 'job', label: __('Job'), - columnClass: 'gl-w-20p', + columnClass: 'gl-w-15p', tdClass: 'gl-vertical-align-middle!', }, { @@ -48,7 +48,7 @@ export const ENVIRONMENT_DETAILS_TABLE_FIELDS = [ { key: 'actions', label: __('Actions'), - columnClass: 'gl-w-10p', + columnClass: 'gl-w-15p', tdClass: 'gl-vertical-align-middle! gl-white-space-nowrap', }, ]; diff --git a/app/assets/javascripts/environments/environment_details/deployments_table.vue b/app/assets/javascripts/environments/environment_details/deployments_table.vue index 430fe8d9ece..128b1aae4d8 100644 --- a/app/assets/javascripts/environments/environment_details/deployments_table.vue +++ b/app/assets/javascripts/environments/environment_details/deployments_table.vue @@ -54,7 +54,11 @@ export default { <time-ago-tooltip :time="item.deployed" /> </template> <template #cell(actions)="{ item }"> - <deployment-actions :actions="item.actions" :rollback="item.rollback" /> + <deployment-actions + :actions="item.actions" + :rollback="item.rollback" + :approval-environment="item.deploymentApproval" + /> </template> </gl-table-lite> </template> diff --git a/app/assets/javascripts/environments/graphql/fragments/deployment_job.fragment.graphql b/app/assets/javascripts/environments/graphql/fragments/deployment_job.fragment.graphql new file mode 100644 index 00000000000..e799623f9bb --- /dev/null +++ b/app/assets/javascripts/environments/graphql/fragments/deployment_job.fragment.graphql @@ -0,0 +1,6 @@ +fragment DeploymentJob on CiJob { + name + id + webPath + playable +} diff --git a/app/assets/javascripts/environments/graphql/fragments/environment_protected_data.fragment.graphql b/app/assets/javascripts/environments/graphql/fragments/environment_protected_data.fragment.graphql new file mode 100644 index 00000000000..1ff68c56362 --- /dev/null +++ b/app/assets/javascripts/environments/graphql/fragments/environment_protected_data.fragment.graphql @@ -0,0 +1,3 @@ +fragment ProtectedEnvironment on Environment { + id +} diff --git a/app/assets/javascripts/environments/graphql/queries/environment_details.query.graphql b/app/assets/javascripts/environments/graphql/queries/environment_details.query.graphql index 0182b3a7234..65d36242afe 100644 --- a/app/assets/javascripts/environments/graphql/queries/environment_details.query.graphql +++ b/app/assets/javascripts/environments/graphql/queries/environment_details.query.graphql @@ -1,3 +1,7 @@ +#import "ee_else_ce/environments/graphql/fragments/environment_protected_data.fragment.graphql" +#import "~/graphql_shared/fragments/user.fragment.graphql" +#import "~/environments/graphql/fragments/deployment_job.fragment.graphql" + query getEnvironmentDetails( $projectFullPath: ID! $environmentName: String @@ -11,8 +15,9 @@ query getEnvironmentDetails( name fullPath environment(name: $environmentName) { - id + ...ProtectedEnvironment name + tier lastDeployment(status: SUCCESS) { id job { @@ -40,19 +45,13 @@ query getEnvironmentDetails( ref tag job { - name - id - webPath - playable + ...DeploymentJob deploymentPipeline: pipeline { id jobs(whenExecuted: ["manual"], retried: false) { nodes { - id - name - playable + ...DeploymentJob scheduledAt - webPath } } } @@ -66,17 +65,11 @@ query getEnvironmentDetails( authorName authorEmail author { - id - name - avatarUrl - webUrl + ...User } } triggerer { - id - webUrl - name - avatarUrl + ...User } createdAt finishedAt diff --git a/app/assets/javascripts/environments/helpers/deployment_data_transformation_helper.js b/app/assets/javascripts/environments/helpers/deployment_data_transformation_helper.js index 63ccb568794..92efd46df64 100644 --- a/app/assets/javascripts/environments/helpers/deployment_data_transformation_helper.js +++ b/app/assets/javascripts/environments/helpers/deployment_data_transformation_helper.js @@ -81,6 +81,41 @@ export const getRollbackActionFromDeploymentNode = (deploymentNode, environment) }; }; +const getDeploymentApprovalFromDeploymentNode = (deploymentNode, environment) => { + if (!environment.protectedEnvironments || environment.protectedEnvironments.nodes.length === 0) { + return { + isApprovalActionAvailable: false, + }; + } + + const protectedEnvironmentInfo = environment.protectedEnvironments.nodes[0]; + + const hasApprovalRules = protectedEnvironmentInfo.approvalRules.nodes?.length > 0; + const hasRequiredApprovals = protectedEnvironmentInfo.requiredApprovalCount > 0; + + const isApprovalActionAvailable = hasRequiredApprovals || hasApprovalRules; + const requiredMultipleApprovalRulesApprovals = protectedEnvironmentInfo.approvalRules.nodes.reduce( + (requiredApprovals, rule) => { + return requiredApprovals + rule.requiredApprovals; + }, + 0, + ); + + const requiredApprovalCount = hasRequiredApprovals + ? protectedEnvironmentInfo.requiredApprovalCount + : requiredMultipleApprovalRulesApprovals; + + return { + isApprovalActionAvailable, + deploymentIid: deploymentNode.iid, + environment: { + name: environment.name, + tier: environment.tier, + requiredApprovalCount, + }, + }; +}; + /** * This function transforms deploymentNode object coming from GraphQL to object compatible with app/assets/javascripts/environments/environment_details/page.vue table * @param {Object} deploymentNode @@ -102,5 +137,6 @@ export const convertToDeploymentTableRow = (deploymentNode, environment) => { deployed: deploymentNode.finishedAt || '', actions: getActionsFromDeploymentNode(deploymentNode, lastDeployment?.job?.name), rollback: getRollbackActionFromDeploymentNode(deploymentNode, environment), + deploymentApproval: getDeploymentApprovalFromDeploymentNode(deploymentNode, environment), }; }; diff --git a/app/assets/javascripts/environments/mount_show.js b/app/assets/javascripts/environments/mount_show.js index afce2b7f237..5e812c85c96 100644 --- a/app/assets/javascripts/environments/mount_show.js +++ b/app/assets/javascripts/environments/mount_show.js @@ -92,7 +92,9 @@ export const initPage = async () => { el, apolloProvider: apolloProvider(), router, - provide: {}, + provide: { + projectPath: dataSet.projectFullPath, + }, render(createElement) { return createElement('router-view'); }, |