Merge branch 'master' into feedback-msgs-1917

.env.example

@@ -1 +1 @@
-REACT_APP_HOSPITALRUN_API=http:https://0.0.0.0:3001
+REACT_APP_HOSPITALRUN_API=http:https://0.0.0.0:3001

package.json

@@ -6,7 +6,7 @@
  "license": "MIT",
  "dependencies": {
  "@hospitalrun/components": "^1.0.0",
- "@reduxjs/toolkit": "~1.2.1",
+ "@reduxjs/toolkit": "~1.3.0",
  "@types/pouchdb-find": "~6.3.4",
  "bootstrap": "~4.4.1",
  "date-fns": "~2.11.0",
@@ -60,8 +60,8 @@
  "@types/redux-mock-store": "~1.0.1",
  "@types/shortid": "^0.0.29",
  "@types/uuid": "^7.0.0",
- "@typescript-eslint/eslint-plugin": "~2.24.0",
- "@typescript-eslint/parser": "~2.24.0",
+ "@typescript-eslint/eslint-plugin": "~2.25.0",
+ "@typescript-eslint/parser": "~2.25.0",
  "commitizen": "~4.0.3",
  "commitlint-config-cz": "~0.13.0",
  "cross-env": "~7.0.0",

src/__tests__/patients/GeneralInformation.test.tsx

@@ -17,14 +17,14 @@ describe('Error handling', () => {
  <GeneralInformation
  patient={{} as Patient}
  isEditable
- errorMessage="patient.errors.patientGivenNameRequired"
+ errorMessage="patient.errors.patientGivenNameRequiredOnCreate"
  />
  </Router>,
  )
 
  const errorMessage = wrapper.find(Alert)
  expect(errorMessage).toBeTruthy()
- expect(errorMessage.prop('message')).toMatch('patient.errors.patientGivenNameRequired')
+ expect(errorMessage.prop('message')).toMatch('patient.errors.patientGivenNameRequiredOnCreate')
  })
 })
 

src/__tests__/patients/allergies/Allergies.test.tsx

@@ -127,7 +127,7 @@ describe('Allergies', () => {
 
  expect(mockedComponents.Toast).toHaveBeenCalledWith(
  'success',
- 'Success!',
+ 'states.success',
  'patient.allergies.successfullyAdded',
  )
  })

src/__tests__/patients/allergies/NewAllergyModal.test.tsx

@@ -84,7 +84,7 @@ describe('New Allergy Modal', () => {
 
  expect(wrapper.find(Alert)).toHaveLength(1)
  expect(wrapper.find(Alert).prop('title')).toEqual('states.error')
- expect(wrapper.find(Alert).prop('message')).toContain('patient.allergies.error.nameRequired')
+ expect(wrapper.find(Alert).prop('message')).toContain('patient.allergies.error.unableToAdd')
  })
  })
 })

src/__tests__/patients/diagnoses/Diagnoses.test.tsx

@@ -128,7 +128,7 @@ describe('Diagnoses', () => {
 
  expect(mockedComponents.Toast).toHaveBeenCalledWith(
  'success',
- 'Success!',
+ 'states.success',
  'patient.diagnoses.successfullyAdded',
  )
  })

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

@@ -95,8 +95,9 @@ describe('New Patient', () => {
 
  wrapper.update()
  expect(wrapper.find(GeneralInformation).prop('errorMessage')).toMatch(
- 'patient.errors.patientGivenNameRequired',
+ 'patient.errors.patientGivenNameRequiredOnCreate',
  )
+ expect(wrapper.update.isInvalid === true)
  })
 
  it('should dispatch createPatient when save button is clicked', async () => {
@@ -153,7 +154,7 @@ describe('New Patient', () => {
  expect(history.location.pathname).toEqual(`/patients/${patient.id}`)
  expect(mockedComponents.Toast).toHaveBeenCalledWith(
  'success',
- 'Success!',
+ 'states.success',
  `patients.successfullyCreated ${patient.fullName}`,
  )
  })

src/__tests__/patients/related-persons/RelatedPersons.test.tsx

@@ -166,8 +166,9 @@ describe('Related Persons Tab', () => {
 
  expect(mockedComponents.Toast).toHaveBeenCalledWith(
  'success',
- 'Success!',
- 'patient.relatedPersons.successfullyAdded',
+ 'states.success',
+ 'patients.successfullyAddedRelatedPerson',
+ 'top-left',
  )
  })
  })

