diff options
Diffstat (limited to 'app/assets/javascripts/ci_variable_list/components/ci_variable_modal.vue')
-rw-r--r-- | app/assets/javascripts/ci_variable_list/components/ci_variable_modal.vue | 43 |
1 files changed, 39 insertions, 4 deletions
diff --git a/app/assets/javascripts/ci_variable_list/components/ci_variable_modal.vue b/app/assets/javascripts/ci_variable_list/components/ci_variable_modal.vue index 94f8cb9e906..00177539cdc 100644 --- a/app/assets/javascripts/ci_variable_list/components/ci_variable_modal.vue +++ b/app/assets/javascripts/ci_variable_list/components/ci_variable_modal.vue @@ -29,6 +29,7 @@ import { ENVIRONMENT_SCOPE_LINK_TITLE, EVENT_LABEL, EVENT_ACTION, + EXPANDED_VARIABLES_NOTE, EDIT_VARIABLE_ACTION, VARIABLE_ACTIONS, variableOptions, @@ -46,6 +47,7 @@ export default { awsTipMessage: AWS_TIP_MESSAGE, containsVariableReferenceMessage: CONTAINS_VARIABLE_REFERENCE_MESSAGE, environmentScopeLinkTitle: ENVIRONMENT_SCOPE_LINK_TITLE, + expandedVariablesNote: EXPANDED_VARIABLES_NOTE, components: { CiEnvironmentsDropdown, GlAlert, @@ -127,7 +129,7 @@ export default { }, containsVariableReference() { const regex = /\$/; - return regex.test(this.variable.value); + return regex.test(this.variable.value) && this.isExpanded; }, displayMaskedError() { return !this.canMask && this.variable.masked; @@ -135,6 +137,9 @@ export default { isEditing() { return this.mode === EDIT_VARIABLE_ACTION; }, + isExpanded() { + return !this.variable.raw; + }, isTipVisible() { return !this.isTipDismissed && AWS_TOKEN_CONSTANTS.includes(this.variable.key); }, @@ -208,6 +213,9 @@ export default { hideModal() { this.$refs.modal.hide(); }, + onShow() { + this.setVariableProtectedByDefault(); + }, resetModalHandler() { this.resetVariableData(); this.resetValidationErrorEvents(); @@ -220,6 +228,9 @@ export default { setEnvironmentScope(scope) { this.variable = { ...this.variable, environmentScope: scope }; }, + setVariableRaw(expanded) { + this.variable = { ...this.variable, raw: !expanded }; + }, setVariableProtected() { this.variable = { ...this.variable, protected: true }; }, @@ -275,7 +286,7 @@ export default { static lazy @hidden="resetModalHandler" - @shown="setVariableProtectedByDefault" + @shown="onShow" > <form> <gl-form-combobox @@ -304,6 +315,13 @@ export default { class="gl-font-monospace!" spellcheck="false" /> + <p + v-if="variable.raw" + class="gl-mt-2 gl-mb-0 text-secondary" + data-testid="raw-variable-tip" + > + {{ __('Variable value will be evaluated as raw string.') }} + </p> </gl-form-group> <div class="gl-display-flex"> @@ -361,7 +379,6 @@ export default { {{ __('Export variable to pipelines running on protected branches and tags only.') }} </p> </gl-form-checkbox> - <gl-form-checkbox ref="masked-ci-variable" v-model="variable.masked" @@ -371,7 +388,7 @@ export default { <gl-link target="_blank" :href="maskedEnvironmentVariablesLink"> <gl-icon name="question" :size="12" /> </gl-link> - <p class="gl-mt-2 gl-mb-0 text-secondary"> + <p class="gl-mt-2 text-secondary"> {{ __('Variable will be masked in job logs.') }} <span :class="{ @@ -385,6 +402,24 @@ export default { }}</gl-link> </p> </gl-form-checkbox> + <gl-form-checkbox + ref="expanded-ci-variable" + :checked="isExpanded" + data-testid="ci-variable-expanded-checkbox" + @change="setVariableRaw" + > + {{ __('Expand variable reference') }} + <gl-link target="_blank" :href="containsVariableReferenceLink"> + <gl-icon name="question" :size="12" /> + </gl-link> + <p class="gl-mt-2 gl-mb-0 gl-text-secondary"> + <gl-sprintf :message="$options.expandedVariablesNote"> + <template #code="{ content }"> + <code>{{ content }}</code> + </template> + </gl-sprintf> + </p> + </gl-form-checkbox> </gl-form-group> </form> <gl-collapse :visible="isTipVisible"> |