update the rest of the organizations tests

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

@@ -1,12 +1,12 @@
 import React from 'react';
-import { mount } from 'enzyme';
 import { MemoryRouter } from 'react-router-dom';
 import { I18nProvider } from '@lingui/react';
+import { mountWithContexts } from '../../../enzymeHelpers';
 import OrganizationListItem from '../../../../src/pages/Organizations/components/OrganizationListItem';
 
 describe('<OrganizationListItem />', () => {
   test('initially renders succesfully', () => {
-    mount(
+    mountWithContexts(
       <I18nProvider>
         <MemoryRouter initialEntries={['/organizations']} initialIndex={0}>
           <OrganizationListItem />

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

@@ -1,8 +1,6 @@
 import React from 'react';
-import { mount } from 'enzyme';
-import { MemoryRouter, Router } from 'react-router-dom';
 import { createMemoryHistory } from 'history';
-import { I18nProvider } from '@lingui/react';
+import { mountWithContexts } from '../../../enzymeHelpers';
 import { sleep } from '../../../testUtils';
 import OrganizationTeamsList from '../../../../src/pages/Organizations/components/OrganizationTeamsList';
 
@@ -20,20 +18,16 @@ describe('<OrganizationTeamsList />', () => {
   });
 
   test('initially renders succesfully', () => {
-    mount(
-      <I18nProvider>
-        <MemoryRouter>
-          <OrganizationTeamsList
-            teams={mockData}
-            itemCount={7}
-            queryParams={{
-              page: 1,
-              page_size: 5,
-              order_by: 'name',
-            }}
-          />
-        </MemoryRouter>
-      </I18nProvider>
+    mountWithContexts(
+      <OrganizationTeamsList
+        teams={mockData}
+        itemCount={7}
+        queryParams={{
+          page: 1,
+          page_size: 5,
+          order_by: 'name',
+        }}
+      />
     );
   });
 
@@ -42,20 +36,16 @@ describe('<OrganizationTeamsList />', () => {
     const history = createMemoryHistory({
       initialEntries: ['/organizations/1/teams'],
     });
-    const wrapper = mount(
-      <Router history={history}>
-        <I18nProvider>
-          <OrganizationTeamsList
-            teams={mockData}
-            itemCount={7}
-            queryParams={{
-              page: 1,
-              page_size: 5,
-              order_by: 'name',
-            }}
-          />
-        </I18nProvider>
-      </Router>
+    const wrapper = mountWithContexts(
+      <OrganizationTeamsList
+        teams={mockData}
+        itemCount={7}
+        queryParams={{
+          page: 1,
+          page_size: 5,
+          order_by: 'name',
+        }}
+      />, { context: { router: { history } } }
     );
 
     const toolbar = wrapper.find('DataListToolbar');
@@ -78,20 +68,16 @@ describe('<OrganizationTeamsList />', () => {
     const history = createMemoryHistory({
       initialEntries: ['/organizations/1/teams'],
     });
-    const wrapper = mount(
-      <Router history={history}>
-        <I18nProvider>
-          <OrganizationTeamsList
-            teams={mockData}
-            itemCount={7}
-            queryParams={{
-              page: 1,
-              page_size: 5,
-              order_by: 'name',
-            }}
-          />
-        </I18nProvider>
-      </Router>
+    const wrapper = mountWithContexts(
+      <OrganizationTeamsList
+        teams={mockData}
+        itemCount={7}
+        queryParams={{
+          page: 1,
+          page_size: 5,
+          order_by: 'name',
+        }}
+      />, { context: { router: { history } } }
     );
 
     const pagination = wrapper.find('Pagination');

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

@@ -1,7 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
-import { MemoryRouter } from 'react-router-dom';
-import { I18nProvider } from '@lingui/react';
+import { mountWithContexts } from '../../../../enzymeHelpers';
 import OrganizationDetail from '../../../../../src/pages/Organizations/screens/Organization/OrganizationDetail';
 
 describe('<OrganizationDetail />', () => {
@@ -14,33 +12,21 @@ describe('<OrganizationDetail />', () => {
   };
 
   test('initially renders succesfully', () => {
-    mount(
-      <I18nProvider>
-        <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-          <OrganizationDetail
-            match={{ params: { id: '1' } }}
-            organization={mockDetails}
-          />
-        </MemoryRouter>
-      </I18nProvider>
+    mountWithContexts(
+      <OrganizationDetail
+        organization={mockDetails}
+      />
     );
   });
 
   test('should request instance groups from api', () => {
     const getOrganizationInstanceGroups = jest.fn();
-    mount(
-      <I18nProvider>
-        <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-          <OrganizationDetail
-            match={{ params: { id: '1' } }}
-            api={{
-              getOrganizationInstanceGroups
-            }}
-            handleHttpError={() => {}}
-            organization={mockDetails}
-          />
-        </MemoryRouter>
-      </I18nProvider>
+    mountWithContexts(
+      <OrganizationDetail
+        organization={mockDetails}
+      />, { context: {
+        network: { api: { getOrganizationInstanceGroups }, handleHttpError: () => {} }
+      } }
     ).find('OrganizationDetail');
 
     expect(getOrganizationInstanceGroups).toHaveBeenCalledTimes(1);
@@ -54,23 +40,12 @@ describe('<OrganizationDetail />', () => {
     const getOrganizationInstanceGroups = jest.fn(() => (
       Promise.resolve({ data: { results: mockInstanceGroups } })
     ));
-    const wrapper = mount(
-      <I18nProvider>
-        <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-          <OrganizationDetail
-            match={{
-              path: '/organizations/:id',
-              url: '/organizations/1',
-              params: { id: '1' }
-            }}
-            organization={mockDetails}
-            handleHttpError={() => {}}
-            api={{
-              getOrganizationInstanceGroups
-            }}
-          />
-        </MemoryRouter>
-      </I18nProvider>
+    const wrapper = mountWithContexts(
+      <OrganizationDetail
+        organization={mockDetails}
+      />, { context: {
+        network: { api: { getOrganizationInstanceGroups }, handleHttpError: () => {} }
+      } }
     ).find('OrganizationDetail');
 
     await getOrganizationInstanceGroups();
@@ -78,19 +53,10 @@ describe('<OrganizationDetail />', () => {
   });
 
   test('should render Details', async () => {
-    const wrapper = mount(
-      <I18nProvider>
-        <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-          <OrganizationDetail
-            match={{
-              path: '/organizations/:id',
-              url: '/organizations/1',
-              params: { id: '1' }
-            }}
-            organization={mockDetails}
-          />
-        </MemoryRouter>
-      </I18nProvider>
+    const wrapper = mountWithContexts(
+      <OrganizationDetail
+        organization={mockDetails}
+      />
     );
 
     const detailWrapper = wrapper.find('Detail');

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

@@ -1,17 +1,12 @@
 import React from 'react';
-import { mount } from 'enzyme';
-import { MemoryRouter } from 'react-router-dom';
-import { I18nProvider } from '@lingui/react';
+import { mountWithContexts } from '../../../../enzymeHelpers';
 
-import { NetworkProvider } from '../../../../../src/contexts/Network';
-
-import { _OrganizationEdit } from '../../../../../src/pages/Organizations/screens/Organization/OrganizationEdit';
+import OrganizationEdit from '../../../../../src/pages/Organizations/screens/Organization/OrganizationEdit';
 
 const sleep = (ms) => new Promise(resolve => setTimeout(resolve, ms));
 
 describe('<OrganizationEdit />', () => {
   let api;
-  let networkProviderValue;
 
   const mockData = {
     name: 'Foo',
@@ -30,26 +25,16 @@ describe('<OrganizationEdit />', () => {
       associateInstanceGroup: jest.fn(),
       disassociate: jest.fn(),
     };
-
-    networkProviderValue = {
-      api,
-      handleHttpError: () => {}
-    };
   });
 
   test('handleSubmit should call api update', () => {
-    const wrapper = mount(
-      <MemoryRouter>
-        <I18nProvider>
-          <NetworkProvider value={networkProviderValue}>
-            <_OrganizationEdit
-              organization={mockData}
-              api={api}
-              handleHttpError={() => {}}
-            />
-          </NetworkProvider>
-        </I18nProvider>
-      </MemoryRouter>
+    const wrapper = mountWithContexts(
+      <OrganizationEdit
+        organization={mockData}
+      />, { context: { network: {
+        api,
+        handleHttpError: () => {}
+      } } }
     );
 
     const updatedOrgData = {
@@ -66,18 +51,13 @@ describe('<OrganizationEdit />', () => {
   });
 
   test('handleSubmit associates and disassociates instance groups', async () => {
-    const wrapper = mount(
-      <MemoryRouter>
-        <I18nProvider>
-          <NetworkProvider value={networkProviderValue}>
-            <_OrganizationEdit
-              organization={mockData}
-              api={api}
-              handleHttpError={() => {}}
-            />
-          </NetworkProvider>
-        </I18nProvider>
-      </MemoryRouter>
+    const wrapper = mountWithContexts(
+      <OrganizationEdit
+        organization={mockData}
+      />, { context: { network: {
+        api,
+        handleHttpError: () => {}
+      } } }
     );
 
     const updatedOrgData = {
@@ -106,19 +86,16 @@ describe('<OrganizationEdit />', () => {
     const history = {
       push: jest.fn(),
     };
-    const wrapper = mount(
-      <MemoryRouter>
-        <I18nProvider>
-          <NetworkProvider value={networkProviderValue}>
-            <_OrganizationEdit
-              organization={mockData}
-              api={api}
-              handleHttpError={() => {}}
-              history={history}
-            />
-          </NetworkProvider>
-        </I18nProvider>
-      </MemoryRouter>
+    const wrapper = mountWithContexts(
+      <OrganizationEdit
+        organization={mockData}
+      />, { context: {
+        network: {
+          api: { api },
+          handleHttpError: () => {}
+        },
+        router: { history }
+      } }
     );
 
     expect(history.push).not.toHaveBeenCalled();

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

@@ -1,60 +1,45 @@
 import React from 'react';
-import { mount } from 'enzyme';
-import { MemoryRouter } from 'react-router-dom';
-import { _OrganizationNotifications } from '../../../../../src/pages/Organizations/screens/Organization/OrganizationNotifications';
+import { mountWithContexts } from '../../../../enzymeHelpers';
+
+import OrganizationNotifications from '../../../../../src/pages/Organizations/screens/Organization/OrganizationNotifications';
 
 describe('<OrganizationNotifications />', () => {
+  let api;
+
+  beforeEach(() => {
+    api = {
+      getOrganizationNotifications: jest.fn(),
+      getOrganizationNotificationSuccess: jest.fn(),
+      getOrganizationNotificationError: jest.fn(),
+      createOrganizationNotificationSuccess: jest.fn(),
+      createOrganizationNotificationError: jest.fn()
+    };
+  });
+
   test('initially renders succesfully', () => {
-    mount(
-      <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-        <_OrganizationNotifications
-          match={{ path: '/organizations/:id/notifications', url: '/organizations/1/notifications' }}
-          location={{ search: '', pathname: '/organizations/1/notifications' }}
-          params={{}}
-          api={{
-            getOrganizationNotifications: jest.fn(),
-            getOrganizationNotificationSuccess: jest.fn(),
-            getOrganizationNotificationError: jest.fn(),
-            createOrganizationNotificationSuccess: jest.fn(),
-            createOrganizationNotificationError: jest.fn()
-          }}
-          handleHttpError={() => {}}
-        />
-      </MemoryRouter>
+    mountWithContexts(
+      <OrganizationNotifications />, { context: { network: {
+        api,
+        handleHttpError: () => {}
+      } } }
     );
   });
   test('handles api requests', () => {
-    const getOrganizationNotifications = jest.fn();
-    const getOrganizationNotificationSuccess = jest.fn();
-    const getOrganizationNotificationError = jest.fn();
-    const createOrganizationNotificationSuccess = jest.fn();
-    const createOrganizationNotificationError = jest.fn();
-    const wrapper = mount(
-      <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-        <_OrganizationNotifications
-          match={{ path: '/organizations/:id/notifications', url: '/organizations/1/notifications' }}
-          location={{ search: '', pathname: '/organizations/1/notifications' }}
-          params={{}}
-          api={{
-            getOrganizationNotifications,
-            getOrganizationNotificationSuccess,
-            getOrganizationNotificationError,
-            createOrganizationNotificationSuccess,
-            createOrganizationNotificationError
-          }}
-          handleHttpError={() => {}}
-        />
-      </MemoryRouter>
+    const wrapper = mountWithContexts(
+      <OrganizationNotifications />, { context: { network: {
+        api,
+        handleHttpError: () => {}
+      } } }
     ).find('OrganizationNotifications');
     wrapper.instance().readOrgNotifications(1, { foo: 'bar' });
-    expect(getOrganizationNotifications).toHaveBeenCalledWith(1, { foo: 'bar' });
+    expect(api.getOrganizationNotifications).toHaveBeenCalledWith(1, { foo: 'bar' });
     wrapper.instance().readOrgNotificationSuccess(1, { foo: 'bar' });
-    expect(getOrganizationNotificationSuccess).toHaveBeenCalledWith(1, { foo: 'bar' });
+    expect(api.getOrganizationNotificationSuccess).toHaveBeenCalledWith(1, { foo: 'bar' });
     wrapper.instance().readOrgNotificationError(1, { foo: 'bar' });
-    expect(getOrganizationNotificationError).toHaveBeenCalledWith(1, { foo: 'bar' });
+    expect(api.getOrganizationNotificationError).toHaveBeenCalledWith(1, { foo: 'bar' });
     wrapper.instance().createOrgNotificationSuccess(1, { id: 2 });
-    expect(createOrganizationNotificationSuccess).toHaveBeenCalledWith(1, { id: 2 });
+    expect(api.createOrganizationNotificationSuccess).toHaveBeenCalledWith(1, { id: 2 });
     wrapper.instance().createOrgNotificationError(1, { id: 2 });
-    expect(createOrganizationNotificationError).toHaveBeenCalledWith(1, { id: 2 });
+    expect(api.createOrganizationNotificationError).toHaveBeenCalledWith(1, { id: 2 });
   });
 });

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

@@ -1,12 +1,10 @@
 import React from 'react';
-import { mount, shallow } from 'enzyme';
-import { MemoryRouter, Router } from 'react-router-dom';
-import { I18nProvider } from '@lingui/react';
+import { shallow } from 'enzyme';
 import { createMemoryHistory } from 'history';
+import { mountWithContexts } from '../../../../enzymeHelpers';
 import { sleep } from '../../../../testUtils';
 import OrganizationTeams, { _OrganizationTeams } from '../../../../../src/pages/Organizations/screens/Organization/OrganizationTeams';
 import OrganizationTeamsList from '../../../../../src/pages/Organizations/components/OrganizationTeamsList';
-import { NetworkProvider } from '../../../../../src/contexts/Network';
 
 const listData = {
   data: {
@@ -38,19 +36,13 @@ describe('<OrganizationTeams />', () => {
 
   test('should load teams on mount', () => {
     const readOrganizationTeamsList = jest.fn(() => Promise.resolve(listData));
-    mount(
-      <I18nProvider>
-        <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-          <NetworkProvider
-            value={{ api: { readOrganizationTeamsList }, handleHttpError: () => {} }}
-          >
-            <OrganizationTeams
-              id={1}
-              searchString=""
-            />
-          </NetworkProvider>
-        </MemoryRouter>
-      </I18nProvider>
+    mountWithContexts(
+      <OrganizationTeams
+        id={1}
+        searchString=""
+      />, { context: {
+        network: { api: { readOrganizationTeamsList }, handleHttpError: () => {} } }
+      }
     ).find('OrganizationTeams');
     expect(readOrganizationTeamsList).toHaveBeenCalledWith(1, {
       page: 1,
@@ -61,19 +53,13 @@ describe('<OrganizationTeams />', () => {
 
   test('should pass fetched teams to list component', async () => {
     const readOrganizationTeamsList = jest.fn(() => Promise.resolve(listData));
-    const wrapper = mount(
-      <I18nProvider>
-        <MemoryRouter>
-          <NetworkProvider
-            value={{ api: { readOrganizationTeamsList }, handleHttpError: () => {} }}
-          >
-            <OrganizationTeams
-              id={1}
-              searchString=""
-            />
-          </NetworkProvider>
-        </MemoryRouter>
-      </I18nProvider>
+    const wrapper = mountWithContexts(
+      <OrganizationTeams
+        id={1}
+        searchString=""
+      />, { context: {
+        network: { api: { readOrganizationTeamsList }, handleHttpError: () => {} } }
+      }
     );
 
     await sleep(0);
@@ -105,19 +91,14 @@ describe('<OrganizationTeams />', () => {
     const history = createMemoryHistory({
       initialEntries: ['/organizations/1/teams'],
     });
-    const wrapper = mount(
-      <Router history={history}>
-        <I18nProvider>
-          <NetworkProvider
-            value={{ api: { readOrganizationTeamsList }, handleHttpError: () => {} }}
-          >
-            <OrganizationTeams
-              id={1}
-              searchString=""
-            />
-          </NetworkProvider>
-        </I18nProvider>
-      </Router>
+    const wrapper = mountWithContexts(
+      <OrganizationTeams
+        id={1}
+        searchString=""
+      />, { context: {
+        network: { api: { readOrganizationTeamsList }, handleHttpError: () => {} },
+        router: { history }
+      } }
     );
 
     await sleep(0);
@@ -132,7 +113,6 @@ describe('<OrganizationTeams />', () => {
 
     readOrganizationTeamsList.mockReturnValueOnce(page2Data);
     history.push('/organizations/1/teams?page=2');
-    wrapper.setProps({ history });
 
     await sleep(0);
     wrapper.update();

src/components/NotificationsList/Notifications.list.jsx

@@ -3,6 +3,7 @@ import React, {
   Fragment
 } from 'react';
 import PropTypes from 'prop-types';
+import { withRouter } from 'react-router-dom';
 import { Title, EmptyState, EmptyStateIcon, EmptyStateBody } from '@patternfly/react-core';
 import { CubesIcon } from '@patternfly/react-icons';
 import { I18n, i18nMark } from '@lingui/react';
@@ -344,4 +345,4 @@ Notifications.propTypes = {
 };
 
 export { Notifications as _Notifications };
-export default withNetwork(Notifications);
+export default withRouter(withNetwork(Notifications));

src/pages/Organizations/screens/Organization/OrganizationDetail.jsx

@@ -1,5 +1,5 @@
 import React, { Component } from 'react';
-import { Link } from 'react-router-dom';
+import { Link, withRouter } from 'react-router-dom';
 import { I18n } from '@lingui/react';
 import { Trans, t } from '@lingui/macro';
 
@@ -178,4 +178,4 @@ class OrganizationDetail extends Component {
   }
 }
 
-export default withNetwork(OrganizationDetail);
+export default withRouter(withNetwork(OrganizationDetail));

src/pages/Organizations/screens/Organization/OrganizationNotifications.jsx

@@ -41,12 +41,6 @@ class OrganizationNotifications extends Component {
   }
 
   render () {
-    const {
-      location,
-      match,
-      history
-    } = this.props;
-
     return (
       <NotificationsList
         onReadNotifications={this.readOrgNotifications}
@@ -54,9 +48,6 @@ class OrganizationNotifications extends Component {
         onReadError={this.readOrgNotificationError}
         onCreateSuccess={this.createOrgNotificationSuccess}
         onCreateError={this.createOrgNotificationError}
-        match={match}
-        location={location}
-        history={history}
       />
     );
   }