1 files changed, 60 insertions, 0 deletions
diff --git a/app/assets/javascripts/ide/components/branches/item.vue b/app/assets/javascripts/ide/components/branches/item.vue
new file mode 100644
index 00000000000..cc3e84e3f77
--- /dev/null
+++ b/app/assets/javascripts/ide/components/branches/item.vue
@@ -0,0 +1,60 @@
+<script>
+import Icon from '~/vue_shared/components/icon.vue';
+import Timeago from '~/vue_shared/components/time_ago_tooltip.vue';
+import router from '../../ide_router';
+
+export default {
+  components: {
+    Icon,
+    Timeago,
+  },
+  props: {
+    item: {
+      type: Object,
+      required: true,
+    },
+    projectId: {
+      type: String,
+      required: true,
+    },
+    isActive: {
+      type: Boolean,
+      required: false,
+      default: false,
+    },
+  },
+  computed: {
+    branchHref() {
+      return router.resolve(`/project/${this.projectId}/edit/${this.item.name}`).href;
+    },
+  },
+};
+</script>
+
+<template>
+  <a
+    :href="branchHref"
+    class="btn-link d-flex align-items-center"
+  >
+    <span class="d-flex append-right-default ide-search-list-current-icon">
+      <icon
+        v-if="isActive"
+        :size="18"
+        name="mobile-issue-close"
+      />
+    </span>
+    <span>
+      <strong>
+        {{ item.name }}
+      </strong>
+      <span
+        class="ide-merge-request-project-path d-block mt-1"
+      >
+        Updated
+        <timeago
+          :time="item.committedDate || ''"
+        />
+      </span>
+    </span>
+  </a>
+</template>