diff options
| -rw-r--r-- | app/assets/javascripts/vue_merge_request_widget/components/deployment.vue | 39 |
1 files changed, 17 insertions, 22 deletions
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/deployment.vue b/app/assets/javascripts/vue_merge_request_widget/components/deployment.vue index 0720a766474..9286a597c05 100644 --- a/app/assets/javascripts/vue_merge_request_widget/components/deployment.vue +++ b/app/assets/javascripts/vue_merge_request_widget/components/deployment.vue @@ -68,6 +68,11 @@ export default { isDeployInProgress() { return this.deployment.status === 'running'; }, + deployInProgressTooltip() { + return this.isDeployInProgress + ? __('Stopping this environment is currently not possible as a deployment is in progress') + : ''; + }, shouldRenderDropdown() { return ( this.enableCiEnvironmentsStatusChanges && @@ -186,34 +191,24 @@ export default { css-class="js-deploy-url js-deploy-url-feature-flag deploy-link btn btn-default btn-sm inlin" /> </template> - <template v-if="deployment.stop_url"> - <span - v-if="isDeployInProgress" - v-tooltip - :title="__('Stopping this environment is currently not possible as a deployment is in progress')" - class="d-inline-block" - tabindex="0" - > - <loading-button - :loading="isStopping" - :disabled="isDeployInProgress" - container-class="js-stop-env btn btn-default btn-sm inline prepend-left-4" - style="pointer-events: none;" - @click="stopEnvironment" - > - <icon name="stop" /> - </loading-button> - </span> + <span + v-if="deployment.stop_url" + v-tooltip + :title="deployInProgressTooltip" + class="d-inline-block" + tabindex="0" + > <loading-button - v-else - :title="__('Stop environment')" :loading="isStopping" - container-class="btn btn-default btn-sm inline prepend-left-4" + :disabled="isDeployInProgress" + :title="__('Stop environment')" + container-class="js-stop-env btn btn-default btn-sm inline prepend-left-4" + style="pointer-events: none;" @click="stopEnvironment" > <icon name="stop" /> </loading-button> - </template> + </span> </div> </div> </div> |