Creates mixin to hold data common to both environments apps

3 files changed, 30 insertions, 24 deletions

diff --git a/app/assets/javascripts/environments/components/environment.vue b/app/assets/javascripts/environments/components/environment.vue
index 5fad3fb9742..86d8fe89010 100644
--- a/app/assets/javascripts/environments/components/environment.vue
+++ b/app/assets/javascripts/environments/components/environment.vue
@@ -9,6 +9,7 @@ import tablePagination from '../../vue_shared/components/table_pagination.vue';
 import '../../lib/utils/common_utils';
 import eventHub from '../event_hub';
 import Poll from '../../lib/utils/poll';
+import environmentsMixin from '../mixins/environments_mixin';
 
 export default {
 
@@ -18,6 +19,10 @@ export default {
     loadingIcon,
   },
 
+  mixins: [
+    environmentsMixin,
+  ],
+
   data() {
     const environmentsData = document.querySelector('#environments-list-view').dataset;
     const store = new EnvironmentsStore();
@@ -169,19 +174,9 @@ export default {
     },
 
     successCallback(resp) {
-      const response = {
-        headers: resp.headers,
-        body: resp.json(),
-      };
-
-      this.isLoading = false;
-
-      this.store.storeAvailableCount(response.body.available_count);
-      this.store.storeStoppedCount(response.body.stopped_count);
-      this.store.storeEnvironments(response.body.environments);
-      this.store.setPagination(response.headers);
+      this.saveData(resp);
 
-      // If it were any open folders while polling we need to set them open again
+      // If folders are open while polling we need to open them again
       if (this.openFolders.length) {
         this.openFolders.map((folder) => {
           // TODO - Move this to the backend
diff --git a/app/assets/javascripts/environments/folder/environments_folder_view.vue b/app/assets/javascripts/environments/folder/environments_folder_view.vue
index 23a316e4a32..925503a01c4 100644
--- a/app/assets/javascripts/environments/folder/environments_folder_view.vue
+++ b/app/assets/javascripts/environments/folder/environments_folder_view.vue
@@ -8,8 +8,8 @@ import loadingIcon from '../../vue_shared/components/loading_icon.vue';
 import tablePagination from '../../vue_shared/components/table_pagination.vue';
 import Poll from '../../lib/utils/poll';
 import eventHub from '../event_hub';
+import environmentsMixin from '../mixins/environments_mixin';
 import '../../lib/utils/common_utils';
-import '../../vue_shared/vue_resource_interceptor';
 
 export default {
   components: {
@@ -18,6 +18,10 @@ export default {
     loadingIcon,
   },
 
+  mixins: [
+    environmentsMixin,
+  ],
+
   data() {
     const environmentsData = document.querySelector('#environments-folder-list-view').dataset;
     const store = new EnvironmentsStore();
@@ -139,17 +143,7 @@ export default {
     },
 
     successCallback(resp) {
-      const response = {
-        headers: resp.headers,
-        body: resp.json(),
-      };
-
-      this.isLoading = false;
-
-      this.store.storeAvailableCount(response.body.available_count);
-      this.store.storeStoppedCount(response.body.stopped_count);
-      this.store.storeEnvironments(response.body.environments);
-      this.store.setPagination(response.headers);
+      this.saveData(resp);
     },
 
     errorCallback() {
diff --git a/app/assets/javascripts/environments/mixins/environments_mixin.js b/app/assets/javascripts/environments/mixins/environments_mixin.js
new file mode 100644
index 00000000000..25b24fbd6dc
--- /dev/null
+++ b/app/assets/javascripts/environments/mixins/environments_mixin.js
@@ -0,0 +1,17 @@
+export default {
+  methods: {
+    saveData(resp) {
+      const response = {
+        headers: resp.headers,
+        body: resp.json(),
+      };
+
+      this.isLoading = false;
+
+      this.store.storeAvailableCount(response.body.available_count);
+      this.store.storeStoppedCount(response.body.stopped_count);
+      this.store.storeEnvironments(response.body.environments);
+      this.store.setPagination(response.headers);
+    },
+  },
+};