@kenyaemr/esm-patient-registration-app 8.1.1-pre.118 → 8.1.1-pre.121

package/src/patient-registration/input/custom-input/identifier/identifier-input.test.tsx

@@ -2,25 +2,22 @@
 import React from 'react';
 import { render, screen } from '@testing-library/react';
 import { Form, Formik } from 'formik';
+import { getDefaultsFromConfigSchema, useConfig } from '@openmrs/esm-framework';
+import { esmPatientRegistrationSchema, type RegistrationConfig } from '../../../../config-schema';
 import { ResourcesContext, type Resources } from '../../../../offline.resources';
 import {
   PatientRegistrationContext,
   type PatientRegistrationContextProps,
 } from '../../../patient-registration-context';
-import type { AddressTemplate, FormValues, PatientIdentifierValue } from '../../../patient-registration.types';
+import type {
+  AddressTemplate,
+  FormValues,
+  IdentifierSource,
+  PatientIdentifierValue,
+} from '../../../patient-registration.types';
 import IdentifierInput from './identifier-input.component';
 import userEvent from '@testing-library/user-event';
 
-const predefinedAddressTemplate = {
-  uuid: 'test-address-template-uuid',
-  property: 'layout.address.format',
-  description: 'Test Address Template',
-  display:
-    'Layout - Address Format = <org.openmrs.layout.address.AddressTemplate>\n     <nameMappings class="properties">\n       <property name="postalCode" value="Location.postalCode"/>\n       <property name="address2" value="Location.address2"/>\n       <property name="address1" value="Location.address1"/>\n       <property name="country" value="Location.country"/>\n       <property name="stateProvince" value="Location.stateProvince"/>\n       <property name="cityVillage" value="Location.cityVillage"/>\n     </nameMappings>\n     <sizeMappings class="properties">\n       <property name="postalCode" value="10"/>\n       <property name="address2" value="40"/>\n       <property name="address1" value="40"/>\n       <property name="country" value="10"/>\n       <property name="stateProvince" value="10"/>\n       <property name="cityVillage" value="10"/>\n     </sizeMappings>\n     <lineByLineFormat>\n       <string>address1</string>\n       <string>address2</string>\n       <string>cityVillage stateProvince country postalCode</string>\n     </lineByLineFormat>\n   </org.openmrs.layout.address.AddressTemplate>',
-  value:
-    '<org.openmrs.layout.address.AddressTemplate>\r\n     <nameMappings class="properties">\r\n       <property name="postalCode" value="Location.postalCode"/>\r\n       <property name="address2" value="Location.address2"/>\r\n       <property name="address1" value="Location.address1"/>\r\n       <property name="country" value="Location.country"/>\r\n       <property name="stateProvince" value="Location.stateProvince"/>\r\n       <property name="cityVillage" value="Location.cityVillage"/>\r\n     </nameMappings>\r\n     <sizeMappings class="properties">\r\n       <property name="postalCode" value="4"/>\r\n       <property name="address1" value="40"/>\r\n       <property name="address2" value="40"/>\r\n       <property name="country" value="10"/>\r\n       <property name="stateProvince" value="10"/>\r\n       <property name="cityVillage" value="10"/>\r\n       <asset name="cityVillage" value="10"/>\r\n     </sizeMappings>\r\n     <lineByLineFormat>\r\n       <string>address1 address2</string>\r\n       <string>cityVillage stateProvince postalCode</string>\r\n       <string>country</string>\r\n     </lineByLineFormat>\r\n     <elementDefaults class="properties">\r\n            <property name="country" value=""/>\r\n     </elementDefaults>\r\n     <elementRegex class="properties">\r\n            <property name="address1" value="[a-zA-Z]+$"/>\r\n     </elementRegex>\r\n     <elementRegexFormats class="properties">\r\n            <property name="address1" value="Countries can only be letters"/>\r\n     </elementRegexFormats>\r\n   </org.openmrs.layout.address.AddressTemplate>',
-};
-
 const mockIdentifierTypes = [
   {
     fieldName: 'openMrsId',
@@ -44,7 +41,7 @@ const mockIdentifierTypes = [
 ];
 
 const mockResourcesContextValue: Resources = {
-  addressTemplate: predefinedAddressTemplate as unknown as AddressTemplate,
+  addressTemplate: {} as AddressTemplate,
   currentSession: {
     authenticated: true,
     sessionId: 'JSESSION',
@@ -68,30 +65,35 @@ const mockContextValues: PatientRegistrationContextProps = {
   values: {} as FormValues,
 };
 
+const mockUseConfig = jest.mocked(useConfig<RegistrationConfig>);
+
 describe('identifier input', () => {
+  mockUseConfig.mockReturnValue({
+    ...getDefaultsFromConfigSchema(esmPatientRegistrationSchema),
+  });
+
   const fieldName = 'openMrsId';
   const openmrsID = {
     identifierTypeUuid: '05a29f94-c0ed-11e2-94be-8c13b969e334',
     initialValue: '',
-    identifierValue: '',
     identifierName: 'OpenMRS ID',
     selectedSource: {
       uuid: '01af8526-cea4-4175-aa90-340acb411771',
       name: 'Generator 2 for OpenMRS ID',
       autoGenerationOption: {
-        manualEntryEnabled: true,
+        manualEntryEnabled: false,
         automaticGenerationEnabled: true,
       },
-    },
+    } as IdentifierSource,
     autoGeneration: false,
     preferred: true,
     required: true,
-  };
+  } as PatientIdentifierValue;
 
-  const setupIdentifierInput = async (patientIdentifier: PatientIdentifierValue) => {
+  const setupIdentifierInput = (patientIdentifier: PatientIdentifierValue, initialValues = {}) => {
     render(
       <ResourcesContext.Provider value={mockResourcesContextValue}>
-        <Formik initialValues={{}} onSubmit={jest.fn()}>
+        <Formik initialValues={initialValues} onSubmit={jest.fn()}>
           <Form>
             <PatientRegistrationContext.Provider value={mockContextValues}>
               <IdentifierInput patientIdentifier={patientIdentifier} fieldName={fieldName} />
@@ -100,56 +102,102 @@ describe('identifier input', () => {
         </Formik>
       </ResourcesContext.Provider>,
     );
-
-    let identifierLabel: HTMLParagraphElement;
-    let identifierInput: HTMLInputElement;
-    if (patientIdentifier.autoGeneration) {
-      identifierLabel = screen.getByTestId('identifier-label');
-      identifierInput = screen.getByTestId('identifier-input');
-    } else {
-      identifierLabel = screen.getByText(patientIdentifier.identifierName);
-      identifierInput = screen.getByLabelText(patientIdentifier.identifierName);
-    }
-    return {
-      identifierLabel,
-      identifierInput,
-    };
   };
 
-  it('shows the identifier input', async () => {
-    const { identifierInput } = await setupIdentifierInput(openmrsID);
-    expect(identifierInput).toBeInTheDocument();
+  it('shows the identifier input', () => {
+    openmrsID.autoGeneration = false;
+    setupIdentifierInput(openmrsID as PatientIdentifierValue);
+    expect(screen.getByLabelText(openmrsID.identifierName)).toBeInTheDocument();
   });
 
-  describe('Auto-generated identifier', () => {
-    openmrsID.autoGeneration = true;
+  it('displays an edit button when there is an initial value', async () => {
+    // setup
+    openmrsID.autoGeneration = false;
+    openmrsID.required = false;
+    openmrsID.initialValue = '1002UU9';
+    openmrsID.identifierValue = '1002UU9';
+    // replay
+    setupIdentifierInput(openmrsID as PatientIdentifierValue);
+    expect(screen.getByText('Edit')).toBeInTheDocument();
+  });
 
-    it('hides the input when the identifier is auto-generated', async () => {
-      const { identifierInput } = await setupIdentifierInput(openmrsID);
-      expect(identifierInput.type).toBe('hidden');
-    });
+  it('hides the edit button when the identifier is required', async () => {
+    // setup
+    openmrsID.autoGeneration = false;
+    openmrsID.required = true;
+    openmrsID.initialValue = '1002UU9';
+    openmrsID.identifierValue = '1002UU9';
+    // replay
+    setupIdentifierInput(openmrsID);
+    expect(screen.queryByText('Edit')).not.toBeInTheDocument();
+  });
+
+  it('displays a delete button when the identifier is not a default type', () => {
+    // setup
+    openmrsID.required = false;
+    // replay
+    setupIdentifierInput(openmrsID);
+    expect(screen.getByText('Delete')).toBeInTheDocument();
+  });
 
-    it("displays 'Auto-Generated' when the indentifier has auto generation", async () => {
-      const { identifierLabel, identifierInput } = await setupIdentifierInput(openmrsID);
-      expect(identifierLabel.innerHTML).toBe('Auto-generated');
-      expect(identifierInput.disabled).toBe(true);
+  describe('auto-generated identifier', () => {
+    it('hides the input when the identifier is auto-generated', () => {
+      openmrsID.autoGeneration = true;
+      setupIdentifierInput(openmrsID);
+      expect(screen.getByTestId('identifier-input')).toHaveAttribute('type', 'hidden');
     });
 
-    it('displays an edit button when there is an initial value', async () => {
-      // setup
-      openmrsID.required = false;
-      openmrsID.initialValue = '1002UU9';
-      // replay
-      await setupIdentifierInput(openmrsID);
-      expect(screen.getByText('Edit')).toBeInTheDocument();
+    it("displays 'Auto-Generated' when the indentifier has auto generation", () => {
+      openmrsID.autoGeneration = true;
+      setupIdentifierInput(openmrsID);
+      expect(screen.getByTestId('identifier-placeholder').innerHTML).toBe('Auto-generated');
+      expect(screen.getByTestId('identifier-input')).toBeDisabled();
     });
 
-    it('displays a delete button when the identifier is not a default type', async () => {
-      // setup
-      openmrsID.required = false;
-      // replay
-      await setupIdentifierInput(openmrsID);
-      expect(screen.getByText('Delete')).toBeInTheDocument();
+    describe('manual entry allowed', () => {
+      openmrsID.selectedSource = {
+        autoGenerationOption: {
+          manualEntryEnabled: true,
+        },
+      } as IdentifierSource;
+
+      it('shows the edit button', () => {
+        openmrsID.autoGeneration = true;
+        setupIdentifierInput(openmrsID);
+        expect(screen.getByText('Edit')).toBeInTheDocument();
+      });
+
+      describe('edit button clicked', () => {
+        it('displays an empty input field', async () => {
+          const user = userEvent.setup();
+          openmrsID.autoGeneration = true;
+          openmrsID.required = false;
+          openmrsID.selectedSource = {
+            autoGenerationOption: {
+              manualEntryEnabled: true,
+            },
+          } as IdentifierSource;
+          setupIdentifierInput(openmrsID);
+          const editButton = screen.getByTestId('edit-button');
+          await user.click(editButton);
+          expect(screen.getByLabelText(new RegExp(`${openmrsID.identifierName}`))).toHaveValue('');
+        });
+
+        it('displays an input field with the identifier value if it exists', async () => {
+          const user = userEvent.setup();
+          openmrsID.autoGeneration = true;
+          openmrsID.required = false;
+          openmrsID.selectedSource = {
+            autoGenerationOption: {
+              manualEntryEnabled: true,
+            },
+          } as IdentifierSource;
+          setupIdentifierInput(openmrsID, { identifiers: { [fieldName]: { identifierValue: '10001V' } } });
+          const editButton = screen.getByTestId('edit-button');
+          await user.click(editButton);
+          expect(screen.getByLabelText(new RegExp(`${openmrsID.identifierName}`))).toHaveValue('10001V');
+        });
+      });
     });
   });
 });

package/src/patient-registration/input/input.scss

@@ -116,3 +116,8 @@
   margin: 0;
   padding-left: layout.$spacing-05;
 }
+
+.actionButtonContainer {
+  margin-left: layout.$spacing-05;
+  margin-bottom: layout.$spacing-05;
+}

package/translations/en.json

@@ -95,6 +95,7 @@
   "nupi": "NUPI",
   "obsFieldUnknownDatatype": "Concept for obs field '{{fieldDefinitionId}}' has unknown datatype '{{datatypeName}}'",
   "optional": "optional",
+  "optionalIdentifierLabel": "{{identifierName}} (optional)",
   "other": "Other",
   "patientDetailsFound": "Patient information found in the registry, do you want to use the information to continue with registration?",
   "patientName": "Patient name",
@@ -123,6 +124,7 @@
   "searchClientRegistry": "Search client registry",
   "searchIdentifierPlaceholder": "Search identifier",
   "searchingRegistry": "Searching registry...",
+  "searchLocationPersonAttribute": "Search location",
   "searchRegistry": "Search registry",
   "selectAnOption": "Select an option",
   "selectCountry": "Select country",