Service credentials form create role store

Implement Vuex store logic to send a request to create an ARN role

app/assets/javascripts/create_cluster/eks_cluster/index.js

@@ -14,7 +14,7 @@ export default el => {
     externalId,
     accountId,
     hasCredentials,
-    createCredentialsPath,
+    createRolePath,
   } = el.dataset;
 
   return new Vue({
@@ -26,7 +26,7 @@ export default el => {
         accountId,
       },
       apiPaths: {
-        createCredentialsPath,
+        createRolePath,
       },
     }),
     components: {

app/assets/javascripts/create_cluster/eks_cluster/store/actions.js

 import * as types from './mutation_types';
-
-export const setClusterName = ({ commit }, payload) => {
-  commit(types.SET_CLUSTER_NAME, payload);
-};
-
-export const setEnvironmentScope = ({ commit }, payload) => {
-  commit(types.SET_ENVIRONMENT_SCOPE, payload);
-};
-
-export const setKubernetesVersion = ({ commit }, payload) => {
-  commit(types.SET_KUBERNETES_VERSION, payload);
-};
-
-export const setRegion = ({ commit }, payload) => {
-  commit(types.SET_REGION, payload);
-};
-
-export const setKeyPair = ({ commit }, payload) => {
-  commit(types.SET_KEY_PAIR, payload);
-};
-
-export const setVpc = ({ commit }, payload) => {
-  commit(types.SET_VPC, payload);
-};
-
-export const setSubnet = ({ commit }, payload) => {
-  commit(types.SET_SUBNET, payload);
-};
-
-export const setRole = ({ commit }, payload) => {
-  commit(types.SET_ROLE, payload);
-};
-
-export const setSecurityGroup = ({ commit }, payload) => {
-  commit(types.SET_SECURITY_GROUP, payload);
-};
-
-export const setGitlabManagedCluster = ({ commit }, payload) => {
-  commit(types.SET_GITLAB_MANAGED_CLUSTER, payload);
-};
-
-export default () => {};
+import axios from '~/lib/utils/axios_utils';
+
+export default apiPaths => ({
+  setClusterName({ commit }, payload) {
+    commit(types.SET_CLUSTER_NAME, payload);
+  },
+  setEnvironmentScope({ commit }, payload) {
+    commit(types.SET_ENVIRONMENT_SCOPE, payload);
+  },
+  setKubernetesVersion({ commit }, payload) {
+    commit(types.SET_KUBERNETES_VERSION, payload);
+  },
+  createRole({ dispatch }, payload) {
+    dispatch('requestCreateRole');
+
+    return axios
+      .post(apiPaths.createRolePath, {
+        role_arn: payload.roleArn,
+        role_external_id: payload.externalId,
+      })
+      .then(() => dispatch('createRoleSuccess'))
+      .catch(error => dispatch('createRoleError', { error }));
+  },
+  requestCreateRole({ commit }) {
+    commit(types.REQUEST_CREATE_ROLE);
+  },
+  createRoleSuccess({ commit }) {
+    commit(types.CREATE_ROLE_SUCCESS);
+  },
+  createRoleError({ commit }, payload) {
+    commit(types.CREATE_ROLE_ERROR, payload);
+  },
+  setRegion({ commit }, payload) {
+    commit(types.SET_REGION, payload);
+  },
+  setKeyPair({ commit }, payload) {
+    commit(types.SET_KEY_PAIR, payload);
+  },
+  setVpc({ commit }, payload) {
+    commit(types.SET_VPC, payload);
+  },
+  setSubnet({ commit }, payload) {
+    commit(types.SET_SUBNET, payload);
+  },
+  setRole({ commit }, payload) {
+    commit(types.SET_ROLE, payload);
+  },
+  setSecurityGroup({ commit }, payload) {
+    commit(types.SET_SECURITY_GROUP, payload);
+  },
+  setGitlabManagedCluster({ commit }, payload) {
+    commit(types.SET_GITLAB_MANAGED_CLUSTER, payload);
+  },
+});

app/assets/javascripts/create_cluster/eks_cluster/store/index.js

 import Vuex from 'vuex';
-import * as actions from './actions';
+import actions from './actions';
 import * as getters from './getters';
 import mutations from './mutations';
 import state from './state';
@@ -8,9 +8,9 @@ import clusterDropdownStore from './cluster_dropdown';
 
 import * as awsServices from '../services/aws_services_facade';
 
-const createStore = ({ initialState }) =>
+const createStore = ({ initialState, apiPaths }) =>
   new Vuex.Store({
-    actions,
+    actions: actions(apiPaths),
     getters,
     mutations,
     state: Object.assign(state(), initialState),

app/assets/javascripts/create_cluster/eks_cluster/store/mutation_types.js

@@ -8,3 +8,6 @@ export const SET_SUBNET = 'SET_SUBNET';
 export const SET_ROLE = 'SET_ROLE';
 export const SET_SECURITY_GROUP = 'SET_SECURITY_GROUP';
 export const SET_GITLAB_MANAGED_CLUSTER = 'SET_GITLAB_MANAGED_CLUSTER';
+export const REQUEST_CREATE_ROLE = 'REQUEST_CREATE_ROLE';
+export const CREATE_ROLE_SUCCESS = 'CREATE_ROLE_SUCCESS';
+export const CREATE_ROLE_ERROR = 'CREATE_ROLE_ERROR';

app/assets/javascripts/create_cluster/eks_cluster/store/mutations.js

@@ -31,4 +31,19 @@ export default {
   [types.SET_GITLAB_MANAGED_CLUSTER](state, { gitlabManagedCluster }) {
     state.gitlabManagedCluster = gitlabManagedCluster;
   },
+  [types.REQUEST_CREATE_ROLE](state) {
+    state.isCreatingRole = true;
+    state.createRoleError = null;
+    state.hasCredentials = false;
+  },
+  [types.CREATE_ROLE_SUCCESS](state) {
+    state.isCreatingRole = false;
+    state.createRoleError = null;
+    state.hasCredentials = true;
+  },
+  [types.CREATE_ROLE_ERROR](state, { error }) {
+    state.isCreatingRole = false;
+    state.createRoleError = error;
+    state.hasCredentials = false;
+  },
 };

app/assets/javascripts/create_cluster/eks_cluster/store/state.js

 import { KUBERNETES_VERSIONS } from '../constants';
 
 export default () => ({
-  isAuthenticating: false,
-  hasCredentials: false,
-  invalidCredentials: false,
-  invalidCredentialsError: null,
+  isCreatingRole: false,
+  roleCreated: false,
+  createRoleError: false,
+
   accountId: '',
   externalId: '',
 

spec/frontend/create_cluster/eks_cluster/components/service_credentials_form_spec.js

@@ -92,12 +92,12 @@ describe('ServiceCredentialsForm', () => {
 
     it('sets submit button as loading', () => {
       expect(findSubmitButton().props('loading')).toBe(true);
-    })
+    });
 
     it('displays Authenticating label on submit button', () => {
       expect(findSubmitButton().props('label')).toBe('Authenticating');
     });
-  })
+  });
 
   describe('when role can’t be created', () => {
     beforeEach(() => {

spec/frontend/create_cluster/eks_cluster/store/actions_spec.js

 import testAction from 'helpers/vuex_action_helper';
 
 import createState from '~/create_cluster/eks_cluster/store/state';
-import * as actions from '~/create_cluster/eks_cluster/store/actions';
+import actionsFactory from '~/create_cluster/eks_cluster/store/actions';
 import {
   SET_CLUSTER_NAME,
   SET_ENVIRONMENT_SCOPE,
@@ -13,7 +13,12 @@ import {
   SET_ROLE,
   SET_SECURITY_GROUP,
   SET_GITLAB_MANAGED_CLUSTER,
+  REQUEST_CREATE_ROLE,
+  CREATE_ROLE_SUCCESS,
+  CREATE_ROLE_ERROR,
 } from '~/create_cluster/eks_cluster/store/mutation_types';
+import axios from '~/lib/utils/axios_utils';
+import MockAdapter from 'axios-mock-adapter';
 
 describe('EKS Cluster Store Actions', () => {
   let clusterName;
@@ -26,6 +31,9 @@ describe('EKS Cluster Store Actions', () => {
   let keyPair;
   let securityGroup;
   let gitlabManagedCluster;
+  let actions;
+  let apiPaths;
+  let mock;
 
   beforeEach(() => {
     clusterName = 'my cluster';
@@ -38,6 +46,20 @@ describe('EKS Cluster Store Actions', () => {
     keyPair = { name: 'key-pair-1' };
     securityGroup = { name: 'default group' };
     gitlabManagedCluster = true;
+
+    apiPaths = {
+      createRolePath: '/clusters/roles/',
+    };
+
+    actions = actionsFactory(apiPaths);
+  });
+
+  beforeEach(() => {
+    mock = new MockAdapter(axios);
+  });
+
+  afterEach(() => {
+    mock.restore();
   });
 
   it.each`
@@ -57,4 +79,78 @@ describe('EKS Cluster Store Actions', () => {
 
     testAction(actions[action], payload, createState(), [{ type: mutation, payload }]);
   });
+
+  describe('createRole', () => {
+    const payload = {
+      roleArn: 'role_arn',
+      externalId: 'externalId',
+    };
+
+    describe('when request succeeds', () => {
+      beforeEach(() => {
+        mock
+          .onPost(apiPaths.createRolePath, {
+            role_arn: payload.roleArn,
+            role_external_id: payload.externalId,
+          })
+          .reply(201);
+      });
+
+      it('dispatches createRoleSuccess action', () =>
+        testAction(
+          actions.createRole,
+          payload,
+          createState(),
+          [],
+          [{ type: 'requestCreateRole' }, { type: 'createRoleSuccess' }],
+        ));
+    });
+
+    describe('when request fails', () => {
+      let error;
+
+      beforeEach(() => {
+        error = new Error('Request failed with status code 400');
+        mock
+          .onPost(apiPaths.createRolePath, {
+            role_arn: payload.roleArn,
+            role_external_id: payload.externalId,
+          })
+          .reply(400, error);
+      });
+
+      it('dispatches createRoleError action', () =>
+        testAction(
+          actions.createRole,
+          payload,
+          createState(),
+          [],
+          [{ type: 'requestCreateRole' }, { type: 'createRoleError', payload: { error } }],
+        ));
+    });
+  });
+
+  describe('requestCreateRole', () => {
+    it('commits requestCreaterole mutation', () => {
+      testAction(actions.requestCreateRole, null, createState(), [{ type: REQUEST_CREATE_ROLE }]);
+    });
+  });
+
+  describe('createRoleSuccess', () => {
+    it('commits createRoleSuccess mutation', () => {
+      testAction(actions.createRoleSuccess, null, createState(), [{ type: CREATE_ROLE_SUCCESS }]);
+    });
+  });
+
+  describe('createRoleError', () => {
+    it('commits createRoleError mutation', () => {
+      const payload = {
+        error: new Error(),
+      };
+
+      testAction(actions.createRoleError, payload, createState(), [
+        { type: CREATE_ROLE_ERROR, payload },
+      ]);
+    });
+  });
 });

spec/frontend/create_cluster/eks_cluster/store/mutations_spec.js

@@ -9,6 +9,9 @@ import {
   SET_ROLE,
   SET_SECURITY_GROUP,
   SET_GITLAB_MANAGED_CLUSTER,
+  REQUEST_CREATE_ROLE,
+  CREATE_ROLE_SUCCESS,
+  CREATE_ROLE_ERROR,
 } from '~/create_cluster/eks_cluster/store/mutation_types';
 import createState from '~/create_cluster/eks_cluster/store/state';
 import mutations from '~/create_cluster/eks_cluster/store/mutations';
@@ -59,4 +62,60 @@ describe('Create EKS cluster store mutations', () => {
     mutations[mutation](state, payload);
     expect(state[mutatedProperty]).toBe(expectedValue);
   });
+
+  describe(`mutation ${REQUEST_CREATE_ROLE}`, () => {
+    beforeEach(() => {
+      mutations[REQUEST_CREATE_ROLE](state);
+    });
+
+    it('sets isCreatingRole to true', () => {
+      expect(state.isCreatingRole).toBe(true);
+    });
+
+    it('sets createRoleError to null', () => {
+      expect(state.createRoleError).toBe(null);
+    });
+
+    it('sets hasCredentials to false', () => {
+      expect(state.hasCredentials).toBe(false);
+    });
+  });
+
+  describe(`mutation ${CREATE_ROLE_SUCCESS}`, () => {
+    beforeEach(() => {
+      mutations[CREATE_ROLE_SUCCESS](state);
+    });
+
+    it('sets isCreatingRole to false', () => {
+      expect(state.isCreatingRole).toBe(false);
+    });
+
+    it('sets createRoleError to null', () => {
+      expect(state.createRoleError).toBe(null);
+    });
+
+    it('sets hasCredentials to false', () => {
+      expect(state.hasCredentials).toBe(true);
+    });
+  });
+
+  describe(`mutation ${CREATE_ROLE_ERROR}`, () => {
+    const error = new Error();
+
+    beforeEach(() => {
+      mutations[CREATE_ROLE_ERROR](state, { error });
+    });
+
+    it('sets isCreatingRole to false', () => {
+      expect(state.isCreatingRole).toBe(false);
+    });
+
+    it('sets createRoleError to the error object', () => {
+      expect(state.createRoleError).toBe(error);
+    });
+
+    it('sets hasCredentials to false', () => {
+      expect(state.hasCredentials).toBe(false);
+    });
+  });
 });