diff options
Diffstat (limited to 'app/assets/javascripts/ci/pipeline_editor/components/code_snippet_alert/code_snippet_alert.vue')
-rw-r--r-- | app/assets/javascripts/ci/pipeline_editor/components/code_snippet_alert/code_snippet_alert.vue | 42 |
1 files changed, 42 insertions, 0 deletions
diff --git a/app/assets/javascripts/ci/pipeline_editor/components/code_snippet_alert/code_snippet_alert.vue b/app/assets/javascripts/ci/pipeline_editor/components/code_snippet_alert/code_snippet_alert.vue new file mode 100644 index 00000000000..7b33d98bca0 --- /dev/null +++ b/app/assets/javascripts/ci/pipeline_editor/components/code_snippet_alert/code_snippet_alert.vue @@ -0,0 +1,42 @@ +<script> +import { GlAlert } from '@gitlab/ui'; +import { CODE_SNIPPET_SOURCES, CODE_SNIPPET_SOURCE_SETTINGS } from './constants'; + +export default { + name: 'CodeSnippetAlert', + components: { + GlAlert, + }, + inject: ['configurationPaths'], + props: { + source: { + type: String, + required: true, + validator: (source) => CODE_SNIPPET_SOURCES.includes(source), + }, + }, + computed: { + settings() { + return CODE_SNIPPET_SOURCE_SETTINGS[this.source]; + }, + configurationPath() { + return this.configurationPaths[this.source]; + }, + }, +}; +</script> + +<template> + <gl-alert + variant="tip" + :title="__('Code snippet copied. Insert it in the correct location in the YAML file.')" + :dismiss-label="__('Dismiss')" + :primary-button-link="settings.docsPath" + :primary-button-text="__('Read documentation')" + :secondary-button-link="configurationPath" + :secondary-button-text="__('Go back to configuration')" + v-on="$listeners" + > + {{ __('Before inserting code, be sure to read the comment that separated each code group.') }} + </gl-alert> +</template> |