IDE trigger files change eventce-5276-2-update-stores-for-terminal-file-sync

- On CMD+S when editor is focused
- On editor blur
- When file is created in tree
- When file is removed in tree
- When file is renamed in tree

6 files changed, 39 insertions, 2 deletions

diff --git a/app/assets/javascripts/ide/components/repo_editor.vue b/app/assets/javascripts/ide/components/repo_editor.vue
index e15b2a6f76b..b0c4969c5e4 100644
--- a/app/assets/javascripts/ide/components/repo_editor.vue
+++ b/app/assets/javascripts/ide/components/repo_editor.vue
@@ -125,6 +125,7 @@ export default {
       'setFileEOL',
       'updateViewer',
       'removePendingTab',
+      'triggerFilesChange',
     ]),
     initEditor() {
       if (this.shouldHideEditor) return;
@@ -256,6 +257,7 @@ export default {
         'is-added': file.tempFile,
       }"
       class="multi-file-editor-holder"
+      @focusout="triggerFilesChange"
     ></div>
     <content-viewer
       v-if="showContentViewer"
diff --git a/app/assets/javascripts/ide/lib/keymap.json b/app/assets/javascripts/ide/lib/keymap.json
index 131abfebbed..2db87c07dde 100644
--- a/app/assets/javascripts/ide/lib/keymap.json
+++ b/app/assets/javascripts/ide/lib/keymap.json
@@ -7,5 +7,13 @@
       "name": "toggleFileFinder",
       "params": true
     }
+  },
+  {
+    "id": "save-files",
+    "label": "Save files",
+    "bindings": ["CtrlCmd+KEY_S"],
+    "action": {
+      "name": "triggerFilesChange"
+    }
   }
 ]
diff --git a/app/assets/javascripts/ide/stores/actions.js b/app/assets/javascripts/ide/stores/actions.js
index dc8ca732879..5429b834708 100644
--- a/app/assets/javascripts/ide/stores/actions.js
+++ b/app/assets/javascripts/ide/stores/actions.js
@@ -99,6 +99,7 @@ export const createTempEntry = (
       commit(types.TOGGLE_FILE_OPEN, file.path);
       commit(types.ADD_FILE_TO_CHANGED, file.path);
       dispatch('setFileActive', file.path);
+      dispatch('triggerFilesChange');
     }
 
     if (parentPath && !state.entries[parentPath].opened) {
@@ -210,6 +211,8 @@ export const deleteEntry = ({ commit, dispatch, state }, path) => {
   if (entry.parentPath && state.entries[entry.parentPath].tree.length === 0) {
     dispatch('deleteEntry', entry.parentPath);
   }
+
+  dispatch('triggerFilesChange');
 };
 
 export const resetOpenFiles = ({ commit }) => commit(types.RESET_OPEN_FILES);
@@ -240,6 +243,8 @@ export const renameEntry = (
   if (!entryPath && !entry.tempFile) {
     dispatch('deleteEntry', path);
   }
+
+  dispatch('triggerFilesChange');
 };
 
 export const getBranchData = ({ commit, state }, { projectId, branchId, force = false } = {}) =>
diff --git a/app/assets/javascripts/ide/stores/actions/file.js b/app/assets/javascripts/ide/stores/actions/file.js
index e7e8ac6d80b..dc40a1fa6a2 100644
--- a/app/assets/javascripts/ide/stores/actions/file.js
+++ b/app/assets/javascripts/ide/stores/actions/file.js
@@ -265,3 +265,8 @@ export const removePendingTab = ({ commit }, file) => {
 
   eventHub.$emit(`editor.update.model.dispose.${file.key}`);
 };
+
+export const triggerFilesChange = () => {
+  // Used in EE for file mirroring
+  eventHub.$emit('ide.files.change');
+};
diff --git a/spec/javascripts/ide/stores/actions/file_spec.js b/spec/javascripts/ide/stores/actions/file_spec.js
index e6fb08bcc49..dd2313dc800 100644
--- a/spec/javascripts/ide/stores/actions/file_spec.js
+++ b/spec/javascripts/ide/stores/actions/file_spec.js
@@ -719,4 +719,20 @@ describe('IDE store file actions', () => {
         .catch(done.fail);
     });
   });
+
+  describe('triggerFilesChange', () => {
+    beforeEach(() => {
+      spyOn(eventHub, '$emit');
+    });
+
+    it('emits event that files have changed', done => {
+      store
+        .dispatch('triggerFilesChange')
+        .then(() => {
+          expect(eventHub.$emit).toHaveBeenCalledWith('ide.files.change');
+        })
+        .then(done)
+        .catch(done.fail);
+    });
+  });
 });
diff --git a/spec/javascripts/ide/stores/actions_spec.js b/spec/javascripts/ide/stores/actions_spec.js
index 04e236fb042..37354283cab 100644
--- a/spec/javascripts/ide/stores/actions_spec.js
+++ b/spec/javascripts/ide/stores/actions_spec.js
@@ -488,7 +488,7 @@ describe('Multi-file store actions', () => {
         'path',
         store.state,
         [{ type: types.DELETE_ENTRY, payload: 'path' }],
-        [{ type: 'burstUnusedSeal' }],
+        [{ type: 'burstUnusedSeal' }, { type: 'triggerFilesChange' }],
         done,
       );
     });
@@ -510,7 +510,7 @@ describe('Multi-file store actions', () => {
             payload: { path: 'test', name: 'new-name', entryPath: null, parentPath: 'parent-path' },
           },
         ],
-        [{ type: 'deleteEntry', payload: 'test' }],
+        [{ type: 'deleteEntry', payload: 'test' }, { type: 'triggerFilesChange' }],
         done,
       );
     });
@@ -558,6 +558,7 @@ describe('Multi-file store actions', () => {
             },
           },
           { type: 'deleteEntry', payload: 'test' },
+          { type: 'triggerFilesChange' },
         ],
         done,
       );