1 files changed, 27 insertions, 29 deletions
diff --git a/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue b/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue
index 18934af004a..560cdd941cd 100644
--- a/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue
+++ b/app/assets/javascripts/ide/components/commit_sidebar/list_item.vue
@@ -1,38 +1,36 @@
 <script>
-  import { mapActions } from 'vuex';
-  import icon from '~/vue_shared/components/icon.vue';
-  import router from '../../ide_router';
+import { mapActions } from 'vuex';
+import Icon from '~/vue_shared/components/icon.vue';
 
-  export default {
-    components: {
-      icon,
+export default {
+  components: {
+    Icon,
+  },
+  props: {
+    file: {
+      type: Object,
+      required: true,
     },
-    props: {
-      file: {
-        type: Object,
-        required: true,
-      },
+  },
+  computed: {
+    iconName() {
+      return this.file.tempFile ? 'file-addition' : 'file-modified';
     },
-    computed: {
-      iconName() {
-        return this.file.tempFile ? 'file-addition' : 'file-modified';
-      },
-      iconClass() {
-        return `multi-file-${this.file.tempFile ? 'addition' : 'modified'} append-right-8`;
-      },
+    iconClass() {
+      return `multi-file-${this.file.tempFile ? 'addition' : 'modified'} append-right-8`;
     },
-    methods: {
-      ...mapActions([
-        'discardFileChanges',
-        'updateViewer',
-      ]),
-      openFileInEditor(file) {
-        this.updateViewer('diff');
-
-        router.push(`/project${file.url}`);
-      },
+  },
+  methods: {
+    ...mapActions(['discardFileChanges', 'updateViewer', 'openPendingTab']),
+    openFileInEditor(file) {
+      return this.openPendingTab(file).then(changeViewer => {
+        if (changeViewer) {
+          this.updateViewer('diff');
+        }
+      });
     },
-  };
+  },
+};
 </script>
 
 <template>