1 files changed, 28 insertions, 23 deletions
diff --git a/app/assets/javascripts/repo/components/repo_tab.vue b/app/assets/javascripts/repo/components/repo_tab.vue
index 0d0c34ec741..098715915b0 100644
--- a/app/assets/javascripts/repo/components/repo_tab.vue
+++ b/app/assets/javascripts/repo/components/repo_tab.vue
@@ -26,11 +26,13 @@ const RepoTab = {
   },
 
   methods: {
-    tabClicked: Store.setActiveFiles,
-
+    tabClicked(file) {
+      Store.setActiveFiles(file);
+    },
     closeTab(file) {
       if (file.changed) return;
-      this.$emit('tabclosed', file);
+
+      Store.removeFromOpenedFiles(file);
     },
   },
 };
@@ -39,25 +41,28 @@ export default RepoTab;
 </script>
 
 <template>
-<li @click="tabClicked(tab)">
-  <a
-    href="#0"
-    class="close"
-    @click.stop.prevent="closeTab(tab)"
-    :aria-label="closeLabel">
-    <i
-      class="fa"
-      :class="changedClass"
-      aria-hidden="true">
-    </i>
-  </a>
+  <li
+    :class="{ active : tab.active }"
+    @click="tabClicked(tab)"
+  >
+    <button
+      type="button"
+      class="close-btn"
+      @click.stop.prevent="closeTab(tab)"
+      :aria-label="closeLabel">
+      <i
+        class="fa"
+        :class="changedClass"
+        aria-hidden="true">
+      </i>
+    </button>
 
-  <a
-    href="#"
-    class="repo-tab"
-    :title="tab.url"
-    @click.prevent="tabClicked(tab)">
-    {{tab.name}}
-  </a>
-</li>
+    <a
+      href="#"
+      class="repo-tab"
+      :title="tab.url"
+      @click.prevent="tabClicked(tab)">
+      {{tab.name}}
+    </a>
+  </li>
 </template>