diff options
Diffstat (limited to 'app/assets/javascripts/pages/projects/labels/components')
-rw-r--r-- | app/assets/javascripts/pages/projects/labels/components/promote_label_modal.vue | 41 |
1 files changed, 24 insertions, 17 deletions
diff --git a/app/assets/javascripts/pages/projects/labels/components/promote_label_modal.vue b/app/assets/javascripts/pages/projects/labels/components/promote_label_modal.vue index 08078fa6b62..f58e4909a08 100644 --- a/app/assets/javascripts/pages/projects/labels/components/promote_label_modal.vue +++ b/app/assets/javascripts/pages/projects/labels/components/promote_label_modal.vue @@ -1,7 +1,7 @@ <script> -import { escape } from 'lodash'; +import { GlSprintf } from '@gitlab/ui'; import axios from '~/lib/utils/axios_utils'; -import createFlash from '~/flash'; +import { deprecatedCreateFlash as createFlash } from '~/flash'; import DeprecatedModal2 from '~/vue_shared/components/deprecated_modal_2.vue'; import { s__, sprintf } from '~/locale'; import { visitUrl } from '~/lib/utils/url_utility'; @@ -10,6 +10,7 @@ import eventHub from '../event_hub'; export default { components: { GlModal: DeprecatedModal2, + GlSprintf, }, props: { url: { @@ -45,20 +46,6 @@ export default { }, ); }, - title() { - const label = `<span - class="label color-label" - style="background-color: ${this.labelColor}; color: ${this.labelTextColor};" - >${escape(this.labelTitle)}</span>`; - - return sprintf( - s__('Labels|<span>Promote label</span> %{labelTitle} <span>to Group Label?</span>'), - { - labelTitle: label, - }, - false, - ); - }, }, methods: { onSubmit() { @@ -90,7 +77,27 @@ export default { footer-primary-button-variant="warning" @submit="onSubmit" > - <div slot="title" class="modal-title-with-label" v-html="title"></div> + <div slot="title" class="modal-title-with-label"> + <gl-sprintf + :message=" + s__( + 'Labels|%{spanStart}Promote label%{spanEnd} %{labelTitle} %{spanStart}to Group Label?%{spanEnd}', + ) + " + > + <template #labelTitle> + <span + class="label color-label" + :style="`background-color: ${labelColor}; color: ${labelTextColor};`" + > + {{ labelTitle }} + </span> + </template> + <template #span="{ content }" + ><span>{{ content }}</span></template + > + </gl-sprintf> + </div> {{ text }} </gl-modal> |