src/__tests__/scheduling/appointments/new/NewAppointment.test.tsx

@@ -194,7 +194,7 @@ describe('New Appointment', () => {
  expect(history.location.pathname).toEqual(`/appointments/${expectedNewAppointment.id}`)
  expect(mockedComponents.Toast).toHaveBeenCalledWith(
  'success',
- 'Success!',
+ 'states.success',
  `scheduling.appointment.successfullyCreated ${expectedNewAppointment.id}`,
  )
  })

src/__tests__/scheduling/appointments/view/ViewAppointment.test.tsx

@@ -282,7 +282,7 @@ describe('View Appointment', () => {
  expect(mockedComponents.Toast).toHaveBeenCalledWith(
  'success',
  'states.success',
- 'scheduling.appointments.successfullyDeleted',
+ 'scheduling.appointment.successfullyDeleted',
  )
  })
  })

src/components/input/TextInputWithLabelFormGroup.tsx

@@ -10,16 +10,31 @@ interface Props {
  placeholder?: string
  onChange?: (event: React.ChangeEvent<HTMLInputElement>) => void
  isRequired?: boolean
+ feedback?: string
+ isInvalid?: boolean
 }
 
 const TextInputWithLabelFormGroup = (props: Props) => {
- const { value, label, name, isEditable, onChange, placeholder, type, isRequired } = props
+ const {
+ value,
+ label,
+ name,
+ isEditable,
+ onChange,
+ placeholder,
+ type,
+ isRequired,
+ feedback,
+ isInvalid,
+ } = props
  const id = `${name}TextInput`
  return (
  <div className="form-group">
  <Label text={label} htmlFor={id} isRequired={isRequired} />
  <TextInput
+ feedback={feedback}
  id={id}
+ isInvalid={isInvalid}
  value={value}
  disabled={!isEditable}
  onChange={onChange}

src/locales/enUs/translations/actions/index.ts

@@ -6,5 +6,7 @@ export default {
  new: 'New',
  list: 'List',
  search: 'Search',
+ delete: 'Delete',
+ confirmDelete: 'Delete Confirmation',
  },
 }

src/locales/enUs/translations/patient/index.ts

@@ -38,9 +38,11 @@ export default {
  },
  allergies: {
  label: 'Allergies',
+ allergyName: 'Allergy Name',
  new: 'Add Allergy',
  error: {
  nameRequired: 'Name is required.',
+ unableToAdd: 'Unable to add allergy.',
  },
  warning: {
  noAllergies: 'No Allergies',
@@ -68,7 +70,9 @@ export default {
  private: 'Private',
  },
  errors: {
- patientGivenNameRequired: 'Patient Given Name is required.',
+ patientGivenNameRequiredOnCreate: 'Could not create new patient.',
+ patientGivenNameRequiredOnUpdate: 'Could not update patient.',
+ patientGivenNameFeedback: 'Given Name is required.',
  },
  },
 }

src/locales/enUs/translations/patients/index.ts

@@ -2,9 +2,10 @@ export default {
  patients: {
  label: 'Patients',
  viewPatients: 'View Patients',
+ editPatient: 'Edit Patient',
  viewPatient: 'View Patient',
  newPatient: 'New Patient',
  successfullyCreated: 'Successfully created patient',
- successfullyAddedRelatedPerson: 'Successfully added the new related person',
+ successfullyAddedRelatedPerson: 'Successfully added a new related person',
  },
 }

src/locales/enUs/translations/scheduling/index.ts

@@ -5,6 +5,8 @@ export default {
  label: 'Appointments',
  new: 'New Appointment',
  deleteAppointment: 'Delete Appointment',
+ viewAppointment: 'Appointment',
+ editAppointment: 'Edit Appointment',
  },
  appointment: {
  startDate: 'Start Date',
@@ -28,6 +30,8 @@ export default {
  },
  reason: 'Reason',
  patient: 'Patient',
+ successfullyDeleted: 'Appointment successfully deleted.',
+ deleteConfirmationMessage: 'Are you sure you want to delete this appointment?',
  },
  },
 }

