@kenyaemr/esm-patient-registration-app 8.0.3-pre.140 → 8.0.3-pre.146

package/dist/routes.json

@@ -1 +1 @@
-{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"webservices.rest":"^2.24.0"},"pages":[{"component":"root","route":"patient-registration","online":true,"offline":true},{"component":"editPatient","routeRegex":"patient\\/([a-zA-Z0-9\\-]+)\\/edit","online":true,"offline":true}],"extensions":[{"component":"addPatientLink","name":"add-patient-action","slot":"top-nav-actions-slot","online":true,"offline":true},{"component":"patientPhotoExtension","name":"patient-photo-widget","slot":"patient-photo-slot","online":true,"offline":true},{"component":"editPatientDetailsButton","name":"edit-patient-details-button","slot":"patient-actions-slot","online":true,"offline":true},{"component":"editPatientDetailsButton","name":"edit-patient-details-button","slot":"patient-search-actions-slot","online":true,"offline":true}],"modals":[{"name":"cancel-patient-edit-modal","component":"cancelPatientEditModal"},{"name":"delete-identifier-confirmation-modal","component":"deleteIdentifierConfirmationModal"},{"component":"emptyClientRegistryModal","name":"empty-client-registry-modal"},{"component":"confirmClientRegistryModal","name":"confirm-client-registry-modal"},{"component":"hieConfirmationModal","name":"hie-confirmation-modal"}],"version":"8.0.3-pre.140"}
+{"$schema":"https://json.openmrs.org/routes.schema.json","backendDependencies":{"webservices.rest":"^2.24.0"},"pages":[{"component":"root","route":"patient-registration","online":true,"offline":true},{"component":"editPatient","routeRegex":"patient\\/([a-zA-Z0-9\\-]+)\\/edit","online":true,"offline":true}],"extensions":[{"component":"addPatientLink","name":"add-patient-action","slot":"top-nav-actions-slot","online":true,"offline":true},{"component":"patientPhotoExtension","name":"patient-photo-widget","slot":"patient-photo-slot","online":true,"offline":true},{"component":"editPatientDetailsButton","name":"edit-patient-details-button","slot":"patient-actions-slot","online":true,"offline":true},{"component":"editPatientDetailsButton","name":"edit-patient-details-button","slot":"patient-search-actions-slot","online":true,"offline":true}],"modals":[{"name":"cancel-patient-edit-modal","component":"cancelPatientEditModal"},{"name":"delete-identifier-confirmation-modal","component":"deleteIdentifierConfirmationModal"},{"component":"emptyClientRegistryModal","name":"empty-client-registry-modal"},{"component":"confirmClientRegistryModal","name":"confirm-client-registry-modal"},{"component":"hieConfirmationModal","name":"hie-confirmation-modal"}],"version":"8.0.3-pre.146"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@kenyaemr/esm-patient-registration-app",
-  "version": "8.0.3-pre.140",
+  "version": "8.0.3-pre.146",
   "description": "Patient registration microfrontend for the OpenMRS SPA",
   "browser": "dist/kenyaemr-esm-patient-registration-app.js",
   "main": "src/index.ts",

package/src/client-registry/hie-client-registry/dependants/dependants.component.tsx

@@ -14,15 +14,13 @@ const DependentInfo: React.FC<{ dependents: any[] }> = ({ dependents }) => {
           const name = dependent?.name?.text;
           const relationship =
             dependent?.relationship?.[0]?.coding?.[0]?.display || t('unknownRelationship', 'Unknown');
+
           const nationalID = dependent?.extension?.find(
-            (ext) =>
-              ext.url === 'http://cr.tiberbu.app/fhir/StructureDefinition/dependants-id-number' &&
-              ext.valueIdentifier?.type?.coding?.[0]?.code === 'national-id',
+            (ext) => ext?.valueIdentifier?.type?.coding?.some((coding) => coding.code === 'national-id'),
           )?.valueIdentifier?.value;
+
           const birthCertificate = dependent?.extension?.find(
-            (ext) =>
-              ext.url === 'http://cr.tiberbu.app/fhir/StructureDefinition/dependants-id-number' &&
-              ext.valueIdentifier?.type?.coding?.[0]?.code === 'birth-certificate-number',
+            (ext) => ext?.valueIdentifier?.type?.coding?.some((coding) => coding.code === 'birth-certificate'),
           )?.valueIdentifier?.value;
 
           const primaryIdentifier = nationalID || birthCertificate;
@@ -34,7 +32,7 @@ const DependentInfo: React.FC<{ dependents: any[] }> = ({ dependents }) => {
             <div key={index} className={styles.dependentInfo}>
               <PatientInfo label={t('name', 'Name')} value={name} />
               <PatientInfo label={t('relationship', 'Relationship')} value={relationship} />
-              <PatientInfo label={identifierLabel} value={primaryIdentifier} />
+              {primaryIdentifier && <PatientInfo label={identifierLabel} value={primaryIdentifier} />}
             </div>
           );
         })}

