test: lint

src/App.test.jsx

@@ -32,9 +32,10 @@ jest.mock('@edx/frontend-platform', () => ({
   getConfig: jest.fn(() => ({})),
 }));
 
-jest.unmock('@openedx/paragon');
-jest.unmock('@edx/frontend-platform/i18n');
-jest.unmock('react');
+// jest.mock('@edx/frontend-platform/react', () => ({
+//   ...jest.requireActual('@edx/frontend-platform/react'),
+//   ErrorPage: () => 'ErrorPage',
+// }));
 
 const loadData = jest.fn();
 reduxHooks.useLoadData.mockReturnValue(loadData);

src/components/NoticesWrapper/hooks.js

@@ -1,6 +1,6 @@
 import React from 'react';
 import { getConfig } from '@edx/frontend-platform';
-import { useIntl } from 'react-intl';
+import { useIntl } from '@edx/frontend-platform/i18n';
 
 import { StrictDict } from 'utils';
 import { getNotices } from './api';

src/components/NoticesWrapper/hooks.test.js

@@ -1,6 +1,6 @@
 import React from 'react';
 
-import { MockUseState } from 'testUtils';
+import { MockUseState, formatMessage } from 'testUtils';
 
 import { getConfig } from '@edx/frontend-platform';
 import { getNotices } from './api';
@@ -8,12 +8,22 @@ import * as hooks from './hooks';
 
 jest.mock('@edx/frontend-platform', () => ({ getConfig: jest.fn() }));
 jest.mock('./api', () => ({ getNotices: jest.fn() }));
-const mockFormatMessage = jest.fn(message => message.defaultMessage || 'translated-string');
-jest.mock('react-intl', () => ({
-  useIntl: () => ({
-    formatMessage: mockFormatMessage,
-  }),
-}));
+
+// jest.mock('react', () => ({
+//   ...jest.requireActual('react'),
+//   useEffect: jest.fn((cb, prereqs) => ({ useEffect: { cb, prereqs } })),
+//   useContext: jest.fn(context => context),
+// }));
+
+// jest.mock('@edx/frontend-platform/i18n', () => {
+//   const { formatMessage: fn } = jest.requireActual('testUtils');
+//   return {
+//     ...jest.requireActual('@edx/frontend-platform/i18n'),
+//     useIntl: () => ({
+//       formatMessage: fn,
+//     }),
+//   };
+// });
 
 getConfig.mockReturnValue({ ENABLE_NOTICES: true });
 const state = new MockUseState(hooks);
@@ -40,7 +50,7 @@ describe('NoticesWrapper hooks', () => {
           getConfig.mockReturnValueOnce({ ENABLE_NOTICES: false });
           hooks.useNoticesWrapperData();
           const [cb, prereqs] = React.useEffect.mock.calls[0];
-          expect(prereqs).toEqual([state.setState.isRedirected, mockFormatMessage]);
+          expect(prereqs).toEqual([state.setState.isRedirected, formatMessage]);
           cb();
           expect(getNotices).not.toHaveBeenCalled();
         });
