feat(incidents): add incident related routing

src/HospitalRun.tsx

@@ -17,6 +17,7 @@ import { RootState } from './store'
 import Navbar from './components/Navbar'
 import PrivateRoute from './components/PrivateRoute'
 import Patients from './patients/Patients'
+import Incidents from './incidents/Incidents'
 
 const HospitalRun = () => {
   const { title } = useSelector((state: RootState) => state.title)
@@ -74,6 +75,7 @@ const HospitalRun = () => {
                   />
                   <PrivateRoute isAuthenticated path="/patients" component={Patients} />
                   <PrivateRoute isAuthenticated path="/labs" component={Labs} />
+                  <PrivateRoute isAuthenticated path="/incidents" component={Incidents} />
                 </Switch>
               </div>
               <Toaster autoClose={5000} hideProgressBar draggable />

src/__tests__/HospitalRun.test.tsx

@@ -20,6 +20,7 @@ import Patient from '../model/Patient'
 import Appointment from '../model/Appointment'
 import HospitalRun from '../HospitalRun'
 import Permissions from '../model/Permissions'
+import Incidents from '../incidents/Incidents'
 
 const mockStore = configureMockStore([thunk])
 
@@ -256,6 +257,52 @@ describe('HospitalRun', () => {
         expect(wrapper.find(Dashboard)).toHaveLength(1)
       })
     })
+
+    describe('/incidents', () => {
+      it('should render the Incidents component when /incidents is accessed', async () => {
+        const store = mockStore({
+          title: 'test',
+          user: { permissions: [Permissions.ViewIncidents] },
+          breadcrumbs: { breadcrumbs: [] },
+          components: { sidebarCollapsed: false },
+        })
+
+        let wrapper: any
+        await act(async () => {
+          wrapper = await mount(
+            <Provider store={store}>
+              <MemoryRouter initialEntries={['/incidents']}>
+                <HospitalRun />
+              </MemoryRouter>
+            </Provider>,
+          )
+        })
+        wrapper.update()
+
+        expect(wrapper.find(Incidents)).toHaveLength(1)
+      })
+
+      it('should render the dashboard if the user does not have permissions to view incidents', () => {
+        jest.spyOn(LabRepository, 'findAll').mockResolvedValue([])
+        const store = mockStore({
+          title: 'test',
+          user: { permissions: [] },
+          breadcrumbs: { breadcrumbs: [] },
+          components: { sidebarCollapsed: false },
+        })
+
+        const wrapper = mount(
+          <Provider store={store}>
+            <MemoryRouter initialEntries={['/incidents']}>
+              <HospitalRun />
+            </MemoryRouter>
+          </Provider>,
+        )
+
+        expect(wrapper.find(Incidents)).toHaveLength(0)
+        expect(wrapper.find(Dashboard)).toHaveLength(1)
+      })
+    })
   })
 
   describe('layout', () => {

src/__tests__/components/Sidebar.test.tsx

@@ -326,4 +326,93 @@ describe('Sidebar', () => {
       expect(history.location.pathname).toEqual('/labs')
     })
   })
+
+  describe('incident links', () => {
+    it('should render the main incidents link', () => {
+      const wrapper = setup('/incidents')
+
+      const listItems = wrapper.find(ListItem)
+
+      expect(listItems.at(5).text().trim()).toEqual('incidents.label')
+    })
+
+    it('should render the new incident report link', () => {
+      const wrapper = setup('/incidents')
+
+      const listItems = wrapper.find(ListItem)
+
+      expect(listItems.at(6).text().trim()).toEqual('incidents.reports.new')
+    })
+
+    it('should render the incidents list link', () => {
+      const wrapper = setup('/incidents')
+
+      const listItems = wrapper.find(ListItem)
+
+      expect(listItems.at(7).text().trim()).toEqual('incidents.reports.label')
+    })
+
+    it('main incidents link should be active when the current path is /incidents', () => {
+      const wrapper = setup('/incidents')
+
+      const listItems = wrapper.find(ListItem)
+
+      expect(listItems.at(5).prop('active')).toBeTruthy()
+    })
+
+    it('should navigate to /incidents when the main incident link is clicked', () => {
+      const wrapper = setup('/')
+
+      const listItems = wrapper.find(ListItem)
+
+      act(() => {
+        const onClick = listItems.at(5).prop('onClick') as any
+        onClick()
+      })
+
+      expect(history.location.pathname).toEqual('/incidents')
+    })
+
+    it('new incident report link should be active when the current path is /incidents/new', () => {
+      const wrapper = setup('/incidents/new')
+
+      const listItems = wrapper.find(ListItem)
+
+      expect(listItems.at(6).prop('active')).toBeTruthy()
+    })
+
+    it('should navigate to /incidents/new when the new labs link is clicked', () => {
+      const wrapper = setup('/incidents')
+
+      const listItems = wrapper.find(ListItem)
+
+      act(() => {
+        const onClick = listItems.at(6).prop('onClick') as any
+        onClick()
+      })
+
+      expect(history.location.pathname).toEqual('/incidents/new')
+    })
+
+    it('incidents list link should be active when the current path is /incidents', () => {
+      const wrapper = setup('/incidents')
+
+      const listItems = wrapper.find(ListItem)
+
+      expect(listItems.at(7).prop('active')).toBeTruthy()
+    })
+
+    it('should navigate to /labs when the labs list link is clicked', () => {
+      const wrapper = setup('/incidents/new')
+
+      const listItems = wrapper.find(ListItem)
+
+      act(() => {
+        const onClick = listItems.at(7).prop('onClick') as any
+        onClick()
+      })
+
+      expect(history.location.pathname).toEqual('/incidents')
+    })
+  })
 })

