Merge pull request #123 from ansible/access-list-remove-role-functionality

Org Access List: add remove role functionality

__tests__/api.test.js

@@ -155,14 +155,14 @@ describe('APIClient (api.js)', () => {
     done();
   });
 
-  test('disassociateInstanceGroup calls expected http method with expected data', async (done) => {
+  test('disassociate calls expected http method with expected data', async (done) => {
     const createPromise = () => Promise.resolve();
     const mockHttp = ({ post: jest.fn(createPromise) });
 
     const api = new APIClient(mockHttp);
     const url = 'foo/bar/';
     const id = 1;
-    await api.disassociateInstanceGroup(url, id);
+    await api.disassociate(url, id);
 
     expect(mockHttp.post).toHaveBeenCalledTimes(1);
     expect(mockHttp.post.mock.calls[0][0]).toEqual(url);

__tests__/components/AccessList.test.jsx

@@ -1,160 +0,0 @@
-import React from 'react';
-import { mount } from 'enzyme';
-import { MemoryRouter } from 'react-router-dom';
-import { I18nProvider } from '@lingui/react';
-
-import AccessList from '../../src/components/AccessList';
-
-const mockResults = [
-  {
-    id: 1,
-    username: 'boo',
-    url: '/foo/bar/',
-    first_name: 'john',
-    last_name: 'smith',
-    summary_fields: {
-      foo: [
-        {
-          role: {
-            name: 'foo',
-            id: 2,
-          }
-        }
-      ],
-    }
-  }
-];
-
-describe('<AccessList />', () => {
-  test('initially renders succesfully', () => {
-    mount(
-      <I18nProvider>
-        <MemoryRouter>
-          <AccessList
-            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '1' } }}
-            location={{ search: '', pathname: '/organizations/1/access' }}
-            getAccessList={() => {}}
-          />
-        </MemoryRouter>
-      </I18nProvider>
-    );
-  });
-
-  test('api response data passed to component gets set to state properly', (done) => {
-    const wrapper = mount(
-      <I18nProvider>
-        <MemoryRouter>
-          <AccessList
-            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
-            location={{ search: '', pathname: '/organizations/1/access' }}
-            getAccessList={() => ({ data: { count: 1, results: mockResults } })}
-          />
-        </MemoryRouter>
-      </I18nProvider>
-    ).find('AccessList');
-
-    setImmediate(() => {
-      expect(wrapper.state().results).toEqual(mockResults);
-      done();
-    });
-  });
-
-  test('onExpand and onCompact methods called when user clicks on Expand and Compact icons respectively', async (done) => {
-    const onExpand = jest.spyOn(AccessList.prototype, 'onExpand');
-    const onCompact = jest.spyOn(AccessList.prototype, 'onCompact');
-    const wrapper = mount(
-      <I18nProvider>
-        <MemoryRouter>
-          <AccessList
-            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
-            location={{ search: '', pathname: '/organizations/1/access' }}
-            getAccessList={() => ({ data: { count: 1, results: mockResults } })}
-          />
-        </MemoryRouter>
-      </I18nProvider>
-    ).find('AccessList');
-    expect(onExpand).not.toHaveBeenCalled();
-    expect(onCompact).not.toHaveBeenCalled();
-
-    setImmediate(() => {
-      const rendered = wrapper.update();
-      rendered.find('button[aria-label="Expand"]').simulate('click');
-      rendered.find('button[aria-label="Collapse"]').simulate('click');
-      expect(onExpand).toHaveBeenCalled();
-      expect(onCompact).toHaveBeenCalled();
-      done();
-    });
-  });
-
-  test('onSort being passed properly to DataListToolbar component', async (done) => {
-    const onSort = jest.spyOn(AccessList.prototype, 'onSort');
-    const wrapper = mount(
-      <I18nProvider>
-        <MemoryRouter>
-          <AccessList
-            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
-            location={{ search: '', pathname: '/organizations/1/access' }}
-            getAccessList={() => ({ data: { count: 1, results: mockResults } })}
-          />
-        </MemoryRouter>
-      </I18nProvider>
-    ).find('AccessList');
-    expect(onSort).not.toHaveBeenCalled();
-
-    setImmediate(() => {
-      const rendered = wrapper.update();
-      rendered.find('button[aria-label="Sort"]').simulate('click');
-      expect(onSort).toHaveBeenCalled();
-      done();
-    });
-  });
-
-  test('getTeamRoles returns empty array if dataset is missing team_id attribute', (done) => {
-    const mockData = [
-      {
-        id: 1,
-        username: 'boo',
-        url: '/foo/bar/',
-        first_name: 'john',
-        last_name: 'smith',
-        summary_fields: {
-          foo: [
-            {
-              role: {
-                name: 'foo',
-                id: 2,
-              }
-            }
-          ],
-          direct_access: [
-            {
-              role: {
-                name: 'team user',
-                id: 3,
-              }
-            }
-          ]
-        }
-      }
-    ];
-    const wrapper = mount(
-      <I18nProvider>
-        <MemoryRouter>
-          <AccessList
-            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
-            location={{ search: '', pathname: '/organizations/1/access' }}
-            getAccessList={() => ({ data: { count: 1, results: mockData } })}
-          />
-        </MemoryRouter>
-      </I18nProvider>
-    ).find('AccessList');
-
-    setImmediate(() => {
-      const { results } = wrapper.state();
-      results.forEach(result => {
-        expect(result.teamRoles).toEqual([]);
-      });
-      done();
-    });
-  });
-});

__tests__/pages/Organizations/components/OrganizationAccessList.test.jsx

@@ -0,0 +1,215 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import { MemoryRouter } from 'react-router-dom';
+import { I18nProvider } from '@lingui/react';
+
+import OrganizationAccessList from '../../../../src/pages/Organizations/components/OrganizationAccessList';
+
+const mockData = [
+  {
+    id: 1,
+    username: 'boo',
+    url: '/foo/bar/',
+    first_name: 'john',
+    last_name: 'smith',
+    summary_fields: {
+      foo: [
+        {
+          role: {
+            name: 'foo',
+            id: 2,
+          }
+        }
+      ],
+    }
+  }
+];
+
+describe('<OrganizationAccessList />', () => {
+  afterEach(() => {
+    jest.restoreAllMocks();
+  });
+
+  test('initially renders succesfully', () => {
+    mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationAccessList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '1' } }}
+            location={{ search: '', pathname: '/organizations/1/access' }}
+            getAccessList={() => {}}
+            removeRole={() => {}}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    );
+  });
+
+  test('api response data passed to component gets set to state properly', (done) => {
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationAccessList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
+            location={{ search: '', pathname: '/organizations/1/access' }}
+            getAccessList={() => ({ data: { count: 1, results: mockData } })}
+            removeRole={() => {}}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('OrganizationAccessList');
+
+    setImmediate(() => {
+      expect(wrapper.state().results).toEqual(mockData);
+      done();
+    });
+  });
+
+  test('onExpand and onCompact methods called when user clicks on Expand and Compact icons respectively', async (done) => {
+    const onExpand = jest.spyOn(OrganizationAccessList.prototype, 'onExpand');
+    const onCompact = jest.spyOn(OrganizationAccessList.prototype, 'onCompact');
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationAccessList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
+            location={{ search: '', pathname: '/organizations/1/access' }}
+            getAccessList={() => ({ data: { count: 1, results: mockData } })}
+            removeRole={() => {}}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('OrganizationAccessList');
+    expect(onExpand).not.toHaveBeenCalled();
+    expect(onCompact).not.toHaveBeenCalled();
+
+    setImmediate(() => {
+      const rendered = wrapper.update();
+      rendered.find('button[aria-label="Expand"]').simulate('click');
+      rendered.find('button[aria-label="Collapse"]').simulate('click');
+      expect(onExpand).toHaveBeenCalled();
+      expect(onCompact).toHaveBeenCalled();
+      done();
+    });
+  });
+
+  test('onSort being passed properly to DataListToolbar component', async (done) => {
+    const onSort = jest.spyOn(OrganizationAccessList.prototype, 'onSort');
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationAccessList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
+            location={{ search: '', pathname: '/organizations/1/access' }}
+            getAccessList={() => ({ data: { count: 1, results: mockData } })}
+            removeRole={() => {}}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('OrganizationAccessList');
+    expect(onSort).not.toHaveBeenCalled();
+
+    setImmediate(() => {
+      const rendered = wrapper.update();
+      rendered.find('button[aria-label="Sort"]').simulate('click');
+      expect(onSort).toHaveBeenCalled();
+      done();
+    });
+  });
+
+  test('getTeamRoles returns empty array if dataset is missing team_id attribute', (done) => {
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationAccessList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
+            location={{ search: '', pathname: '/organizations/1/access' }}
+            getAccessList={() => ({ data: { count: 1, results: mockData } })}
+            removeRole={() => {}}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('OrganizationAccessList');
+
+    setImmediate(() => {
+      const { results } = wrapper.state();
+      results.forEach(result => {
+        expect(result.teamRoles).toEqual([]);
+      });
+      done();
+    });
+  });
+
+  test('test handleWarning, confirmDelete, and removeRole methods for Alert component', (done) => {
+    const handleWarning = jest.spyOn(OrganizationAccessList.prototype, 'handleWarning');
+    const confirmDelete = jest.spyOn(OrganizationAccessList.prototype, 'confirmDelete');
+    const removeRole = jest.spyOn(OrganizationAccessList.prototype, 'removeAccessRole');
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationAccessList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
+            location={{ search: '', pathname: '/organizations/1/access' }}
+            getAccessList={() => ({ data: { count: 1, results: mockData } })}
+            removeRole={() => {}}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('OrganizationAccessList');
+    expect(handleWarning).not.toHaveBeenCalled();
+    expect(confirmDelete).not.toHaveBeenCalled();
+    expect(removeRole).not.toHaveBeenCalled();
+
+    setImmediate(() => {
+      const rendered = wrapper.update().find('ChipButton');
+      rendered.find('button[aria-label="close"]').simulate('click');
+      expect(handleWarning).toHaveBeenCalled();
+      const alert = wrapper.update().find('Alert');
+      alert.find('button[aria-label="confirm-delete"]').simulate('click');
+      expect(confirmDelete).toHaveBeenCalled();
+      expect(removeRole).toHaveBeenCalled();
+      done();
+    });
+  });
+
+  test('state is set appropriately when a user tries deleting a role', (done) => {
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationAccessList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
+            location={{ search: '', pathname: '/organizations/1/access' }}
+            getAccessList={() => ({ data: { count: 1, results: mockData } })}
+            removeRole={() => {}}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('OrganizationAccessList');
+
+    setImmediate(() => {
+      const expected = [
+        {
+          deleteType: 'users'
+        },
+        {
+          deleteRoleId: mockData[0].summary_fields.foo[0].role.id
+        },
+        {
+          deleteResourceId: mockData[0].id
+        }
+      ];
+      const rendered = wrapper.update().find('ChipButton');
+      rendered.find('button[aria-label="close"]').simulate('click');
+      const alert = wrapper.update().find('Alert');
+      alert.find('button[aria-label="confirm-delete"]').simulate('click');
+      expect(wrapper.state().warningTitle).not.toBe(null);
+      expect(wrapper.state().warningMsg).not.toBe(null);
+      expected.forEach(criteria => {
+        Object.keys(criteria).forEach(key => {
+          expect(wrapper.state()[key]).toEqual(criteria[key]);
+        });
+      });
+      done();
+    });
+  });
+});

