added ability to have `head` file to compare against

fixed files getting into an opened & active state when it shouldnt

app/assets/javascripts/ide/components/repo_editor.vue

@@ -14,7 +14,7 @@ export default {
   },
   computed: {
     ...mapState(['leftPanelCollapsed', 'rightPanelCollapsed', 'viewer', 'delayViewerUpdated']),
-    ...mapGetters(['currentMergeRequest']),
+    ...mapGetters(['currentMergeRequest', 'getStagedFile']),
     shouldHideEditor() {
       return this.file && this.file.binary && !this.file.raw;
     },
@@ -101,7 +101,12 @@ export default {
     setupEditor() {
       if (!this.file || !this.editor.instance) return;
 
-      this.model = this.editor.createModel(this.file);
+      const head = this.getStagedFile(this.file.path);
+
+      this.model = this.editor.createModel(
+        this.file,
+        this.file.staged && this.file.key.indexOf('unstaged-') === 0 ? head : null,
+      );
 
       if (this.viewer === 'mrdiff') {
         this.editor.attachMergeRequestModel(this.model);

app/assets/javascripts/ide/lib/common/model.js

@@ -3,15 +3,16 @@ import Disposable from './disposable';
 import eventHub from '../../eventhub';
 
 export default class Model {
-  constructor(monaco, file) {
+  constructor(monaco, file, head = null) {
     this.monaco = monaco;
     this.disposable = new Disposable();
     this.file = file;
+    this.head = head;
     this.content = file.content !== '' ? file.content : file.raw;
 
     this.disposable.add(
       (this.originalModel = this.monaco.editor.createModel(
-        this.file.raw,
+        head ? head.content : this.file.raw,
         undefined,
         new this.monaco.Uri(null, null, `original/${this.file.key}`),
       )),

app/assets/javascripts/ide/lib/common/model_manager.js

@@ -17,12 +17,12 @@ export default class ModelManager {
     return this.models.get(key);
   }
 
-  addModel(file) {
+  addModel(file, head = null) {
     if (this.hasCachedModel(file.key)) {
       return this.getModel(file.key);
     }
 
-    const model = new Model(this.monaco, file);
+    const model = new Model(this.monaco, file, head);
     this.models.set(model.path, model);
     this.disposable.add(model);
 

app/assets/javascripts/ide/lib/editor.js

@@ -76,8 +76,8 @@ export default class Editor {
     }
   }
 
-  createModel(file) {
-    return this.modelManager.addModel(file);
+  createModel(file, head = null) {
+    return this.modelManager.addModel(file, head);
   }
 
   attachModel(model) {

app/assets/javascripts/ide/stores/getters.js

@@ -41,3 +41,5 @@ export const collapseButtonTooltip = state =>
   state.rightPanelCollapsed ? __('Expand sidebar') : __('Collapse sidebar');
 
 export const hasMergeRequest = state => !!state.currentMergeRequestId;
+
+export const getStagedFile = state => path => state.stagedFiles.find(f => f.path === path);

app/assets/javascripts/ide/stores/mutations/file.js

@@ -132,6 +132,8 @@ export default {
       Object.assign(state.entries[path], {
         ...stagedFile,
         key: state.entries[path].key,
+        active: state.entries[path].active,
+        opened: state.entries[path].opened,
         changed: true,
       });
 
@@ -157,9 +159,7 @@ export default {
   [types.ADD_PENDING_TAB](state, { file, keyPrefix = 'pending' }) {
     const key = `${keyPrefix}-${file.key}`;
     const pendingTab = state.openFiles.find(f => f.key === key && f.pending);
-    let openFiles = state.openFiles.map(f =>
-      Object.assign(f, { active: f.key === key, opened: false }),
-    );
+    let openFiles = state.openFiles.map(f => Object.assign(f, { active: false, opened: false }));
 
     if (!pendingTab) {
       const openFile = openFiles.find(f => f.path === file.path);