fixed icon in tabs not updating correctlyide-delete-entries

6 files changed, 33 insertions, 10 deletions

diff --git a/app/assets/javascripts/ide/components/changed_file_icon.vue b/app/assets/javascripts/ide/components/changed_file_icon.vue
index 60381bddc68..368af8b5e95 100644
--- a/app/assets/javascripts/ide/components/changed_file_icon.vue
+++ b/app/assets/javascripts/ide/components/changed_file_icon.vue
@@ -44,15 +44,12 @@ export default {
       return commitItemIconMap.modified;
     },
     changedIcon() {
-      const suffix = this.file.staged && !this.showStagedIcon ? '-solid' : '';
+      const suffix = !this.file.changed && this.file.staged && !this.showStagedIcon ? '-solid' : '';
 
       if (this.forceModifiedIcon) return `file-modified${suffix}`;
 
       return `${this.commitItemIcon.icon}${suffix}`;
     },
-    stagedIcon() {
-      return `${this.changedIcon}-solid`;
-    },
     changedIconClass() {
       return `ide-${this.changedIcon} float-left`;
     },
diff --git a/app/assets/javascripts/ide/components/ide_review.vue b/app/assets/javascripts/ide/components/ide_review.vue
index ae85a147071..d09c99050fe 100644
--- a/app/assets/javascripts/ide/components/ide_review.vue
+++ b/app/assets/javascripts/ide/components/ide_review.vue
@@ -10,7 +10,7 @@ export default {
     EditorModeDropdown,
   },
   computed: {
-    ...mapGetters(['currentMergeRequest']),
+    ...mapGetters(['currentMergeRequest', 'activeFile']),
     ...mapState(['viewer', 'currentMergeRequestId']),
     showLatestChangesText() {
       return !this.currentMergeRequestId || this.viewer === viewerTypes.diff;
@@ -23,12 +23,20 @@ export default {
     },
   },
   mounted() {
+    if (this.activeFile && this.activeFile.pending && !this.activeFile.deleted) {
+      this.$router.push(`/project${this.activeFile.url}`, () => {
+        this.updateViewer('editor');
+      });
+    } else if (this.activeFile && this.activeFile.deleted) {
+      this.resetOpenFiles();
+    }
+
     this.$nextTick(() => {
       this.updateViewer(this.currentMergeRequestId ? viewerTypes.mr : viewerTypes.diff);
     });
   },
   methods: {
-    ...mapActions(['updateViewer']),
+    ...mapActions(['updateViewer', 'resetOpenFiles']),
   },
 };
 </script>
diff --git a/app/assets/javascripts/ide/components/ide_tree.vue b/app/assets/javascripts/ide/components/ide_tree.vue
index e15990d987c..e996dd9059e 100644
--- a/app/assets/javascripts/ide/components/ide_tree.vue
+++ b/app/assets/javascripts/ide/components/ide_tree.vue
@@ -17,14 +17,18 @@ export default {
     ...mapGetters(['currentProject', 'currentTree', 'activeFile']),
   },
   mounted() {
-    if (this.activeFile && this.activeFile.pending && !this.activeFile.deleted) {
+    if (!this.activeFile) return;
+
+    if (this.activeFile.pending && !this.activeFile.deleted) {
       this.$router.push(`/project${this.activeFile.url}`, () => {
         this.updateViewer('editor');
       });
+    } else if (this.activeFile.deleted) {
+      this.resetOpenFiles();
     }
   },
   methods: {
-    ...mapActions(['updateViewer', 'openNewEntryModal', 'createTempEntry']),
+    ...mapActions(['updateViewer', 'openNewEntryModal', 'createTempEntry', 'resetOpenFiles']),
   },
 };
 </script>
diff --git a/app/assets/javascripts/ide/components/repo_tab.vue b/app/assets/javascripts/ide/components/repo_tab.vue
index 0ea5f744888..db47b75ec5c 100644
--- a/app/assets/javascripts/ide/components/repo_tab.vue
+++ b/app/assets/javascripts/ide/components/repo_tab.vue
@@ -71,7 +71,8 @@ export default {
 <template>
   <li
     :class="{
-      active: tab.active
+      active: tab.active,
+      disabled: tab.pending
     }"
     @click="clickFile(tab)"
     @mouseover="mouseOverTab"
diff --git a/app/assets/javascripts/ide/stores/actions.js b/app/assets/javascripts/ide/stores/actions.js
index de901bb179b..2765acada48 100644
--- a/app/assets/javascripts/ide/stores/actions.js
+++ b/app/assets/javascripts/ide/stores/actions.js
@@ -191,6 +191,8 @@ export const deleteEntry = ({ commit, dispatch, state }, path) => {
   commit(types.DELETE_ENTRY, path);
 };
 
+export const resetOpenFiles = ({ commit }) => commit(types.RESET_OPEN_FILES);
+
 export * from './actions/tree';
 export * from './actions/file';
 export * from './actions/project';
diff --git a/app/assets/stylesheets/pages/repo.scss b/app/assets/stylesheets/pages/repo.scss
index fdb05a99df7..f45366ad4df 100644
--- a/app/assets/stylesheets/pages/repo.scss
+++ b/app/assets/stylesheets/pages/repo.scss
@@ -162,12 +162,23 @@
       background-color: $white-light;
       border-bottom-color: $white-light;
     }
+
+    &:not(.disabled) {
+      .multi-file-tab {
+        cursor: pointer;
+      }
+    }
+
+    &.disabled {
+      .multi-file-tab-close {
+        cursor: default;
+      }
+    }
   }
 }
 
 .multi-file-tab {
   @include str-truncated(141px);
-  cursor: pointer;
 
   svg {
     vertical-align: middle;