fix: standardize mock store setup in tests

src/__tests__/HospitalRun.test.tsx

@@ -6,7 +6,7 @@ import React from 'react'
 import { act } from 'react-dom/test-utils'
 import { Provider } from 'react-redux'
 import { MemoryRouter } from 'react-router-dom'
-import configureMockStore from 'redux-mock-store'
+import createMockStore from 'redux-mock-store'
 import thunk from 'redux-thunk'
 
 import { addBreadcrumbs } from '../breadcrumbs/breadcrumbs-slice'
@@ -17,8 +17,9 @@ import Incidents from '../incidents/Incidents'
 import ViewLabs from '../labs/ViewLabs'
 import Permissions from '../model/Permissions'
 import Appointments from '../scheduling/appointments/Appointments'
+import { RootState } from '../store'
 
-const mockStore = configureMockStore([thunk])
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('HospitalRun', () => {
   describe('routing', () => {
@@ -31,7 +32,7 @@ describe('HospitalRun', () => {
           breadcrumbs: { breadcrumbs: [] },
           components: { sidebarCollapsed: false },
           incidents: { incidents: [] },
-        })
+        } as any)
 
         const wrapper = mount(
           <Provider store={store}>
@@ -63,7 +64,7 @@ describe('HospitalRun', () => {
               user: { permissions: [] },
               breadcrumbs: { breadcrumbs: [] },
               components: { sidebarCollapsed: false },
-            })}
+            } as any)}
           >
             <MemoryRouter initialEntries={['/appointments']}>
               <HospitalRun />
@@ -84,7 +85,7 @@ describe('HospitalRun', () => {
           labs: { labs: [] },
           breadcrumbs: { breadcrumbs: [] },
           components: { sidebarCollapsed: false },
-        })
+        } as any)
 
         let wrapper: any
         await act(async () => {
@@ -108,7 +109,7 @@ describe('HospitalRun', () => {
           user: { permissions: [] },
           breadcrumbs: { breadcrumbs: [] },
           components: { sidebarCollapsed: false },
-        })
+        } as any)
 
         const wrapper = mount(
           <Provider store={store}>
@@ -131,7 +132,7 @@ describe('HospitalRun', () => {
           breadcrumbs: { breadcrumbs: [] },
           components: { sidebarCollapsed: false },
           incidents: { incidents: [] },
-        })
+        } as any)
 
         let wrapper: any
         await act(async () => {
@@ -155,7 +156,7 @@ describe('HospitalRun', () => {
           user: { permissions: [] },
           breadcrumbs: { breadcrumbs: [] },
           components: { sidebarCollapsed: false },
-        })
+        } as any)
 
         const wrapper = mount(
           <Provider store={store}>
@@ -180,7 +181,7 @@ describe('HospitalRun', () => {
             user: { permissions: [Permissions.WritePatients] },
             breadcrumbs: { breadcrumbs: [] },
             components: { sidebarCollapsed: false },
-          })}
+          } as any)}
         >
           <MemoryRouter initialEntries={['/']}>
             <HospitalRun />

src/__tests__/breadcrumbs/Breadcrumbs.test.tsx

@@ -1,5 +1,4 @@
 import '../../__mocks__/matchMediaMock'