src/__tests__/incidents/Incidents.test.tsx

@@ -0,0 +1,102 @@
+import '../../__mocks__/matchMediaMock'
+import React from 'react'
+import { mount } from 'enzyme'
+import { MemoryRouter } from 'react-router'
+import { Provider } from 'react-redux'
+import thunk from 'redux-thunk'
+import configureMockStore from 'redux-mock-store'
+import { act } from '@testing-library/react'
+import Permissions from 'model/Permissions'
+import ViewIncident from '../../incidents/view/ViewIncident'
+import Incidents from '../../incidents/Incidents'
+import ReportIncident from '../../incidents/report/ReportIncident'
+
+const mockStore = configureMockStore([thunk])
+
+describe('Incidents', () => {
+  describe('routing', () => {
+    describe('/incidents/new', () => {
+      it('should render the new lab request screen when /incidents/new is accessed', () => {
+        const store = mockStore({
+          title: 'test',
+          user: { permissions: [Permissions.ReportIncident] },
+          breadcrumbs: { breadcrumbs: [] },
+          components: { sidebarCollapsed: false },
+        })
+
+        const wrapper = mount(
+          <Provider store={store}>
+            <MemoryRouter initialEntries={['/incidents/new']}>
+              <Incidents />
+            </MemoryRouter>
+          </Provider>,
+        )
+
+        expect(wrapper.find(ReportIncident)).toHaveLength(1)
+      })
+
+      it('should not navigate to /incidents/new if the user does not have RequestLab permissions', () => {
+        const store = mockStore({
+          title: 'test',
+          user: { permissions: [] },
+          breadcrumbs: { breadcrumbs: [] },
+          components: { sidebarCollapsed: false },
+        })
+
+        const wrapper = mount(
+          <Provider store={store}>
+            <MemoryRouter initialEntries={['/incidents/new']}>
+              <Incidents />
+            </MemoryRouter>
+          </Provider>,
+        )
+
+        expect(wrapper.find(ReportIncident)).toHaveLength(0)
+      })
+    })
+
+    describe('/incidents/:id', () => {
+      it('should render the view lab screen when /incidents/:id is accessed', async () => {
+        const store = mockStore({
+          title: 'test',
+          user: { permissions: [Permissions.ViewIncident] },
+          breadcrumbs: { breadcrumbs: [] },
+          components: { sidebarCollapsed: false },
+        })
+
+        let wrapper: any
+
+        await act(async () => {
+          wrapper = await mount(
+            <Provider store={store}>
+              <MemoryRouter initialEntries={['/incidents/1234']}>
+                <Incidents />
+              </MemoryRouter>
+            </Provider>,
+          )
+
+          expect(wrapper.find(ViewIncident)).toHaveLength(1)
+        })
+      })
+
+      it('should not navigate to /incidents/:id if the user does not have ViewIncident permissions', async () => {
+        const store = mockStore({
+          title: 'test',
+          user: { permissions: [] },
+          breadcrumbs: { breadcrumbs: [] },
+          components: { sidebarCollapsed: false },
+        })
+
+        const wrapper = await mount(
+          <Provider store={store}>
+            <MemoryRouter initialEntries={['/incidents/1234']}>
+              <Incidents />
+            </MemoryRouter>
+          </Provider>,
+        )
+
+        expect(wrapper.find(ViewIncident)).toHaveLength(0)
+      })
+    })
+  })
+})

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

@@ -0,0 +1,61 @@
+import '../../../__mocks__/matchMediaMock'
+import React from 'react'
+import { mount } from 'enzyme'
+import { createMemoryHistory } from 'history'
+import { act } from '@testing-library/react'
+import { Provider } from 'react-redux'
+import { Route, Router } from 'react-router'
+import createMockStore from 'redux-mock-store'
+import thunk from 'redux-thunk'
+import Permissions from '../../../model/Permissions'
+import * as titleUtil from '../../../page-header/useTitle'
+import * as ButtonBarProvider from '../../../page-header/ButtonBarProvider'
+import * as breadcrumbUtil from '../../../breadcrumbs/useAddBreadcrumbs'
+import ViewIncidents from '../../../incidents/list/ViewIncidents'
+
+const mockStore = createMockStore([thunk])
+
+describe('View Incidents', () => {
+  let history: any
+
+  let setButtonToolBarSpy: any
+  const setup = async (permissions: Permissions[]) => {
+    jest.resetAllMocks()
+    jest.spyOn(breadcrumbUtil, 'default')
+    setButtonToolBarSpy = jest.fn()
+    jest.spyOn(titleUtil, 'default')
+    jest.spyOn(ButtonBarProvider, 'useButtonToolbarSetter').mockReturnValue(setButtonToolBarSpy)
+
+    history = createMemoryHistory()
+    history.push(`/incidents`)
+    const store = mockStore({
+      title: '',
+      user: {
+        permissions,
+      },
+    })
+
+    let wrapper: any
+    await act(async () => {
+      wrapper = await mount(
+        <ButtonBarProvider.ButtonBarProvider>
+          <Provider store={store}>
+            <Router history={history}>
+              <Route path="/incidents">
+                <ViewIncidents />
+              </Route>
+            </Router>
+          </Provider>
+        </ButtonBarProvider.ButtonBarProvider>,
+      )
+    })
+    wrapper.update()
+    return wrapper
+  }
+
+  it('should set the title', async () => {
+    await setup([Permissions.ViewIncidents])
+
+    expect(titleUtil.default).toHaveBeenCalledWith('incidents.reports.label')
+  })
+})