diff options
author | GitLab Bot <gitlab-bot@gitlab.com> | 2020-11-05 18:09:04 +0300 |
---|---|---|
committer | GitLab Bot <gitlab-bot@gitlab.com> | 2020-11-05 18:09:04 +0300 |
commit | 74dd67ddea70f70830f3fe1ca65b06b604ec229f (patch) | |
tree | 7347826741dfed35d59e53890907e9e17a7afa4f /app/assets/javascripts/environments | |
parent | a662b146aca7227bc800eed4878000d2b7c9d757 (diff) |
Add latest changes from gitlab-org/gitlab@master
Diffstat (limited to 'app/assets/javascripts/environments')
-rw-r--r-- | app/assets/javascripts/environments/components/environment_stop.vue | 6 | ||||
-rw-r--r-- | app/assets/javascripts/environments/components/stop_environment_modal.vue | 48 |
2 files changed, 36 insertions, 18 deletions
diff --git a/app/assets/javascripts/environments/components/environment_stop.vue b/app/assets/javascripts/environments/components/environment_stop.vue index ff74f81c98e..8e100623199 100644 --- a/app/assets/javascripts/environments/components/environment_stop.vue +++ b/app/assets/javascripts/environments/components/environment_stop.vue @@ -4,7 +4,7 @@ * Used in environments table. */ -import { GlTooltipDirective, GlButton } from '@gitlab/ui'; +import { GlTooltipDirective, GlButton, GlModalDirective } from '@gitlab/ui'; import { s__ } from '~/locale'; import eventHub from '../event_hub'; @@ -14,6 +14,7 @@ export default { }, directives: { GlTooltip: GlTooltipDirective, + GlModalDirective, }, props: { environment: { @@ -54,14 +55,13 @@ export default { <template> <gl-button v-gl-tooltip="{ id: $options.stopEnvironmentTooltipId }" + v-gl-modal-directive="'stop-environment-modal'" :loading="isLoading" :title="title" :aria-label="title" icon="stop" category="primary" variant="danger" - data-toggle="modal" - data-target="#stop-environment-modal" @click="onClick" /> </template> diff --git a/app/assets/javascripts/environments/components/stop_environment_modal.vue b/app/assets/javascripts/environments/components/stop_environment_modal.vue index f0dafe0620e..0832822520d 100644 --- a/app/assets/javascripts/environments/components/stop_environment_modal.vue +++ b/app/assets/javascripts/environments/components/stop_environment_modal.vue @@ -1,15 +1,14 @@ <script> -/* eslint-disable @gitlab/vue-require-i18n-strings */ -import { GlSprintf, GlTooltipDirective } from '@gitlab/ui'; -import DeprecatedModal2 from '~/vue_shared/components/deprecated_modal_2.vue'; +import { GlSprintf, GlTooltipDirective, GlModal } from '@gitlab/ui'; import eventHub from '../event_hub'; +import { __, s__ } from '~/locale'; export default { id: 'stop-environment-modal', name: 'StopEnvironmentModal', components: { - GlModal: DeprecatedModal2, + GlModal, GlSprintf, }, @@ -24,6 +23,20 @@ export default { }, }, + computed: { + primaryProps() { + return { + text: s__('Environments|Stop environment'), + attributes: [{ variant: 'danger' }], + }; + }, + cancelProps() { + return { + text: __('Cancel'), + }; + }, + }, + methods: { onSubmit() { eventHub.$emit('stopEnvironment', this.environment); @@ -34,18 +47,23 @@ export default { <template> <gl-modal - :id="$options.id" - :footer-primary-button-text="s__('Environments|Stop environment')" - footer-primary-button-variant="danger" - @submit="onSubmit" + :modal-id="$options.id" + :action-primary="primaryProps" + :action-cancel="cancelProps" + @primary="onSubmit" > - <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"> - {{ environment.name }}? - </span> - </h4> + <template #modal-title> + <gl-sprintf :message="s__('Environments|Stopping %{environmentName}')"> + <template #environmentName> + <span + v-gl-tooltip + :title="environment.name" + class="gl-text-truncate gl-ml-2 gl-mr-2 gl-flex-fill" + > + {{ environment.name }}? + </span> + </template> + </gl-sprintf> </template> <p>{{ s__('Environments|Are you sure you want to stop this environment?') }}</p> |