1 files changed, 89 insertions, 0 deletions
diff --git a/app/assets/javascripts/ci/pipeline_editor/components/lint/ci_lint_results_value.vue b/app/assets/javascripts/ci/pipeline_editor/components/lint/ci_lint_results_value.vue
new file mode 100644
index 00000000000..ef2be2a5fba
--- /dev/null
+++ b/app/assets/javascripts/ci/pipeline_editor/components/lint/ci_lint_results_value.vue
@@ -0,0 +1,89 @@
+<script>
+import { isEmpty } from 'lodash';
+
+export default {
+  props: {
+    item: {
+      type: Object,
+      required: true,
+    },
+    dryRun: {
+      type: Boolean,
+      required: true,
+    },
+  },
+  computed: {
+    tagList() {
+      return this.item.tags?.join(', ');
+    },
+    onlyPolicy() {
+      return this.item.only ? this.item.only.refs.join(', ') : this.item.only;
+    },
+    exceptPolicy() {
+      return this.item.except ? this.item.except.refs.join(', ') : this.item.except;
+    },
+    scripts() {
+      return {
+        beforeScript: {
+          show: !isEmpty(this.item.beforeScript),
+          content: this.item.beforeScript?.join('\n'),
+        },
+        script: {
+          show: !isEmpty(this.item.script),
+          content: this.item.script?.join('\n'),
+        },
+        afterScript: {
+          show: !isEmpty(this.item.afterScript),
+          content: this.item.afterScript?.join('\n'),
+        },
+      };
+    },
+  },
+};
+</script>
+
+<template>
+  <div data-testid="ci-lint-value">
+    <pre
+      v-if="scripts.beforeScript.show"
+      class="gl-white-space-pre-wrap"
+      data-testid="ci-lint-before-script"
+      >{{ scripts.beforeScript.content }}</pre
+    >
+    <pre v-if="scripts.script.show" class="gl-white-space-pre-wrap" data-testid="ci-lint-script">{{
+      scripts.script.content
+    }}</pre>
+    <pre
+      v-if="scripts.afterScript.show"
+      class="gl-white-space-pre-wrap"
+      data-testid="ci-lint-after-script"
+      >{{ scripts.afterScript.content }}</pre
+    >
+
+    <ul class="gl-list-style-none gl-pl-0 gl-mb-0">
+      <li v-if="tagList">
+        <b>{{ __('Tag list:') }}</b>
+        {{ tagList }}
+      </li>
+      <div v-if="!dryRun" data-testid="ci-lint-only-except">
+        <li v-if="onlyPolicy">
+          <b>{{ __('Only policy:') }}</b>
+          {{ onlyPolicy }}
+        </li>
+        <li v-if="exceptPolicy">
+          <b>{{ __('Except policy:') }}</b>
+          {{ exceptPolicy }}
+        </li>
+      </div>
+      <li v-if="item.environment">
+        <b>{{ __('Environment:') }}</b>
+        {{ item.environment }}
+      </li>
+      <li v-if="item.when">
+        <b>{{ __('When:') }}</b>
+        {{ item.when }}
+        <b v-if="item.allowFailure">{{ __('Allowed to fail') }}</b>
+      </li>
+    </ul>
+  </div>
+</template>