diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2022-01-14 06:16:05 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2022-01-14 06:16:05 +0300 |
commit | 4df4bbed3ee2333c23f50952d55178418eedfbe4 (patch) | |
tree | acf4669870419e64a791872f72b651260ce89a93 /app/assets/javascripts/environments | |
parent | 0426ca208d7f3d54f5ec7572b7d5dff33a97ee87 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/environments')
3 files changed, 47 insertions, 8 deletions
diff --git a/app/assets/javascripts/environments/components/deployment.vue b/app/assets/javascripts/environments/components/deployment.vue new file mode 100644 index 00000000000..292f9a366c3 --- /dev/null +++ b/app/assets/javascripts/environments/components/deployment.vue @@ -0,0 +1,13 @@ +<script> +export default { + props: { + deployment: { + type: Object, + required: true, + }, + }, +}; +</script> +<template> + <div></div> +</template> diff --git a/app/assets/javascripts/environments/components/new_environment_folder.vue b/app/assets/javascripts/environments/components/new_environment_folder.vue index 0d8651b1d09..0d3867a4d74 100644 --- a/app/assets/javascripts/environments/components/new_environment_folder.vue +++ b/app/assets/javascripts/environments/components/new_environment_folder.vue @@ -70,9 +70,9 @@ export default { <template> <div :class="{ 'gl-pb-5': !visible }" - class="gl-border-b-solid gl-border-gray-100 gl-border-1 gl-px-3 gl-pt-3" + class="gl-border-b-solid gl-border-gray-100 gl-border-1 gl-pt-3" > - <div class="gl-w-full gl-display-flex gl-align-items-center"> + <div class="gl-w-full gl-display-flex gl-align-items-center gl-px-3"> <gl-button class="gl-mr-4 gl-fill-current-color gl-text-gray-500" :aria-label="label" @@ -94,7 +94,7 @@ export default { :key="environment.name" :environment="environment" :class="{ 'gl-mt-5': isFirstEnvironment(index) }" - class="gl-border-gray-100 gl-border-t-solid gl-border-1 gl-pl-7 gl-pt-3" + class="gl-border-gray-100 gl-border-t-solid gl-border-1 gl-pt-3" in-folder /> </gl-collapse> diff --git a/app/assets/javascripts/environments/components/new_environment_item.vue b/app/assets/javascripts/environments/components/new_environment_item.vue index 883e887c1ae..d3624103c13 100644 --- a/app/assets/javascripts/environments/components/new_environment_item.vue +++ b/app/assets/javascripts/environments/components/new_environment_item.vue @@ -17,6 +17,7 @@ import Pin from './environment_pin.vue'; import Monitoring from './environment_monitoring.vue'; import Terminal from './environment_terminal_button.vue'; import Delete from './environment_delete.vue'; +import Deployment from './deployment.vue'; export default { components: { @@ -25,6 +26,7 @@ export default { GlButton, GlLink, Actions, + Deployment, ExternalUrl, StopComponent, Rollback, @@ -75,11 +77,17 @@ export default { label() { return this.visible ? this.$options.i18n.collapse : this.$options.i18n.expand; }, + lastDeployment() { + return this.environment?.lastDeployment; + }, + upcomingDeployment() { + return this.environment?.upcomingDeployment; + }, actions() { - if (!this.environment?.lastDeployment) { + if (!this.lastDeployment) { return []; } - const { manualActions = [], scheduledActions = [] } = this.environment.lastDeployment; + const { manualActions = [], scheduledActions = [] } = this.lastDeployment; const combinedActions = [...manualActions, ...scheduledActions]; return combinedActions.map((action) => ({ ...action, @@ -89,7 +97,7 @@ export default { return this.environment?.canStop; }, retryPath() { - return this.environment?.lastDeployment?.deployable?.retryPath; + return this.lastDeployment?.deployable?.retryPath; }, hasExtraActions() { return Boolean( @@ -131,6 +139,14 @@ export default { this.visible = !this.visible; }, }, + deploymentClasses: [ + 'gl-border-gray-100', + 'gl-border-t-solid', + 'gl-border-1', + 'gl-py-5', + 'gl-pl-7', + 'gl-bg-gray-10', + ], }; </script> <template> @@ -138,7 +154,10 @@ export default { <div class="gl-px-3 gl-pt-3 gl-pb-5 gl-display-flex gl-justify-content-space-between gl-align-items-center" > - <div class="gl-min-w-0 gl-mr-4 gl-display-flex gl-align-items-center"> + <div + :class="{ 'gl-ml-7': inFolder }" + class="gl-min-w-0 gl-mr-4 gl-display-flex gl-align-items-center" + > <gl-button class="gl-mr-4 gl-min-w-fit-content" :icon="icon" @@ -234,6 +253,13 @@ export default { </div> </div> </div> - <gl-collapse :visible="visible" /> + <gl-collapse :visible="visible"> + <div v-if="lastDeployment" :class="$options.deploymentClasses"> + <deployment :deployment="lastDeployment" :class="{ 'gl-ml-7': inFolder }" /> + </div> + <div v-if="upcomingDeployment" :class="$options.deploymentClasses"> + <deployment :deployment="upcomingDeployment" :class="{ 'gl-ml-7': inFolder }" /> + </div> + </gl-collapse> </div> </template> |