@olaboot/esm-patient-registration-app 9.2.1 → 10.0.2

package/src/constants.ts

@@ -6,7 +6,7 @@ export const personRelationshipRepresentation =
   'personB:(age,display,birthdate,uuid),' +
   'relationshipType:(uuid,display,description,aIsToB,bIsToA))';
 
-export const moduleName = '@olaboot/esm-patient-registration-app';
+export const moduleName = '@openmrs/esm-patient-registration-app';
 export const patientRegistration = 'patient-registration';
 
 export const cacheForOfflineHeaders: OmrsOfflineHttpHeaders = {

package/src/index.ts

@@ -1,6 +1,6 @@
-import { defineConfigSchema, getAsyncLifecycle, getSyncLifecycle, registerBreadcrumbs } from '@openmrs/esm-framework';
+import { defineConfigSchema, getAsyncLifecycle, getSyncLifecycle } from '@openmrs/esm-framework';
 import { esmPatientRegistrationSchema } from './config-schema';
-import { moduleName, patientRegistration } from './constants';
+import { moduleName } from './constants';
 import { setupOffline } from './offline';
 import addPatientLinkComponent from './add-patient-link.extension';
 
@@ -13,28 +13,6 @@ const options = {
 
 export function startupApp() {
   defineConfigSchema(moduleName, esmPatientRegistrationSchema);
-
-  registerBreadcrumbs([
-    {
-      path: `${window.spaBase}/${patientRegistration}`,
-      // t('patientRegistrationBreadcrumb', 'Patient Registration')
-      title: () =>
-        Promise.resolve(
-          window.i18next.t('patientRegistrationBreadcrumb', { defaultValue: 'Patient Registration', ns: moduleName }),
-        ),
-      parent: `${window.spaBase}/home`,
-    },
-    {
-      path: `${window.spaBase}/patient/:patientUuid/edit`,
-      // t('editPatientDetailsBreadcrumb', 'Edit patient details')
-      title: () =>
-        Promise.resolve(
-          window.i18next.t('editPatientDetailsBreadcrumb', { defaultValue: 'Edit patient details', ns: moduleName }),
-        ),
-      parent: `${window.spaBase}/patient/:patientUuid/chart`,
-    },
-  ]);
-
   setupOffline();
 }
 

package/src/nav-link.test.tsx

@@ -1,4 +1,5 @@
 import React from 'react';
+import { vi, describe, it, expect } from 'vitest';
 import { render, screen } from '@testing-library/react';
 import Root from './nav-link';
 

package/src/offline.resources.ts

@@ -1,16 +1,28 @@
 import { camelCase, escapeRegExp, find } from 'lodash-es';
-import { getConfig, messageOmrsServiceWorker, openmrsFetch, restBaseUrl, type Session } from '@openmrs/esm-framework';
+import {
+  getConfig,
+  messageOmrsServiceWorker,
+  openmrsFetch,
+  restBaseUrl,
+  type FetchResponse,
+  type Session,
+} from '@openmrs/esm-framework';
 import type {
-  PatientIdentifierType,
-  FetchedPatientIdentifierType,
   AddressTemplate,
+  ConceptResponse,
+  FetchedPatientIdentifierType,
+  IdentifierSourceAutoGenerationOption,
+  PatientIdentifierType,
+  PersonAttributeTypeResponse,
+  RelationshipTypesResponse,
 } from './patient-registration/patient-registration.types';
 import { cacheForOfflineHeaders, moduleName } from './constants';
+import type { FieldDefinition } from './config-schema';
 
 export interface Resources {
   addressTemplate: AddressTemplate;
   currentSession: Session;
-  relationshipTypes: any;
+  relationshipTypes: RelationshipTypesResponse;
   identifierTypes: Array<PatientIdentifierType>;
 }
 
@@ -24,8 +36,8 @@ export async function fetchAddressTemplate() {
   return data;
 }
 
-export async function fetchAllRelationshipTypes() {
-  const { data } = await cacheAndFetch(`${restBaseUrl}/relationshiptype?v=default`);
+export async function fetchAllRelationshipTypes(): Promise<RelationshipTypesResponse> {
+  const { data } = await cacheAndFetch<RelationshipTypesResponse>(`${restBaseUrl}/relationshiptype?v=default`);
   return data;
 }
 
@@ -50,39 +62,61 @@ export async function fetchAllFieldDefinitionTypes() {
   return mergedData;
 }
 
-async function fetchFieldDefinitionType(fieldDefinition) {
+async function fetchFieldDefinitionType(
+  fieldDefinition: FieldDefinition,
+): Promise<PersonAttributeTypeResponse | undefined> {
   let apiUrl = '';
 
   if (fieldDefinition.type === 'person attribute') {
     apiUrl = `${restBaseUrl}/personattributetype/${fieldDefinition.uuid}`;
   }
 
+  // Pre-fetch the concept for offline caching if answerConceptSetUuid is provided.
+  // This ensures the concept answers are available offline even though we don't use the result here.
+  // The actual concept data is fetched later via useConceptAnswers hook when rendering the field.
   if (fieldDefinition.answerConceptSetUuid) {
-    await cacheAndFetch(`${restBaseUrl}/concept/${fieldDefinition.answerConceptSetUuid}`);
+    await cacheAndFetch<ConceptResponse>(`${restBaseUrl}/concept/${fieldDefinition.answerConceptSetUuid}`);
+  }
+
+  if (!apiUrl) {
+    return undefined;
   }
-  const { data } = await cacheAndFetch(apiUrl);
+
+  const { data } = await cacheAndFetch<PersonAttributeTypeResponse>(apiUrl);
   return data;
 }
 
+function isValidFetchedIdentifierType(
+  type: FetchedPatientIdentifierType | null | undefined,
+): type is FetchedPatientIdentifierType {
+  return type !== null && type !== undefined;
+}
+
 export async function fetchPatientIdentifierTypesWithSources(): Promise<Array<PatientIdentifierType>> {
   const patientIdentifierTypes = await fetchPatientIdentifierTypes();
 
-  // @ts-ignore Reason: The required props of the type are generated below.
-  const identifierTypes: Array<PatientIdentifierType> = patientIdentifierTypes.filter(Boolean);
+  const validIdentifierTypes = patientIdentifierTypes.filter(isValidFetchedIdentifierType);
+  // Convert FetchedPatientIdentifierType to PatientIdentifierType
+  const identifierTypes: Array<PatientIdentifierType> = validIdentifierTypes.map((type) => ({
+    ...type,
+    identifierSources: [],
+  }));
 
   const [autoGenOptions, identifierSourcesResponse] = await Promise.all([
     fetchAutoGenerationOptions(),
     fetchIdentifierSources(),
   ]);
 
-  const allIdentifierSources = identifierSourcesResponse.data.results;
+  const allIdentifierSources = identifierSourcesResponse.data?.results || [];
 
-  for (let i = 0; i < identifierTypes?.length; i++) {
+  for (let i = 0; i < identifierTypes.length; i++) {
     identifierTypes[i].identifierSources = allIdentifierSources
       .filter((source) => source.identifierType.uuid === identifierTypes[i].uuid)
       .map((source) => {
-        const option = find(autoGenOptions.data.results, { source: { uuid: source.uuid } });
-        source.autoGenerationOption = option;
+        const option = find(autoGenOptions.data?.results || [], { source: { uuid: source.uuid } });
+        if (option && 'manualEntryEnabled' in option && 'automaticGenerationEnabled' in option) {
+          source.autoGenerationOption = option as IdentifierSourceAutoGenerationOption;
+        }
         return source;
       });
   }
@@ -90,28 +124,40 @@ export async function fetchPatientIdentifierTypesWithSources(): Promise<Array<Pa
   return identifierTypes;
 }
 
-async function fetchPatientIdentifierTypes(): Promise<Array<FetchedPatientIdentifierType>> {
+interface ApiPatientIdentifierType {
+  display: string;
+  uuid: string;
+  name: string;
+  format: string;
+  formatDescription?: string;
+  required: boolean;
+  uniquenessBehavior: undefined | null | 'UNIQUE' | 'NON_UNIQUE' | 'LOCATION';
+}
+
+async function fetchPatientIdentifierTypes(): Promise<Array<FetchedPatientIdentifierType | null>> {
   const [patientIdentifierTypesResponse, primaryIdentifierTypeResponse] = await Promise.all([
-    cacheAndFetch(
+    cacheAndFetch<{ results: Array<ApiPatientIdentifierType> }>(
       `${restBaseUrl}/patientidentifiertype?v=custom:(display,uuid,name,format,formatDescription,required,uniquenessBehavior)`,
     ),
-    cacheAndFetch(`${restBaseUrl}/metadatamapping/termmapping?v=full&code=emr.primaryIdentifierType`),
+    cacheAndFetch<{ results: Array<{ metadataUuid: string }> }>(
+      `${restBaseUrl}/metadatamapping/termmapping?v=full&code=emr.primaryIdentifierType`,
+    ),
   ]);
 
   if (patientIdentifierTypesResponse.ok) {
     // Primary identifier type is to be kept at the top of the list.
-    const patientIdentifierTypes = patientIdentifierTypesResponse?.data?.results;
+    const patientIdentifierTypes = patientIdentifierTypesResponse?.data?.results || [];
 
     const primaryIdentifierTypeUuid = primaryIdentifierTypeResponse?.data?.results?.[0]?.metadataUuid;
 
-    let identifierTypes = primaryIdentifierTypeResponse?.ok
-      ? [
-          mapPatientIdentifierType(
-            patientIdentifierTypes?.find((type) => type.uuid === primaryIdentifierTypeUuid),
-            true,
-          ),
-        ]
-      : [];
+    const identifierTypes: Array<FetchedPatientIdentifierType | null> = [];
+
+    if (primaryIdentifierTypeResponse?.ok && primaryIdentifierTypeUuid) {
+      const primaryType = patientIdentifierTypes.find((type) => type.uuid === primaryIdentifierTypeUuid);
+      if (primaryType) {
+        identifierTypes.push(mapPatientIdentifierType(primaryType, true));
+      }
+    }
 
     patientIdentifierTypes.forEach((type) => {
       if (type.uuid !== primaryIdentifierTypeUuid) {
@@ -124,15 +170,32 @@ async function fetchPatientIdentifierTypes(): Promise<Array<FetchedPatientIdenti
   return [];
 }
 
+interface IdentifierSourceResponse {
+  results: Array<{
+    uuid: string;
+    name: string;
+    identifierType: { uuid: string };
+    autoGenerationOption?: IdentifierSourceAutoGenerationOption;
+  }>;
+}
+
 async function fetchIdentifierSources() {
-  return await cacheAndFetch(`${restBaseUrl}/idgen/identifiersource?v=default`);
+  return await cacheAndFetch<IdentifierSourceResponse>(`${restBaseUrl}/idgen/identifiersource?v=default`);
+}
+
+interface AutoGenerationOptionResponse {
+  results: Array<IdentifierSourceAutoGenerationOption & { source: { uuid: string } }>;
 }
 
 async function fetchAutoGenerationOptions(abortController?: AbortController) {
-  return await cacheAndFetch(`${restBaseUrl}/idgen/autogenerationoption?v=full`);
+  return await cacheAndFetch<AutoGenerationOptionResponse>(`${restBaseUrl}/idgen/autogenerationoption?v=full`);
 }
 
-async function cacheAndFetch<T = any>(url?: string) {
+async function cacheAndFetch<T = unknown>(url?: string): Promise<FetchResponse<T>> {
+  if (!url) {
+    throw new Error('URL is required for cacheAndFetch');
+  }
+
   const abortController = new AbortController();
 
   await messageOmrsServiceWorker({
@@ -143,7 +206,10 @@ async function cacheAndFetch<T = any>(url?: string) {
   return await openmrsFetch<T>(url, { headers: cacheForOfflineHeaders, signal: abortController?.signal });
 }
 
-function mapPatientIdentifierType(patientIdentifierType, isPrimary) {
+function mapPatientIdentifierType(
+  patientIdentifierType: ApiPatientIdentifierType,
+  isPrimary: boolean,
+): FetchedPatientIdentifierType {
   return {
     name: patientIdentifierType.display,
     fieldName: camelCase(patientIdentifierType.name),

package/src/patient-registration/before-save-prompt.test.tsx

@@ -0,0 +1,199 @@
+import React from 'react';
+import { vi, describe, it, expect, beforeEach, afterEach, type Mock, type MockInstance } from 'vitest';
+import { render, waitFor } from '@testing-library/react';
+import { showModal, navigate } from '@openmrs/esm-framework';
+import BeforeSavePrompt from './before-save-prompt.component';
+
+const mockShowModal = vi.mocked(showModal);
+const mockNavigate = vi.mocked(navigate);
+
+const mockGetOpenmrsSpaBase = vi.fn(() => '/openmrs/spa');
+window['getOpenmrsSpaBase'] = mockGetOpenmrsSpaBase;
+
+/**
+ * Helper to render BeforeSavePrompt component.
+ */
+function renderBeforeSavePrompt(when: boolean, redirect?: string) {
+  return render(<BeforeSavePrompt when={when} redirect={redirect} />);
+}
+
+describe('BeforeSavePrompt component', () => {
+  let addEventListenerSpy: MockInstance;
+  let removeEventListenerSpy: MockInstance;
+  let disposeMock: Mock;
+
+  beforeEach(() => {
+    disposeMock = vi.fn();
+    mockShowModal.mockReturnValue(disposeMock);
+    mockNavigate.mockClear();
+
+    // Spy on window.addEventListener and removeEventListener
+    addEventListenerSpy = vi.spyOn(window, 'addEventListener');
+    removeEventListenerSpy = vi.spyOn(window, 'removeEventListener');
+  });
+
+  afterEach(() => {
+    addEventListenerSpy.mockRestore();
+    removeEventListenerSpy.mockRestore();
+  });
+
+  describe('Event listener setup', () => {
+    it('does not set up event listeners when when is false', () => {
+      renderBeforeSavePrompt(false);
+
+      expect(addEventListenerSpy).not.toHaveBeenCalled();
+    });
+
+    it('sets up beforeunload and navigation event listeners when when is true', () => {
+      renderBeforeSavePrompt(true);
+
+      expect(addEventListenerSpy).toHaveBeenCalledWith('beforeunload', expect.any(Function));
+      expect(addEventListenerSpy).toHaveBeenCalledWith('single-spa:before-routing-event', expect.any(Function));
+    });
+
+    it('removes event listeners on unmount', () => {
+      const { unmount } = renderBeforeSavePrompt(true);
+
+      unmount();
+
+      expect(removeEventListenerSpy).toHaveBeenCalledWith('beforeunload', expect.any(Function));
+      expect(removeEventListenerSpy).toHaveBeenCalledWith('single-spa:before-routing-event', expect.any(Function));
+    });
+
+    it('does not set up listeners when redirect is provided', () => {
+      renderBeforeSavePrompt(true, '/some/path');
+
+      expect(addEventListenerSpy).not.toHaveBeenCalled();
+    });
+  });
+
+  describe('Beforeunload event handling', () => {
+    it('prevents default and sets returnValue on beforeunload event', () => {
+      renderBeforeSavePrompt(true);
+
+      const beforeunloadHandler = addEventListenerSpy.mock.calls.find((call) => call[0] === 'beforeunload')?.[1] as (
+        e: BeforeUnloadEvent,
+      ) => string;
+
+      const mockEvent = {
+        preventDefault: vi.fn(),
+        returnValue: '',
+      } as unknown as BeforeUnloadEvent;
+
+      const result = beforeunloadHandler(mockEvent);
+
+      expect(mockEvent.preventDefault).toHaveBeenCalled();
+      expect(mockEvent.returnValue).toBeTruthy();
+      expect(result).toBeTruthy();
+    });
+  });
+
+  describe('Navigation event handling', () => {
+    it('shows modal and cancels navigation on single-spa routing event', () => {
+      renderBeforeSavePrompt(true);
+
+      const navigationHandler = addEventListenerSpy.mock.calls.find(
+        (call) => call[0] === 'single-spa:before-routing-event',
+      )?.[1] as (e: CustomEvent) => void;
+
+      const mockCancelNavigation = vi.fn();
+      const mockEvent = {
+        detail: {
+          newUrl: '/openmrs/spa/new-page',
+          navigationIsCanceled: false,
+          cancelNavigation: mockCancelNavigation,
+        },
+      } as unknown as CustomEvent;
+
+      navigationHandler(mockEvent);
+
+      expect(mockCancelNavigation).toHaveBeenCalled();
+      expect(mockShowModal).toHaveBeenCalledWith(
+        'cancel-patient-edit-modal',
+        expect.objectContaining({
+          onConfirm: expect.any(Function),
+        }),
+        expect.any(Function),
+      );
+    });
+
+    it('does not show modal if navigation is already canceled', () => {
+      renderBeforeSavePrompt(true);
+
+      const navigationHandler = addEventListenerSpy.mock.calls.find(
+        (call) => call[0] === 'single-spa:before-routing-event',
+      )?.[1] as (e: CustomEvent) => void;
+
+      const mockEvent = {
+        detail: {
+          newUrl: '/openmrs/spa/new-page',
+          navigationIsCanceled: true,
+          cancelNavigation: vi.fn(),
+        },
+      } as unknown as CustomEvent;
+
+      navigationHandler(mockEvent);
+
+      expect(mockShowModal).not.toHaveBeenCalled();
+    });
+
+    it('navigates to target URL when modal is confirmed', async () => {
+      renderBeforeSavePrompt(true);
+
+      const navigationHandler = addEventListenerSpy.mock.calls.find(
+        (call) => call[0] === 'single-spa:before-routing-event',
+      )?.[1] as (e: CustomEvent) => void;
+
+      const mockEvent = {
+        detail: {
+          newUrl: '/openmrs/spa/new-page',
+          navigationIsCanceled: false,
+          cancelNavigation: vi.fn(),
+        },
+      } as unknown as CustomEvent;
+
+      // Call navigationHandler directly - it triggers showModal synchronously
+      navigationHandler(mockEvent);
+
+      // Get the onConfirm callback from showModal call
+      // showModal is called with: (modalName, props, onClose)
+      const modalProps = mockShowModal.mock.calls[0]?.[1] as { onConfirm?: () => void } | undefined;
+      const onConfirm = modalProps?.onConfirm;
+
+      expect(onConfirm).toBeDefined();
+
+      // Call onConfirm directly - waitFor will handle async updates
+      onConfirm?.();
+
+      await waitFor(() => {
+        expect(mockNavigate).toHaveBeenCalledWith({
+          to: expect.stringContaining('/new-page'),
+        });
+      });
+      expect(disposeMock).toHaveBeenCalled();
+    });
+  });
+
+  describe('Redirect handling', () => {
+    it('navigates to redirect URL when redirect prop is provided', async () => {
+      renderBeforeSavePrompt(true, '/openmrs/spa/target-page');
+
+      await waitFor(() => {
+        expect(mockNavigate).toHaveBeenCalledWith({
+          to: expect.stringContaining('/target-page'),
+        });
+      });
+    });
+
+    it('handles redirect with full URL', async () => {
+      mockGetOpenmrsSpaBase.mockReturnValue('/openmrs/spa');
+      renderBeforeSavePrompt(true, '/openmrs/spa/target-page');
+
+      await waitFor(() => {
+        expect(mockNavigate).toHaveBeenCalledWith({
+          to: expect.stringContaining('/target-page'),
+        });
+      });
+    });
+  });
+});

package/src/patient-registration/field/__mocks__/field.resource.ts

@@ -1,11 +1,12 @@
+import { vi } from 'vitest';
 import { type ConceptResponse } from '../../patient-registration.types';
 
-export const useConcept = jest.fn(function mockUseConceptImplementation(uuid: string): {
+export const useConcept = vi.fn(function mockUseConceptImplementation(uuid: string): {
   data: ConceptResponse;
   isLoading: boolean;
 } {
   let data;
-  if (uuid == 'weight-uuid') {
+  if (uuid === 'weight-uuid') {
     data = {
       uuid: 'weight-uuid',
       display: 'Weight (kg)',
@@ -13,7 +14,7 @@ export const useConcept = jest.fn(function mockUseConceptImplementation(uuid: st
       answers: [],
       setMembers: [],
     };
-  } else if (uuid == 'chief-complaint-uuid') {
+  } else if (uuid === 'chief-complaint-uuid') {
     data = {
       uuid: 'chief-complaint-uuid',
       display: 'Chief Complaint',
@@ -21,7 +22,7 @@ export const useConcept = jest.fn(function mockUseConceptImplementation(uuid: st
       answers: [],
       setMembers: [],
     };
-  } else if (uuid == 'nationality-uuid') {
+  } else if (uuid === 'nationality-uuid') {
     data = {
       uuid: 'nationality-uuid',
       display: 'Nationality',
@@ -39,8 +40,8 @@ export const useConcept = jest.fn(function mockUseConceptImplementation(uuid: st
   };
 });
 
-export const useConceptAnswers = jest.fn((uuid: string) => {
-  if (uuid == 'nationality-uuid') {
+export const useConceptAnswers = vi.fn((uuid: string) => {
+  if (uuid === 'nationality-uuid') {
     return {
       data: [
         { display: 'USA', uuid: 'usa' },
@@ -48,7 +49,7 @@ export const useConceptAnswers = jest.fn((uuid: string) => {
       ],
       isLoading: false,
     };
-  } else if (uuid == 'other-countries-uuid') {
+  } else if (uuid === 'other-countries-uuid') {
     return {
       data: [
         { display: 'Kenya', uuid: 'ke' },