1 files changed, 36 insertions, 0 deletions
diff --git a/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_status_icon.js b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_status_icon.js
new file mode 100644
index 00000000000..b01c923311b
--- /dev/null
+++ b/app/assets/javascripts/vue_merge_request_widget/components/mr_widget_status_icon.js
@@ -0,0 +1,36 @@
+import ciIcon from '../../vue_shared/components/ci_icon.vue';
+import loadingIcon from '../../vue_shared/components/loading_icon.vue';
+
+export default {
+  props: {
+    status: { type: String, required: true },
+    showDisabledButton: { type: Boolean, required: false },
+  },
+  components: {
+    ciIcon,
+    loadingIcon,
+  },
+  computed: {
+    statusObj() {
+      return {
+        group: this.status,
+        icon: `icon_status_${this.status}`,
+      };
+    },
+  },
+  template: `
+    <div class="space-children flex-container-block append-right-10">
+      <div v-if="status === 'loading'" class="mr-widget-icon">
+        <loading-icon />
+      </div>
+      <ci-icon v-else :status="statusObj" />
+      <button
+        v-if="showDisabledButton"
+        type="button"
+        class="btn btn-success btn-small"
+        disabled="true">
+        Merge
+      </button>
+    </div>
+  `,
+};