__tests__/pages/Organizations/screens/Organization/OrganizationAccess.test.jsx

@@ -8,9 +8,13 @@ const mockAPIAccessList = {
   foo: 'bar',
 };
 
-const mockGetOrganzationAccessList = jest.fn(() => (
-  Promise.resolve(mockAPIAccessList)
-));
+const mockGetOrganzationAccessList = () => Promise.resolve(mockAPIAccessList);
+
+const mockResponse = {
+  status: 'success',
+};
+
+const mockRemoveRole = () => Promise.resolve(mockResponse);
 
 describe('<OrganizationAccess />', () => {
   test('initially renders succesfully', () => {
@@ -37,11 +41,14 @@ describe('<OrganizationAccess />', () => {
           params={{}}
           api={{
             getOrganzationAccessList: mockGetOrganzationAccessList,
+            disassociate: mockRemoveRole
           }}
         />
       </MemoryRouter>
     ).find('OrganizationAccess');
     const accessList = await wrapper.instance().getOrgAccessList();
     expect(accessList).toEqual(mockAPIAccessList);
+    const resp = await wrapper.instance().removeRole(2, 3, 'users');
+    expect(resp).toEqual(mockResponse);
   });
 });

__tests__/pages/Organizations/screens/Organization/OrganizationEdit.test.jsx

@@ -183,7 +183,7 @@ describe('<OrganizationEdit />', () => {
       getOrganizationInstanceGroups: getOrganizationInstanceGroupsFn,
       updateOrganizationDetails: updateOrganizationDetailsFn,
       associateInstanceGroup: associateInstanceGroupFn,
-      disassociateInstanceGroup: disassociateInstanceGroupFn
+      disassociate: disassociateInstanceGroupFn
     };
     const wrapper = mount(
       <I18nProvider>