Merge pull request #136 from jlmitch5/addOrgTeamsList

add org teams list

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

@@ -0,0 +1,107 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import { MemoryRouter } from 'react-router-dom';
+import { I18nProvider } from '@lingui/react';
+
+import OrganizationTeamsList from '../../../../src/pages/Organizations/components/OrganizationTeamsList';
+
+const mockData = [
+  {
+    id: 1,
+    name: 'boo',
+    url: '/foo/bar/'
+  }
+];
+
+describe('<OrganizationTeamsList />', () => {
+  afterEach(() => {
+    jest.restoreAllMocks();
+  });
+
+  test('initially renders succesfully', () => {
+    mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationTeamsList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '1' } }}
+            location={{ search: '', pathname: '/organizations/1/teams' }}
+            onReadTeamsList={() => {}}
+            removeRole={() => {}}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    );
+  });
+
+  test('api response data passed to component gets set to state properly', (done) => {
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationTeamsList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
+            location={{ search: '', pathname: '/organizations/1/teams' }}
+            onReadTeamsList={() => ({ data: { count: 1, results: mockData } })}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('OrganizationTeamsList');
+
+    setImmediate(() => {
+      expect(wrapper.state().results).toEqual(mockData);
+      done();
+    });
+  });
+
+  test('handleSort being passed properly to DataListToolbar component', async (done) => {
+    const handleSort = jest.spyOn(OrganizationTeamsList.prototype, 'handleSort');
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationTeamsList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
+            location={{ search: '', pathname: '/organizations/1/teams' }}
+            onReadTeamsList={() => ({ data: { count: 1, results: mockData } })}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('OrganizationTeamsList');
+    expect(handleSort).not.toHaveBeenCalled();
+
+    setImmediate(() => {
+      const rendered = wrapper.update();
+      rendered.find('button[aria-label="Sort"]').simulate('click');
+      expect(handleSort).toHaveBeenCalled();
+      done();
+    });
+  });
+
+  test('handleSetPage calls readQueryParams and readOrganizationTeamsList ', () => {
+    const spyQueryParams = jest.spyOn(OrganizationTeamsList.prototype, 'readQueryParams');
+    const spyFetch = jest.spyOn(OrganizationTeamsList.prototype, 'readOrganizationTeamsList');
+    const wrapper = mount(
+      <I18nProvider>
+        <MemoryRouter>
+          <OrganizationTeamsList
+            match={{ path: '/organizations/:id', url: '/organizations/1', params: { id: '0' } }}
+            location={{ search: '', pathname: '/organizations/1/teams' }}
+            onReadTeamsList={() => ({ data: { count: 1, results: mockData } })}
+          />
+        </MemoryRouter>
+      </I18nProvider>
+    ).find('OrganizationTeamsList');
+    wrapper.instance().handleSetPage(2, 10);
+    expect(spyQueryParams).toHaveBeenCalled();
+    expect(spyFetch).toHaveBeenCalled();
+    wrapper.setState({ sortOrder: 'descending' });
+    wrapper.instance().handleSetPage(3, 5);
+    expect(spyQueryParams).toHaveBeenCalled();
+    expect(spyFetch).toHaveBeenCalled();
+    const queryParamCalls = spyQueryParams.mock.calls;
+    // make sure last two readQueryParams calls
+    // were called with the correct arguments
+    expect(queryParamCalls[queryParamCalls.length - 2][0])
+      .toEqual({ order_by: 'name', page: 2, page_size: 10 });
+    expect(queryParamCalls[queryParamCalls.length - 1][0])
+      .toEqual({ order_by: '-name', page: 3, page_size: 5 });
+  });
+});

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

@@ -8,7 +8,7 @@ const mockAPIAccessList = {
   foo: 'bar',
 };
 
-const mockGetOrganzationAccessList = () => Promise.resolve(mockAPIAccessList);
+const mockGetOrganizationAccessList = () => Promise.resolve(mockAPIAccessList);
 
 const mockResponse = {
   status: 'success',
@@ -25,7 +25,7 @@ describe('<OrganizationAccess />', () => {
           location={{ search: '', pathname: '/organizations/1/access' }}
           params={{}}
           api={{
-            getOrganzationAccessList: jest.fn(),
+            getOrganizationAccessList: jest.fn(),
           }}
         />
       </MemoryRouter>
@@ -40,7 +40,7 @@ describe('<OrganizationAccess />', () => {
           location={{ search: '', pathname: '/organizations/1/access' }}
           params={{}}
           api={{
-            getOrganzationAccessList: mockGetOrganzationAccessList,
+            getOrganizationAccessList: mockGetOrganizationAccessList,
             disassociate: mockRemoveRole
           }}
         />

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

@@ -0,0 +1,45 @@
+import React from 'react';
+import { mount } from 'enzyme';
+import { MemoryRouter } from 'react-router-dom';
+
+import OrganizationTeams from '../../../../../src/pages/Organizations/screens/Organization/OrganizationTeams';
+
+const mockAPITeamsList = {
+  foo: 'bar',
+};
+
+const readOrganizationTeamsList = () => Promise.resolve(mockAPITeamsList);
+
+describe('<OrganizationTeams />', () => {
+  test('initially renders succesfully', () => {
+    mount(
+      <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
+        <OrganizationTeams
+          match={{ path: '/organizations/:id/teams', url: '/organizations/1/teams', params: { id: 1 } }}
+          location={{ search: '', pathname: '/organizations/1/teams' }}
+          params={{}}
+          api={{
+            readOrganizationTeamsList: jest.fn(),
+          }}
+        />
+      </MemoryRouter>
+    );
+  });
+
+  test('passed methods as props are called appropriately', async () => {
+    const wrapper = mount(
+      <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
+        <OrganizationTeams
+          match={{ path: '/organizations/:id/teams', url: '/organizations/1/teams', params: { id: 1 } }}
+          location={{ search: '', pathname: '/organizations/1/teams' }}
+          params={{}}
+          api={{
+            readOrganizationTeamsList
+          }}
+        />
+      </MemoryRouter>
+    ).find('OrganizationTeams');
+    const teamsList = await wrapper.instance().readOrganizationTeamsList();
+    expect(teamsList).toEqual(mockAPITeamsList);
+  });
+});