@@ -49,7 +59,7 @@ describe('NoticesWrapper hooks', () => {
             hooks.useNoticesWrapperData();
             expect(React.useEffect).toHaveBeenCalled();
             const [cb, prereqs] = React.useEffect.mock.calls[0];
-            expect(prereqs).toEqual([state.setState.isRedirected, mockFormatMessage]);
+            expect(prereqs).toEqual([state.setState.isRedirected, formatMessage]);
             cb();
             expect(getNotices).toHaveBeenCalled();
             const { onLoad } = getNotices.mock.calls[0][0];
@@ -65,7 +75,7 @@ describe('NoticesWrapper hooks', () => {
             window.location = { replace: jest.fn(), href: 'test-old-href' };
             hooks.useNoticesWrapperData();
             const [cb, prereqs] = React.useEffect.mock.calls[0];
-            expect(prereqs).toEqual([state.setState.isRedirected, mockFormatMessage]);
+            expect(prereqs).toEqual([state.setState.isRedirected, formatMessage]);
             cb();
             expect(getNotices).toHaveBeenCalled();
             const { onLoad } = getNotices.mock.calls[0][0];

src/containers/CourseCard/components/CourseCardActions/ActionButton/hooks.test.js

@@ -1,6 +1,33 @@
 import { useWindowSize, breakpoints } from '@openedx/paragon';
 import useIsCollapsed from './hooks';
 
+// jest.mock('@openedx/paragon', () => ({
+//   ...jest.requireActual('@openedx/paragon'),
+//   useWindowSize: jest.fn(),
+//   breakpoints: {
+//     extraSmall: {
+//       minWidth: 0,
+//       maxWidth: 575,
+//     },
+//     small: {
+//       minWidth: 576,
+//       maxWidth: 767,
+//     },
+//     medium: {
+//       minWidth: 768,
+//       maxWidth: 991,
+//     },
+//     large: {
+//       minWidth: 992,
+//       maxWidth: 1199,
+//     },
+//     extraLarge: {
+//       minWidth: 1200,
+//       maxWidth: 100000,
+//     },
+//   },
+// }));
+
 describe('useIsCollapsed', () => {
   it('returns true only when it is between medium and small', () => {
     // make sure all three breakpoints gap is large enough for test

src/containers/CourseCard/components/CourseCardActions/BeginCourseButton.test.jsx

@@ -1,12 +1,11 @@
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
+import { IntlProvider } from '@edx/frontend-platform/i18n';
 import { reduxHooks } from 'hooks';
 import track from 'tracking';
 import useActionDisabledState from '../hooks';
 import BeginCourseButton from './BeginCourseButton';
 
-jest.unmock('@openedx/paragon');
-
 jest.mock('tracking', () => ({
   course: {
     enterCourseClicked: jest.fn().mockName('segment.enterCourseClicked'),
@@ -33,24 +32,27 @@ reduxHooks.useTrackCourseEvent.mockImplementation(
   (eventName, cardId, url) => ({ trackCourseEvent: { eventName, cardId, url } }),
 );
 
+const props = {
+  cardId: 'cardId',
+};
+
+const renderComponent = () => render(<IntlProvider locale="en"><BeginCourseButton {...props} /></IntlProvider>);
+
 describe('BeginCourseButton', () => {
-  const props = {
-    cardId: 'cardId',
-  };
   beforeEach(() => {
     jest.clearAllMocks();
   });
   describe('initiliaze hooks', () => {
     it('initializes course run data with cardId', () => {
-      render(<BeginCourseButton {...props} />);
+      renderComponent();
       expect(reduxHooks.useCardCourseRunData).toHaveBeenCalledWith(props.cardId);
     });
     it('loads exec education path param', () => {
-      render(<BeginCourseButton {...props} />);
+      renderComponent();
       expect(reduxHooks.useCardExecEdTrackingParam).toHaveBeenCalledWith(props.cardId);
     });
     it('loads disabled states for begin action from action hooks', () => {
-      render(<BeginCourseButton {...props} />);
+      renderComponent();
       expect(useActionDisabledState).toHaveBeenCalledWith(props.cardId);
     });
   });
@@ -58,7 +60,7 @@ describe('BeginCourseButton', () => {
     describe('disabled', () => {
       it('should be disabled', () => {
         useActionDisabledState.mockReturnValueOnce({ disableBeginCourse: true });
-        render(<BeginCourseButton {...props} />);
+        renderComponent();
         const button = screen.getByRole('button', { name: 'Begin Course' });
         expect(button).toHaveClass('disabled');
         expect(button).toHaveAttribute('aria-disabled', 'true');
@@ -66,13 +68,13 @@ describe('BeginCourseButton', () => {
     });
     describe('enabled', () => {
       it('should be enabled', () => {
-        render(<BeginCourseButton {...props} />);
+        renderComponent();
         const button = screen.getByRole('button', { name: 'Begin Course' });
         expect(button).not.toHaveClass('disabled');
         expect(button).not.toHaveAttribute('aria-disabled', 'true');
       });
       it('should track enter course clicked event on click, with exec ed param', async () => {
-        render(<BeginCourseButton {...props} />);
+        renderComponent();
         const user = userEvent.setup();
         const button = screen.getByRole('button', { name: 'Begin Course' });
         user.click(button);

src/containers/CourseCard/components/CourseCardActions/ResumeButton.test.jsx

@@ -1,5 +1,6 @@
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
+import { IntlProvider } from '@edx/frontend-platform/i18n';
 
 import { reduxHooks } from 'hooks';
 import track from 'tracking';
@@ -20,7 +21,7 @@ jest.mock('hooks', () => ({
   },
 }));
 jest.mock('../hooks', () => jest.fn(() => ({ disableResumeCourse: false })));
-jest.unmock('@openedx/paragon');
+
 jest.mock('./ActionButton/hooks', () => jest.fn(() => false));
 
 const resumeUrl = 'resume-url';
@@ -36,7 +37,7 @@ describe('ResumeButton', () => {
     cardId: 'cardId',
   };
   describe('initialize hooks', () => {
-    beforeEach(() => render(<ResumeButton {...props} />));
+    beforeEach(() => render(<IntlProvider locale="en"><ResumeButton {...props} /></IntlProvider>));
     it('initializes course run data with cardId', () => {
       expect(reduxHooks.useCardCourseRunData).toHaveBeenCalledWith(props.cardId);
     });
@@ -53,7 +54,7 @@ describe('ResumeButton', () => {
         useActionDisabledState.mockReturnValueOnce({ disableResumeCourse: true });
       });
       it('should be disabled', () => {
-        render(<ResumeButton {...props} />);
+        render(<IntlProvider locale="en"><ResumeButton {...props} /></IntlProvider>);
         const button = screen.getByRole('button', { name: 'Resume' });
         expect(button).toHaveClass('disabled');
         expect(button).toHaveAttribute('aria-disabled', 'true');
@@ -61,14 +62,14 @@ describe('ResumeButton', () => {
     });
     describe('enabled', () => {
       it('should be enabled', () => {
-        render(<ResumeButton {...props} />);
+        render(<IntlProvider locale="en"><ResumeButton {...props} /></IntlProvider>);
         const button = screen.getByRole('button', { name: 'Resume' });
         expect(button).toBeInTheDocument();
         expect(button).not.toHaveClass('disabled');
         expect(button).not.toHaveAttribute('aria-disabled', 'true');
       });
       it('should track enter course clicked event on click, with exec ed param', async () => {
-        render(<ResumeButton {...props} />);
+        render(<IntlProvider locale="en"><ResumeButton {...props} /></IntlProvider>);
         const user = userEvent.setup();
         const button = screen.getByRole('button', { name: 'Resume' });
         user.click(button);

src/containers/CourseCard/components/CourseCardActions/SelectSessionButton.test.jsx

@@ -1,5 +1,6 @@
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
+import { IntlProvider } from '@edx/frontend-platform/i18n';
 
 import { reduxHooks } from 'hooks';
 import useActionDisabledState from '../hooks';
@@ -13,27 +14,26 @@ jest.mock('hooks', () => ({
 }));
 jest.mock('../hooks', () => jest.fn(() => ({ disableSelectSession: false })));
 
-jest.unmock('@openedx/paragon');
 jest.mock('./ActionButton/hooks', () => jest.fn(() => false));
 
 describe('SelectSessionButton', () => {
   const props = { cardId: 'cardId' };
   it('default render', () => {
-    render(<SelectSessionButton {...props} />);
+    render(<IntlProvider locale="en"><SelectSessionButton {...props} /></IntlProvider>);
     const button = screen.getByRole('button', { name: 'Select Session' });
     expect(button).toBeInTheDocument();
   });
   describe('if useActionDisabledState is false', () => {
     it('should disabled Select Session', () => {
       useActionDisabledState.mockReturnValueOnce({ disableSelectSession: true });
-      render(<SelectSessionButton {...props} />);
+      render(<IntlProvider locale="en"><SelectSessionButton {...props} /></IntlProvider>);
       const button = screen.getByRole('button', { name: 'Select Session' });
       expect(button).toBeDisabled();
     });
   });
   describe('on click', () => {
     it('should call openSessionModal', async () => {
-      render(<SelectSessionButton {...props} />);
+      render(<IntlProvider locale="en"><SelectSessionButton {...props} /></IntlProvider>);
       const user = userEvent.setup();
       const button = screen.getByRole('button', { name: 'Select Session' });
       await user.click(button);

src/containers/CourseCard/components/CourseCardActions/ViewCourseButton.test.jsx

@@ -1,5 +1,6 @@
 import { render, screen } from '@testing-library/react';
 import userEvent from '@testing-library/user-event';
+import { IntlProvider } from '@edx/frontend-platform/i18n';
 
 import track from 'tracking';
 import { reduxHooks } from 'hooks';
@@ -20,7 +21,6 @@ jest.mock('hooks', () => ({
 }));
 jest.mock('../hooks', () => jest.fn(() => ({ disableViewCourse: false })));
 
-jest.unmock('@openedx/paragon');
 jest.mock('./ActionButton/hooks', () => jest.fn(() => false));
 
 const defaultProps = { cardId: 'cardId' };
@@ -28,14 +28,14 @@ const homeUrl = 'homeUrl';
 
 describe('ViewCourseButton', () => {
   it('learner can view course', async () => {
-    render(<ViewCourseButton {...defaultProps} />);
+    render(<IntlProvider locale="en"><ViewCourseButton {...defaultProps} /></IntlProvider>);
     const button = screen.getByRole('button', { name: 'View Course' });
     expect(button).toBeInTheDocument();
     expect(button).not.toHaveClass('disabled');
     expect(button).not.toHaveAttribute('aria-disabled', 'true');
   });
   it('calls trackCourseEvent on click', async () => {
-    render(<ViewCourseButton {...defaultProps} />);
+    render(<IntlProvider locale="en"><ViewCourseButton {...defaultProps} /></IntlProvider>);
     const user = userEvent.setup();
     const button = screen.getByRole('button', { name: 'View Course' });
     await user.click(button);
@@ -47,7 +47,7 @@ describe('ViewCourseButton', () => {
   });
   it('learner cannot view course', () => {
     useActionDisabledState.mockReturnValueOnce({ disableViewCourse: true });
-    render(<ViewCourseButton {...defaultProps} />);
+    render(<IntlProvider locale="en"><ViewCourseButton {...defaultProps} /></IntlProvider>);
     const button = screen.getByRole('button', { name: 'View Course' });
     expect(button).toHaveClass('disabled');
     expect(button).toHaveAttribute('aria-disabled', 'true');

src/containers/CourseCard/components/CourseCardBanners/CreditBanner/views/components/CreditRequestForm/hooks.test.js

@@ -4,6 +4,12 @@ import useCreditRequestFormData from './hooks';
 
 const requestData = 'test-request-data';
 
+// jest.mock('react', () => ({
+//   ...jest.requireActual('react'),
+//   useRef: jest.fn((val) => ({ current: val, useRef: true })),
+//   useEffect: jest.fn((cb, prereqs) => ({ useEffect: { cb, prereqs } })),
+// }));
+
 let out;
 const ref = {
   current: { click: jest.fn() },

src/containers/CourseCard/components/CourseCardDetails/hooks.test.js

@@ -20,6 +20,16 @@ jest.mock('hooks', () => ({
   },
 }));
 
+// jest.mock('@edx/frontend-platform/i18n', () => {
+//   const { formatMessage } = jest.requireActual('testUtils');
+//   return {
+//     ...jest.requireActual('@edx/frontend-platform/i18n'),
+//     useIntl: () => ({
+//       formatMessage,
+//     }),
+//   };
+// });
+
 const cardId = 'my-test-card-id';
 const courseNumber = 'test-course-number';
 const useAccessMessage = 'test-access-message';

src/containers/CourseCard/components/RelatedProgramsBadge/hooks.test.js

@@ -12,6 +12,16 @@ jest.mock('hooks', () => ({
   },
 }));
 
+// jest.mock('@edx/frontend-platform/i18n', () => {
+//   const { formatMessage } = jest.requireActual('testUtils');
+//   return {
+//     ...jest.requireActual('@edx/frontend-platform/i18n'),
+//     useIntl: () => ({
+//       formatMessage,
+//     }),
+//   };
+// });
+
 const cardId = 'test-card-id';
 
 const state = new MockUseState(hooks);

src/containers/CourseCard/hooks.test.js

@@ -11,6 +11,16 @@ jest.mock('hooks', () => ({
   },
 }));
 
+// jest.mock('@edx/frontend-platform/i18n', () => {
+//   const { formatMessage } = jest.requireActual('testUtils');
+//   return {
+//     ...jest.requireActual('@edx/frontend-platform/i18n'),
+//     useIntl: () => ({
+//       formatMessage,
+//     }),
+//   };
+// });
+
 const cardId = 'my-test-course-number';
 
 describe('CourseCard hooks', () => {

src/containers/CourseFilterControls/hooks.test.js

@@ -7,6 +7,15 @@ import track from 'tracking';
 
 import * as hooks from './hooks';
 
+// jest.mock('@openedx/paragon', () => ({
+//   ...jest.requireActual('@openedx/paragon'),
+//   useToggle: jest.fn().mockImplementation((val) => [
+//     val,
+//     jest.fn().mockName('useToggle.setTrue'),
+//     jest.fn().mockName('useToggle.setFalse'),
+//   ]),
+// }));
+
 jest.mock('tracking', () => ({
   filter: {
     filterClicked: jest.fn(),

src/containers/Dashboard/hooks.test.js

@@ -10,16 +10,32 @@ import appMessages from 'messages';
 import * as hooks from './hooks';
 
 jest.mock('@openedx/paragon', () => ({
+  ...jest.requireActual('@openedx/paragon'),
   useWindowSize: jest.fn(),
   breakpoints: {},
 }));
 
+// jest.mock('@edx/frontend-platform/i18n', () => {
+//   const { formatMessage } = jest.requireActual('testUtils');
+//   return {
+//     ...jest.requireActual('@edx/frontend-platform/i18n'),
+//     useIntl: () => ({
+//       formatMessage,
+//     }),
+//   };
+// });
+
 jest.mock('hooks', () => ({
   apiHooks: {
     useInitializeApp: jest.fn(),
   },
 }));
 
+// jest.mock('react', () => ({
+//   ...jest.requireActual('react'),
+//   useEffect: jest.fn((cb, prereqs) => ({ useEffect: { cb, prereqs } })),
+// }));
+
 const state = new MockUseState(hooks);
 
 const initializeApp = jest.fn();

src/containers/LearnerDashboardHeader/hooks.test.js

@@ -18,6 +18,16 @@ jest.mock('tracking', () => ({
   },
 }));
 
+// jest.mock('@edx/frontend-platform/i18n', () => {
+//   const { formatMessage } = jest.requireActual('testUtils');
+//   return {
+//     ...jest.requireActual('@edx/frontend-platform/i18n'),
+//     useIntl: () => ({
+//       formatMessage,
+//     }),
+//   };
+// });
+
 const url = 'http://example.com';
 
 describe('LearnerDashboardHeader hooks', () => {

src/containers/MasqueradeBar/hooks.test.js

@@ -4,6 +4,16 @@ import { apiHooks, reduxHooks } from 'hooks';
 import * as hooks from './hooks';
 import messages from './messages';
 
+// jest.mock('@edx/frontend-platform/i18n', () => {
+//   const { formatMessage } = jest.requireActual('testUtils');
+//   return {
+//     ...jest.requireActual('@edx/frontend-platform/i18n'),
+//     useIntl: () => ({
+//       formatMessage,
+//     }),
+//   };
+// });
+
 jest.mock('hooks', () => ({
   apiHooks: {
     useMasqueradeAs: jest.fn(),

src/containers/SelectSessionModal/hooks.test.js

@@ -8,6 +8,16 @@ import { LEAVE_OPTION } from './constants';
 import messages from './messages';
 import * as hooks from './hooks';
 
+// jest.mock('@edx/frontend-platform/i18n', () => {
+//   const { formatMessage } = jest.requireActual('testUtils');
+//   return {
+//     ...jest.requireActual('@edx/frontend-platform/i18n'),
+//     useIntl: () => ({
+//       formatMessage,
+//     }),
+//   };
+// });
+
 jest.mock('tracking', () => ({
   entitlements: {
     newSession: jest.fn(),

src/hooks/api.test.js

@@ -30,6 +30,10 @@ jest.mock('data/redux/hooks', () => ({
   useClearRequest: jest.fn(),
   useEmailConfirmationData: jest.fn(),
 }));
+// jest.mock('react', () => ({
+//   ...jest.requireActual('react'),
+//   useContext: jest.fn(context => context),
+// }));
 
 const moduleKeys = keyStore(apiHooks);
 const testString = 'TEST-string';

src/hooks/utils.test.js

@@ -1,6 +1,10 @@
 import * as utils from './utils';
 
 jest.unmock('./utils');
+// jest.mock('react', () => ({
+//   ...jest.requireActual('react'),
+//   useCallback: jest.fn((cb, prereqs) => ({ useCallback: { cb, prereqs } })),
+// }));
 
 describe('app-level hooks', () => {
   describe('useValuecallback', () => {

src/setupTest.jsx

@@ -1,16 +1,6 @@
 /* eslint-disable import/no-extraneous-dependencies */
 import '@testing-library/jest-dom';
 
-jest.mock('react', () => ({
-  ...jest.requireActual('react'),
-  useRef: jest.fn((val) => ({ current: val, useRef: true })),
-  useCallback: jest.fn((cb, prereqs) => ({ useCallback: { cb, prereqs } })),
-  useEffect: jest.fn((cb, prereqs) => ({ useEffect: { cb, prereqs } })),
-  useMemo: jest.fn((cb, prereqs) => cb(prereqs)),
-  useContext: jest.fn(context => context),
-  useState: jest.fn(),
-}));
-
 jest.mock('reselect', () => ({
   createSelector: jest.fn((preSelectors, cb) => ({ preSelectors, cb })),
 }));
@@ -30,132 +20,33 @@ jest.mock('react-redux', () => {
   };
 });
 
-jest.mock('moment', () => ({
-  __esModule: true,
-  default: (date) => ({
-    toDate: jest.fn().mockReturnValue(date),
-  }),
-}));
-
 jest.mock('@edx/frontend-platform/react', () => ({
   ...jest.requireActual('@edx/frontend-platform/react'),
   ErrorPage: () => 'ErrorPage',
 }));
 
+jest.mock('react', () => ({
+  ...jest.requireActual('react'),
+  useEffect: jest.fn((cb, prereqs) => ({ useEffect: { cb, prereqs } })),
+  useContext: jest.fn(context => context),
+  useRef: jest.fn((val) => ({ current: val, useRef: true })),
+  useCallback: jest.fn((cb, prereqs) => ({ useCallback: { cb, prereqs } })),
+}));
+
 jest.mock('@edx/frontend-platform/i18n', () => {
-  const i18n = jest.requireActual('@edx/frontend-platform/i18n');
-  const PropTypes = jest.requireActual('prop-types');
-  const { formatMessage } = jest.requireActual('./testUtils');
-  const formatDate = jest.fn(date => new Date(date).toLocaleDateString()).mockName('useIntl.formatDate');
+  const { formatMessage: fn } = jest.requireActual('testUtils');
   return {
-    ...i18n,
-    intlShape: PropTypes.shape({
-      formatMessage: PropTypes.func,
-    }),
+    ...jest.requireActual('@edx/frontend-platform/i18n'),
     useIntl: () => ({
-      formatMessage,
-      formatDate,
+      formatMessage: fn,
     }),
-    defineMessages: m => m,
-    FormattedMessage: () => 'FormattedMessage',
   };
 });
 
-jest.mock('@openedx/paragon', () => jest.requireActual('testUtils').mockNestedComponents({
-  Alert: {
-    Heading: 'Alert.Heading',
-  },
-  AlertModal: 'AlertModal',
-  MarketingModal: 'MarketingModal',
-  ActionRow: 'ActionRow',
-  Badge: 'Badge',
-  Button: 'Button',
-  Card: {
-    Body: 'Card.Body',
-    Footer: 'Card.Footer',
-    Header: 'Card.Header',
-    ImageCap: 'Card.ImageCap',
-    Section: 'Card.Section',
-  },
-  CardGrid: 'CardGrid',
-  Chip: 'Chip',
-  Col: 'Col',
-  Collapsible: {
-    Advanced: 'Collapsible.Advanced',
-    Body: 'Collapsible.Body',
-    Trigger: 'Collapsible.Trigger',
-    Visible: 'Collapsible.Visible',
-  },
-  Container: 'Container',
-  DataTable: {
-    EmptyTable: 'DataTable.EmptyTable',
-    Table: 'DataTable.Table',
-    TableControlBar: 'DataTable.TableControlBar',
-    TableController: 'DataTable.TableController',
-    TableFooter: 'DataTable.TableFooter',
-  },
-  Dropdown: {
-    Item: 'Dropdown.Item',
-    Menu: 'Dropdown.Menu',
-    Toggle: 'Dropdown.Toggle',
-    Header: 'Dropdown.Header',
-    Divider: 'Dropdown.Divider',
-  },
-  Form: {
-    Checkbox: 'Form.Checkbox',
-    CheckboxSet: 'Form.CheckboxSet',
-    Control: {
-      Feedback: 'Form.Control.Feedback',
-    },
-    Group: 'Form.Group',
-    Label: 'Form.Label',
-    Radio: 'Form.Radio',
-    RadioSet: 'Form.RadioSet',
-    Switch: 'Form.Switch',
-  },
-  FormControl: 'FormControl',
-  FormControlFeedback: 'FormControlFeedback',
-  FormGroup: 'FormGroup',
-  FormLabel: 'FormLabel',
-  FullscreenModal: 'FullscreenModal',
-  Hyperlink: 'Hyperlink',
-  Icon: 'Icon',
-  IconButton: 'IconButton',
-  Image: 'Image',
-  MailtoLink: 'MailtoLink',
-  ModalDialog: {
-    Header: 'ModalDialog.Header',
-    Body: 'ModalDialog.Body',
-    Hero: 'ModalDialog.Hero',
-  },
-  ModalPopup: 'ModalPopup',
-  ModalCloseButton: 'ModalCloseButton',
-  MultiSelectDropdownFilter: 'MultiSelectDropdownFilter',
-  OverlayTrigger: 'OverlayTrigger',
-  Popover: {
-    Content: 'Popover.Content',
-  },
-  Row: 'Row',
-  Sheet: 'Sheet',
-  StatefulButton: 'StatefulButton',
-  TextFilter: 'TextFilter',
-  Truncate: 'Truncate',
-  Skeleton: 'Skeleton',
-  Spinner: 'Spinner',
-  PageBanner: 'PageBanner',
-  Pagination: 'Pagination',
-
-  useWindowSize: () => jest.fn(),
-  useToggle: () => jest.fn().mockImplementation((val) => [
-    val,
-    jest.fn().mockName('useToggle.setTrue'),
-    jest.fn().mockName('useToggle.setFalse'),
-  ]),
-  useCheckboxSetValues: () => jest.fn().mockImplementation((values) => ([values, {
-    add: jest.fn().mockName('useCheckboxSetValues.add'),
-    remove: jest.fn().mockName('useCheckboxSetValues.remove'),
-  }])),
-  breakpoints: () => ({
+jest.mock('@openedx/paragon', () => ({
+  ...jest.requireActual('@openedx/paragon'),
+  useWindowSize: jest.fn(),
+  breakpoints: {
     extraSmall: {
       minWidth: 0,
       maxWidth: 575,
@@ -176,53 +67,10 @@ jest.mock('@openedx/paragon', () => jest.requireActual('testUtils').mockNestedCo
       minWidth: 1200,
       maxWidth: 100000,
     },
-  }),
+  },
+  useToggle: jest.fn().mockImplementation((val) => [
+    val,
+    jest.fn().mockName('useToggle.setTrue'),
+    jest.fn().mockName('useToggle.setFalse'),
+  ]),
 }));
-
-jest.mock('@fortawesome/react-fontawesome', () => ({
-  FontAwesomeIcon: 'FontAwesomeIcon',
-}));
-jest.mock('@fortawesome/free-solid-svg-icons', () => ({
-  faUserCircle: jest.fn().mockName('fa-user-circle-icon'),
-}));
-
-jest.mock('@openedx/paragon/icons', () => ({
-  ArrowBack: jest.fn().mockName('icons.ArrowBack'),
-  ArrowDropDown: jest.fn().mockName('icons.ArrowDropDown'),
-  ArrowDropUp: jest.fn().mockName('icons.ArrowDropUp'),
-  Book: jest.fn().mockName('icons.Book'),
-  Cancel: jest.fn().mockName('icons.Cancel'),
-  Close: jest.fn().mockName('icons.Close'),
-  CheckCircle: jest.fn().mockName('icons.CheckCircle'),
-  ChevronLeft: jest.fn().mockName('icons.ChevronLeft'),
-  ChevronRight: jest.fn().mockName('icons.ChevronRight'),
-  Highlight: jest.fn().mockName('icons.Highlight'),
-  Info: jest.fn().mockName('icons.Info'),
-  InfoOutline: jest.fn().mockName('icons.InfoOutline'),
-  Launch: jest.fn().mockName('icons.Launch'),
-  Locked: jest.fn().mockName('icons.Locked'),
-  MoreVert: jest.fn().mockName('icons.MoreVert'),
-  Tune: jest.fn().mockName('icons.Tune'),
-  PersonSearch: jest.fn().mockName('icons.PersonSearch'),
-  Program: jest.fn().mockName('icons.Program'),
-  Search: jest.fn().mockName('icons.Search'),
-}));
-
-jest.mock('data/constants/app', () => ({
-  ...jest.requireActual('data/constants/app'),
-  locationId: 'fake-location-id',
-}));
-
-jest.mock('utils', () => ({
-  ...jest.requireActual('utils'),
-  nullMethod: jest.fn().mockName('utils.nullMethod'),
-}));
-
-jest.mock('utils/hooks', () => {
-  const formatDate = jest.fn(date => new Date(date).toLocaleDateString())
-    .mockName('utils.formatDate');
-  return {
-    formatDate,
-    useFormatDate: () => formatDate,
-  };
-});