Commit ce93532a authored by Kev's avatar Kev

Replace sprintf with GlSprintf component

parent 72bda3c5
...@@ -10,7 +10,7 @@ import { ...@@ -10,7 +10,7 @@ import {
GlIcon, GlIcon,
GlSafeHtmlDirective as SafeHtml, GlSafeHtmlDirective as SafeHtml,
} from '@gitlab/ui'; } from '@gitlab/ui';
import { s__, __, sprintf } from '~/locale'; import { s__, __ } from '~/locale';
import ModalCopyButton from '~/vue_shared/components/modal_copy_button.vue'; import ModalCopyButton from '~/vue_shared/components/modal_copy_button.vue';
import Callout from '~/vue_shared/components/callout.vue'; import Callout from '~/vue_shared/components/callout.vue';
...@@ -112,20 +112,6 @@ export default { ...@@ -112,20 +112,6 @@ export default {
} }
: null; : null;
}, },
helpText() {
return sprintf(
s__(
'FeatureFlags|Install a %{docs_link_anchored_start}compatible client library%{docs_link_anchored_end} and specify the API URL, application name, and instance ID during the configuration setup. %{docs_link_start}More Information%{docs_link_end}',
),
{
docs_link_anchored_start: `<a href="${this.helpClientLibrariesPath}" target="_blank">`,
docs_link_anchored_end: '</a>',
docs_link_start: `<a href="${this.helpPath}" target="_blank">`,
docs_link_end: '</a>',
},
false,
);
},
}, },
methods: { methods: {
...@@ -151,7 +137,23 @@ export default { ...@@ -151,7 +137,23 @@ export default {
<template #modal-title> <template #modal-title>
{{ $options.modalTitle }} {{ $options.modalTitle }}
</template> </template>
<p v-safe-html="helpText"></p> <p>
<gl-sprintf
:message="
s__(
'FeatureFlags|Install a %{docsLinkAnchoredStart}compatible client library%{docsLinkAnchoredEnd} and specify the API URL, application name, and instance ID during the configuration setup. %{docsLinkStart}More Information%{docsLinkEnd}',
)
"
>
<template #docsLinkAnchored="{ content }">
<gl-link :href="helpClientLibrariesPath" target="_blank">{{ content }}</gl-link>
</template>
<template #docsLink="{ content }">
<gl-link :href="helpPath" target="_blank">{{ content }}</gl-link>
</template>
</gl-sprintf>
</p>
<callout category="warning"> <callout category="warning">
<gl-sprintf <gl-sprintf
:message=" :message="
......
...@@ -75,9 +75,9 @@ describe('Configure Feature Flags Modal', () => { ...@@ -75,9 +75,9 @@ describe('Configure Feature Flags Modal', () => {
it('should have links to the documentation', () => { it('should have links to the documentation', () => {
const help = wrapper.find('p'); const help = wrapper.find('p');
const link = help.find('a[href="/help/path"]'); const link = help.find('gl-link-stub[href="/help/path"]');
expect(link.exists()).toBe(true); expect(link.exists()).toBe(true);
const anchoredLink = help.find('a[href="/help/path/#flags"]'); const anchoredLink = help.find('gl-link-stub[href="/help/path/#flags"]');
expect(anchoredLink.exists()).toBe(true); expect(anchoredLink.exists()).toBe(true);
}); });
......
Markdown is supported
0%
or
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment