diff --git a/app/assets/javascripts/vue_shared/components/reports/constants.js b/app/assets/javascripts/vue_shared/components/reports/constants.js
new file mode 100644
index 00000000000..dbde648bfdb
--- /dev/null
+++ b/app/assets/javascripts/vue_shared/components/reports/constants.js
@@ -0,0 +1,3 @@
+export const STATUS_FAILED = 'failed';
+export const STATUS_SUCCESS = 'success';
+export const STATUS_NEUTRAL = 'neutral';
diff --git a/app/assets/javascripts/vue_shared/components/reports/issue_body.js b/app/assets/javascripts/vue_shared/components/reports/issue_body.js
new file mode 100644
index 00000000000..f2141e519da
--- /dev/null
+++ b/app/assets/javascripts/vue_shared/components/reports/issue_body.js
@@ -0,0 +1,3 @@
+export const components = {};
+
+export const componentNames = {};
diff --git a/app/assets/javascripts/vue_shared/components/reports/issue_status_icon.vue b/app/assets/javascripts/vue_shared/components/reports/issue_status_icon.vue
new file mode 100644
index 00000000000..f8189117ac3
--- /dev/null
+++ b/app/assets/javascripts/vue_shared/components/reports/issue_status_icon.vue
@@ -0,0 +1,58 @@
+
+
+
+
+
+
diff --git a/app/assets/javascripts/vue_shared/components/reports/issues_list.vue b/app/assets/javascripts/vue_shared/components/reports/issues_list.vue
index e1e03e39ee0..04b09c00be1 100644
--- a/app/assets/javascripts/vue_shared/components/reports/issues_list.vue
+++ b/app/assets/javascripts/vue_shared/components/reports/issues_list.vue
@@ -1,5 +1,10 @@
@@ -52,20 +36,17 @@ export default {
:key="index"
class="report-block-list-issue"
>
-
-
-
+
+
diff --git a/app/assets/javascripts/vue_shared/components/reports/report_section.vue b/app/assets/javascripts/vue_shared/components/reports/report_section.vue
index d383ed99a0c..be09f3ebe03 100644
--- a/app/assets/javascripts/vue_shared/components/reports/report_section.vue
+++ b/app/assets/javascripts/vue_shared/components/reports/report_section.vue
@@ -21,7 +21,7 @@ export default {
required: false,
default: false,
},
- type: {
+ component: {
type: String,
required: false,
default: '',
@@ -149,7 +149,7 @@ export default {
:status="statusIconName"
/>
diff --git a/spec/javascripts/vue_shared/components/reports/report_issues_spec.js b/spec/javascripts/vue_shared/components/reports/report_issues_spec.js
deleted file mode 100644
index e69de29bb2d..00000000000
diff --git a/spec/javascripts/vue_shared/components/reports/report_section_spec.js b/spec/javascripts/vue_shared/components/reports/report_section_spec.js
index 07401181ffd..8d5401a9d89 100644
--- a/spec/javascripts/vue_shared/components/reports/report_section_spec.js
+++ b/spec/javascripts/vue_shared/components/reports/report_section_spec.js
@@ -23,7 +23,7 @@ describe('Report section', () => {
describe('computed', () => {
beforeEach(() => {
vm = mountComponent(ReportSection, {
- type: 'codequality',
+ component: '',
status: 'SUCCESS',
loadingText: 'Loading codeclimate report',
errorText: 'foo',
@@ -89,7 +89,7 @@ describe('Report section', () => {
describe('when it is loading', () => {
it('should render loading indicator', () => {
vm = mountComponent(ReportSection, {
- type: 'codequality',
+ component: '',
status: 'LOADING',
loadingText: 'Loading codeclimate report',
errorText: 'foo',
@@ -103,7 +103,7 @@ describe('Report section', () => {
describe('with success status', () => {
beforeEach(() => {
vm = mountComponent(ReportSection, {
- type: 'codequality',
+ component: '',
status: 'SUCCESS',
loadingText: 'Loading codeclimate report',
errorText: 'foo',
@@ -161,7 +161,7 @@ describe('Report section', () => {
describe('with failed request', () => {
it('should render error indicator', () => {
vm = mountComponent(ReportSection, {
- type: 'codequality',
+ component: '',
status: 'ERROR',
loadingText: 'Loading codeclimate report',
errorText: 'Failed to load codeclimate report',