package/src/client-registry/hie-client-registry/hie-client-registry.component.tsx

@@ -11,7 +11,7 @@ import { type RegistrationConfig } from '../../config-schema';
 import { useForm, Controller, type SubmitHandler } from 'react-hook-form';
 import { zodResolver } from '@hookform/resolvers/zod';
 import { fetchPatientFromHIE, mapHIEPatientToFormValues } from './hie-resource';
-import { type HIEPatient } from './hie-types';
+import { type HIEPatientResponse, type HIEPatient, type ErrorResponse } from './hie-types';
 
 type HIEClientRegistryProps = {
   props: FormikProps<FormValues>;
@@ -39,26 +39,56 @@ const HIEClientRegistry: React.FC<HIEClientRegistryProps> = ({ setInitialFormVal
     hieClientRegistry: { identifierTypes },
   } = useConfig<RegistrationConfig>();
 
+  const isHIEPatientResponse = (
+    response: HIEPatientResponse | ErrorResponse | undefined,
+  ): response is HIEPatientResponse => {
+    return response?.resourceType === 'Bundle' && 'total' in response;
+  };
+
+  const isOperationOutcome = (response: HIEPatientResponse | ErrorResponse | undefined): response is ErrorResponse => {
+    return response?.resourceType === 'OperationOutcome' && 'issue' in response;
+  };
+
   const onSubmit: SubmitHandler<HIEFormValues> = async (data: HIEFormValues, event: React.BaseSyntheticEvent) => {
     try {
       const hieClientRegistry = await fetchPatientFromHIE(data.identifierType, data.identifierValue);
 
-      if (hieClientRegistry && hieClientRegistry.resourceType === 'Patient') {
+      if (isHIEPatientResponse(hieClientRegistry)) {
+        if (hieClientRegistry.total === 0) {
+          const dispose = showModal('empty-client-registry-modal', {
+            onConfirm: () => dispose(),
+            close: () => dispose(),
+            title: t('clientRegistryEmpty', 'Create & Post Patient'),
+            message: t(
+              'patientNotFound',
+              `No patient found with the provided ${data?.identifierType}. Proceed to register.`,
+            ),
+          });
+          return;
+        }
+
         const dispose = showModal('hie-confirmation-modal', {
           patient: hieClientRegistry,
           closeModal: () => dispose(),
           onUseValues: () =>
-            setInitialFormValues(mapHIEPatientToFormValues(hieClientRegistry as HIEPatient, props.values)),
+            setInitialFormValues(
+              mapHIEPatientToFormValues(hieClientRegistry as unknown as HIEPatientResponse, props.values),
+            ),
         });
-      }
-
-      if (hieClientRegistry && hieClientRegistry.resourceType === 'OperationOutcome') {
-        const issueMessage = hieClientRegistry?.['issue']?.map((issue) => issue.diagnostics).join(', ');
+      } else if (isOperationOutcome(hieClientRegistry)) {
+        const issueMessage = hieClientRegistry?.issue?.map((issue) => issue.diagnostics).join(', ');
         const dispose = showModal('empty-client-registry-modal', {
           onConfirm: () => dispose(),
           close: () => dispose(),
           title: t('clientRegistryEmpty', 'Create & Post Patient'),
-          message: issueMessage,
+          message: issueMessage || t('errorOccurred', ' There was an error processing the request. Try again later'),
+        });
+      } else {
+        showSnackbar({
+          title: t('unexpectedResponse', 'Unexpected Response'),
+          subtitle: t('contactAdmin', 'Please contact the administrator.'),
+          kind: 'error',
+          isLowContrast: true,
         });
       }
     } catch (error) {

package/src/client-registry/hie-client-registry/hie-resource.ts

@@ -1,6 +1,6 @@
 import capitalize from 'lodash-es/capitalize';
 import { type PatientIdentifierValue, type FormValues } from '../../patient-registration/patient-registration.types';
-import { type MapperConfig, type HIEPatient, type ErrorResponse } from './hie-types';
+import { type MapperConfig, type HIEPatient, type ErrorResponse, type HIEPatientResponse } from './hie-types';
 import { openmrsFetch, restBaseUrl } from '@openmrs/esm-framework';
 import { v4 } from 'uuid';
 import { z } from 'zod';
@@ -13,7 +13,6 @@ class HealthInformationExchangeClient<T> {
   async fetchResource(resourceType: string, params: Record<string, string>): Promise<T> {
     const [identifierType, identifierValue] = Object.entries(params)[0];
     const url = `${restBaseUrl}/kenyaemr/getSHAPatient/${identifierValue}/${identifierType}`;
-
     const response = await openmrsFetch(url);
     return response.json();
   }
@@ -35,19 +34,19 @@ class Mapper<T, U> {
 /**
  * Maps HIEPatient objects to FormValues objects.
  */
-class PatientMapper extends Mapper<HIEPatient, FormValues> {
-  mapHIEPatientToFormValues(hiePatient: HIEPatient, currentFormValues: FormValues): FormValues {
+class PatientMapper extends Mapper<HIEPatientResponse, FormValues> {
+  mapHIEPatientToFormValues(hiePatient: HIEPatientResponse, currentFormValues: FormValues): FormValues {
     const { familyName, givenName, middleName } = getPatientName(hiePatient);
-    const telecom = hiePatient.telecom || [];
+    const telecom = hiePatient?.entry[0]?.resource.telecom || [];
 
     const telecomAttributes = this.mapTelecomToAttributes(telecom);
     const updatedIdentifiers = this.mapIdentifiers(hiePatient, currentFormValues);
-    const extensionAddressEntries = this.mapExtensionsToAddress(hiePatient.extension);
+    const extensionAddressEntries = this.mapExtensionsToAddress(hiePatient?.entry[0]?.resource.extension);
 
     return {
-      isDead: hiePatient.deceasedBoolean || false,
-      gender: hiePatient.gender || '',
-      birthdate: hiePatient.birthDate || '',
+      isDead: hiePatient?.entry[0]?.resource?.active || false,
+      gender: hiePatient?.entry[0]?.resource.gender || '',
+      birthdate: hiePatient?.entry[0]?.resource?.birthDate || '',
       givenName,
       familyName,
       telephoneNumber: telecom.find((t) => t.system === 'phone')?.value || '',
@@ -73,7 +72,7 @@ class PatientMapper extends Mapper<HIEPatient, FormValues> {
   }
 
   private mapIdentifiers(
-    hiePatient: HIEPatient,
+    hiePatient: HIEPatientResponse,
     currentFormValues: FormValues,
   ): Record<string, PatientIdentifierValue> {
     const updatedIdentifiers: Record<string, PatientIdentifierValue> = { ...currentFormValues.identifiers };
@@ -81,11 +80,11 @@ class PatientMapper extends Mapper<HIEPatient, FormValues> {
     // See https://github.com/palladiumkenya/openmrs-module-kenyaemr/blob/1e1d281eaba8041c45318e60ca0730449b8e4197/api/src/main/distro/metadata/identifierTypes.xml#L33
     updatedIdentifiers.socialHealthAuthorityIdentificationNumber = {
       ...currentFormValues.identifiers['socialHealthAuthorityIdentificationNumber'],
-      identifierValue: hiePatient.id,
+      identifierValue: hiePatient?.entry[0]?.resource?.id,
     };
 
     // Map fhir.Patient.Identifier to identifiers
-    hiePatient.identifier?.forEach((identifier: fhir.Identifier) => {
+    hiePatient.entry[0]?.resource.identifier?.forEach((identifier: fhir.Identifier) => {
       const identifierType = identifier.type?.coding?.[0]?.code;
       const mappedIdentifierType = this.convertToCamelCase(identifierType);
       const identifierValue = identifier.value;
@@ -148,18 +147,21 @@ const mapperConfig: MapperConfig = {
 };
 
 // Create instances
-const hieApiClient = new HealthInformationExchangeClient<HIEPatient | ErrorResponse>();
+const hieApiClient = new HealthInformationExchangeClient<HIEPatientResponse | ErrorResponse>();
 const patientMapper = new PatientMapper(mapperConfig);
 
 // Exported functions
 export const fetchPatientFromHIE = async (
   identifierType: string,
   identifierValue: string,
-): Promise<HIEPatient | ErrorResponse> => {
-  return hieApiClient.fetchResource('Patient', { [identifierType]: identifierValue });
+): Promise<HIEPatientResponse | ErrorResponse> => {
+  return hieApiClient.fetchResource('Bundle', { [identifierType]: identifierValue });
 };
 
-export const mapHIEPatientToFormValues = (hiePatient: HIEPatient, currentFormValues: FormValues): FormValues => {
+export const mapHIEPatientToFormValues = (
+  hiePatient: HIEPatientResponse,
+  currentFormValues: FormValues,
+): FormValues => {
   return patientMapper.mapHIEPatientToFormValues(hiePatient, currentFormValues);
 };
 
@@ -169,7 +171,7 @@ export const mapHIEPatientToFormValues = (hiePatient: HIEPatient, currentFormVal
  * @returns {string} - The masked data
  */
 export const maskData = (data: string): string => {
-  const maskedData = data.slice(0, 2) + '*'.repeat(data.length - 2);
+  const maskedData = data.slice(0, 2) + '*'.repeat(Math.max(0, data.length - 2));
   return maskedData;
 };
 
@@ -178,10 +180,13 @@ export const maskData = (data: string): string => {
  * @param patient {fhir.Patient} - The FHIR Patient resource
  * @returns {object} - The patient name
  */
-export const getPatientName = (patient: fhir.Patient) => {
-  const familyName = patient?.name[0]?.['family'] ?? '';
-  const givenName = patient.name[0]?.['given']?.[0]?.split(' ')?.[0] ?? '';
-  const middleName = patient.name[0]?.['given']?.[0]?.replace(givenName, '')?.trim() ?? '';
+export const getPatientName = (patient: HIEPatientResponse) => {
+  const familyName = patient?.entry?.[0]?.resource?.name?.[0]?.family ?? ''; // Safely access the family name
+  const givenNames = patient?.entry?.[0]?.resource?.name?.[0]?.given ?? []; // Safely access the given names array
+
+  const givenName = givenNames?.[0] ?? ''; // The first item is the given name (first name)
+  const middleName = givenNames.slice(1).join(' ').trim(); // Combine all other given names as middle name(s)
+
   return { familyName, givenName, middleName };
 };
 

package/src/client-registry/hie-client-registry/hie-types.ts

@@ -5,6 +5,108 @@ export type HIEPatient = fhir.Patient & {
   }>;
 };
 
+export interface HIEPatientResponse {
+  resourceType: string;
+  id: string;
+  total: number;
+  meta: Metadata;
+  link: Link[];
+  entry: Entry[];
+}
+
+interface Metadata {
+  lastUpdated: string;
+}
+
+interface Link {
+  relation: string;
+  url: string;
+}
+
+interface Entry {
+  resource: Resource;
+}
+
+interface Resource {
+  id: string;
+  extension: Extension[];
+  identifier: Identifier[];
+  active: boolean;
+  name: Name[];
+  telecom: Telecom[];
+  birthDate: string;
+  address: Address[];
+  gender: string;
+  maritalStatus: MaritalStatus;
+  contact: Contact[];
+}
+
+interface Extension {
+  url: string;
+  valueString: string;
+}
+
+interface Identifier {
+  type: CodingType;
+  value: string;
+}
+
+interface CodingType {
+  coding: Coding[];
+}
+
+interface Coding {
+  system?: string;
+  code: string;
+  display: string;
+}
+
+interface Name {
+  text: string;
+  family: string;
+  given: string[];
+}
+
+interface Telecom {
+  system: string;
+  value?: string;
+}
+
+interface Address {
+  extension: AddressExtension[];
+  city: string;
+  country: string;
+}
+
+interface AddressExtension {
+  url: string;
+  valueString: string;
+}
+
+interface MaritalStatus {
+  coding: Coding[];
+}
+
+interface Contact {
+  id: string;
+  extension: ContactExtension[];
+  relationship: Relationship[];
+  name: Name;
+  telecom: Telecom[];
+  address: Address;
+  gender: string;
+}
+
+interface ContactExtension {
+  url: string;
+  valueIdentifier?: Identifier;
+  valueString?: string;
+}
+
+interface Relationship {
+  coding: Coding[];
+}
+
 export type APIClientConfig = {
   baseUrl: string;
   credentials: string;

package/src/client-registry/hie-client-registry/modal/confirm-hie.modal.tsx

@@ -1,7 +1,7 @@
 import { Button, ModalBody, ModalFooter, ModalHeader } from '@carbon/react';
 import React, { useState } from 'react';
 import { useTranslation } from 'react-i18next';
-import { type HIEPatient } from '../hie-types';
+import { type HIEPatientResponse, type HIEPatient } from '../hie-types';
 import styles from './confirm-hie.scss';
 import { authorizationFormSchema, generateOTP, getPatientName, persistOTP, sendOtp, verifyOtp } from '../hie-resource';
 import HIEPatientDetailPreview from './hie-patient-detail-preview.component';
@@ -14,7 +14,7 @@ import { showSnackbar } from '@openmrs/esm-framework';
 
 interface HIEConfirmationModalProps {
   closeModal: () => void;
-  patient: HIEPatient;
+  patient: HIEPatientResponse;
   onUseValues: () => void;
 }
 
@@ -22,9 +22,11 @@ const HIEConfirmationModal: React.FC<HIEConfirmationModalProps> = ({ closeModal,
   const { t } = useTranslation();
   const [mode, setMode] = useState<'authorization' | 'preview'>('preview');
   const [status, setStatus] = useState<'loadingOtp' | 'otpSendSuccessfull' | 'otpFetchError'>();
-  const phoneNumber = patient?.telecom?.find((num) => num.value)?.value;
+  const phoneNumber = patient?.entry[0]?.resource.telecom?.find((num) => num.system === 'phone')?.value;
   const getidentifier = (code: string) =>
-    patient?.identifier?.find((identifier) => identifier?.type?.coding?.some((coding) => coding?.code === code));
+    patient?.entry[0]?.resource.identifier?.find(
+      (identifier) => identifier?.type?.coding?.some((coding) => coding?.code === code),
+    );
   const patientId = patient?.id ?? getidentifier('SHA-number')?.value;
   const form = useForm<z.infer<typeof authorizationFormSchema>>({
     defaultValues: {

package/src/client-registry/hie-client-registry/modal/hie-patient-detail-preview.component.tsx

@@ -7,16 +7,19 @@ import DependentInfo from '../dependants/dependants.component';
 import { getPatientName, maskData } from '../hie-resource';
 import PatientInfo from '../patient-info/patient-info.component';
 import styles from './confirm-hie.scss';
+import { type HIEPatientResponse } from '../hie-types';
 
 type HIEPatientDetailPreviewProps = {
-  patient: fhir.Patient;
+  patient: HIEPatientResponse;
 };
 
 const HIEPatientDetailPreview: React.FC<HIEPatientDetailPreviewProps> = ({ patient }) => {
   const { familyName, givenName, middleName } = getPatientName(patient);
   const { t } = useTranslation();
   const getidentifier = (code: string) =>
-    patient?.identifier?.find((identifier) => identifier?.type?.coding?.some((coding) => coding?.code === code));
+    patient?.entry[0]?.resource.identifier?.find(
+      (identifier) => identifier?.type?.coding?.some((coding) => coding?.code === code),
+    );
 
   return (
     <>
@@ -27,7 +30,7 @@ const HIEPatientDetailPreview: React.FC<HIEPatientDetailPreviewProps> = ({ patie
           state={{ patientName: `${maskData(givenName)} . ${maskData(middleName)} . ${maskData(familyName)}` }}
         />
         <div className={styles.patientInfoContainer}>
-          <PatientInfo label={t('healthID', 'HealthID')} value={getidentifier('SHA-number')?.value} />
+          <PatientInfo label={t('healthID', 'HealthID')} value={getidentifier('sha-number')?.value} />
           <PatientInfo
             label={t('patientName', 'Patient name')}
             customValue={
@@ -41,21 +44,22 @@ const HIEPatientDetailPreview: React.FC<HIEPatientDetailPreviewProps> = ({ patie
             }
           />
 
-          <PatientInfo label={t('age', 'Age')} value={age(patient?.birthDate)} />
-          <PatientInfo label={t('dateOfBirth', 'Date of birth')} value={formatDate(new Date(patient?.birthDate))} />
-          <PatientInfo label={t('gender', 'Gender')} value={capitalize(patient?.gender)} />
+          <PatientInfo label={t('age', 'Age')} value={age(patient?.entry[0]?.resource.birthDate)} />
+          <PatientInfo
+            label={t('dateOfBirth', 'Date of birth')}
+            value={formatDate(new Date(patient?.entry[0]?.resource?.birthDate))}
+          />
+          <PatientInfo label={t('gender', 'Gender')} value={capitalize(patient?.entry[0]?.resource.gender)} />
           <PatientInfo
             label={t('maritalStatus', 'Marital status')}
-            value={patient?.maritalStatus?.coding?.map((m) => m.code).join('')}
+            value={patient?.entry[0]?.resource.maritalStatus?.coding?.map((m) => m.code).join('')}
           />
 
-          {(!patient?.contact || patient?.contact.length === 0) && (
-            <PatientInfo label={t('dependents', 'Dependents')} value="--" />
-          )}
+          {!patient?.entry[0]?.resource.contact && <PatientInfo label={t('dependents', 'Dependents')} value="--" />}
         </div>
       </div>
 
-      <DependentInfo dependents={patient?.contact} />
+      <DependentInfo dependents={patient?.entry[0]?.resource.contact} />
 
       <div>
         <Accordion>

package/src/config-schema.ts

@@ -416,7 +416,7 @@ export const esmPatientRegistrationSchema = {
         },
       },
       _default: [
-        { identifierType: 'National ID', identifierValue: 'national-id' },
+        { identifierType: 'National ID', identifierValue: 'National ID' },
         { identifierType: 'Passport Number', identifierValue: 'passport-number' },
         { identifierType: 'Birth Certificate Number', identifierValue: 'birth-certificate-number' },
         { identifierType: 'Alien ID Number', identifierValue: 'alien-id-number' },

package/translations/en.json

@@ -24,6 +24,7 @@
   "confirmDiscardChangesBody": "Your unsaved changes will be lost if you proceed to discard the form",
   "confirmDiscardChangesTitle": "Are you sure you want to discard these changes?",
   "confirmIdentifierDeletionText": "Are you sure you want to remove this identifier?",
+  "contactAdmin": "Please contact the administrator.",
   "contactSection": "Contact Details",
   "continue": "Continue",
   "createNewPatient": "Create new patient",
@@ -59,6 +60,7 @@
   "errorFetchingCodedCausesOfDeath": "Error fetching coded causes of death",
   "errorFetchingOrderedFields": "Error occured fetching ordered fields for address hierarchy",
   "errorFetchingPatient": "Error fetching patient",
+  "errorOccurred": " There was an error processing the request. Try again later",
   "estimatedAgeInMonthsLabelText": "Estimated age in months",
   "estimatedAgeInYearsLabelText": "Estimated age in years",
   "familyNameLabelText": "Family Name",
@@ -145,6 +147,7 @@
   "timeFormat": "Time Format",
   "timeOfDeathInputLabel": "Time of death (hh:mm)",
   "unableToFetch": "Unable to fetch person attribute type - {{personattributetype}}",
+  "unexpectedResponse": "Unexpected Response",
   "unknown": "Unknown",
   "unknownPatientAttributeType": "Patient attribute type has unknown format {{personAttributeTypeFormat}}",
   "unknownRelationship": "Unknown",