-
 import {
   Breadcrumb as HRBreadcrumb,
   BreadcrumbItem as HRBreadcrumbItem,
@@ -9,19 +8,21 @@ import { createMemoryHistory } from 'history'
 import React from 'react'
 import { Provider } from 'react-redux'
 import { Router } from 'react-router-dom'
-import configureMockStore from 'redux-mock-store'
+import createMockStore from 'redux-mock-store'
+import thunk from 'redux-thunk'
 
 import Breadcrumbs from '../../breadcrumbs/Breadcrumbs'
 import Breadcrumb from '../../model/Breadcrumb'
+import { RootState } from '../../store'
 
-const mockStore = configureMockStore()
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('Breadcrumbs', () => {
   const setup = (breadcrumbs: Breadcrumb[]) => {
     const history = createMemoryHistory()
     const store = mockStore({
       breadcrumbs: { breadcrumbs },
-    })
+    } as any)
 
     const wrapper = mount(
       <Provider store={store}>

src/__tests__/breadcrumbs/useAddBreadcrumbs.test.tsx

@@ -1,18 +1,20 @@
 import { renderHook } from '@testing-library/react-hooks'
 import React from 'react'
 import { Provider } from 'react-redux'
-import configureMockStore from 'redux-mock-store'
+import createMockStore from 'redux-mock-store'
+import thunk from 'redux-thunk'
 
 import * as breadcrumbsSlice from '../../breadcrumbs/breadcrumbs-slice'
 import useAddBreadcrumbs from '../../breadcrumbs/useAddBreadcrumbs'
+import { RootState } from '../../store'
 
-const store = configureMockStore()
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('useAddBreadcrumbs', () => {
   beforeEach(() => jest.clearAllMocks())
 
   it('should call addBreadcrumbs with the correct data', () => {
-    const wrapper = ({ children }: any) => <Provider store={store({})}>{children}</Provider>
+    const wrapper = ({ children }: any) => <Provider store={mockStore({})}>{children}</Provider>
 
     jest.spyOn(breadcrumbsSlice, 'addBreadcrumbs')
     const breadcrumbs = [
@@ -28,7 +30,7 @@ describe('useAddBreadcrumbs', () => {
   })
 
   it('should call addBreadcrumbs with an additional dashboard breadcrumb', () => {
-    const wrapper = ({ children }: any) => <Provider store={store({})}>{children}</Provider>
+    const wrapper = ({ children }: any) => <Provider store={mockStore({})}>{children}</Provider>
 
     jest.spyOn(breadcrumbsSlice, 'addBreadcrumbs')
     const breadcrumbs = [
@@ -47,7 +49,7 @@ describe('useAddBreadcrumbs', () => {
   })
 
   it('should call removeBreadcrumbs with the correct data after unmount', () => {
-    const wrapper = ({ children }: any) => <Provider store={store({})}>{children}</Provider>
+    const wrapper = ({ children }: any) => <Provider store={mockStore({})}>{children}</Provider>
 
     jest.spyOn(breadcrumbsSlice, 'addBreadcrumbs')
     jest.spyOn(breadcrumbsSlice, 'removeBreadcrumbs')

src/__tests__/components/Sidebar.test.tsx

@@ -7,18 +7,19 @@ import { createMemoryHistory } from 'history'
 import React from 'react'
 import { Provider } from 'react-redux'
 import { Router } from 'react-router-dom'
-import configureMockStore from 'redux-mock-store'
+import createMockStore from 'redux-mock-store'
 import thunk from 'redux-thunk'
 
 import Sidebar from '../../components/Sidebar'
+import { RootState } from '../../store'
 
-const mockStore = configureMockStore([thunk])
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('Sidebar', () => {
   let history = createMemoryHistory()
   const store = mockStore({
     components: { sidebarCollapsed: false },
-  })
+  } as any)
   const setup = (location: string) => {
     history = createMemoryHistory()
     history.push(location)

src/__tests__/incidents/Incidents.test.tsx

@@ -5,7 +5,7 @@ import { mount } from 'enzyme'
 import React from 'react'
 import { Provider } from 'react-redux'
 import { MemoryRouter } from 'react-router-dom'
-import configureMockStore from 'redux-mock-store'
+import createMockStore from 'redux-mock-store'
 import thunk from 'redux-thunk'
 
 import IncidentRepository from '../../clients/db/IncidentRepository'
@@ -14,8 +14,9 @@ import ReportIncident from '../../incidents/report/ReportIncident'
 import ViewIncident from '../../incidents/view/ViewIncident'
 import Incident from '../../model/Incident'
 import Permissions from '../../model/Permissions'
+import { RootState } from '../../store'
 
-const mockStore = configureMockStore([thunk])
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('Incidents', () => {
   describe('routing', () => {
@@ -34,7 +35,7 @@ describe('Incidents', () => {
           incident: {
             incident: expectedIncident,
           },
-        })
+        } as any)
 
         const wrapper = mount(
           <Provider store={store}>
@@ -53,7 +54,7 @@ describe('Incidents', () => {
           user: { permissions: [] },
           breadcrumbs: { breadcrumbs: [] },
           components: { sidebarCollapsed: false },
-        })
+        } as any)
 
         const wrapper = mount(
           <Provider store={store}>
@@ -82,7 +83,7 @@ describe('Incidents', () => {
               reportedOn: new Date().toISOString(),
             },
           },
-        })
+        } as any)
 
         let wrapper: any
 
@@ -105,7 +106,7 @@ describe('Incidents', () => {
           user: { permissions: [] },
           breadcrumbs: { breadcrumbs: [] },
           components: { sidebarCollapsed: false },
-        })
+        } as any)
 
         const wrapper = await mount(
           <Provider store={store}>

src/__tests__/incidents/list/ViewIncidents.test.tsx

@@ -16,8 +16,9 @@ import Incident from '../../../model/Incident'
 import Permissions from '../../../model/Permissions'
 import * as ButtonBarProvider from '../../../page-header/ButtonBarProvider'
 import * as titleUtil from '../../../page-header/useTitle'
+import { RootState } from '../../../store'
 
-const mockStore = createMockStore([thunk])
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('View Incidents', () => {
   let history: any
@@ -52,7 +53,7 @@ describe('View Incidents', () => {
       incidents: {
         incidents: expectedIncidents,
       },
-    })
+    } as any)
 
     let wrapper: any
     await act(async () => {

src/__tests__/incidents/report/ReportIncident.test.tsx

@@ -16,8 +16,9 @@ import ReportIncident from '../../../incidents/report/ReportIncident'
 import Permissions from '../../../model/Permissions'
 import * as ButtonBarProvider from '../../../page-header/ButtonBarProvider'
 import * as titleUtil from '../../../page-header/useTitle'
+import { RootState } from '../../../store'
 
-const mockStore = createMockStore([thunk])
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('Report Incident', () => {
   let history: any
@@ -43,7 +44,7 @@ describe('Report Incident', () => {
       incident: {
         error,
       },
-    })
+    } as any)
 
     let wrapper: any
     await act(async () => {

src/__tests__/incidents/view/ViewIncident.test.tsx

@@ -16,8 +16,9 @@ import Incident from '../../../model/Incident'
 import Permissions from '../../../model/Permissions'
 import * as ButtonBarProvider from '../../../page-header/ButtonBarProvider'
 import * as titleUtil from '../../../page-header/useTitle'
+import { RootState } from '../../../store'
 
-const mockStore = createMockStore([thunk])
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('View Incident', () => {
   const expectedDate = new Date(2020, 5, 1, 19, 48)
@@ -52,7 +53,7 @@ describe('View Incident', () => {
       incident: {
         incident: expectedIncident,
       },
-    })
+    } as any)
 
     let wrapper: any
     await act(async () => {

src/__tests__/labs/Labs.test.tsx

@@ -5,7 +5,7 @@ import { mount } from 'enzyme'
 import React from 'react'
 import { Provider } from 'react-redux'
 import { MemoryRouter } from 'react-router-dom'
-import configureMockStore from 'redux-mock-store'
+import createMockStore from 'redux-mock-store'
 import thunk from 'redux-thunk'
 
 import LabRepository from '../../clients/db/LabRepository'
@@ -16,8 +16,9 @@ import ViewLab from '../../labs/ViewLab'
 import Lab from '../../model/Lab'
 import Patient from '../../model/Patient'
 import Permissions from '../../model/Permissions'
+import { RootState } from '../../store'
 
-const mockStore = configureMockStore([thunk])
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('Labs', () => {
   jest.spyOn(LabRepository, 'findAll').mockResolvedValue([])
@@ -41,7 +42,7 @@ describe('Labs', () => {
             patient: { id: 'patientId', fullName: 'some name' },
             error: {},
           },
-        })
+        } as any)
 
         const wrapper = mount(
           <Provider store={store}>
@@ -60,7 +61,7 @@ describe('Labs', () => {
           user: { permissions: [] },
           breadcrumbs: { breadcrumbs: [] },
           components: { sidebarCollapsed: false },
-        })
+        } as any)
 
         const wrapper = mount(
           <Provider store={store}>
@@ -90,7 +91,7 @@ describe('Labs', () => {
             patient: { id: 'patientId', fullName: 'some name' },
             error: {},
           },
-        })
+        } as any)
 
         let wrapper: any
 
@@ -113,7 +114,7 @@ describe('Labs', () => {
           user: { permissions: [] },
           breadcrumbs: { breadcrumbs: [] },
           components: { sidebarCollapsed: false },
-        })
+        } as any)
 
         const wrapper = await mount(
           <Provider store={store}>

src/__tests__/labs/ViewLab.test.tsx

@@ -20,8 +20,9 @@ import Patient from '../../model/Patient'
 import Permissions from '../../model/Permissions'
 import * as ButtonBarProvider from '../../page-header/ButtonBarProvider'
 import * as titleUtil from '../../page-header/useTitle'
+import { RootState } from '../../store'
 
-const mockStore = createMockStore([thunk])
+const mockStore = createMockStore<RootState, any>([thunk])
 
 describe('View Labs', () => {
   let history: any
@@ -63,7 +64,7 @@ describe('View Labs', () => {
         error,
         status: Object.keys(error).length > 0 ? 'error' : 'completed',
       },
-    })
+    } as any)
 
     let wrapper: any
     await act(async () => {