Add latest changes from gitlab-org/gitlab@master

12 files changed, 86 insertions, 66 deletions

diff --git a/app/assets/javascripts/create_cluster/eks_cluster/components/eks_cluster_configuration_form.vue b/app/assets/javascripts/create_cluster/eks_cluster/components/eks_cluster_configuration_form.vue
index a700069d2c8..7ed51068d42 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/components/eks_cluster_configuration_form.vue
+++ b/app/assets/javascripts/create_cluster/eks_cluster/components/eks_cluster_configuration_form.vue
@@ -1,11 +1,14 @@
 <script>
-import { mapActions, mapState } from 'vuex';
-
+import { createNamespacedHelpers, mapState, mapActions } from 'vuex';
 import RegionDropdown from './region_dropdown.vue';
 import RoleNameDropdown from './role_name_dropdown.vue';
 import SecurityGroupDropdown from './security_group_dropdown.vue';
 import SubnetDropdown from './subnet_dropdown.vue';
-import VPCDropdown from './vpc_dropdown.vue';
+import VpcDropdown from './vpc_dropdown.vue';
+
+const { mapState: mapRegionsState, mapActions: mapRegionsActions } = createNamespacedHelpers(
+  'regions',
+);
 
 export default {
   components: {
@@ -13,31 +16,39 @@ export default {
     RoleNameDropdown,
     SecurityGroupDropdown,
     SubnetDropdown,
-    VPCDropdown,
+    VpcDropdown,
   },
   computed: {
-    ...mapState(['isLoadingRegions', 'loadingRegionsError', 'regions', 'selectedRegion']),
+    ...mapState(['selectedRegion']),
+    ...mapRegionsState({
+      regions: 'items',
+      isLoadingRegions: 'isLoadingItems',
+      loadingRegionsError: 'loadingItemsError',
+    }),
   },
   mounted() {
     this.fetchRegions();
   },
   methods: {
-    ...mapActions(['fetchRegions', 'setRegion']),
+    ...mapActions(['setRegion']),
+    ...mapRegionsActions({
+      fetchRegions: 'fetchItems',
+    }),
   },
 };
 </script>
 <template>
   <form name="eks-cluster-configuration-form">
     <div class="form-group">
-      <label class="label-bold" name="role" for="eks-role">
-        {{ s__('ClusterIntegration|Role name') }}
-      </label>
+      <label class="label-bold" name="role" for="eks-role">{{
+        s__('ClusterIntegration|Role name')
+      }}</label>
       <role-name-dropdown />
     </div>
     <div class="form-group">
-      <label class="label-bold" name="role" for="eks-role">
-        {{ s__('ClusterIntegration|Region') }}
-      </label>
+      <label class="label-bold" name="role" for="eks-role">{{
+        s__('ClusterIntegration|Region')
+      }}</label>
       <region-dropdown
         :value="selectedRegion"
         :regions="regions"
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/actions.js b/app/assets/javascripts/create_cluster/eks_cluster/store/actions.js
index cad9e5eb183..68493be37e0 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/actions.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/actions.js
@@ -1,25 +1,5 @@
-import * as awsServices from '../services/aws_services_facade';
 import * as types from './mutation_types';
 
-export const requestRegions = ({ commit }) => commit(types.REQUEST_REGIONS);
-
-export const receiveRegionsSuccess = ({ commit }, payload) => {
-  commit(types.RECEIVE_REGIONS_SUCCESS, payload);
-};
-
-export const receiveRegionsError = ({ commit }, payload) => {
-  commit(types.RECEIVE_REGIONS_ERROR, payload);
-};
-
-export const fetchRegions = ({ dispatch }) => {
-  dispatch('requestRegions');
-
-  return awsServices
-    .fetchRegions()
-    .then(regions => dispatch('receiveRegionsSuccess', { regions }))
-    .catch(error => dispatch('receiveRegionsError', { error }));
-};
-
 export const setRegion = ({ commit }, payload) => {
   commit(types.SET_REGION, payload);
 };
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/actions.js b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/actions.js
new file mode 100644
index 00000000000..4f1ecb22719
--- /dev/null
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/actions.js
@@ -0,0 +1,14 @@
+import * as types from './mutation_types';
+
+export default fetchItems => ({
+  requestItems: ({ commit }) => commit(types.REQUEST_ITEMS),
+  receiveItemsSuccess: ({ commit }, payload) => commit(types.RECEIVE_ITEMS_SUCCESS, payload),
+  receiveItemsError: ({ commit }, payload) => commit(types.RECEIVE_ITEMS_ERROR, payload),
+  fetchItems: ({ dispatch }) => {
+    dispatch('requestItems');
+
+    return fetchItems()
+      .then(items => dispatch('receiveItemsSuccess', { items }))
+      .catch(error => dispatch('receiveItemsError', { error }));
+  },
+});
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/getters.js b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/getters.js
new file mode 100644
index 00000000000..e69de29bb2d
--- /dev/null
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/getters.js
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/index.js b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/index.js
new file mode 100644
index 00000000000..07a5821c47d
--- /dev/null
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/index.js
@@ -0,0 +1,13 @@
+import * as getters from './getters';
+import actions from './actions';
+import mutations from './mutations';
+import state from './state';
+
+const createStore = fetchFn => ({
+  actions: actions(fetchFn),
+  getters,
+  mutations,
+  state: state(),
+});
+
+export default createStore;
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/mutation_types.js b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/mutation_types.js
new file mode 100644
index 00000000000..48959a73924
--- /dev/null
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/mutation_types.js
@@ -0,0 +1,3 @@
+export const REQUEST_ITEMS = 'REQUEST_ITEMS';
+export const RECEIVE_ITEMS_SUCCESS = 'REQUEST_ITEMS_SUCCESS';
+export const RECEIVE_ITEMS_ERROR = 'RECEIVE_ITEMS_ERROR';
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/mutations.js b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/mutations.js
new file mode 100644
index 00000000000..d09689f1f6c
--- /dev/null
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/mutations.js
@@ -0,0 +1,16 @@
+import * as types from './mutation_types';
+
+export default {
+  [types.REQUEST_ITEMS](state) {
+    state.isLoadingItems = true;
+    state.loadingItemsError = null;
+  },
+  [types.RECEIVE_ITEMS_SUCCESS](state, { items }) {
+    state.isLoadingItems = false;
+    state.items = items;
+  },
+  [types.RECEIVE_ITEMS_ERROR](state, { error }) {
+    state.isLoadingItems = false;
+    state.loadingItemsError = error;
+  },
+};
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/state.js b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/state.js
new file mode 100644
index 00000000000..b949a24216e
--- /dev/null
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/cluster_dropdown/state.js
@@ -0,0 +1,5 @@
+export default () => ({
+  isLoadingItems: false,
+  items: [],
+  loadingItemsError: null,
+});
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/index.js b/app/assets/javascripts/create_cluster/eks_cluster/store/index.js
index 8f5ad109c2f..608c4ec9e1e 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/index.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/index.js
@@ -4,12 +4,22 @@ import * as getters from './getters';
 import mutations from './mutations';
 import state from './state';
 
+import clusterDropdownStore from './cluster_dropdown';
+
+import * as awsServices from '../services/aws_services_facade';
+
 const createStore = () =>
   new Vuex.Store({
     actions,
     getters,
     mutations,
     state: state(),
+    modules: {
+      regions: {
+        namespaced: true,
+        ...clusterDropdownStore(awsServices.fetchRegions),
+      },
+    },
   });
 
 export default createStore;
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/mutation_types.js b/app/assets/javascripts/create_cluster/eks_cluster/store/mutation_types.js
index d66d0e70dc0..80c1354482b 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/mutation_types.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/mutation_types.js
@@ -1,4 +1,2 @@
-export const REQUEST_REGIONS = 'REQUEST_REGIONS';
-export const RECEIVE_REGIONS_SUCCESS = 'REQUEST_REGIONS_SUCCESS';
-export const RECEIVE_REGIONS_ERROR = 'RECEIVE_REGIONS_ERROR';
+// eslint-disable-next-line import/prefer-default-export
 export const SET_REGION = 'SET_REGION';
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/mutations.js b/app/assets/javascripts/create_cluster/eks_cluster/store/mutations.js
index a203dd3bf42..02f34d1bdcd 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/mutations.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/mutations.js
@@ -1,18 +1,6 @@
 import * as types from './mutation_types';
 
 export default {
-  [types.REQUEST_REGIONS](state) {
-    state.isLoadingRegions = true;
-    state.loadingRegionsError = null;
-  },
-  [types.RECEIVE_REGIONS_SUCCESS](state, { regions }) {
-    state.isLoadingRegions = false;
-    state.regions = regions;
-  },
-  [types.RECEIVE_REGIONS_ERROR](state, { error }) {
-    state.isLoadingRegions = false;
-    state.loadingRegionsError = error;
-  },
   [types.SET_REGION](state, { region }) {
     state.selectedRegion = region;
   },
diff --git a/app/assets/javascripts/create_cluster/eks_cluster/store/state.js b/app/assets/javascripts/create_cluster/eks_cluster/store/state.js
index ffeb1963060..84880e15d9c 100644
--- a/app/assets/javascripts/create_cluster/eks_cluster/store/state.js
+++ b/app/assets/javascripts/create_cluster/eks_cluster/store/state.js
@@ -2,27 +2,9 @@ export default () => ({
   isValidatingCredentials: false,
   validCredentials: false,
 
-  isLoadingRegions: false,
-  isLoadingRoles: false,
-  isLoadingVPCs: false,
-  isLoadingSubnets: false,
-  isLoadingSecurityGroups: false,
-
-  regions: [],
-  roles: [],
-  vpcs: [],
-  subnets: [],
-  securityGroups: [],
-
-  loadingRegionsError: null,
-  loadingRolesError: null,
-  loadingVPCsError: null,
-  loadingSubnetsError: null,
-  loadingSecurityGroupsError: null,
-
   selectedRegion: '',
   selectedRole: '',
-  selectedVPC: '',
+  selectedVpc: '',
   selectedSubnet: '',
   selectedSecurityGroup: '',
 });