1 files changed, 30 insertions, 0 deletions
diff --git a/app/assets/javascripts/pipeline_editor/components/header/pipeline_editor_header.vue b/app/assets/javascripts/pipeline_editor/components/header/pipeline_editor_header.vue
new file mode 100644
index 00000000000..ab41c0170e9
--- /dev/null
+++ b/app/assets/javascripts/pipeline_editor/components/header/pipeline_editor_header.vue
@@ -0,0 +1,30 @@
+<script>
+import ValidationSegment from './validation_segment.vue';
+
+export default {
+  validationSegmentClasses:
+    'gl-p-5 gl-bg-gray-10 gl-border-solid gl-border-1 gl-border-gray-100 gl-rounded-base',
+  components: {
+    ValidationSegment,
+  },
+  props: {
+    ciConfigData: {
+      type: Object,
+      required: true,
+    },
+    isCiConfigDataLoading: {
+      type: Boolean,
+      required: true,
+    },
+  },
+};
+</script>
+<template>
+  <div class="gl-mb-5">
+    <validation-segment
+      :class="$options.validationSegmentClasses"
+      :loading="isCiConfigDataLoading"
+      :ci-config="ciConfigData"
+    />
+  </div>
+</template>