Merge pull request #141 from AlexSCorey/48-deleteOrgs

Add alert for org. delete.

__tests__/components/DataListToolbar.test.jsx

@@ -221,4 +221,36 @@ describe('<DataListToolbar />', () => {
     const upAlphaIcon = toolbar.find(upAlphaIconSelector);
     expect(upAlphaIcon.length).toBe(1);
   });
+
+  test('trash can button triggers correct function', () => {
+    const columns = [{ name: 'Name', key: 'name', isSortable: true }];
+    const onOpenDeleteModal = jest.fn();
+    const openDeleteModalButton = 'button[aria-label="Delete"]';
+    const onSearch = jest.fn();
+    const onSort = jest.fn();
+    const onSelectAll = jest.fn();
+    const showDelete = true;
+    const disableTrashCanIcon = false;
+
+    toolbar = mount(
+      <I18nProvider>
+        <DataListToolbar
+          isAllSelected={false}
+          selected={() => [1, 2, 3, 4]}
+          sortedColumnKey="name"
+          sortOrder="ascending"
+          columns={columns}
+          onSearch={onSearch}
+          onSort={onSort}
+          onSelectAll={onSelectAll}
+          onOpenDeleteModal={onOpenDeleteModal}
+          showDelete={showDelete}
+          disableTrashCanIcon={disableTrashCanIcon}
+        />
+      </I18nProvider>
+    );
+
+    toolbar.find(openDeleteModalButton).simulate('click');
+    expect(onOpenDeleteModal).toBeCalled();
+  });
 });

__tests__/pages/Organizations/screens/OrganizationsList.test.jsx

@@ -4,6 +4,45 @@ import { MemoryRouter } from 'react-router-dom';
 import { I18nProvider } from '@lingui/react';
 import OrganizationsList from '../../../../src/pages/Organizations/screens/OrganizationsList';
 
+const mockAPIOrgsList = {
+  data: {
+    results: [{
+      name: 'Organization 0',
+      id: 1,
+      summary_fields: {
+        related_field_counts: {
+          teams: 3,
+          users: 4
+        }
+      },
+    },
+    {
+      name: 'Organization 1',
+      id: 1,
+      summary_fields: {
+        related_field_counts: {
+          teams: 2,
+          users: 5
+        }
+      },
+    },
+    {
+      name: 'Organization 2',
+      id: 2,
+      summary_fields: {
+        related_field_counts: {
+          teams: 5,
+          users: 6
+        }
+      },
+    }]
+  },
+  isModalOpen: false,
+  warningTitle: 'title',
+  warningMsg: 'message'
+
+};
+
 describe('<OrganizationsList />', () => {
   test('initially renders succesfully', () => {
     mount(
@@ -17,4 +56,79 @@ describe('<OrganizationsList />', () => {
       </MemoryRouter>
     );
   });
+
+  test.only('Modal closes when close button is clicked.', async (done) => {
+    const handleClearOrgsToDelete = jest.fn();
+    const wrapper = mount(
+      <MemoryRouter initialEntries={['/organizations']} initialIndex={0}>
+        <I18nProvider>
+          <OrganizationsList
+            match={{ path: '/organizations', url: '/organizations' }}
+            location={{ search: '', pathname: '/organizations' }}
+            getItems={({ data: { orgsToDelete: [{ name: 'Organization 1', id: 1 }] } })}
+            handleClearOrgsToDelete={handleClearOrgsToDelete()}
+          />
+        </I18nProvider>
+      </MemoryRouter>
+    );
+    wrapper.find({ type: 'checkbox' }).simulate('click');
+
+    wrapper.find('DataListToolbar').prop('onOpenDeleteModal')();
+    expect(wrapper.find('OrganizationsList').state().isModalOpen).toEqual(true);
+    setImmediate(() => {
+      wrapper.update();
+      wrapper.setState({
+        selected: mockAPIOrgsList.data.results.map((result) => result.id),
+        orgsToDelete: mockAPIOrgsList.data.results.map((result) => result),
+        isModalOpen: true,
+      });
+
+      wrapper.find('button[aria-label="Close"]').simulate('click');
+      expect(handleClearOrgsToDelete).toBeCalled();
+      const list = wrapper.find('OrganizationsList');
+      expect(list.state().isModalOpen).toBe(false);
+      done();
+    });
+  });
+
+  test.only('Orgs to delete length is 0 when all orgs are selected and Delete button is called.', async (done) => {
+    const handleClearOrgsToDelete = jest.fn();
+    const handleOrgDelete = jest.fn();
+    const fetchOrganizations = jest.fn();
+    const wrapper = mount(
+      <MemoryRouter initialEntries={['/organizations']} initialIndex={0}>
+        <I18nProvider>
+          <OrganizationsList
+            match={{ path: '/organizations', url: '/organizations' }}
+            location={{ search: '', pathname: '/organizations' }}
+            getItems={({ data: { orgsToDelete: [{ name: 'Organization 1', id: 1 }] } })}
+            handleClearOrgsToDelete={handleClearOrgsToDelete()}
+            handleOrgDelete={handleOrgDelete()}
+            fetchOrganizations={fetchOrganizations()}
+
+          />
+        </I18nProvider>
+      </MemoryRouter>
+    );
+    wrapper.find({ type: 'checkbox' }).simulate('click');
+    wrapper.find('button[aria-label="Delete"]').simulate('click');
+
+    wrapper.find('DataListToolbar').prop('onOpenDeleteModal')();
+    expect(wrapper.find('OrganizationsList').state().isModalOpen).toEqual(true);
+    setImmediate(() => {
+      wrapper.update();
+      wrapper.setState({
+        selected: mockAPIOrgsList.data.results.map((result) => result.id),
+        orgsToDelete: mockAPIOrgsList.data.results.map((result) => result),
+        isModalOpen: true,
+      });
+      wrapper.update();
+
+      const list = wrapper.find('OrganizationsList');
+      wrapper.find('button[aria-label="confirm-delete"]').simulate('click');
+      expect(list.state().orgsToDelete.length).toEqual(list.state().orgsDeleted.length);
+      expect(fetchOrganizations).toHaveBeenCalled();
+      done();
+    });
+  });
 });