feat(patients): adds functionality to save patient

src/__tests__/patients/new/NewPatient.test.tsx

@@ -0,0 +1,61 @@
+import '../../../__mocks__/matchMediaMock'
+import React from 'react'
+import { mount } from 'enzyme'
+import { MemoryRouter } from 'react-router'
+import { Provider } from 'react-redux'
+import NewPatient from '../../../patients/new/NewPatient'
+import NewPatientForm from '../../../patients/new/NewPatientForm'
+import store from '../../../store'
+import Patient from '../../../model/Patient'
+import Name from '../../../model/Name'
+import * as patientSlice from '../../../patients/patients-slice'
+import * as titleUtil from '../../../util/useTitle'
+
+describe('New Patient', () => {
+  it('should render a new patient form', () => {
+    const wrapper = mount(
+      <Provider store={store}>
+        <MemoryRouter>
+          <NewPatient />
+        </MemoryRouter>
+      </Provider>,
+    )
+
+    expect(wrapper.find(NewPatientForm)).toHaveLength(1)
+  })
+
+  it('should use "New Patient" as the header', () => {
+    jest.spyOn(titleUtil, 'default')
+    mount(
+      <Provider store={store}>
+        <MemoryRouter>
+          <NewPatient />
+        </MemoryRouter>
+      </Provider>,
+    )
+
+    expect(titleUtil.default).toHaveBeenCalledWith('patients.newPatient')
+  })
+
+  it('should call create patient when save button is clicked', async () => {
+    jest.spyOn(patientSlice, 'createPatient')
+    const expectedName = new Name('prefix', 'given', 'family', 'suffix')
+    const expectedPatient = {
+      name: expectedName,
+    } as Patient
+
+    const wrapper = mount(
+      <Provider store={store}>
+        <MemoryRouter>
+          <NewPatient />
+        </MemoryRouter>
+      </Provider>,
+    )
+
+    const newPatientForm = wrapper.find(NewPatientForm)
+
+    await newPatientForm.prop('onSave')(expectedPatient)
+
+    expect(patientSlice.createPatient).toHaveBeenCalledWith(expectedPatient, expect.anything())
+  })
+})

src/patients/new/NewPatient.tsx

@@ -1,21 +1,24 @@
 import React from 'react'
 import { useHistory } from 'react-router'
 import { useTranslation } from 'react-i18next'
+import { useDispatch } from 'react-redux'
 import NewPatientForm from './NewPatientForm'
 import useTitle from '../../util/useTitle'
 import Patient from '../../model/Patient'
+import { createPatient } from '../patients-slice'
 
 const NewPatient = () => {
   const { t } = useTranslation()
   const history = useHistory()
+  const dispatch = useDispatch()
   useTitle(t('patients.newPatient'))
 
   const onCancel = () => {
     history.push('/patients')
   }
 
   const onSave = (patient: Patient) => {
-    console.log(patient)
+    dispatch(createPatient(patient, history))
   }
 
   return <NewPatientForm onCancel={onCancel} onSave={onSave} />