@kenyaemr/esm-patient-registration-app 5.2.1 → 5.2.3

package/src/patient-registration/section/death-info/death-info-section.test.tsx

@@ -3,7 +3,7 @@ import { render, screen } from '@testing-library/react';
 import { Formik, Form } from 'formik';
 import { initialFormValues } from '../../patient-registration.component';
 import { DeathInfoSection } from './death-info-section.component';
-import { FormValues } from '../../patient-registration-types';
+import { type FormValues } from '../../patient-registration.types';
 import { PatientRegistrationContext } from '../../patient-registration-context';
 
 jest.mock('@openmrs/esm-framework', () => {
@@ -15,62 +15,50 @@ jest.mock('@openmrs/esm-framework', () => {
   };
 });
 
-// TODO: Implement feature and get tests to pass
-describe('death info section', () => {
-  const formValues: FormValues = initialFormValues;
+const initialContextValues = {
+  currentPhoto: 'data:image/png;base64,1234567890',
+  identifierTypes: [],
+  inEditMode: false,
+  initialFormValues: {} as FormValues,
+  isOffline: false,
+  setCapturePhotoProps: jest.fn(),
+  setFieldValue: jest.fn(),
+  setInitialFormValues: jest.fn(),
+  validationSchema: null,
+  values: {
+    isDead: true,
+  } as FormValues,
+};
 
-  const setupSection = async (isDead?: boolean) => {
-    render(
-      <PatientRegistrationContext.Provider value={{ values: { isDead: isDead || false } }}>
-        <Formik initialValues={{ ...initialFormValues, isDead }} onSubmit={null}>
+describe('Death info section', () => {
+  const renderDeathInfoSection = (isDead) => {
+    initialContextValues.values.isDead = isDead;
+
+    return render(
+      <PatientRegistrationContext.Provider value={initialContextValues}>
+        <Formik initialValues={initialFormValues} onSubmit={jest.fn()}>
           <Form>
             <DeathInfoSection />
           </Form>
         </Formik>
       </PatientRegistrationContext.Provider>,
     );
-    const allInputs = screen.queryAllByLabelText(
-      (content, element) => element.tagName.toLowerCase() === 'input',
-    ) as Array<HTMLInputElement>;
-    const allSelects = screen.queryAllByRole('combobox') as Array<HTMLInputElement>;
-    let inputAndSelectNames = [];
-    allInputs.forEach((input) => inputAndSelectNames.push(input.name));
-    allSelects.forEach((select) => inputAndSelectNames.push(select.name));
-    return inputAndSelectNames;
   };
 
-  it('has the correct number of inputs if is dead is checked', async () => {
-    const inputAndSelectNames = await setupSection(true);
-    expect(inputAndSelectNames.length).toBe(3);
-  });
-
-  it('has the correct number of inputs if is dead is not checked', async () => {
-    const inputAndSelectNames = await setupSection(false);
-    expect(inputAndSelectNames.length).toBe(1);
-  });
+  it('shows fields for recording death info when the patient is marked as dead', () => {
+    renderDeathInfoSection(true);
 
-  it('has isDead checkbox', async () => {
-    const inputAndSelectNames = await setupSection();
-    expect(inputAndSelectNames).toContain('isDead');
+    expect(screen.getByRole('region', { name: /death info section/i })).toBeInTheDocument();
+    expect(screen.getByRole('heading', { name: /death info/i })).toBeInTheDocument();
+    expect(screen.getByRole('textbox', { name: /is dead \(optional\)/i })).toBeInTheDocument();
+    expect(screen.getByRole('textbox', { name: /date of death \(optional\)/i })).toBeInTheDocument();
+    expect(screen.getByRole('combobox', { name: /cause of death \(optional\)/i })).toBeInTheDocument();
   });
 
-  it('has death date if is dead is checked', async () => {
-    const inputAndSelectNames = await setupSection(true);
-    expect(inputAndSelectNames).toContain('deathDate');
-  });
-
-  it('has no death date if is dead is not checked', async () => {
-    const inputAndSelectNames = await setupSection(false);
-    expect(inputAndSelectNames).not.toContain('deathDate');
-  });
-
-  it('has death cause if is dead is checked', async () => {
-    const inputAndSelectNames = await setupSection(true);
-    expect(inputAndSelectNames).toContain('deathCause');
-  });
+  it('has the correct number of inputs if is dead is not checked', async () => {
+    renderDeathInfoSection(false);
 
-  it('has no death cause if is dead is not checked', async () => {
-    const inputAndSelectNames = await setupSection(false);
-    expect(inputAndSelectNames).not.toContain('deathCause');
+    expect(screen.queryByRole('textbox', { name: /date of death \(optional\)/i })).not.toBeInTheDocument();
+    expect(screen.queryByRole('combobox', { name: /cause of death \(optional\)/i })).not.toBeInTheDocument();
   });
 });

package/src/patient-registration/section/demographics/demographics-section.test.tsx

@@ -4,7 +4,7 @@ import { Formik, Form } from 'formik';
 import { initialFormValues } from '../../patient-registration.component';
 import { DemographicsSection } from './demographics-section.component';
 import { PatientRegistrationContext } from '../../patient-registration-context';
-import { FormValues } from '../../patient-registration.types';
+import { type FormValues } from '../../patient-registration.types';
 
 jest.mock('@openmrs/esm-framework', () => {
   const originalModule = jest.requireActual('@openmrs/esm-framework');
@@ -60,7 +60,6 @@ describe('demographics section', () => {
               initialFormValues: null,
               identifierTypes: [],
               validationSchema: {},
-              setValidationSchema: () => {},
               values: { ...initialFormValues, birthdateEstimated, addNameInLocalLanguage },
               inEditMode: false,
               setFieldValue: () => {},

package/src/patient-registration/section/generic-section.component.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { SectionDefinition } from '../../config-schema';
+import { type SectionDefinition } from '../../config-schema';
 import { Field } from '../field/field.component';
 
 export interface GenericSectionProps {

package/src/patient-registration/section/patient-relationships/relationships-section.component.tsx

@@ -15,7 +15,7 @@ import { Autosuggest } from '../../input/custom-input/autosuggest/autosuggest.co
 import { PatientRegistrationContext } from '../../patient-registration-context';
 import { ResourcesContext } from '../../../offline.resources';
 import { fetchPerson } from '../../patient-registration.resource';
-import { RelationshipValue } from '../../patient-registration.types';
+import { type RelationshipValue } from '../../patient-registration.types';
 import sectionStyles from '../section.scss';
 import styles from './relationships.scss';
 
@@ -168,12 +168,12 @@ export const RelationshipsSection = () => {
       const tmp: RelationshipType[] = [];
       relationshipTypes.results.forEach((type) => {
         const aIsToB = {
-          display: type.displayAIsToB ? type.displayAIsToB : type.aIsToB,
+          display: type.displayAIsToB ? type.displayAIsToB : type.displayBIsToA,
           uuid: type.uuid,
           direction: 'aIsToB',
         };
         const bIsToA = {
-          display: type.displayBIsToA ? type.displayBIsToA : type.bIsToA,
+          display: type.displayBIsToA ? type.displayBIsToA : type.displayAIsToB,
           uuid: type.uuid,
           direction: 'bIsToA',
         };

package/src/patient-registration/section/patient-relationships/relationships-section.test.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import { Form, Formik } from 'formik';
 import { render, screen } from '@testing-library/react';
 import { PatientRegistrationContext } from '../../patient-registration-context';
-import { Resources, ResourcesContext } from '../../../offline.resources';
+import { type Resources, ResourcesContext } from '../../../offline.resources';
 import { RelationshipsSection } from './relationships-section.component';
 
 jest.mock('../../patient-registration.resource', () => ({
@@ -17,7 +17,7 @@ jest.mock('../../patient-registration.resource', () => ({
 }));
 
 let mockResourcesContextValue = {
-  addressTemplate: [],
+  addressTemplate: null,
   currentSession: {
     authenticated: true,
     sessionId: 'JSESSION',
@@ -40,15 +40,27 @@ describe('RelationshipsSection', () => {
     );
 
     expect(screen.getByLabelText(/loading relationships section/i)).toBeInTheDocument();
-    expect(screen.getByRole(/progressbar/i)).toBeInTheDocument();
+    expect(screen.getByRole('progressbar')).toBeInTheDocument();
     expect(screen.queryByText(/add relationship/i)).not.toBeInTheDocument();
   });
 
   it('renders relationships when relationshipTypes are available', () => {
     const relationshipTypes = {
       results: [
-        { aIsToB: 'Mother', bIsToA: 'Child', uuid: '42ae5ce0-d64b-11ea-9064-5adc43bbdd34' },
-        { aIsToB: 'Father', bIsToA: 'Child', uuid: '52ae5ce0-d64b-11ea-9064-5adc43bbdd24' },
+        {
+          displayAIsToB: 'Mother',
+          aIsToB: 'Mother',
+          bIsToA: 'Child',
+          displayBIsToA: 'Child',
+          uuid: '42ae5ce0-d64b-11ea-9064-5adc43bbdd34',
+        },
+        {
+          displayAIsToB: 'Father',
+          aIsToB: 'Father',
+          bIsToA: 'Child',
+          displayBIsToA: 'Child',
+          uuid: '52ae5ce0-d64b-11ea-9064-5adc43bbdd24',
+        },
       ],
     };
     mockResourcesContextValue = {

package/src/patient-registration/section/patient-relationships/relationships.resource.tsx

@@ -1,7 +1,7 @@
-import { FetchResponse, openmrsFetch } from '@openmrs/esm-framework';
-import { RelationshipValue } from '../../patient-registration.types';
-import useSWR from 'swr';
 import { useMemo } from 'react';
+import useSWR from 'swr';
+import { type FetchResponse, openmrsFetch } from '@openmrs/esm-framework';
+import { type RelationshipValue } from '../../patient-registration.types';
 import { personRelationshipRepresentation } from '../../../constants';
 
 export function useInitialPatientRelationships(patientUuid: string): {

package/src/patient-registration/section/section-wrapper.component.tsx

@@ -2,7 +2,7 @@ import React from 'react';
 import styles from '../patient-registration.scss';
 import { Tile } from '@carbon/react';
 import { useTranslation } from 'react-i18next';
-import { SectionDefinition } from '../../config-schema';
+import { type SectionDefinition } from '../../config-schema';
 import { Section } from './section.component';
 
 export interface SectionWrapperProps {

package/src/patient-registration/section/section.component.tsx

@@ -1,5 +1,5 @@
 import React from 'react';
-import { SectionDefinition } from '../../config-schema';
+import { type SectionDefinition } from '../../config-schema';
 import { GenericSection } from './generic-section.component';
 import { DeathInfoSection } from './death-info/death-info-section.component';
 import { DemographicsSection } from './demographics/demographics-section.component';

package/src/patient-registration/validation/patient-registration-validation.test.tsx

@@ -1,143 +1,157 @@
-import { validationSchema } from './patient-registration-validation';
-
+import { defineConfigSchema, getConfig } from '@openmrs/esm-framework';
+import { getValidationSchema } from './patient-registration-validation';
+import { type RegistrationConfig, esmPatientRegistrationSchema } from '../../config-schema';
 describe('Patient Registration Validation', () => {
-  describe('validationSchema', () => {
-    const validFormValues = {
-      givenName: 'John',
-      familyName: 'Doe',
-      additionalGivenName: '',
-      additionalFamilyName: '',
-      gender: 'Male',
-      birthdate: new Date('1990-01-01'),
-      birthdateEstimated: false,
-      deathDate: null,
-      email: 'john.doe@example.com',
-      identifiers: {
-        nationalId: {
-          required: true,
-          identifierValue: '123456789',
-        },
-        passportId: {
-          required: false,
-          identifierValue: '',
-        },
+  beforeAll(() => {
+    defineConfigSchema('@openmrs/esm-patient-registration-app', esmPatientRegistrationSchema);
+  });
+
+  const validFormValues = {
+    givenName: 'John',
+    familyName: 'Doe',
+    additionalGivenName: '',
+    additionalFamilyName: '',
+    gender: 'male',
+    birthdate: new Date('1990-01-01'),
+    birthdateEstimated: false,
+    deathDate: null,
+    email: 'john.doe@example.com',
+    identifiers: {
+      nationalId: {
+        required: true,
+        identifierValue: '123456789',
       },
-    };
+      passportId: {
+        required: false,
+        identifierValue: '',
+      },
+    },
+  };
 
-    const validateFormValues = async (formValues) => {
-      try {
-        await validationSchema.validate(formValues, { abortEarly: false });
-      } catch (err) {
-        return err;
-      }
-    };
+  const validateFormValues = async (formValues) => {
+    const config = (await getConfig('@openmrs/esm-patient-registration-app')) as any as RegistrationConfig;
+    const validationSchema = getValidationSchema(config);
+    try {
+      await validationSchema.validate(formValues, { abortEarly: false });
+    } catch (err) {
+      return err;
+    }
+  };
 
-    it('should allow valid form values', async () => {
-      const validationError = await validateFormValues(validFormValues);
-      expect(validationError).toBeFalsy();
-    });
+  it('should allow valid form values', async () => {
+    const validationError = await validateFormValues(validFormValues);
+    expect(validationError).toBeFalsy();
+  });
 
-    it('should require givenName', async () => {
-      const invalidFormValues = {
-        ...validFormValues,
-        givenName: '',
-      };
-      const validationError = await validateFormValues(invalidFormValues);
-      expect(validationError.errors).toContain('givenNameRequired');
-    });
+  it('should require givenName', async () => {
+    const invalidFormValues = {
+      ...validFormValues,
+      givenName: '',
+    };
+    const validationError = await validateFormValues(invalidFormValues);
+    expect(validationError.errors).toContain('givenNameRequired');
+  });
 
-    it('should require familyName', async () => {
-      const invalidFormValues = {
-        ...validFormValues,
-        familyName: '',
-      };
-      const validationError = await validateFormValues(invalidFormValues);
-      expect(validationError.errors).toContain('familyNameRequired');
-    });
+  it('should require familyName', async () => {
+    const invalidFormValues = {
+      ...validFormValues,
+      familyName: '',
+    };
+    const validationError = await validateFormValues(invalidFormValues);
+    expect(validationError.errors).toContain('familyNameRequired');
+  });
 
-    it('should require additionalGivenName when addNameInLocalLanguage is true', async () => {
-      const invalidFormValues = {
-        ...validFormValues,
-        addNameInLocalLanguage: true,
-        additionalGivenName: '',
-      };
-      const validationError = await validateFormValues(invalidFormValues);
-      expect(validationError.errors).toContain('givenNameRequired');
-    });
+  it('should require additionalGivenName when addNameInLocalLanguage is true', async () => {
+    const invalidFormValues = {
+      ...validFormValues,
+      addNameInLocalLanguage: true,
+      additionalGivenName: '',
+    };
+    const validationError = await validateFormValues(invalidFormValues);
+    expect(validationError.errors).toContain('givenNameRequired');
+  });
 
-    it('should require additionalFamilyName when addNameInLocalLanguage is true', async () => {
-      const invalidFormValues = {
-        ...validFormValues,
-        addNameInLocalLanguage: true,
-        additionalFamilyName: '',
-      };
-      const validationError = await validateFormValues(invalidFormValues);
-      expect(validationError.errors).toContain('familyNameRequired');
-    });
+  it('should require additionalFamilyName when addNameInLocalLanguage is true', async () => {
+    const invalidFormValues = {
+      ...validFormValues,
+      addNameInLocalLanguage: true,
+      additionalFamilyName: '',
+    };
+    const validationError = await validateFormValues(invalidFormValues);
+    expect(validationError.errors).toContain('familyNameRequired');
+  });
 
-    it('should require gender', async () => {
-      const invalidFormValues = {
-        ...validFormValues,
-        gender: '',
-      };
-      const validationError = await validateFormValues(invalidFormValues);
-      expect(validationError.errors).toContain('genderUnspecified');
-    });
+  it('should require gender', async () => {
+    const invalidFormValues = {
+      ...validFormValues,
+      gender: '',
+    };
+    const validationError = await validateFormValues(invalidFormValues);
+    expect(validationError.errors).toContain('genderUnspecified');
+  });
 
-    it('should allow Male as a valid gender', async () => {
-      const validFormValuesWithOtherGender = {
-        ...validFormValues,
-        gender: 'Male',
-      };
-      const validationError = await validateFormValues(validFormValuesWithOtherGender);
-      expect(validationError).toBeFalsy();
-    });
+  it('should allow female as a valid gender', async () => {
+    const validFormValuesWithOtherGender = {
+      ...validFormValues,
+      gender: 'female',
+    };
+    const validationError = await validateFormValues(validFormValuesWithOtherGender);
+    expect(validationError).toBeFalsy();
+  });
 
-    it('should allow Female as a valid gender', async () => {
-      const validFormValuesWithOtherGender = {
-        ...validFormValues,
-        gender: 'Female',
-      };
-      const validationError = await validateFormValues(validFormValuesWithOtherGender);
-      expect(validationError).toBeFalsy();
-    });
+  it('should allow other as a valid gender', async () => {
+    const validFormValuesWithOtherGender = {
+      ...validFormValues,
+      gender: 'other',
+    };
+    const validationError = await validateFormValues(validFormValuesWithOtherGender);
+    expect(validationError).toBeFalsy();
+  });
 
-    it('should throw error when date of birth is a future date', async () => {
-      const invalidFormValues = {
-        ...validFormValues,
-        birthdate: new Date('2100-01-01'),
-      };
-      const validationError = await validateFormValues(invalidFormValues);
-      expect(validationError.errors).toContain('birthdayNotInTheFuture');
-    });
+  it('should allow unknown as a valid gender', async () => {
+    const validFormValuesWithOtherGender = {
+      ...validFormValues,
+      gender: 'unknown',
+    };
+    const validationError = await validateFormValues(validFormValuesWithOtherGender);
+    expect(validationError).toBeFalsy();
+  });
 
-    it('should require yearsEstimated when birthdateEstimated is true', async () => {
-      const invalidFormValues = {
-        ...validFormValues,
-        birthdateEstimated: true,
-      };
-      const validationError = await validateFormValues(invalidFormValues);
-      expect(validationError.errors).toContain('yearsEstimateRequired');
-    });
+  it('should throw error when date of birth is a future date', async () => {
+    const invalidFormValues = {
+      ...validFormValues,
+      birthdate: new Date('2100-01-01'),
+    };
+    const validationError = await validateFormValues(invalidFormValues);
+    expect(validationError.errors).toContain('birthdayNotInTheFuture');
+  });
+
+  it('should require yearsEstimated when birthdateEstimated is true', async () => {
+    const invalidFormValues = {
+      ...validFormValues,
+      birthdateEstimated: true,
+    };
+    const validationError = await validateFormValues(invalidFormValues);
+    expect(validationError.errors).toContain('yearsEstimateRequired');
+  });
 
-    it('should throw error when monthEstimated is negative', async () => {
-      const invalidFormValues = {
-        ...validFormValues,
-        birthdateEstimated: true,
-        yearsEstimated: 0,
-        monthsEstimated: -1,
-      };
-      const validationError = await validateFormValues(invalidFormValues);
-      expect(validationError.errors).toContain('negativeMonths');
-    });
+  it('should throw error when monthEstimated is negative', async () => {
+    const invalidFormValues = {
+      ...validFormValues,
+      birthdateEstimated: true,
+      yearsEstimated: 0,
+      monthsEstimated: -1,
+    };
+    const validationError = await validateFormValues(invalidFormValues);
+    expect(validationError.errors).toContain('negativeMonths');
+  });
 
-    it('should throw error when deathDate is in future', async () => {
-      const invalidFormValues = {
-        ...validFormValues,
-        deathDate: new Date('2100-01-01'),
-      };
-      const validationError = await validateFormValues(invalidFormValues);
-      expect(validationError.errors).toContain('deathdayNotInTheFuture');
-    });
+  it('should throw error when deathDate is in future', async () => {
+    const invalidFormValues = {
+      ...validFormValues,
+      deathDate: new Date('2100-01-01'),
+    };
+    const validationError = await validateFormValues(invalidFormValues);
+    expect(validationError.errors).toContain('deathdayNotInTheFuture');
   });
 });

package/src/patient-registration/validation/patient-registration-validation.tsx

@@ -1,52 +1,60 @@
 import * as Yup from 'yup';
 import mapValues from 'lodash/mapValues';
-import { FormValues } from '../patient-registration.types';
+import { type FormValues } from '../patient-registration.types';
+import { type RegistrationConfig } from '../../config-schema';
 
-export const validationSchema = Yup.object({
-  givenName: Yup.string().required('givenNameRequired'),
-  familyName: Yup.string().required('familyNameRequired'),
-  additionalGivenName: Yup.string().when('addNameInLocalLanguage', {
-    is: true,
-    then: Yup.string().required('givenNameRequired'),
-    otherwise: Yup.string().notRequired(),
-  }),
-  additionalFamilyName: Yup.string().when('addNameInLocalLanguage', {
-    is: true,
-    then: Yup.string().required('familyNameRequired'),
-    otherwise: Yup.string().notRequired(),
-  }),
-  gender: Yup.string().oneOf(['Male', 'Female', 'Other', 'Unknown'], 'genderUnspecified').required('genderRequired'),
-  birthdate: Yup.date().when('birthdateEstimated', {
-    is: false,
-    then: Yup.date().required('birthdayRequired').max(Date(), 'birthdayNotInTheFuture').nullable(),
-    otherwise: Yup.date().nullable(),
-  }),
-  yearsEstimated: Yup.number().when('birthdateEstimated', {
-    is: true,
-    then: Yup.number().required('yearsEstimateRequired').min(0, 'negativeYears'),
-    otherwise: Yup.number().nullable(),
-  }),
-  monthsEstimated: Yup.number().min(0, 'negativeMonths'),
-  deathDate: Yup.date().max(Date(), 'deathdayNotInTheFuture').nullable(),
-  email: Yup.string().optional().email('invalidEmail'),
-  identifiers: Yup.lazy((obj: FormValues['identifiers']) =>
-    Yup.object(
-      mapValues(obj, () =>
-        Yup.object({
-          required: Yup.bool(),
-          identifierValue: Yup.string().when('required', {
-            is: true,
-            then: Yup.string().required('identifierValueRequired'),
-            otherwise: Yup.string().notRequired(),
+export function getValidationSchema(config: RegistrationConfig) {
+  return Yup.object({
+    givenName: Yup.string().required('givenNameRequired'),
+    familyName: Yup.string().required('familyNameRequired'),
+    additionalGivenName: Yup.string().when('addNameInLocalLanguage', {
+      is: true,
+      then: Yup.string().required('givenNameRequired'),
+      otherwise: Yup.string().notRequired(),
+    }),
+    additionalFamilyName: Yup.string().when('addNameInLocalLanguage', {
+      is: true,
+      then: Yup.string().required('familyNameRequired'),
+      otherwise: Yup.string().notRequired(),
+    }),
+    gender: Yup.string()
+      .oneOf(
+        config.fieldConfigurations.gender.map((g) => g.value),
+        'genderUnspecified',
+      )
+      .required('genderRequired'),
+    birthdate: Yup.date().when('birthdateEstimated', {
+      is: false,
+      then: Yup.date().required('birthdayRequired').max(Date(), 'birthdayNotInTheFuture').nullable(),
+      otherwise: Yup.date().nullable(),
+    }),
+    yearsEstimated: Yup.number().when('birthdateEstimated', {
+      is: true,
+      then: Yup.number().required('yearsEstimateRequired').min(0, 'negativeYears'),
+      otherwise: Yup.number().nullable(),
+    }),
+    monthsEstimated: Yup.number().min(0, 'negativeMonths'),
+    deathDate: Yup.date().max(Date(), 'deathdayNotInTheFuture').nullable(),
+    email: Yup.string().optional().email('invalidEmail'),
+    identifiers: Yup.lazy((obj: FormValues['identifiers']) =>
+      Yup.object(
+        mapValues(obj, () =>
+          Yup.object({
+            required: Yup.bool(),
+            identifierValue: Yup.string().when('required', {
+              is: true,
+              then: Yup.string().required('identifierValueRequired'),
+              otherwise: Yup.string().notRequired(),
+            }),
           }),
-        }),
+        ),
       ),
     ),
-  ),
-  relationships: Yup.array().of(
-    Yup.object().shape({
-      relatedPersonUuid: Yup.string().required(),
-      relationshipType: Yup.string().required(),
-    }),
-  ),
-});
+    relationships: Yup.array().of(
+      Yup.object().shape({
+        relatedPersonUuid: Yup.string().required(),
+        relationshipType: Yup.string().required(),
+      }),
+    ),
+  });
+}