src/locales/ptBr/translations/patient/index.ts

@@ -64,7 +64,10 @@ export default {
  private: 'Particular',
  },
  errors: {
- patientGivenNameRequired: 'Nome do Paciente é necessário.',
+ patientGivenNameRequiredOnCreate: 'Nome do Paciente é necessário.',
+ // todo Portuguese translation
+ patientGivenNameRequiredOnUpdate: '',
+ patientGivenNameFeedback: '',
  },
  },
 }

src/patients/GeneralInformation.tsx

@@ -14,11 +14,20 @@ interface Props {
  isEditable?: boolean
  errorMessage?: string
  onFieldChange?: (key: string, value: string | boolean) => void
+ isInvalid?: boolean
+ patientGivenNameFeedback?: string
 }
 
 const GeneralInformation = (props: Props) => {
  const { t } = useTranslation()
- const { patient, isEditable, onFieldChange, errorMessage } = props
+ const {
+ patient,
+ isEditable,
+ onFieldChange,
+ errorMessage,
+ isInvalid,
+ patientGivenNameFeedback,
+ } = props
 
  const onSelectChange = (event: React.ChangeEvent<HTMLSelectElement>, fieldName: string) =>
  onFieldChange && onFieldChange(fieldName, event.target.value)
@@ -72,6 +81,8 @@ const GeneralInformation = (props: Props) => {
  onInputElementChange(event, 'givenName')
  }}
  isRequired
+ isInvalid={isInvalid}
+ feedback={patientGivenNameFeedback}
  />
  </div>
  <div className="col-md-4">

src/patients/allergies/Allergies.tsx

