Integrate proptypes for our shared components.

- Fix unit tests.
- Fix linter errors.

__tests__/components/About.test.jsx

@@ -6,11 +6,11 @@ import About from '../../src/components/About';
 describe('<About />', () => {
   let aboutWrapper;
   let closeButton;
-
+  const onClose = jest.fn();
   test('initially renders without crashing', () => {
     aboutWrapper = mount(
       <I18nProvider>
-        <About isOpen />
+        <About isOpen onClose={onClose} />
       </I18nProvider>
     );
     expect(aboutWrapper.length).toBe(1);
@@ -18,7 +18,6 @@ describe('<About />', () => {
   });
 
   test('close button calls onClose handler', () => {
-    const onClose = jest.fn();
     aboutWrapper = mount(
       <I18nProvider>
         <About isOpen onClose={onClose} />

__tests__/components/Lookup.test.jsx

@@ -3,7 +3,7 @@ import { mount } from 'enzyme';
 import { I18nProvider } from '@lingui/react';
 import Lookup from '../../src/components/Lookup';
 
-let mockData = [{ name: 'foo', id: 1, isChecked: false }];
+let mockData = [{ name: 'foo', id: 1 }];
 describe('<Lookup />', () => {
   test('initially renders succesfully', () => {
     mount(
@@ -85,7 +85,7 @@ describe('<Lookup />', () => {
   });
   test('calls "toggleSelected" when remove icon is clicked', () => {
     const spy = jest.spyOn(Lookup.prototype, 'toggleSelected');
-    mockData = [{ name: 'foo', id: 1, isChecked: false }, { name: 'bar', id: 2, isChecked: true }];
+    mockData = [{ name: 'foo', id: 1 }, { name: 'bar', id: 2 }];
     const wrapper = mount(
       <I18nProvider>
         <Lookup
@@ -103,20 +103,21 @@ describe('<Lookup />', () => {
   });
   test('"wrapTags" method properly handles data', () => {
     const spy = jest.spyOn(Lookup.prototype, 'wrapTags');
-    mockData = [{ name: 'foo', id: 0, isChecked: false }, { name: 'bar', id: 1, isChecked: false }];
+    mockData = [{ name: 'foo', id: 0 }, { name: 'bar', id: 1 }];
     const wrapper = mount(
       <I18nProvider>
         <Lookup
           lookup_header="Foo Bar"
           onLookupSave={() => { }}
-          data={mockData}
+          value={mockData}
           selected={[]}
+          getItems={() => { }}
         />
       </I18nProvider>
     );
     expect(spy).toHaveBeenCalled();
     const pill = wrapper.find('span.awx-c-tag--pill');
-    expect(pill).toHaveLength(0);
+    expect(pill).toHaveLength(2);
   });
   test('toggleSelected successfully adds/removes row from lookupSelectedItems state', () => {
     mockData = [{ name: 'foo', id: 1 }];
@@ -125,8 +126,9 @@ describe('<Lookup />', () => {
         <Lookup
           lookup_header="Foo Bar"
           onLookupSave={() => { }}
-          data={mockData}
+          value={mockData}
           selected={[]}
+          getItems={() => { }}
         />
       </I18nProvider>
     ).find('Lookup');

__tests__/components/NotificationList.test.jsx

@@ -112,9 +112,9 @@ describe('<Notifications />', () => {
     const getNotificationsFn = jest.fn().mockResolvedValue({
       data: {
         results: [
-          { id: 1 },
-          { id: 2 },
-          { id: 3 }
+          { id: 1, notification_type: 'slack' },
+          { id: 2, notification_type: 'email' },
+          { id: 3, notification_type: 'github' }
         ]
       }
     });

__tests__/components/NotificationListItem.test.jsx

@@ -6,6 +6,7 @@ import NotificationListItem from '../../src/components/NotificationsList/Notific
 
 describe('<NotificationListItem />', () => {
   let wrapper;
+  const toggleNotification = jest.fn();
 
   afterEach(() => {
     if (wrapper) {
@@ -18,7 +19,12 @@ describe('<NotificationListItem />', () => {
     wrapper = mount(
       <I18nProvider>
         <MemoryRouter>
-          <NotificationListItem />
+          <NotificationListItem
+            itemId={9000}
+            toggleNotification={toggleNotification}
+            detailUrl="/foo"
+            notificationType="slack"
+          />
         </MemoryRouter>
       </I18nProvider>
     );
@@ -26,7 +32,6 @@ describe('<NotificationListItem />', () => {
   });
 
   test('handles success click when toggle is on', () => {
-    const toggleNotification = jest.fn();
     wrapper = mount(
       <I18nProvider>
         <MemoryRouter>
@@ -34,6 +39,8 @@ describe('<NotificationListItem />', () => {
             itemId={9000}
             successTurnedOn
             toggleNotification={toggleNotification}
+            detailUrl="/foo"
+            notificationType="slack"
           />
         </MemoryRouter>
       </I18nProvider>
@@ -43,7 +50,6 @@ describe('<NotificationListItem />', () => {
   });
 
   test('handles success click when toggle is off', () => {
-    const toggleNotification = jest.fn();
     wrapper = mount(
       <I18nProvider>
         <MemoryRouter>
@@ -51,6 +57,8 @@ describe('<NotificationListItem />', () => {
             itemId={9000}
             successTurnedOn={false}
             toggleNotification={toggleNotification}
+            detailUrl="/foo"
+            notificationType="slack"
           />
         </MemoryRouter>
       </I18nProvider>
@@ -60,7 +68,6 @@ describe('<NotificationListItem />', () => {
   });
 
   test('handles error click when toggle is on', () => {
-    const toggleNotification = jest.fn();
     wrapper = mount(
       <I18nProvider>
         <MemoryRouter>
@@ -68,6 +75,8 @@ describe('<NotificationListItem />', () => {
             itemId={9000}
             errorTurnedOn
             toggleNotification={toggleNotification}
+            detailUrl="/foo"
+            notificationType="slack"
           />
         </MemoryRouter>
       </I18nProvider>
@@ -77,7 +86,6 @@ describe('<NotificationListItem />', () => {
   });
 
   test('handles error click when toggle is off', () => {
-    const toggleNotification = jest.fn();
     wrapper = mount(
       <I18nProvider>
         <MemoryRouter>
@@ -85,6 +93,8 @@ describe('<NotificationListItem />', () => {
             itemId={9000}
             errorTurnedOn={false}
             toggleNotification={toggleNotification}
+            detailUrl="/foo"
+            notificationType="slack"
           />
         </MemoryRouter>
       </I18nProvider>

__tests__/components/PageHeaderToolbar.test.jsx

@@ -8,17 +8,24 @@ import PageHeaderToolbar from '../../src/components/PageHeaderToolbar';
 describe('PageHeaderToolbar', () => {
   const pageHelpDropdownSelector = 'Dropdown QuestionCircleIcon';
   const pageUserDropdownSelector = 'Dropdown UserIcon';
+  const onAboutClick = jest.fn();
+  const onLogoutClick = jest.fn();
 
   test('expected content is rendered on initialization', () => {
-    const wrapper = mount(<I18nProvider><PageHeaderToolbar /></I18nProvider>);
+    const wrapper = mount(
+      <I18nProvider>
+        <PageHeaderToolbar
+          onAboutClick={onAboutClick}
+          onLogoutClick={onLogoutClick}
+        />
+      </I18nProvider>
+    );
 
     expect(wrapper.find(pageHelpDropdownSelector)).toHaveLength(1);
     expect(wrapper.find(pageUserDropdownSelector)).toHaveLength(1);
   });
 
   test('dropdowns have expected items and callbacks', () => {
-    const onAboutClick = jest.fn();
-    const onLogoutClick = jest.fn();
     const wrapper = mount(
       <MemoryRouter>
         <I18nProvider>

__tests__/components/Tooltip.test.jsx

@@ -7,14 +7,24 @@ describe('<Tooltip />', () => {
   let content;
   let mouseOverHandler;
   let mouseOutHandler;
+  const child = (<span>foo</span>);
+  const message = 'hi';
 
   test('initially renders without crashing', () => {
-    elem = mount(<Tooltip />);
+    elem = mount(
+      <Tooltip message={message}>
+        {child}
+      </Tooltip>
+    );
     expect(elem.length).toBe(1);
   });
 
   test('shows/hides with mouse over and leave', () => {
-    elem = mount(<Tooltip />);
+    elem = mount(
+      <Tooltip message={message}>
+        {child}
+      </Tooltip>
+    );
     mouseOverHandler = elem.find('.mouseOverHandler');
     mouseOutHandler = elem.find('.mouseOutHandler');
     expect(elem.state().isDisplayed).toBe(false);
@@ -34,7 +44,11 @@ describe('<Tooltip />', () => {
   });
 
   test('shows/hides with focus and blur', () => {
-    elem = mount(<Tooltip />);
+    elem = mount(
+      <Tooltip message={message}>
+        {child}
+      </Tooltip>
+    );
     mouseOverHandler = elem.find('.mouseOverHandler');
     mouseOutHandler = elem.find('.mouseOutHandler');
     expect(elem.state().isDisplayed).toBe(false);