Merge remote-tracking branch 'origin/add-org-new' into react-context-api

__tests__/components/About.test.jsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { mount } from 'enzyme';
+import { I18nProvider } from '@lingui/react';
 import api from '../../src/api';
 import { API_CONFIG } from '../../src/endpoints';
 import About from '../../src/components/About';
@@ -9,14 +10,22 @@ describe('<About />', () => {
   let closeButton;
 
   test('initially renders without crashing', () => {
-    aboutWrapper = mount(<About isOpen />);
+    aboutWrapper = mount(
+      <I18nProvider>
+        <About isOpen />
+      </I18nProvider>
+    );
     expect(aboutWrapper.length).toBe(1);
     aboutWrapper.unmount();
   });
 
   test('close button calls onAboutModalClose', () => {
     const onAboutModalClose = jest.fn();
-    aboutWrapper = mount(<About isOpen onAboutModalClose={onAboutModalClose} />);
+    aboutWrapper = mount(
+      <I18nProvider>
+        <About isOpen onAboutModalClose={onAboutModalClose} />
+      </I18nProvider>
+    );
     closeButton = aboutWrapper.find('AboutModalBoxCloseButton Button');
     closeButton.simulate('click');
     expect(onAboutModalClose).toBeCalled();
@@ -29,9 +38,15 @@ describe('<About />', () => {
       err.response = { status: 404, message: 'problem' };
       return Promise.reject(err);
     });
-    aboutWrapper = mount(<About isOpen />);
-    await aboutWrapper.instance().componentDidMount();
-    expect(aboutWrapper.state('error').response.status).toBe(404);
+    aboutWrapper = mount(
+      <I18nProvider>
+        <About isOpen />
+      </I18nProvider>
+    );
+
+    const aboutComponentInstance = aboutWrapper.find(About).instance();
+    await aboutComponentInstance.componentDidMount();
+    expect(aboutComponentInstance.state.error.response.status).toBe(404);
     aboutWrapper.unmount();
   });
 

__tests__/components/DataListToolbar.test.jsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { mount } from 'enzyme';
+import { I18nProvider } from '@lingui/react';
 import DataListToolbar from '../../src/components/DataListToolbar';
 
 describe('<DataListToolbar />', () => {
@@ -15,7 +16,7 @@ describe('<DataListToolbar />', () => {
 
   test('it triggers the expected callbacks', () => {
     const search = 'button[aria-label="Search"]';
-    const searchTextInput = 'input[aria-label="search text input"]';
+    const searchTextInput = 'input[aria-label="Search text input"]';
     const selectAll = 'input[aria-label="Select all"]';
     const sort = 'button[aria-label="Sort"]';
 
@@ -24,15 +25,17 @@ describe('<DataListToolbar />', () => {
     const onSelectAll = jest.fn();
 
     toolbar = mount(
-      <DataListToolbar
-        isAllSelected={false}
-        sortedColumnKey="name"
-        sortOrder="ascending"
-        columns={columns}
-        onSearch={onSearch}
-        onSort={onSort}
-        onSelectAll={onSelectAll}
-      />
+      <I18nProvider>
+        <DataListToolbar
+          isAllSelected={false}
+          sortedColumnKey="name"
+          sortOrder="ascending"
+          columns={columns}
+          onSearch={onSearch}
+          onSort={onSort}
+          onSelectAll={onSelectAll}
+        />
+      </I18nProvider>
     );
 
     toolbar.find(sort).simulate('click');

__tests__/components/HelpDropdown.test.jsx

@@ -1,15 +1,22 @@
 import React from 'react';
 import { mount } from 'enzyme';
+import { I18nProvider } from '@lingui/react';
 import HelpDropdown from '../../src/components/HelpDropdown';
 
 let questionCircleIcon;
 let dropdownWrapper;
+let dropdownComponentInstance;
 let dropdownToggle;
 let dropdownItems;
 let dropdownItem;
 
 beforeEach(() => {
-  dropdownWrapper = mount(<HelpDropdown />);
+  dropdownWrapper = mount(
+    <I18nProvider>
+      <HelpDropdown />
+    </I18nProvider>
+  );
+  dropdownComponentInstance = dropdownWrapper.find(HelpDropdown).instance();
 });
 
 afterEach(() => {
@@ -19,14 +26,15 @@ afterEach(() => {
 describe('<HelpDropdown />', () => {
   test('initially renders without crashing', () => {
     expect(dropdownWrapper.length).toBe(1);
-    expect(dropdownWrapper.state('isOpen')).toEqual(false);
-    expect(dropdownWrapper.state('showAboutModal')).toEqual(false);
+    expect(dropdownComponentInstance.state.isOpen).toEqual(false);
+    expect(dropdownComponentInstance.state.showAboutModal).toEqual(false);
     questionCircleIcon = dropdownWrapper.find('QuestionCircleIcon');
     expect(questionCircleIcon.length).toBe(1);
   });
 
   test('renders two dropdown items', () => {
-    dropdownWrapper.setState({ isOpen: true });
+    dropdownComponentInstance.setState({ isOpen: true });
+    dropdownWrapper.update();
     dropdownItems = dropdownWrapper.find('DropdownItem');
     expect(dropdownItems.length).toBe(2);
     const dropdownTexts = dropdownItems.map(item => item.text());
@@ -34,24 +42,27 @@ describe('<HelpDropdown />', () => {
   });
 
   test('onToggle sets state.isOpen to opposite', () => {
-    dropdownWrapper.setState({ isOpen: true });
+    dropdownComponentInstance.setState({ isOpen: true });
+    dropdownWrapper.update();
     dropdownToggle = dropdownWrapper.find('DropdownToggle > DropdownToggle');
     dropdownToggle.simulate('click');
-    expect(dropdownWrapper.state('isOpen')).toEqual(false);
+    expect(dropdownComponentInstance.state.isOpen).toEqual(false);
   });
 
   test('about dropdown item sets state.showAboutModal to true', () => {
-    dropdownWrapper.setState({ isOpen: true });
+    dropdownComponentInstance.setState({ isOpen: true });
+    dropdownWrapper.update();
     dropdownItem = dropdownWrapper.find('DropdownItem a').at(1);
     dropdownItem.simulate('click');
-    expect(dropdownWrapper.state('showAboutModal')).toEqual(true);
+    expect(dropdownComponentInstance.state.showAboutModal).toEqual(true);
   });
 
   test('onAboutModalClose sets state.showAboutModal to false', () => {
-    dropdownWrapper.setState({ showAboutModal: true });
+    dropdownComponentInstance.setState({ showAboutModal: true });
+    dropdownWrapper.update();
     const aboutModal = dropdownWrapper.find('AboutModal');
     aboutModal.find('AboutModalBoxCloseButton Button').simulate('click');
-    expect(dropdownWrapper.state('showAboutModal')).toEqual(false);
+    expect(dropdownComponentInstance.state.showAboutModal).toEqual(false);
   });
 });
 

__tests__/components/LogoutButton.test.jsx

@@ -1,5 +1,6 @@
 import React from 'react';
 import { mount } from 'enzyme';
+import { I18nProvider } from '@lingui/react';
 import LogoutButton from '../../src/components/LogoutButton';
 
 let buttonWrapper;
@@ -14,7 +15,11 @@ const findChildren = () => {
 describe('<LogoutButton />', () => {
   test('initially renders without crashing', () => {
     const onDevLogout = jest.fn();
-    buttonWrapper = mount(<LogoutButton onDevLogout={onDevLogout} />);
+    buttonWrapper = mount(
+      <I18nProvider>
+        <LogoutButton onDevLogout={onDevLogout} />
+      </I18nProvider>
+    );
     findChildren();
     expect(buttonWrapper.length).toBe(1);
     expect(buttonElem.length).toBe(1);

__tests__/components/Pagination.test.jsx

@@ -1,34 +1,35 @@
 import React from 'react';
 import { mount } from 'enzyme';
+import { I18nProvider } from '@lingui/react';
 import Pagination from '../../src/components/Pagination';
 
 describe('<Pagination />', () => {
-  const noop = () => {};
-
   let pagination;
 
   afterEach(() => {
-    if (toolbar) {
+    if (pagination) {
       pagination.unmount();
       pagination = null;
     }
   });
 
   test('it triggers the expected callbacks on next and last', () => {
-    const next = 'button[aria-label="next"]';
-    const last = 'button[aria-label="last"]';
+    const next = 'button[aria-label="Next"]';
+    const last = 'button[aria-label="Last"]';
 
     const onSetPage = jest.fn();
 
     pagination = mount(
-      <Pagination
-        count={21}
-        page={1}
-        pageCount={5}
-        page_size={5}
-        pageSizeOptions={[5, 10, 25, 50]}
-        onSetPage={onSetPage}
-      />
+      <I18nProvider>
+        <Pagination
+          count={21}
+          page={1}
+          pageCount={5}
+          page_size={5}
+          pageSizeOptions={[5, 10, 25, 50]}
+          onSetPage={onSetPage}
+        />
+      </I18nProvider>
     );
 
     pagination.find(next).simulate('click');
@@ -43,20 +44,22 @@ describe('<Pagination />', () => {
   });
 
   test('it triggers the expected callback on previous and first', () => {
-    const previous = 'button[aria-label="previous"]';
-    const first = 'button[aria-label="first"]';
+    const previous = 'button[aria-label="Previous"]';
+    const first = 'button[aria-label="First"]';
 
     const onSetPage = jest.fn();
 
     pagination = mount(
-      <Pagination
-        count={21}
-        page={5}
-        pageCount={5}
-        page_size={5}
-        pageSizeOptions={[5, 10, 25, 50]}
-        onSetPage={onSetPage}
-      />
+      <I18nProvider>
+        <Pagination
+          count={21}
+          page={5}
+          pageCount={5}
+          page_size={5}
+          pageSizeOptions={[5, 10, 25, 50]}
+          onSetPage={onSetPage}
+        />
+      </I18nProvider>
     );
 
     pagination.find(previous).simulate('click');

__tests__/components/TowerLogo.test.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import { mount } from 'enzyme';
+import { I18nProvider } from '@lingui/react';
 import TowerLogo from '../../src/components/TowerLogo';
 
 let logoWrapper;
@@ -14,7 +15,13 @@ const findChildren = () => {
 
 describe('<TowerLogo />', () => {
   test('initially renders without crashing', () => {
-    logoWrapper = mount(<MemoryRouter><TowerLogo /></MemoryRouter>);
+    logoWrapper = mount(
+      <MemoryRouter>
+        <I18nProvider>
+          <TowerLogo />
+        </I18nProvider>
+      </MemoryRouter>
+    );
     findChildren();
     expect(logoWrapper.length).toBe(1);
     expect(towerLogoElem.length).toBe(1);
@@ -23,7 +30,13 @@ describe('<TowerLogo />', () => {
 
   test('adds navigation to route history on click', () => {
     const onLogoClick = jest.fn();
-    logoWrapper = mount(<MemoryRouter><TowerLogo onClick={onLogoClick} /></MemoryRouter>);
+    logoWrapper = mount(
+      <MemoryRouter>
+        <I18nProvider>
+          <TowerLogo onClick={onLogoClick} />
+        </I18nProvider>
+      </MemoryRouter>
+    );
     findChildren();
     expect(towerLogoElem.props().history.length).toBe(1);
     logoWrapper.simulate('click');
@@ -31,7 +44,13 @@ describe('<TowerLogo />', () => {
   });
 
   test('gracefully handles not being passed click handler', () => {
-    logoWrapper = mount(<MemoryRouter><TowerLogo /></MemoryRouter>);
+    logoWrapper = mount(
+      <MemoryRouter>
+        <I18nProvider>
+          <TowerLogo />
+        </I18nProvider>
+      </MemoryRouter>
+    );
     findChildren();
     expect(towerLogoElem.props().history.length).toBe(1);
     logoWrapper.simulate('click');
@@ -40,7 +59,13 @@ describe('<TowerLogo />', () => {
 
   test('handles mouse over and out state.hover changes', () => {
     const onLogoClick = jest.fn();
-    logoWrapper = mount(<MemoryRouter><TowerLogo onClick={onLogoClick} /></MemoryRouter>);
+    logoWrapper = mount(
+      <MemoryRouter>
+        <I18nProvider>
+          <TowerLogo onClick={onLogoClick} />
+        </I18nProvider>
+      </MemoryRouter>
+    );
     findChildren();
     findChildren();
     expect(brandElem.props().src).toBe('tower-logo-header.svg');

__tests__/pages/Login.jsx

@@ -1,6 +1,7 @@
 import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import { mount, shallow } from 'enzyme';
+import { I18nProvider } from '@lingui/react';
 import { asyncFlush } from '../../jest.setup';
 import AtLogin from '../../src/pages/Login';
 import api from '../../src/api';
@@ -26,7 +27,13 @@ describe('<Login />', () => {
   };
 
   beforeEach(() => {
-    loginWrapper = mount(<MemoryRouter><AtLogin /></MemoryRouter>);
+    loginWrapper = mount(
+      <MemoryRouter>
+        <I18nProvider>
+          <AtLogin />
+        </I18nProvider>
+      </MemoryRouter>
+    );
     findChildren();
   });
 
@@ -49,7 +56,13 @@ describe('<Login />', () => {
   });
 
   test('custom logo renders Brand component with correct src and alt', () => {
-    loginWrapper = mount(<MemoryRouter><AtLogin logo="images/foo.jpg" alt="Foo Application" /></MemoryRouter>);
+    loginWrapper = mount(
+      <MemoryRouter>
+        <I18nProvider>
+          <AtLogin 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');
@@ -57,7 +70,13 @@ describe('<Login />', () => {
   });
 
   test('default logo renders Brand component with correct src and alt', () => {
-    loginWrapper = mount(<MemoryRouter><AtLogin /></MemoryRouter>);
+    loginWrapper = mount(
+      <MemoryRouter>
+        <I18nProvider>
+          <AtLogin />
+        </I18nProvider>
+      </MemoryRouter>
+    );
     findChildren();
     expect(loginHeaderLogo.length).toBe(1);
     expect(loginHeaderLogo.props().src).toBe('tower-logo-header.svg');

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

@@ -1,17 +1,20 @@
 import React from 'react';
 import { mount } from 'enzyme';
 import { MemoryRouter } from 'react-router-dom';
+import { I18nProvider } from '@lingui/react';
 import OrganizationDetail from '../../../../src/pages/Organizations/components/OrganizationDetail';
 
 describe('<OrganizationDetail />', () => {
   test('initially renders succesfully', () => {
     mount(
-      <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-        <OrganizationDetail
-          match={{ path: '/organizations/:id', url: '/organizations/1' }}
-          location={{ search: '', pathname: '/organizations/1' }}
-        />
-      </MemoryRouter>
+      <I18nProvider>
+        <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
+          <OrganizationDetail
+            match={{ path: '/organizations/:id', url: '/organizations/1' }}
+            location={{ search: '', pathname: '/organizations/1' }}
+          />
+        </MemoryRouter>
+      </I18nProvider>
     );
   });
 });

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

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

__tests__/pages/Organizations/index.test.jsx

@@ -1,16 +1,19 @@
 import React from 'react';
 import { MemoryRouter } from 'react-router-dom';
 import { mount } from 'enzyme';
+import { I18nProvider } from '@lingui/react';
 import Organizations from '../../../src/pages/Organizations/index';
 
 describe('<Organizations />', () => {
   test('initially renders succesfully', () => {
     mount(
       <MemoryRouter initialEntries={['/organizations']} initialIndex={0}>
-        <Organizations
-          match={{ path: '/organizations', url: '/organizations' }}
-          location={{ search: '', pathname: '/organizations' }}
-        />
+        <I18nProvider>
+          <Organizations
+            match={{ path: '/organizations', url: '/organizations' }}
+            location={{ search: '', pathname: '/organizations' }}
+          />
+        </I18nProvider>
       </MemoryRouter>
     );
   });

__tests__/pages/Organizations/views/Organization.view.test.jsx

@@ -1,17 +1,20 @@
 import React from 'react';
 import { mount } from 'enzyme';
 import { MemoryRouter } from 'react-router-dom';
+import { I18nProvider } from '@lingui/react';
 import OrganizationView from '../../../../src/pages/Organizations/views/Organization.view';
 
 describe('<OrganizationView />', () => {
   test('initially renders succesfully', () => {
     mount(
-      <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
-        <OrganizationView
-          match={{ path: '/organizations/:id', url: '/organizations/1' }}
-          location={{ search: '', pathname: '/organizations/1' }}
-        />
-      </MemoryRouter>
+      <I18nProvider>
+        <MemoryRouter initialEntries={['/organizations/1']} initialIndex={0}>
+          <OrganizationView
+            match={{ path: '/organizations/:id', url: '/organizations/1' }}
+            location={{ search: '', pathname: '/organizations/1' }}
+          />
+        </MemoryRouter>
+      </I18nProvider>
     );
   });
 });

__tests__/pages/Organizations/views/Organizations.list.test.jsx

@@ -1,16 +1,19 @@
 import React from 'react';
 import { mount } from 'enzyme';
 import { MemoryRouter } from 'react-router-dom';
+import { I18nProvider } from '@lingui/react';
 import OrganizationsList from '../../../../src/pages/Organizations/views/Organizations.list';
 
 describe('<OrganizationsList />', () => {
   test('initially renders succesfully', () => {
     mount(
       <MemoryRouter initialEntries={['/organizations']} initialIndex={0}>
-        <OrganizationsList
-          match={{ path: '/organizations', url: '/organizations' }}
-          location={{ search: '', pathname: '/organizations' }}
-        />
+        <I18nProvider>
+          <OrganizationsList
+            match={{ path: '/organizations', url: '/organizations' }}
+            location={{ search: '', pathname: '/organizations' }}
+          />
+        </I18nProvider>
       </MemoryRouter>
     );
   });