@@ -31,7 +31,7 @@ const Allergies = (props: AllergiesProps) => {
  useAddBreadcrumbs(breadcrumbs)
 
  const onAddAllergySuccess = () => {
- Toast('success', t('Success!'), `${t('patient.allergies.successfullyAdded')}`)
+ Toast('success', t('states.success'), `${t('patient.allergies.successfullyAdded')}`)
  }
 
  const onAddAllergy = (allergy: Allergy) => {

src/patients/allergies/NewAllergyModal.tsx

@@ -14,6 +14,8 @@ const NewAllergyModal = (props: NewAllergyModalProps) => {
  const { show, onCloseButtonClick, onSave } = props
  const [allergy, setAllergy] = useState({ name: '' })
  const [errorMessage, setErrorMessage] = useState('')
+ const [isAllergyNameInvalid, setIsAllergynameInvalid] = useState(false)
+ const [nameRequiredFeedback, setNameRequiredFeedback] = useState('')
  const { t } = useTranslation()
 
  useEffect(() => {
@@ -29,7 +31,9 @@ const NewAllergyModal = (props: NewAllergyModalProps) => {
  const onSaveButtonClick = () => {
  let newErrorMessage = ''
  if (!allergy.name) {
- newErrorMessage += `${t('patient.allergies.error.nameRequired')} `
+ newErrorMessage += `${t('patient.allergies.error.unableToAdd')} `
+ setIsAllergynameInvalid(true)
+ setNameRequiredFeedback(`${t('patient.allergies.error.nameRequired')} `)
  }
 
  if (newErrorMessage) {
@@ -49,12 +53,15 @@ const NewAllergyModal = (props: NewAllergyModalProps) => {
  {errorMessage && <Alert color="danger" title={t('states.error')} message={errorMessage} />}
  <form>
  <TextInputWithLabelFormGroup
+ feedback={nameRequiredFeedback}
  name="name"
- label="Name"
+ isRequired
+ label={t('patient.allergies.allergyName')}
  isEditable
- placeholder="Allergy"
+ placeholder={t('patient.allergies.allergyName')}
  value={allergy.name}
  onChange={onNameChange}
+ isInvalid={isAllergyNameInvalid}
  />
  </form>
  </>

src/patients/diagnoses/Diagnoses.tsx

@@ -36,7 +36,7 @@ const Diagnoses = (props: Props) => {
  }
 
  const onAddDiagnosisSuccess = () => {
- Toast('success', t('Success!'), t('patient.diagnoses.successfullyAdded'))
+ Toast('success', t('states.success'), t('patient.diagnoses.successfullyAdded'))
  }
 
  const onDiagnosisSave = (diagnosis: Diagnosis) => {

src/patients/edit/EditPatient.tsx

@@ -27,6 +27,8 @@ const EditPatient = () => {
 
  const [patient, setPatient] = useState({} as Patient)
  const [errorMessage, setErrorMessage] = useState('')
+ const [isInvalid, setIsInvalid] = useState(false)
+ const [patientGivenNameFeedback, setPatientGivenNameFeedback] = useState('')
  const { patient: reduxPatient, isLoading } = useSelector((state: RootState) => state.patient)
 
  useTitle(
@@ -59,12 +61,18 @@ const EditPatient = () => {
 
  const onSuccessfulSave = (updatedPatient: Patient) => {
  history.push(`/patients/${updatedPatient.id}`)
- Toast('success', t('Success!'), `${t('patients.successfullyUpdated')} ${patient.fullName}`)
+ Toast(
+ 'success',
+ t('states.success'),
+ `${t('patients.successfullyUpdated')} ${patient.fullName}`,
+ )
  }
 
  const onSave = () => {
  if (!patient.givenName) {
- setErrorMessage(t('patient.errors.patientGivenNameRequired'))
+ setErrorMessage(t('patient.errors.patientGivenNameRequiredOnUpdate'))
+ setIsInvalid(true)
+ setPatientGivenNameFeedback(t('patient.errors.patientGivenNameFeedback'))
  } else {
  dispatch(
  updatePatient(
@@ -96,6 +104,8 @@ const EditPatient = () => {
  patient={patient}
  onFieldChange={onFieldChange}
  errorMessage={errorMessage}
+ isInvalid={isInvalid}
+ patientGivenNameFeedback={patientGivenNameFeedback}
  />
  <div className="row float-right">
  <div className="btn-group btn-group-lg">

src/patients/new/NewPatient.tsx

@@ -23,6 +23,8 @@ const NewPatient = () => {
 
  const [patient, setPatient] = useState({} as Patient)
  const [errorMessage, setErrorMessage] = useState('')
+ const [isInvalid, setIsInvalid] = useState(false)
+ const [patientGivenNameFeedback, setPatientGivenNameFeedback] = useState('')
 
  useTitle(t('patients.newPatient'))
  useAddBreadcrumbs(breadcrumbs, true)
@@ -33,12 +35,18 @@ const NewPatient = () => {
 
  const onSuccessfulSave = (newPatient: Patient) => {
  history.push(`/patients/${newPatient.id}`)
- Toast('success', t('Success!'), `${t('patients.successfullyCreated')} ${newPatient.fullName}`)
+ Toast(
+ 'success',
+ t('states.success'),
+ `${t('patients.successfullyCreated')} ${newPatient.fullName}`,
+ )
  }
 
  const onSave = () => {
  if (!patient.givenName) {
- setErrorMessage(t('patient.errors.patientGivenNameRequired'))
+ setErrorMessage(t('patient.errors.patientGivenNameRequiredOnCreate'))
+ setIsInvalid(true)
+ setPatientGivenNameFeedback(t('patient.errors.patientGivenNameFeedback'))
  } else {
  dispatch(
  createPatient(
@@ -66,6 +74,8 @@ const NewPatient = () => {
  patient={patient}
  onFieldChange={onFieldChange}
  errorMessage={errorMessage}
+ isInvalid={isInvalid}
+ patientGivenNameFeedback={patientGivenNameFeedback}
  />
  <div className="row float-right">
  <div className="btn-group btn-group-lg mt-3">

src/patients/related-persons/RelatedPersonTab.tsx

@@ -67,8 +67,7 @@ const RelatedPersonTab = (props: Props) => {
  }
 
  const onAddRelatedPersonSuccess = () => {
- Toast('success', t('Success!'), t('patient.relatedPersons.successfullyAdded'))
- Toast('success', t('Success!'), t('patients.successfullyAddedRelatedPerson'), 'top-left')
+ Toast('success', t('states.success'), t('patients.successfullyAddedRelatedPerson'), 'top-left')
  }
 
  const onRelatedPersonSave = (relatedPerson: RelatedPerson) => {