update tests based on i18n changes

__tests__/__snapshots__/enzymeHelpers.test.jsx.snap

@@ -21,29 +21,28 @@ exports[`mountWithContexts injected ConfigProvider should mount and render with
 
 exports[`mountWithContexts injected I18nProvider should mount and render 1`] = `
 <div>
-  <I18n
-    update={true}
-    withHash={true}
-  >
   <span>
     Text content
   </span>
-  </I18n>
 </div>
 `;
 
 exports[`mountWithContexts injected I18nProvider should mount and render deeply nested consumer 1`] = `
 <Parent>
-  <Child>
+  <WithI18n>
     <I18n
       update={true}
       withHash={true}
+    >
+      <Component
+        i18n={"/i18n/"}
       >
         <div>
           Text content
         </div>
+      </Component>
     </I18n>
-  </Child>
+  </WithI18n>
 </Parent>
 `;
 

__tests__/components/AddResourceRole.test.jsx

@@ -1,9 +1,9 @@
 import React from 'react';
 import { shallow } from 'enzyme';
 import { mountWithContexts } from '../enzymeHelpers';
-import AddResourceRole from '../../src/components/AddRole/AddResourceRole';
+import AddResourceRole, { _AddResourceRole } from '../../src/components/AddRole/AddResourceRole';
 
-describe('<AddResourceRole />', () => {
+describe('<_AddResourceRole />', () => {
   const readUsers = jest.fn().mockResolvedValue({
     data: {
       count: 2,
@@ -31,21 +31,23 @@ describe('<AddResourceRole />', () => {
   };
   test('initially renders without crashing', () => {
     shallow(
-      <AddResourceRole
+      <_AddResourceRole
         api={api}
         onClose={() => {}}
         onSave={() => {}}
         roles={roles}
+        i18n={{ _: val => val.toString() }}
       />
     );
   });
   test('handleRoleCheckboxClick properly updates state', () => {
     const wrapper = shallow(
-      <AddResourceRole
+      <_AddResourceRole
         api={api}
         onClose={() => {}}
         onSave={() => {}}
         roles={roles}
+        i18n={{ _: val => val.toString() }}
       />
     );
     wrapper.setState({
@@ -76,11 +78,12 @@ describe('<AddResourceRole />', () => {
   });
   test('handleResourceCheckboxClick properly updates state', () => {
     const wrapper = shallow(
-      <AddResourceRole
+      <_AddResourceRole
         api={api}
         onClose={() => {}}
         onSave={() => {}}
         roles={roles}
+        i18n={{ _: val => val.toString() }}
       />
     );
     wrapper.setState({
@@ -106,14 +109,13 @@ describe('<AddResourceRole />', () => {
     }]);
   });
   test('clicking user/team cards updates state', () => {
-    const spy = jest.spyOn(AddResourceRole.prototype, 'handleResourceSelect');
+    const spy = jest.spyOn(_AddResourceRole.prototype, 'handleResourceSelect');
     const wrapper = mountWithContexts(
       <AddResourceRole
         onClose={() => {}}
         onSave={() => {}}
-        api={api}
         roles={roles}
-      />
+      />, { context: { network: { api, handleHttpError: () => {} } } }
     ).find('AddResourceRole');
     const selectableCardWrapper = wrapper.find('SelectableCard');
     expect(selectableCardWrapper.length).toBe(2);
@@ -126,11 +128,12 @@ describe('<AddResourceRole />', () => {
   });
   test('readUsers and readTeams call out to corresponding api functions', () => {
     const wrapper = shallow(
-      <AddResourceRole
+      <_AddResourceRole
         api={api}
         onClose={() => {}}
         onSave={() => {}}
         roles={roles}
+        i18n={{ _: val => val.toString() }}
       />
     );
     wrapper.instance().readUsers({
@@ -150,11 +153,12 @@ describe('<AddResourceRole />', () => {
 
   test('handleResourceSelect clears out selected lists and sets selectedResource', () => {
     const wrapper = shallow(
-      <AddResourceRole
+      <_AddResourceRole
         api={api}
         onClose={() => {}}
         onSave={() => {}}
         roles={roles}
+        i18n={{ _: val => val.toString() }}
       />
     );
     wrapper.setState({
@@ -193,11 +197,10 @@ describe('<AddResourceRole />', () => {
     const handleSave = jest.fn();
     const wrapper = mountWithContexts(
       <AddResourceRole
-        api={api}
         onClose={() => {}}
         onSave={handleSave}
         roles={roles}
-      />
+      />, { context: { network: { api, handleHttpError: () => {} } } }
     ).find('AddResourceRole');
     wrapper.setState({
       selectedResource: 'users',

__tests__/components/AnsibleSelect.test.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { mountWithContexts } from '../enzymeHelpers';
 import AnsibleSelect from '../../src/components/AnsibleSelect';
+import { _AnsibleSelect } from '../../src/components/AnsibleSelect/AnsibleSelect';
 
 const label = 'test select';
 const mockData = ['/venv/baz/', '/venv/ansible/'];
@@ -18,7 +19,7 @@ describe('<AnsibleSelect />', () => {
   });
 
   test('calls "onSelectChange" on dropdown select change', () => {
-    const spy = jest.spyOn(AnsibleSelect.prototype, 'onSelectChange');
+    const spy = jest.spyOn(_AnsibleSelect.prototype, 'onSelectChange');
     const wrapper = mountWithContexts(
       <AnsibleSelect
         value="foo"

__tests__/components/Lookup.test.jsx

@@ -216,6 +216,7 @@ describe('<Lookup />', () => {
         getItems={getItems}
         handleHttpError={() => {}}
         location={{ history }}
+        i18n={{ _: val => val.toString() }}
       />
     );
 

__tests__/components/NotifyAndRedirect.test.jsx

@@ -11,6 +11,7 @@ describe('<NotifyAndRedirect />', () => {
         to="foo"
         setRootDialogMessage={setRootDialogMessage}
         location={{ pathname: 'foo' }}
+        i18n={{ _: val => val.toString() }}
       />
     );
     expect(setRootDialogMessage).toHaveBeenCalled();

__tests__/components/PaginatedDataList/__snapshots__/DeleteToolbarButton.test.jsx.snap

@@ -2,14 +2,11 @@
 
 exports[`<ToolbarDeleteButton /> should render button 1`] = `
 <ToolbarDeleteButton
+  i18n={"/i18n/"}
   itemName="item"
   itemsToDelete={Array []}
   onDelete={[Function]}
 >
-  <I18n
-    update={true}
-    withHash={true}
-  >
   <Tooltip
     appendTo={[Function]}
     className={null}
@@ -71,12 +68,14 @@ exports[`<ToolbarDeleteButton /> should render button 1`] = `
     >
       <ToolbarDeleteButton__Button
         aria-label="Delete"
+        className="awx-ToolBarBtn"
         isDisabled={true}
         onClick={[Function]}
         variant="plain"
       >
         <StyledComponent
           aria-label="Delete"
+          className="awx-ToolBarBtn"
           forwardedComponent={
             Object {
               "$$typeof": Symbol(react.forward_ref),
@@ -106,7 +105,7 @@ exports[`<ToolbarDeleteButton /> should render button 1`] = `
         >
           <Button
             aria-label="Delete"
-              className="ToolbarDeleteButton__Button-sc-1e3r0eg-0 iyjqWq"
+            className="awx-ToolBarBtn ToolbarDeleteButton__Button-sc-1e3r0eg-0 iyjqWq"
             component="button"
             isActive={false}
             isBlock={false}
@@ -120,13 +119,14 @@ exports[`<ToolbarDeleteButton /> should render button 1`] = `
             <button
               aria-disabled={null}
               aria-label="Delete"
-                className="pf-c-button pf-m-plain pf-m-disabled ToolbarDeleteButton__Button-sc-1e3r0eg-0 iyjqWq"
+              className="pf-c-button pf-m-plain pf-m-disabled awx-ToolBarBtn ToolbarDeleteButton__Button-sc-1e3r0eg-0 iyjqWq"
               disabled={true}
               onClick={[Function]}
               tabIndex={null}
               type="button"
             >
               <TrashAltIcon
+                className="awx-ToolBarTrashCanIcon"
                 color="currentColor"
                 size="sm"
                 title={null}
@@ -134,6 +134,7 @@ exports[`<ToolbarDeleteButton /> should render button 1`] = `
                 <svg
                   aria-hidden={true}
                   aria-labelledby={null}
+                  className="awx-ToolBarTrashCanIcon"
                   fill="currentColor"
                   height="1em"
                   role="img"
@@ -198,6 +199,5 @@ exports[`<ToolbarDeleteButton /> should render button 1`] = `
       </Portal>
     </Tippy>
   </Tooltip>
-  </I18n>
 </ToolbarDeleteButton>
 `;

__tests__/components/SelectResourceStep.test.jsx

@@ -3,7 +3,7 @@ import { createMemoryHistory } from 'history';
 import { shallow } from 'enzyme';
 import { mountWithContexts } from '../enzymeHelpers';
 import { sleep } from '../testUtils';
-import SelectResourceStep, { _SelectResourceStep } from '../../src/components/AddRole/SelectResourceStep';
+import SelectResourceStep from '../../src/components/AddRole/SelectResourceStep';
 
 describe('<SelectResourceStep />', () => {
   const columns = [
@@ -67,15 +67,14 @@ describe('<SelectResourceStep />', () => {
       initialEntries: ['/organizations/1/access?resource.page=1&resource.order_by=-username'],
     });
     const wrapper = await mountWithContexts(
-      <_SelectResourceStep
+      <SelectResourceStep
         columns={columns}
         displayKey="username"
         onRowClick={() => {}}
         onSearch={handleSearch}
         selectedResourceRows={selectedResourceRows}
         sortedColumnKey="username"
-        location={history.location}
+      />, { context: { router: { history, route: { location: history.location } } } }
-      />
     ).find('SelectResourceStep');
     await wrapper.instance().readResourceList();
     expect(handleSearch).toHaveBeenCalledWith({

__tests__/components/SelectRoleStep.test.jsx

@@ -1,5 +1,6 @@
 import React from 'react';
-import { mount, shallow } from 'enzyme';
+import { shallow } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import SelectRoleStep from '../../src/components/AddRole/SelectRoleStep';
 
 describe('<SelectRoleStep />', () => {
@@ -42,7 +43,7 @@ describe('<SelectRoleStep />', () => {
   });
   test('clicking role fires onRolesClick callback', () => {
     const onRolesClick = jest.fn();
-    wrapper = mount(
+    wrapper = mountWithContexts(
       <SelectRoleStep
         onRolesClick={onRolesClick}
         roles={roles}

__tests__/components/__snapshots__/NotificationListItem.test.jsx.snap

@@ -5,6 +5,7 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
   canToggleNotifications={true}
   detailUrl="/foo"
   errorTurnedOn={false}
+  i18n={"/i18n/"}
   notification={
     Object {
       "id": 9000,
@@ -15,10 +16,6 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
   successTurnedOn={false}
   toggleNotification={[MockFunction]}
 >
-  <I18n
-    update={true}
-    withHash={true}
-  >
   <DataListItem
     aria-labelledby="items-list-item-9000"
     className=""
@@ -451,10 +448,94 @@ exports[`<NotificationListItem canToggleNotifications /> initially renders succe
               </NotificationListItem__DataListCell>
             </div>
           </DataListItemCells>
+          <NotificationListItem__Switch
+            aria-label="Toggle notification failure"
+            id="notification-9000-error-toggle"
+            isChecked={false}
+            isDisabled={false}
+            key=".1"
+            label="Failure"
+            onChange={[Function]}
+            rowid="items-list-item-9000"
+          >
+            <StyledComponent
+              aria-label="Toggle notification failure"
+              forwardedComponent={
+                Object {
+                  "$$typeof": Symbol(react.forward_ref),
+                  "attrs": Array [],
+                  "componentStyle": ComponentStyle {
+                    "componentId": "NotificationListItem__Switch-j7c411-1",
+                    "isStatic": true,
+                    "lastClassName": "ceuHGn",
+                    "rules": Array [
+                      "display:flex;flex-wrap:no-wrap;",
+                    ],
+                  },
+                  "displayName": "NotificationListItem__Switch",
+                  "foldedComponentIds": Array [],
+                  "render": [Function],
+                  "styledComponentId": "NotificationListItem__Switch-j7c411-1",
+                  "target": [Function],
+                  "toString": [Function],
+                  "warnTooManyClasses": [Function],
+                  "withComponent": [Function],
+                }
+              }
+              forwardedRef={null}
+              id="notification-9000-error-toggle"
+              isChecked={false}
+              isDisabled={false}
+              label="Failure"
+              onChange={[Function]}
+              rowid="items-list-item-9000"
+            >
+              <Switch
+                aria-label="Toggle notification failure"
+                className="NotificationListItem__Switch-j7c411-1 ceuHGn"
+                id="notification-9000-error-toggle"
+                isChecked={false}
+                isDisabled={false}
+                label="Failure"
+                onChange={[Function]}
+                rowid="items-list-item-9000"
+              >
+                <label
+                  className="pf-c-switch NotificationListItem__Switch-j7c411-1 ceuHGn"
+                  htmlFor="notification-9000-error-toggle"
+                >
+                  <input
+                    aria-label="Toggle notification failure"
+                    checked={false}
+                    className="pf-c-switch__input"
+                    disabled={false}
+                    id="notification-9000-error-toggle"
+                    onChange={[Function]}
+                    rowid="items-list-item-9000"
+                    type="checkbox"
+                  />
+                  <span
+                    className="pf-c-switch__toggle"
+                  />
+                  <span
+                    aria-hidden="true"
+                    className="pf-c-switch__label pf-m-on"
+                  >
+                    Failure
+                  </span>
+                  <span
+                    aria-hidden="true"
+                    className="pf-c-switch__label pf-m-off"
+                  >
+                    Failure
+                  </span>
+                </label>
+              </Switch>
+            </StyledComponent>
+          </NotificationListItem__Switch>
         </div>
       </DataListItemRow>
     </li>
   </DataListItem>
-  </I18n>
 </NotificationListItem>
 `;

__tests__/enzymeHelpers.test.jsx

@@ -1,7 +1,6 @@
 import React from 'react';
 import { Link } from 'react-router-dom';
-// import { mount } from 'enzyme';
+import { withI18n } from '@lingui/react';
-import { I18n } from '@lingui/react';
 import { t } from '@lingui/macro';
 import { mountWithContexts } from './enzymeHelpers';
 import { Config } from '../src/contexts/Config';
@@ -11,26 +10,19 @@ import { withRootDialog } from '../src/contexts/RootDialog';
 describe('mountWithContexts', () => {
   describe('injected I18nProvider', () => {
     test('should mount and render', () => {
-      const wrapper = mountWithContexts(
+      const Child = withI18n()(({ i18n }) => (
         <div>
-          <I18n>
-            {({ i18n }) => (
           <span>{i18n._(t`Text content`)}</span>
-            )}
-          </I18n>
         </div>
-      );
+      ));
+      const wrapper = mountWithContexts(<Child />);
       expect(wrapper.find('div')).toMatchSnapshot();
     });
 
     test('should mount and render deeply nested consumer', () => {
-      const Child = () => (
+      const Child = withI18n()(({ i18n }) => (
-        <I18n>
-          {({ i18n }) => (
         <div>{i18n._(t`Text content`)}</div>
-          )}
+      ));
-        </I18n>
-      );
       const Parent = () => (<Child />);
       const wrapper = mountWithContexts(<Parent />);
       expect(wrapper.find('Parent')).toMatchSnapshot();

__tests__/pages/Applications.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Applications from '../../src/pages/Applications';
 
 describe('<Applications />', () => {
@@ -8,7 +8,7 @@ describe('<Applications />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Applications />);
+    pageWrapper = mountWithContexts(<Applications />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/AuthSettings.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import AuthSettings from '../../src/pages/AuthSettings';
 
 describe('<AuthSettings />', () => {
@@ -8,7 +8,7 @@ describe('<AuthSettings />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<AuthSettings />);
+    pageWrapper = mountWithContexts(<AuthSettings />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/CredentialTypes.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import CredentialTypes from '../../src/pages/CredentialTypes';
 
 describe('<CredentialTypes />', () => {
@@ -8,7 +8,7 @@ describe('<CredentialTypes />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<CredentialTypes />);
+    pageWrapper = mountWithContexts(<CredentialTypes />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Credentials.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Credentials from '../../src/pages/Credentials';
 
 describe('<Credentials />', () => {
@@ -8,7 +8,7 @@ describe('<Credentials />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Credentials />);
+    pageWrapper = mountWithContexts(<Credentials />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Dashboard.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Dashboard from '../../src/pages/Dashboard';
 
 describe('<Dashboard />', () => {
@@ -8,7 +8,7 @@ describe('<Dashboard />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Dashboard />);
+    pageWrapper = mountWithContexts(<Dashboard />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/InstanceGroups.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import InstanceGroups from '../../src/pages/InstanceGroups';
 
 describe('<InstanceGroups />', () => {
@@ -8,7 +8,7 @@ describe('<InstanceGroups />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<InstanceGroups />);
+    pageWrapper = mountWithContexts(<InstanceGroups />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Inventories.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Inventories from '../../src/pages/Inventories';
 
 describe('<Inventories />', () => {
@@ -8,7 +8,7 @@ describe('<Inventories />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Inventories />);
+    pageWrapper = mountWithContexts(<Inventories />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/InventoryScripts.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import InventoryScripts from '../../src/pages/InventoryScripts';
 
 describe('<InventoryScripts />', () => {
@@ -8,7 +8,7 @@ describe('<InventoryScripts />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<InventoryScripts />);
+    pageWrapper = mountWithContexts(<InventoryScripts />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Jobs.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Jobs from '../../src/pages/Jobs';
 
 describe('<Jobs />', () => {
@@ -8,7 +8,7 @@ describe('<Jobs />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Jobs />);
+    pageWrapper = mountWithContexts(<Jobs />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/JobsSettings.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import JobsSettings from '../../src/pages/JobsSettings';
 
 describe('<JobsSettings />', () => {
@@ -8,7 +8,7 @@ describe('<JobsSettings />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<JobsSettings />);
+    pageWrapper = mountWithContexts(<JobsSettings />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/License.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import License from '../../src/pages/License';
 
 describe('<License />', () => {
@@ -8,7 +8,7 @@ describe('<License />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<License />);
+    pageWrapper = mountWithContexts(<License />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Login.test.jsx

@@ -1,9 +1,7 @@
 import React from 'react';
-import { MemoryRouter } from 'react-router-dom';
+import { mountWithContexts } from '../enzymeHelpers';
-import { mount } from 'enzyme';
-import { I18nProvider } from '@lingui/react';
 import { asyncFlush } from '../../jest.setup';
-import { _AWXLogin } from '../../src/pages/Login';
+import AWXLogin from '../../src/pages/Login';
 import APIClient from '../../src/api';
 
 describe('<Login />', () => {
@@ -18,6 +16,12 @@ describe('<Login />', () => {
 
   const api = new APIClient({});
 
+  const mountLogin = () => {
+    loginWrapper = mountWithContexts(<AWXLogin />, { context: { network: {
+      api, handleHttpError: () => {}
+    } } });
+  };
+
   const findChildren = () => {
     awxLogin = loginWrapper.find('AWXLogin');
     loginPage = loginWrapper.find('LoginPage');
@@ -28,22 +32,13 @@ describe('<Login />', () => {
     loginHeaderLogo = loginPage.find('img');
   };
 
-  beforeEach(() => {
-    loginWrapper = mount(
-      <MemoryRouter>
-        <I18nProvider>
-          <_AWXLogin api={api} clearRootDialogMessage={() => {}} handleHttpError={() => {}} />
-        </I18nProvider>
-      </MemoryRouter>
-    );
-    findChildren();
-  });
-
   afterEach(() => {
     loginWrapper.unmount();
   });
 
   test('initially renders without crashing', () => {
+    mountLogin();
+    findChildren();
     expect(loginWrapper.length).toBe(1);
     expect(loginPage.length).toBe(1);
     expect(loginForm.length).toBe(1);
@@ -58,13 +53,7 @@ describe('<Login />', () => {
   });
 
   test('custom logo renders Brand component with correct src and alt', () => {
-    loginWrapper = mount(
+    loginWrapper = mountWithContexts(<AWXLogin logo="images/foo.jpg" alt="Foo Application" />);
-      <MemoryRouter>
-        <I18nProvider>
-          <_AWXLogin api={api} logo="images/foo.jpg" alt="Foo Application" />
-        </I18nProvider>
-      </MemoryRouter>
-    );
     findChildren();
     expect(loginHeaderLogo.length).toBe(1);
     expect(loginHeaderLogo.props().src).toBe('data:image/jpeg;images/foo.jpg');
@@ -72,13 +61,7 @@ describe('<Login />', () => {
   });
 
   test('default logo renders Brand component with correct src and alt', () => {
-    loginWrapper = mount(
+    mountLogin();
-      <MemoryRouter>
-        <I18nProvider>
-          <_AWXLogin api={api} />
-        </I18nProvider>
-      </MemoryRouter>
-    );
     findChildren();
     expect(loginHeaderLogo.length).toBe(1);
     expect(loginHeaderLogo.props().src).toBe('tower-logo-header.svg');
@@ -86,6 +69,8 @@ describe('<Login />', () => {
   });
 
   test('state maps to un/pw input value props', () => {
+    mountLogin();
+    findChildren();
     awxLogin.setState({ username: 'un', password: 'pw' });
     expect(awxLogin.state().username).toBe('un');
     expect(awxLogin.state().password).toBe('pw');
@@ -95,6 +80,8 @@ describe('<Login />', () => {
   });
 
   test('updating un/pw clears out error', () => {
+    mountLogin();
+    findChildren();
     awxLogin.setState({ isInputValid: false });
     expect(loginWrapper.find('.pf-c-form__helper-text.pf-m-error').length).toBe(1);
     usernameInput.instance().value = 'uname';
@@ -113,6 +100,8 @@ describe('<Login />', () => {
 
   test('api.login not called when loading', () => {
     api.login = jest.fn().mockImplementation(() => Promise.resolve({}));
+    mountLogin();
+    findChildren();
     expect(awxLogin.state().isLoading).toBe(false);
     awxLogin.setState({ isLoading: true });
     submitButton.simulate('click');
@@ -121,6 +110,8 @@ describe('<Login />', () => {
 
   test('submit calls api.login successfully', async () => {
     api.login = jest.fn().mockImplementation(() => Promise.resolve({}));
+    mountLogin();
+    findChildren();
     expect(awxLogin.state().isLoading).toBe(false);
     awxLogin.setState({ username: 'unamee', password: 'pwordd' });
     submitButton.simulate('click');
@@ -137,6 +128,8 @@ describe('<Login />', () => {
       err.response = { status: 401, message: 'problem' };
       return Promise.reject(err);
     });
+    mountLogin();
+    findChildren();
     expect(awxLogin.state().isLoading).toBe(false);
     expect(awxLogin.state().isInputValid).toBe(true);
     awxLogin.setState({ username: 'unamee', password: 'pwordd' });
@@ -155,6 +148,8 @@ describe('<Login />', () => {
       err.response = { status: 500, message: 'problem' };
       return Promise.reject(err);
     });
+    mountLogin();
+    findChildren();
     expect(awxLogin.state().isLoading).toBe(false);
     awxLogin.setState({ username: 'unamee', password: 'pwordd' });
     submitButton.simulate('click');
@@ -166,6 +161,8 @@ describe('<Login />', () => {
   });
 
   test('render Redirect to / when already authenticated', () => {
+    mountLogin();
+    findChildren();
     awxLogin.setState({ isAuthenticated: true });
     const redirectElem = loginWrapper.find('Redirect');
     expect(redirectElem.length).toBe(1);

__tests__/pages/ManagementJobs.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import ManagementJobs from '../../src/pages/ManagementJobs';
 
 describe('<ManagementJobs />', () => {
@@ -8,7 +8,7 @@ describe('<ManagementJobs />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<ManagementJobs />);
+    pageWrapper = mountWithContexts(<ManagementJobs />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/NotifcationTemplates.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import NotificationTemplates from '../../src/pages/NotificationTemplates';
 
 describe('<NotificationTemplates />', () => {
@@ -8,7 +8,7 @@ describe('<NotificationTemplates />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<NotificationTemplates />);
+    pageWrapper = mountWithContexts(<NotificationTemplates />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Organizations/components/__snapshots__/DeleteRoleConfirmationModal.test.jsx.snap

@@ -2,6 +2,7 @@
 
 exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
 <DeleteRoleConfirmationModal
+  i18n={"/i18n/"}
   onCancel={[Function]}
   onConfirm={[Function]}
   role={
@@ -16,10 +17,6 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
   }
   username="jane"
 >
-  <I18n
-    update={true}
-    withHash={true}
-  >
   <_default
     actions={
       Array [
@@ -57,7 +54,7 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
     }
     isOpen={true}
     onClose={[Function]}
-      title="Remove Team Access"
+    title="Remove {0} Access"
     variant="danger"
   >
     <Modal
@@ -102,7 +99,7 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
       isOpen={true}
       isSmall={false}
       onClose={[Function]}
-        title="Remove Team Access"
+      title="Remove {0} Access"
       width={null}
     >
       <Portal
@@ -119,7 +116,7 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                 >
                   <div
                     aria-describedby="pf-modal-0"
-                      aria-label="Remove Team Access"
+                    aria-label="Remove {0} Access"
                     aria-modal="true"
                     class="pf-c-modal-box awx-c-modal at-c-alertModal at-c-alertModal--danger"
                     role="dialog"
@@ -148,13 +145,17 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                       class="pf-c-title pf-m-2xl"
                     >
                        
-                        Remove Team Access
+                      Remove {0} Access
                        
                     </h3>
                     <div
                       class="pf-c-modal-box__body"
                       id="pf-modal-0"
                     >
+                      Are you sure you want to remove {0} access from {1}?  Doing so affects all members of the team.
+                      <br />
+                      <br />
+                      If you {0} want to remove access for this particular user, please remove them from the team.
                       <svg
                         aria-hidden="true"
                         class="at-c-alertModal__icon"
@@ -240,7 +241,7 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
           isOpen={true}
           isSmall={false}
           onClose={[Function]}
-            title="Remove Team Access"
+          title="Remove {0} Access"
           width={null}
         >
           <Backdrop
@@ -281,11 +282,11 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                             "width": null,
                           }
                         }
-                          title="Remove Team Access"
+                        title="Remove {0} Access"
                       >
                         <div
                           aria-describedby="pf-modal-0"
-                            aria-label="Remove Team Access"
+                          aria-label="Remove {0} Access"
                           aria-modal="true"
                           className="pf-c-modal-box awx-c-modal at-c-alertModal at-c-alertModal--danger"
                           role="dialog"
@@ -362,7 +363,7 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                                 className="pf-c-title pf-m-2xl"
                               >
                                  
-                                  Remove Team Access
+                                Remove {0} Access
                                  
                               </h3>
                             </Title>
@@ -375,55 +376,10 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
                               className="pf-c-modal-box__body"
                               id="pf-modal-0"
                             >
-                                <WithI18n
+                              Are you sure you want to remove {0} access from {1}?  Doing so affects all members of the team.
-                                  components={
+                              <br />
-                                    Array [
+                              <br />
-                                      <b />,
+                              If you {0} want to remove access for this particular user, please remove them from the team.
-                                      <b />,
-                                      <br />,
-                                      <br />,
-                                      <b />,
-                                      <i />,
-                                    ]
-                                  }
-                                  id="Are you sure you want to remove<0> {0} </0>access from<1> {1}</1>?  Doing so affects all members of the team.<2/><3/>If you<4><5> only </5></4>want to remove access for this particular user, please remove them from the team."
-                                  values={
-                                    Object {
-                                      "0": "Member",
-                                      "1": "The Team",
-                                    }
-                                  }
-                                >
-                                  <I18n
-                                    update={true}
-                                    withHash={true}
-                                  >
-                                    <Trans
-                                      components={
-                                        Array [
-                                          <b />,
-                                          <b />,
-                                          <br />,
-                                          <br />,
-                                          <b />,
-                                          <i />,
-                                        ]
-                                      }
-                                      i18n={"/i18n/"}
-                                      id="Are you sure you want to remove<0> {0} </0>access from<1> {1}</1>?  Doing so affects all members of the team.<2/><3/>If you<4><5> only </5></4>want to remove access for this particular user, please remove them from the team."
-                                      values={
-                                        Object {
-                                          "0": "Member",
-                                          "1": "The Team",
-                                        }
-                                      }
-                                    >
-                                      <Render
-                                        value={null}
-                                      />
-                                    </Trans>
-                                  </I18n>
-                                </WithI18n>
                               <ExclamationCircleIcon
                                 className="at-c-alertModal__icon"
                                 color="currentColor"
@@ -527,6 +483,5 @@ exports[`<DeleteRoleConfirmationModal /> should render initially 1`] = `
       </Portal>
     </Modal>
   </_default>
-  </I18n>
 </DeleteRoleConfirmationModal>
 `;

__tests__/pages/Organizations/components/__snapshots__/OrganizationAccessItem.test.jsx.snap

@@ -29,12 +29,9 @@ exports[`<OrganizationAccessItem /> initially renders succesfully 1`] = `
       "username": "jane",
     }
   }
+  i18n={"/i18n/"}
   onRoleDelete={[Function]}
 >
-  <I18n
-    update={true}
-    withHash={true}
-  >
   <DataListItem
     aria-labelledby="access-list-item"
     className=""
@@ -434,6 +431,5 @@ exports[`<OrganizationAccessItem /> initially renders succesfully 1`] = `
       </DataListItemRow>
     </li>
   </DataListItem>
-  </I18n>
 </OrganizationAccessItem>
 `;

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

@@ -5,6 +5,7 @@ exports[`<OrganizationAccess /> initially renders succesfully 1`] = `
   api={"/api/"}
   handleHttpError={[Function]}
   history={"/history/"}
+  i18n={"/i18n/"}
   location={
     Object {
       "hash": "",

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

@@ -56,8 +56,69 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                       "url": "",
                     }
                   }
+                >
+                  <WithI18n
+                    itemCount={2}
+                    itemName="notification"
+                    items={
+                      Array [
+                        Object {
+                          "id": 1,
+                          "name": "Notification one",
+                          "notification_type": "email",
+                          "url": "/api/v2/notification_templates/1/",
+                        },
+                        Object {
+                          "id": 2,
+                          "name": "Notification two",
+                          "notification_type": "email",
+                          "url": "/api/v2/notification_templates/2/",
+                        },
+                      ]
+                    }
+                    qsConfig={
+                      Object {
+                        "defaultParams": Object {
+                          "order_by": "name",
+                          "page": 1,
+                          "page_size": 5,
+                        },
+                        "integerFields": Array [
+                          "page",
+                          "page_size",
+                        ],
+                        "namespace": "notification",
+                      }
+                    }
+                    renderItem={[Function]}
+                    toolbarColumns={
+                      Array [
+                        Object {
+                          "isSortable": true,
+                          "key": "name",
+                          "name": "Name",
+                        },
+                        Object {
+                          "isNumeric": true,
+                          "isSortable": true,
+                          "key": "modified",
+                          "name": "Modified",
+                        },
+                        Object {
+                          "isNumeric": true,
+                          "isSortable": true,
+                          "key": "created",
+                          "name": "Created",
+                        },
+                      ]
+                    }
+                  >
+                    <I18n
+                      update={true}
+                      withHash={true}
                     >
                       <withRouter(PaginatedDataList)
+                        i18n={"/i18n/"}
                         itemCount={2}
                         itemName="notification"
                         items={
@@ -118,6 +179,7 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                             additionalControls={Array []}
                             alignToolbarLeft={false}
                             history={"/history/"}
+                            i18n={"/i18n/"}
                             isAllSelected={false}
                             itemCount={2}
                             itemName="notification"
@@ -194,6 +256,37 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                 },
                               ]
                             }
+                          >
+                            <WithI18n
+                              additionalControls={Array []}
+                              columns={
+                                Array [
+                                  Object {
+                                    "isSortable": true,
+                                    "key": "name",
+                                    "name": "Name",
+                                  },
+                                  Object {
+                                    "isNumeric": true,
+                                    "isSortable": true,
+                                    "key": "modified",
+                                    "name": "Modified",
+                                  },
+                                  Object {
+                                    "isNumeric": true,
+                                    "isSortable": true,
+                                    "key": "created",
+                                    "name": "Created",
+                                  },
+                                ]
+                              }
+                              isAllSelected={false}
+                              onSearch={[Function]}
+                              onSelectAll={null}
+                              onSort={[Function]}
+                              showSelectAll={false}
+                              sortOrder="ascending"
+                              sortedColumnKey="name"
                             >
                               <I18n
                                 update={true}
@@ -222,6 +315,7 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                       },
                                     ]
                                   }
+                                  i18n={"/i18n/"}
                                   isAllSelected={false}
                                   isCompact={false}
                                   noLeftMargin={false}
@@ -233,10 +327,6 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                   showSelectAll={false}
                                   sortOrder="ascending"
                                   sortedColumnKey="name"
-                          >
-                            <I18n
-                              update={true}
-                              withHash={true}
                                 >
                                   <DataListToolbar__AWXToolbar>
                                     <StyledComponent
@@ -367,7 +457,7 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                                             <div
                                                               className="pf-l-toolbar__item sc-bwzfXH iBEPfq"
                                                             >
-                                                          <Search
+                                                              <WithI18n
                                                                 columns={
                                                                   Array [
                                                                     Object {
@@ -395,6 +485,32 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                                                 <I18n
                                                                   update={true}
                                                                   withHash={true}
+                                                                >
+                                                                  <Search
+                                                                    columns={
+                                                                      Array [
+                                                                        Object {
+                                                                          "isSortable": true,
+                                                                          "key": "name",
+                                                                          "name": "Name",
+                                                                        },
+                                                                        Object {
+                                                                          "isNumeric": true,
+                                                                          "isSortable": true,
+                                                                          "key": "modified",
+                                                                          "name": "Modified",
+                                                                        },
+                                                                        Object {
+                                                                          "isNumeric": true,
+                                                                          "isSortable": true,
+                                                                          "key": "created",
+                                                                          "name": "Created",
+                                                                        },
+                                                                      ]
+                                                                    }
+                                                                    i18n={"/i18n/"}
+                                                                    onSearch={[Function]}
+                                                                    sortedColumnKey="name"
                                                                   >
                                                                     <div
                                                                       className="pf-c-input-group"
@@ -868,8 +984,9 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                                                         </StyledComponent>
                                                                       </Search__Button>
                                                                     </div>
-                                                            </I18n>
                                                                   </Search>
+                                                                </I18n>
+                                                              </WithI18n>
                                                             </div>
                                                           </ToolbarItem>
                                                         </StyledComponent>
@@ -933,7 +1050,7 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                                         <div
                                                           className="pf-l-toolbar__item"
                                                         >
-                                                      <Sort
+                                                          <WithI18n
                                                             columns={
                                                               Array [
                                                                 Object {
@@ -962,6 +1079,33 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                                             <I18n
                                                               update={true}
                                                               withHash={true}
+                                                            >
+                                                              <Sort
+                                                                columns={
+                                                                  Array [
+                                                                    Object {
+                                                                      "isSortable": true,
+                                                                      "key": "name",
+                                                                      "name": "Name",
+                                                                    },
+                                                                    Object {
+                                                                      "isNumeric": true,
+                                                                      "isSortable": true,
+                                                                      "key": "modified",
+                                                                      "name": "Modified",
+                                                                    },
+                                                                    Object {
+                                                                      "isNumeric": true,
+                                                                      "isSortable": true,
+                                                                      "key": "created",
+                                                                      "name": "Created",
+                                                                    },
+                                                                  ]
+                                                                }
+                                                                i18n={"/i18n/"}
+                                                                onSort={[Function]}
+                                                                sortOrder="ascending"
+                                                                sortedColumnKey="name"
                                                               >
                                                                 <Sort__Dropdown
                                                                   dropdownItems={
@@ -1405,8 +1549,9 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                                                     </Button>
                                                                   </StyledComponent>
                                                                 </Styled(Button)>
-                                                        </I18n>
                                                               </Sort>
+                                                            </I18n>
+                                                          </WithI18n>
                                                         </div>
                                                       </ToolbarItem>
                                                       <DataListToolbar__AdditionalControlsWrapper>
@@ -1450,8 +1595,9 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                       </div>
                                     </StyledComponent>
                                   </DataListToolbar__AWXToolbar>
-                            </I18n>
                                 </DataListToolbar>
+                              </I18n>
+                            </WithI18n>
                             <DataList
                               aria-label="{0} List"
                               className=""
@@ -1461,7 +1607,7 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                 className="pf-c-data-list"
                                 role="list"
                               >
-                              <NotificationListItem
+                                <WithI18n
                                   canToggleNotifications={true}
                                   detailUrl="/notifications/1"
                                   errorTurnedOn={false}
@@ -1480,6 +1626,22 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                   <I18n
                                     update={true}
                                     withHash={true}
+                                  >
+                                    <NotificationListItem
+                                      canToggleNotifications={true}
+                                      detailUrl="/notifications/1"
+                                      errorTurnedOn={false}
+                                      i18n={"/i18n/"}
+                                      notification={
+                                        Object {
+                                          "id": 1,
+                                          "name": "Notification one",
+                                          "notification_type": "email",
+                                          "url": "/api/v2/notification_templates/1/",
+                                        }
+                                      }
+                                      successTurnedOn={true}
+                                      toggleNotification={[Function]}
                                     >
                                       <DataListItem
                                         aria-labelledby="items-list-item-1"
@@ -1913,13 +2075,99 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                                   </NotificationListItem__DataListCell>
                                                 </div>
                                               </DataListItemCells>
+                                              <NotificationListItem__Switch
+                                                aria-label="Toggle notification failure"
+                                                id="notification-1-error-toggle"
+                                                isChecked={false}
+                                                isDisabled={false}
+                                                key=".1"
+                                                label="Failure"
+                                                onChange={[Function]}
+                                                rowid="items-list-item-1"
+                                              >
+                                                <StyledComponent
+                                                  aria-label="Toggle notification failure"
+                                                  forwardedComponent={
+                                                    Object {
+                                                      "$$typeof": Symbol(react.forward_ref),
+                                                      "attrs": Array [],
+                                                      "componentStyle": ComponentStyle {
+                                                        "componentId": "NotificationListItem__Switch-j7c411-1",
+                                                        "isStatic": true,
+                                                        "lastClassName": "ceuHGn",
+                                                        "rules": Array [
+                                                          "display:flex;flex-wrap:no-wrap;",
+                                                        ],
+                                                      },
+                                                      "displayName": "NotificationListItem__Switch",
+                                                      "foldedComponentIds": Array [],
+                                                      "render": [Function],
+                                                      "styledComponentId": "NotificationListItem__Switch-j7c411-1",
+                                                      "target": [Function],
+                                                      "toString": [Function],
+                                                      "warnTooManyClasses": [Function],
+                                                      "withComponent": [Function],
+                                                    }
+                                                  }
+                                                  forwardedRef={null}
+                                                  id="notification-1-error-toggle"
+                                                  isChecked={false}
+                                                  isDisabled={false}
+                                                  label="Failure"
+                                                  onChange={[Function]}
+                                                  rowid="items-list-item-1"
+                                                >
+                                                  <Switch
+                                                    aria-label="Toggle notification failure"
+                                                    className="NotificationListItem__Switch-j7c411-1 ceuHGn"
+                                                    id="notification-1-error-toggle"
+                                                    isChecked={false}
+                                                    isDisabled={false}
+                                                    label="Failure"
+                                                    onChange={[Function]}
+                                                    rowid="items-list-item-1"
+                                                  >
+                                                    <label
+                                                      className="pf-c-switch NotificationListItem__Switch-j7c411-1 ceuHGn"
+                                                      htmlFor="notification-1-error-toggle"
+                                                    >
+                                                      <input
+                                                        aria-label="Toggle notification failure"
+                                                        checked={false}
+                                                        className="pf-c-switch__input"
+                                                        disabled={false}
+                                                        id="notification-1-error-toggle"
+                                                        onChange={[Function]}
+                                                        rowid="items-list-item-1"
+                                                        type="checkbox"
+                                                      />
+                                                      <span
+                                                        className="pf-c-switch__toggle"
+                                                      />
+                                                      <span
+                                                        aria-hidden="true"
+                                                        className="pf-c-switch__label pf-m-on"
+                                                      >
+                                                        Failure
+                                                      </span>
+                                                      <span
+                                                        aria-hidden="true"
+                                                        className="pf-c-switch__label pf-m-off"
+                                                      >
+                                                        Failure
+                                                      </span>
+                                                    </label>
+                                                  </Switch>
+                                                </StyledComponent>
+                                              </NotificationListItem__Switch>
                                             </div>
                                           </DataListItemRow>
                                         </li>
                                       </DataListItem>
-                                </I18n>
                                     </NotificationListItem>
-                              <NotificationListItem
+                                  </I18n>
+                                </WithI18n>
+                                <WithI18n
                                   canToggleNotifications={true}
                                   detailUrl="/notifications/2"
                                   errorTurnedOn={true}
@@ -1938,6 +2186,22 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                   <I18n
                                     update={true}
                                     withHash={true}
+                                  >
+                                    <NotificationListItem
+                                      canToggleNotifications={true}
+                                      detailUrl="/notifications/2"
+                                      errorTurnedOn={true}
+                                      i18n={"/i18n/"}
+                                      notification={
+                                        Object {
+                                          "id": 2,
+                                          "name": "Notification two",
+                                          "notification_type": "email",
+                                          "url": "/api/v2/notification_templates/2/",
+                                        }
+                                      }
+                                      successTurnedOn={false}
+                                      toggleNotification={[Function]}
                                     >
                                       <DataListItem
                                         aria-labelledby="items-list-item-2"
@@ -2371,16 +2635,114 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                                   </NotificationListItem__DataListCell>
                                                 </div>
                                               </DataListItemCells>
+                                              <NotificationListItem__Switch
+                                                aria-label="Toggle notification failure"
+                                                id="notification-2-error-toggle"
+                                                isChecked={true}
+                                                isDisabled={false}
+                                                key=".1"
+                                                label="Failure"
+                                                onChange={[Function]}
+                                                rowid="items-list-item-2"
+                                              >
+                                                <StyledComponent
+                                                  aria-label="Toggle notification failure"
+                                                  forwardedComponent={
+                                                    Object {
+                                                      "$$typeof": Symbol(react.forward_ref),
+                                                      "attrs": Array [],
+                                                      "componentStyle": ComponentStyle {
+                                                        "componentId": "NotificationListItem__Switch-j7c411-1",
+                                                        "isStatic": true,
+                                                        "lastClassName": "ceuHGn",
+                                                        "rules": Array [
+                                                          "display:flex;flex-wrap:no-wrap;",
+                                                        ],
+                                                      },
+                                                      "displayName": "NotificationListItem__Switch",
+                                                      "foldedComponentIds": Array [],
+                                                      "render": [Function],
+                                                      "styledComponentId": "NotificationListItem__Switch-j7c411-1",
+                                                      "target": [Function],
+                                                      "toString": [Function],
+                                                      "warnTooManyClasses": [Function],
+                                                      "withComponent": [Function],
+                                                    }
+                                                  }
+                                                  forwardedRef={null}
+                                                  id="notification-2-error-toggle"
+                                                  isChecked={true}
+                                                  isDisabled={false}
+                                                  label="Failure"
+                                                  onChange={[Function]}
+                                                  rowid="items-list-item-2"
+                                                >
+                                                  <Switch
+                                                    aria-label="Toggle notification failure"
+                                                    className="NotificationListItem__Switch-j7c411-1 ceuHGn"
+                                                    id="notification-2-error-toggle"
+                                                    isChecked={true}
+                                                    isDisabled={false}
+                                                    label="Failure"
+                                                    onChange={[Function]}
+                                                    rowid="items-list-item-2"
+                                                  >
+                                                    <label
+                                                      className="pf-c-switch NotificationListItem__Switch-j7c411-1 ceuHGn"
+                                                      htmlFor="notification-2-error-toggle"
+                                                    >
+                                                      <input
+                                                        aria-label="Toggle notification failure"
+                                                        checked={true}
+                                                        className="pf-c-switch__input"
+                                                        disabled={false}
+                                                        id="notification-2-error-toggle"
+                                                        onChange={[Function]}
+                                                        rowid="items-list-item-2"
+                                                        type="checkbox"
+                                                      />
+                                                      <span
+                                                        className="pf-c-switch__toggle"
+                                                      />
+                                                      <span
+                                                        aria-hidden="true"
+                                                        className="pf-c-switch__label pf-m-on"
+                                                      >
+                                                        Failure
+                                                      </span>
+                                                      <span
+                                                        aria-hidden="true"
+                                                        className="pf-c-switch__label pf-m-off"
+                                                      >
+                                                        Failure
+                                                      </span>
+                                                    </label>
+                                                  </Switch>
+                                                </StyledComponent>
+                                              </NotificationListItem__Switch>
                                             </div>
                                           </DataListItemRow>
                                         </li>
                                       </DataListItem>
-                                </I18n>
                                     </NotificationListItem>
+                                  </I18n>
+                                </WithI18n>
                               </ul>
                             </DataList>
+                            <WithI18n
+                              count={2}
+                              onSetPage={[Function]}
+                              page={1}
+                              pageCount={1}
+                              page_size={5}
+                            >
+                              <I18n
+                                update={true}
+                                withHash={true}
+                              >
                                 <Pagination
                                   count={2}
+                                  i18n={"/i18n/"}
                                   onSetPage={[Function]}
                                   page={1}
                                   pageCount={1}
@@ -2394,36 +2756,14 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                   }
                                   page_size={5}
                                   showPageSizeOptions={true}
-                            style={null}
-                          >
-                            <I18n
-                              update={true}
-                              withHash={true}
                                 >
                                   <div
                                     className="awx-pagination"
-                                style={null}
                                   >
                                     <div
                                       className="awx-pagination__page-size-selection"
                                     >
-                                  <WithI18n
+                                      Items Per Page
-                                    id="Items Per Page"
-                                  >
-                                    <I18n
-                                      update={true}
-                                      withHash={true}
-                                    >
-                                      <Trans
-                                        i18n={"/i18n/"}
-                                        id="Items Per Page"
-                                      >
-                                        <Render
-                                          value={null}
-                                        />
-                                      </Trans>
-                                    </I18n>
-                                  </WithI18n>
                                       <Dropdown
                                         className=""
                                         direction="up"
@@ -2633,46 +2973,18 @@ exports[`<OrganizationNotifications /> initially renders succesfully 1`] = `
                                       <div
                                         className="awx-pagination__item-count"
                                       >
-                                    <WithI18n
+                                        Items {itemMin} – {itemMax} of {count}
-                                      id="Items {itemMin} – {itemMax} of {count}"
-                                      values={
-                                        Object {
-                                          "count": 2,
-                                          "itemMax": 2,
-                                          "itemMin": 1,
-                                        }
-                                      }
-                                    >
-                                      <I18n
-                                        update={true}
-                                        withHash={true}
-                                      >
-                                        <Trans
-                                          i18n={"/i18n/"}
-                                          id="Items {itemMin} – {itemMax} of {count}"
-                                          values={
-                                            Object {
-                                              "count": 2,
-                                              "itemMax": 2,
-                                              "itemMin": 1,
-                                            }
-                                          }
-                                        >
-                                          <Render
-                                            value={null}
-                                          />
-                                        </Trans>
-                                      </I18n>
-                                    </WithI18n>
                                       </div>
                                     </div>
                                   </div>
-                            </I18n>
                                 </Pagination>
                               </I18n>
+                            </WithI18n>
                           </PaginatedDataList>
                         </Route>
                       </withRouter(PaginatedDataList)>
+                    </I18n>
+                  </WithI18n>
                 </OrganizationNotifications>
               </Route>
             </withRouter(OrganizationNotifications)>

__tests__/pages/Portal.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Portal from '../../src/pages/Portal';
 
 describe('<Portal />', () => {
@@ -8,7 +8,7 @@ describe('<Portal />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Portal />);
+    pageWrapper = mountWithContexts(<Portal />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Projects.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Projects from '../../src/pages/Projects';
 
 describe('<Projects />', () => {
@@ -8,7 +8,7 @@ describe('<Projects />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Projects />);
+    pageWrapper = mountWithContexts(<Projects />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Schedules.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Schedules from '../../src/pages/Schedules';
 
 describe('<Schedules />', () => {
@@ -8,7 +8,7 @@ describe('<Schedules />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Schedules />);
+    pageWrapper = mountWithContexts(<Schedules />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/SystemSettings.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import SystemSettings from '../../src/pages/SystemSettings';
 
 describe('<SystemSettings />', () => {
@@ -8,7 +8,7 @@ describe('<SystemSettings />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<SystemSettings />);
+    pageWrapper = mountWithContexts(<SystemSettings />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Teams.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Teams from '../../src/pages/Teams';
 
 describe('<Teams />', () => {
@@ -8,7 +8,7 @@ describe('<Teams />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Teams />);
+    pageWrapper = mountWithContexts(<Teams />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Templates.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Templates from '../../src/pages/Templates';
 
 describe('<Templates />', () => {
@@ -8,7 +8,7 @@ describe('<Templates />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Templates />);
+    pageWrapper = mountWithContexts(<Templates />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/UISettings.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import UISettings from '../../src/pages/UISettings';
 
 describe('<UISettings />', () => {
@@ -8,7 +8,7 @@ describe('<UISettings />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<UISettings />);
+    pageWrapper = mountWithContexts(<UISettings />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/pages/Users.test.jsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { mount } from 'enzyme';
+import { mountWithContexts } from '../enzymeHelpers';
 import Users from '../../src/pages/Users';
 
 describe('<Users />', () => {
@@ -8,7 +8,7 @@ describe('<Users />', () => {
   let title;
 
   beforeEach(() => {
-    pageWrapper = mount(<Users />);
+    pageWrapper = mountWithContexts(<Users />);
     pageSections = pageWrapper.find('PageSection');
     title = pageWrapper.find('Title');
   });

__tests__/util/validators.test.js

@@ -1,34 +1,36 @@
 import { required, maxLength } from '../../src/util/validators';
 
+const i18n = { _: val => val };
+
 describe('validators', () => {
   test('required returns undefined if value given', () => {
-    expect(required()('some value')).toBeUndefined();
+    expect(required(null, i18n)('some value')).toBeUndefined();
-    expect(required('oops')('some value')).toBeUndefined();
+    expect(required('oops', i18n)('some value')).toBeUndefined();
   });
 
   test('required returns default message if value missing', () => {
-    expect(required()('')).toEqual('This field must not be blank');
+    expect(required(null, i18n)('')).toEqual({ id: 'This field must not be blank' });
   });
 
   test('required returns custom message if value missing', () => {
-    expect(required('oops')('')).toEqual('oops');
+    expect(required('oops', i18n)('')).toEqual('oops');
   });
 
   test('required interprets white space as empty value', () => {
-    expect(required()(' ')).toEqual('This field must not be blank');
+    expect(required(null, i18n)(' ')).toEqual({ id: 'This field must not be blank' });
-    expect(required()('\t')).toEqual('This field must not be blank');
+    expect(required(null, i18n)('\t')).toEqual({ id: 'This field must not be blank' });
   });
 
   test('maxLength accepts value below max', () => {
-    expect(maxLength(10)('snazzy')).toBeUndefined();
+    expect(maxLength(10, i18n)('snazzy')).toBeUndefined();
   });
 
   test('maxLength accepts value equal to max', () => {
-    expect(maxLength(10)('abracadbra')).toBeUndefined();
+    expect(maxLength(10, i18n)('abracadbra')).toBeUndefined();
   });
 
   test('maxLength rejects value above max', () => {
-    expect(maxLength(8)('abracadbra'))
+    expect(maxLength(8, i18n)('abracadbra'))
-      .toEqual('This field must not exceed 8 characters');
+      .toEqual({ id: 'This field must not exceed {max} characters', values: { max: 8 } });
   });
 });

src/components/AddRole/AddResourceRole.jsx

@@ -3,6 +3,7 @@ import PropTypes from 'prop-types';
 import { withI18n } from '@lingui/react';
 import { t } from '@lingui/macro';
 import { Wizard } from '@patternfly/react-core';
+import { withNetwork } from '../../contexts/Network';
 import SelectResourceStep from './SelectResourceStep';
 import SelectRoleStep from './SelectRoleStep';
 import SelectableCard from './SelectableCard';
@@ -249,4 +250,5 @@ AddResourceRole.defaultProps = {
   roles: {}
 };
 
-export default withI18n()(AddResourceRole);
+export { AddResourceRole as _AddResourceRole };
+export default withI18n()(withNetwork(AddResourceRole));

src/components/AnsibleSelect/AnsibleSelect.jsx

@@ -58,4 +58,5 @@ AnsibleSelect.propTypes = {
   value: PropTypes.string.isRequired,
 };
 
+export { AnsibleSelect as _AnsibleSelect };
 export default withI18n()(AnsibleSelect);

src/components/PaginatedDataList/PaginatedDataList.jsx

@@ -113,7 +113,7 @@ class PaginatedDataList extends React.Component {
     const { error } = this.state;
     const [orderBy, sortOrder] = this.getSortOrder();
     const queryParams = parseNamespacedQueryString(qsConfig, location.search);
-    const columns = toolbarColumns || [{ name: i18n._(t`Name`), key: 'name', isSortable: true }];
+    const columns = toolbarColumns.length ? toolbarColumns : [{ name: i18n._(t`Name`), key: 'name', isSortable: true }];
     return (
       <Fragment>
         {error && (
@@ -141,7 +141,7 @@ class PaginatedDataList extends React.Component {
                 <DataListToolbar
                   sortedColumnKey={orderBy}
                   sortOrder={sortOrder}
-                  columns={toolbarColumns}
+                  columns={columns}
                   onSearch={() => { }}
                   onSort={this.handleSort}
                   showSelectAll={showSelectAll}

src/components/Pagination/Pagination.jsx

@@ -187,13 +187,15 @@ class Pagination extends Component {
                 className="awx-pagination__page-input-form"
                 onSubmit={this.onSubmit}
               >
-                {i18n._(t`Page ${(<TextInput
+                {i18n._(t`Page `)}
+                <TextInput
                   className="awx-pagination__page-input"
                   aria-label={i18n._(t`Page Number`)}
                   value={value}
                   type="text"
                   onChange={this.onPageChange}
-                />)} of ${pageCount}`)}
+                />
+                {i18n._(t` of ${pageCount}`)}
               </form>
               <div className="pf-c-input-group">
                 <Button

src/pages/Organizations/components/OrganizationListItem.jsx

@@ -94,7 +94,7 @@ class OrganizationListItem extends React.Component {
                 </Badge>
               </ListGroup>
             </DataListCell>,
-            <DataListCell>
+            <DataListCell key="teams">
               <ListGroup>
                 {i18n._(t`Teams`)}
                 <Badge isRead>

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

@@ -188,7 +188,6 @@ class OrganizationAccess extends React.Component {
           <AddResourceRole
             onClose={this.toggleAddModal}
             onSave={this.handleSuccessfulRoleAdd}
-            api={api}
             roles={organization.summary_fields.object_roles}
           />
         )}