@openmrs/esm-patient-chart-app 11.3.0 → 11.3.1-patch.9310

package/src/clinical-views/encounter-list/tag.component.tsx

@@ -9,36 +9,35 @@ export const renderTag = (
   statusColorMappings: Record<string, string>,
   config: ConfigConcepts,
 ) => {
-  const columnStatus = getObsFromEncounter({ encounter: encounter, obsConcept: concept, config: config });
+  const columnStatus = getObsFromEncounter({ encounter, obsConcept: concept, config });
   const columnStatusObs = findObs(encounter, concept);
 
-  if (columnStatus == '--') {
+  if (columnStatus === '--') {
     return '--';
-  } else {
-    return (
-      <Tag
-        type={
-          typeof columnStatusObs?.value === 'object' && 'uuid' in columnStatusObs.value
-            ? (statusColorMappings[columnStatusObs.value.uuid] as
-                | 'red'
-                | 'magenta'
-                | 'purple'
-                | 'blue'
-                | 'cyan'
-                | 'teal'
-                | 'green'
-                | 'gray'
-                | 'cool-gray'
-                | 'warm-gray'
-                | 'high-contrast'
-                | 'outline')
-            : undefined
-        }
-        title={typeof columnStatus === 'string' ? columnStatus : ''}
-        style={{ minWidth: '80px' }}
-      >
-        {typeof columnStatus === 'string' ? columnStatus : ''}
-      </Tag>
-    );
   }
+
+  return (
+    <Tag
+      type={
+        typeof columnStatusObs?.value === 'object' && 'uuid' in columnStatusObs.value
+          ? (statusColorMappings[columnStatusObs.value.uuid] as
+              | 'red'
+              | 'magenta'
+              | 'purple'
+              | 'blue'
+              | 'cyan'
+              | 'teal'
+              | 'green'
+              | 'gray'
+              | 'cool-gray'
+              | 'warm-gray'
+              | 'high-contrast'
+              | 'outline')
+          : undefined
+      }
+      style={{ minWidth: '80px' }}
+    >
+      {typeof columnStatus === 'string' ? columnStatus : ''}
+    </Tag>
+  );
 };

package/src/clinical-views/encounter-tile/encounter-tile.component.tsx

@@ -5,6 +5,7 @@ import { isNil } from 'lodash-es';
 import { useLayoutType } from '@openmrs/esm-framework';
 import { useLastEncounter } from '../hooks';
 import type { EncounterTileColumn, EncounterTileProps } from '../types';
+import { withUnit, getConceptUnitsFromEncounter } from '../utils/concept-utils';
 import styles from './tile.scss';
 
 export const EncounterTile = memo(({ patientUuid, columns, headerTitle }: EncounterTileProps) => {
@@ -41,6 +42,10 @@ const EncounterData: React.FC<{
 }> = ({ patientUuid, column }) => {
   const { t } = useTranslation();
   const { lastEncounter, isLoading, error, isValidating } = useLastEncounter(patientUuid, column.encounterTypeUuid);
+  const units = getConceptUnitsFromEncounter(lastEncounter, column.concept);
+  const summaryUnits = column.summaryConcept?.primaryConcept
+    ? getConceptUnitsFromEncounter(lastEncounter, column.summaryConcept.primaryConcept)
+    : null;
   const obsValue = column.getObsValue(lastEncounter);
   const summaryValue =
     column.hasSummary === true && column.getSummaryObsValue && typeof column.getSummaryObsValue === 'function'
@@ -64,15 +69,11 @@ const EncounterData: React.FC<{
     <>
       <span className={styles.tileTitle}>{t(column.header)}</span>
       {!(obsValue === '--' && summaryValue !== '--' && !isNil(summaryValue)) && (
-        <span className={styles.tileValue}>
-          <p>{obsValue}</p>
-        </span>
+        <div className={styles.tileValue}>{withUnit(obsValue, units)}</div>
       )}
 
       {!isNil(summaryValue) && summaryValue !== '--' && (
-        <span className={styles.tileValue}>
-          <p>{summaryValue}</p>
-        </span>
+        <div className={styles.tileValue}>{withUnit(summaryValue, summaryUnits)}</div>
       )}
     </>
   );

package/src/clinical-views/encounter-tile/tile.scss

@@ -22,7 +22,6 @@
 }
 
 .tileValue {
-  @include type.type-style('label-01');
   margin: layout.$spacing-04 0 layout.$spacing-04;
   display: block;
 }

package/src/clinical-views/hooks/useEncountersByVisit.ts

@@ -0,0 +1,13 @@
+import { type Encounter, restBaseUrl, useOpenmrsFetchAll } from '@openmrs/esm-framework';
+
+export function useEncountersByVisit(patientUuid: string, visitUuid: string) {
+  const customRepresentation =
+    'custom:(uuid,encounterType:(uuid,display),encounterProviders:(provider:(person:(display))),encounterDatetime,visit:(uuid))';
+  const url = `${restBaseUrl}/encounter?patient=${patientUuid}&order=desc&visit=${visitUuid}&v=${customRepresentation}`;
+  const { data: encounters, ...rest } = useOpenmrsFetchAll<Encounter>(url);
+
+  return {
+    encounters,
+    ...rest,
+  };
+}

package/src/clinical-views/hooks/useLastEncounter.ts

@@ -5,7 +5,7 @@ import useSWR from 'swr';
 const encounterRepresentation =
   'custom:(uuid,encounterDatetime,encounterType,location:(uuid,name),' +
   'patient:(uuid,display,age,identifiers,person),encounterProviders:(uuid,provider:(uuid,name)),' +
-  'obs:(uuid,obsDatetime,voided,groupMembers,concept:(uuid,display,name:(uuid,name)),value:(uuid,name:(uuid,name,display),' +
+  'obs:(uuid,obsDatetime,voided,groupMembers,concept:(uuid,display,units,name:(uuid,name)),value:(uuid,name:(uuid,name,display),' +
   'names:(uuid,conceptNameType,name,display))),form:(uuid,name))';
 
 export function useLastEncounter(patientUuid: string, encounterType: string) {

package/src/clinical-views/types.ts

@@ -38,7 +38,7 @@ export interface Encounter extends OpenmrsResource {
 
 export interface Observation {
   uuid: string;
-  concept: { uuid: string; name: string };
+  concept: { uuid: string; name: string; units?: string };
   value:
     | {
         uuid: string;
@@ -245,6 +245,7 @@ export interface EncounterTileColumn {
   getSummaryObsValue?: (encounter: Encounter) => string;
   encounter?: Encounter;
   hasSummary?: boolean;
+  summaryConcept?: SummaryConcept;
 }
 export interface EncounterTileProps {
   patientUuid: string;

package/src/clinical-views/utils/concept-utils.ts

@@ -0,0 +1,24 @@
+import type { Encounter } from '../types';
+
+/**
+ * Helper function to extract units from an encounter for a specific concept
+ * @param encounter The encounter containing observations
+ * @param conceptUuid The concept UUID to find
+ * @returns The units string if found
+ */
+export function getConceptUnitsFromEncounter(encounter: Encounter | null, conceptUuid: string): string {
+  if (!encounter || !encounter.obs || !conceptUuid) {
+    return '';
+  }
+
+  // Find the observation for this concept
+  const obs = encounter.obs.find((o) => o.concept?.uuid === conceptUuid);
+
+  // Return the units if found
+  return obs?.concept?.units || '';
+}
+
+export const withUnit = (value: string | number, unit: string | null | undefined) => {
+  if (!value || value === '--') return value;
+  return unit ? `${value} ${unit}` : value;
+};

package/src/clinical-views/utils/helpers.ts

@@ -1,4 +1,4 @@
-import { age, formatDate, launchWorkspace, parseDate, type Visit } from '@openmrs/esm-framework';
+import { age, formatDate, launchWorkspace2, parseDate, type Visit } from '@openmrs/esm-framework';
 import { launchStartVisitPrompt } from '@openmrs/esm-patient-common-lib';
 import type {
   ConfigConcepts,
@@ -25,7 +25,7 @@ export function launchEncounterForm(
   if (!visit && requireActiveVisitForEncounterTile) {
     launchStartVisitPrompt();
   } else
-    launchWorkspace('patient-form-entry-workspace', {
+    launchWorkspace2('patient-form-entry-workspace', {
       workspaceTitle: form?.display ?? form?.name,
       mutateForm: onFormSave,
       formInfo: {

package/src/clinical-views/utils/index.ts

@@ -13,6 +13,7 @@ export const getEncounterTileColumns = (tileDefinition: MenuCardProps, config: C
     concept: column.concept,
     encounterTypeUuid: column.encounterType,
     hasSummary: column.hasSummary || false,
+    summaryConcept: column.summaryConcept,
     getObsValue: (encounter: Encounter) => {
       let obsValue;
       if (column.conceptMappings) {
@@ -35,7 +36,9 @@ export const getEncounterTileColumns = (tileDefinition: MenuCardProps, config: C
           config: config,
         });
       }
-      return typeof obsValue === 'string' || (typeof obsValue === 'number' && !isNaN(obsValue)) ? obsValue : obsValue?.name?.name ?? '--';
+      return typeof obsValue === 'string' || (typeof obsValue === 'number' && !isNaN(obsValue))
+        ? obsValue
+        : obsValue?.name?.name ?? '--';
     },
     getSummaryObsValue: column.hasSummary
       ? (encounter: Encounter) => {

package/src/config-schema.ts

@@ -19,7 +19,8 @@ export const esmPatientChartSchema = {
   encounterEditableDuration: {
     _type: Type.Number,
     _default: 0,
-    _description: 'The number of minutes an encounter is editable after it is created. 0 means the encounter is editable forever.',
+    _description:
+      'The number of minutes an encounter is editable after it is created. 0 means the encounter is editable forever.',
   },
   encounterEditableDurationOverridePrivileges: {
     _type: Type.Array,
@@ -27,7 +28,8 @@ export const esmPatientChartSchema = {
       _type: Type.String,
     },
     _default: [],
-    _description: 'The privileges that allow users to edit encounters even after the editable duration (set by `encounterEditableDuration`) has expired. Any privilege in the list is sufficient to edit the encounter.',
+    _description:
+      'The privileges that allow users to edit encounters even after the editable duration (set by `encounterEditableDuration`) has expired. Any privilege in the list is sufficient to edit the encounter.',
   },
   freeTextFieldConceptUuid: {
     _type: Type.ConceptUuid,
@@ -82,12 +84,6 @@ export const esmPatientChartSchema = {
     _description: 'Shows the All Encounters Tab of Patient Visits section in Patient Chart',
     _default: true,
   },
-  showExtraVisitAttributesSlot: {
-    _type: Type.Boolean,
-    _description:
-      'Whether on start visit form should handle submission of the extra visit attributes from the extra visit attributes slot',
-    _default: false,
-  },
   showRecommendedVisitTypeTab: {
     _type: Type.Boolean,
     _description: 'Whether start visit form should display recommended visit type tab. Requires `visitTypeResourceUrl`',
@@ -160,11 +156,39 @@ export const esmPatientChartSchema = {
     _description: 'Default concept uuid for other in forms',
     _default: '5622AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
   },
+  tileDefinitions: {
+    _type: Type.Array,
+    _default: [
+      {
+        title: 'Weight and Height',
+        columns: [
+          {
+            title: 'Weight',
+            concept: '5089AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+            encounterType: '67a71486-1a54-468f-ac3e-7091a9a79584',
+            hasSummary: true,
+          },
+          {
+            title: 'Height',
+            concept: '5090AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+            encounterType: '67a71486-1a54-468f-ac3e-7091a9a79584',
+            hasSummary: true,
+          },
+        ],
+      },
+    ],
+    _description: 'Definitions for clinical summary tiles with their concepts and encounter types',
+  },
   requireActiveVisitForEncounterTile: {
     _type: Type.Boolean,
     _description: 'Whether to require an active visit for the encounter tile',
     _default: true,
   },
+  drugOrderTypeUUID: {
+    _type: Type.UUID,
+    _description: "UUID for the 'Drug' order type to fetch medications",
+    _default: '131168f4-15f5-102d-96e4-000c29c2a5d7',
+  },
 };
 
 export interface ChartConfig {
@@ -183,7 +207,6 @@ export interface ChartConfig {
   offlineVisitTypeUuid: string;
   restrictByVisitLocationTag: boolean;
   showAllEncountersTab: boolean;
-  showExtraVisitAttributesSlot: boolean;
   showRecommendedVisitTypeTab: boolean;
   showServiceQueueFields: boolean; // used by extension from esm-service-queues-app
   showUpcomingAppointments: boolean; // used by extension from esm-appointments-app
@@ -198,5 +221,15 @@ export interface ChartConfig {
   requireActiveVisitForEncounterTile: boolean;
   trueConceptUuid: string;
   falseConceptUuid: string;
+  tileDefinitions: Array<{
+    title: string;
+    columns: Array<{
+      title: string;
+      concept: string;
+      encounterType: string;
+      hasSummary?: boolean;
+    }>;
+  }>;
   otherConceptUuid: string;
+  drugOrderTypeUUID: string;
 }

package/src/dashboard.meta.ts

@@ -1,11 +1,13 @@
-export const summaryDashboardMeta = {
+import { type DashboardLinkConfig } from '@openmrs/esm-patient-common-lib';
+
+export const summaryDashboardMeta: DashboardLinkConfig & { slot: string } = {
   slot: 'patient-chart-summary-dashboard-slot',
   path: 'Patient Summary',
   title: 'Patient Summary',
   icon: 'omrs-icon-report',
 };
 
-export const encountersDashboardMeta = {
+export const encountersDashboardMeta: DashboardLinkConfig & { slot: string } = {
   slot: 'patient-chart-encounters-dashboard-slot',
   path: 'Visits',
   title: 'Visits',

package/src/index.ts

@@ -1,9 +1,4 @@
-import {
-  defineConfigSchema,
-  defineExtensionConfigSchema,
-  getAsyncLifecycle,
-  getSyncLifecycle,
-} from '@openmrs/esm-framework';
+import { defineConfigSchema, getAsyncLifecycle, getSyncLifecycle } from '@openmrs/esm-framework';
 import * as Framework from '@openmrs/esm-framework';
 import { createDashboardLink } from '@openmrs/esm-patient-common-lib';
 import { esmPatientChartSchema } from './config-schema';
@@ -11,7 +6,7 @@ import { moduleName } from './constants';
 import { setupCacheableRoutes, setupOfflineVisitsSync } from './offline';
 import { summaryDashboardMeta, encountersDashboardMeta } from './dashboard.meta';
 import deleteVisitActionButtonComponent from './actions-buttons/delete-visit.component';
-import currentVisitSummaryComponent from './visit/visits-widget/current-visit-summary.component';
+import currentVisitSummaryComponent from './visit/visits-widget/current-visit-summary.extension';
 import markPatientAliveActionButtonComponent from './actions-buttons/mark-patient-alive.component';
 import markPatientDeceasedActionButtonComponent from './actions-buttons/mark-patient-deceased.component';
 import pastVisitsOverviewComponent from './visit/visits-widget/visit-detail-overview.component';
@@ -20,7 +15,7 @@ import patientDetailsTileComponent from './patient-details-tile/patient-details-
 import startVisitActionButtonComponent from './actions-buttons/start-visit.component';
 import startVisitActionButtonOnPatientSearch from './visit/start-visit-button.component';
 import stopVisitActionButtonComponent from './actions-buttons/stop-visit.component';
-import visitAttributeTagsComponent from './patient-banner-tags/visit-attribute-tags.component';
+import visitAttributeTagsComponent from './patient-banner-tags/visit-attribute-tags.extension';
 
 // This allows @openmrs/esm-framework to be accessed by modules that are not
 // using webpack. This is used for ngx-formentry.
@@ -50,37 +45,37 @@ export const patientSummaryDashboardLink =
   );
 
 export const markPatientAliveActionButton = getSyncLifecycle(markPatientAliveActionButtonComponent, {
-  featureName: 'patient-actions-slot',
+  featureName: 'patient-action-mark-alive',
   moduleName,
 });
 
 export const markPatientDeceasedActionButton = getSyncLifecycle(markPatientDeceasedActionButtonComponent, {
-  featureName: 'patient-actions-slot-deceased-button',
+  featureName: 'patient-action-mark-deceased',
   moduleName,
 });
 
 export const startVisitActionButton = getSyncLifecycle(startVisitActionButtonComponent, {
-  featureName: 'patient-actions-slot',
+  featureName: 'patient-action-start-visit',
   moduleName,
 });
 
 export const stopVisitActionButton = getSyncLifecycle(stopVisitActionButtonComponent, {
-  featureName: 'patient-actions-slot',
+  featureName: 'patient-action-stop-visit',
   moduleName,
 });
 
 export const deleteVisitActionMenuButton = getSyncLifecycle(deleteVisitActionButtonComponent, {
-  featureName: 'patient-actions-slot',
+  featureName: 'patient-action-delete-visit',
   moduleName,
 });
 
 export const startVisitPatientSearchActionButton = getSyncLifecycle(startVisitActionButtonOnPatientSearch, {
-  featureName: 'start-visit-button-patient-search',
+  featureName: 'patient-search-action-start-visit',
   moduleName,
 });
 
 export const stopVisitPatientSearchActionButton = getSyncLifecycle(stopVisitActionButtonComponent, {
-  featureName: 'patient-actions-slot',
+  featureName: 'patient-search-action-stop-visit',
   moduleName,
 });
 
@@ -104,7 +99,7 @@ export const currentVisitSummary = getSyncLifecycle(currentVisitSummaryComponent
 });
 
 export const pastVisitsDetailOverview = getSyncLifecycle(pastVisitsOverviewComponent, {
-  featureName: 'visits-detail-slot',
+  featureName: 'visits-detail-overview',
   moduleName,
 });
 
@@ -118,12 +113,16 @@ export const visitAttributeTags = getSyncLifecycle(visitAttributeTagsComponent,
   moduleName,
 });
 
-// t('startVisitWorkspaceTitle', 'Start a visit')
 export const startVisitWorkspace = getAsyncLifecycle(() => import('./visit/visit-form/visit-form.workspace'), {
   featureName: 'start-visit-form',
   moduleName,
 });
 
+export const exportedVisitForm = getAsyncLifecycle(() => import('./visit/visit-form/exported-visit-form.workspace'), {
+  featureName: 'exported-visit-form',
+  moduleName,
+});
+
 // t('markPatientDeceased', 'Mark patient deceased')
 export const markPatientDeceasedForm = getAsyncLifecycle(
   () => import('./mark-patient-deceased/mark-patient-deceased-form.workspace'),
@@ -133,12 +132,12 @@ export const markPatientDeceasedForm = getAsyncLifecycle(
   },
 );
 
-export const startVisitModal = getAsyncLifecycle(() => import('./visit/visit-prompt/start-visit-dialog.component'), {
+export const startVisitModal = getAsyncLifecycle(() => import('./visit/visit-prompt/start-visit-dialog.modal'), {
   featureName: 'start visit',
   moduleName,
 });
 
-export const deleteVisitModal = getAsyncLifecycle(() => import('./visit/visit-prompt/delete-visit-dialog.component'), {
+export const deleteVisitModal = getAsyncLifecycle(() => import('./visit/visit-prompt/delete-visit-dialog.modal'), {
   featureName: 'delete visit',
   moduleName,
 });
@@ -148,7 +147,7 @@ export const modifyVisitDateModal = getAsyncLifecycle(() => import('./visit/visi
   moduleName,
 });
 
-export const endVisitModal = getAsyncLifecycle(() => import('./visit/visit-prompt/end-visit-dialog.component'), {
+export const endVisitModal = getAsyncLifecycle(() => import('./visit/visit-prompt/end-visit-dialog.modal'), {
   featureName: 'end visit',
   moduleName,
 });
@@ -182,7 +181,7 @@ export const activeVisitActionsComponent = getAsyncLifecycle(
 );
 
 export const encounterListTableTabs = getAsyncLifecycle(
-  () => import('./clinical-views/encounter-list/encounter-list-tabs.component'),
+  () => import('./clinical-views/encounter-list/encounter-list-tabs.extension'),
   { featureName: 'encounter-list-table-tabs', moduleName },
 );
 
@@ -192,7 +191,7 @@ export const visitContextSwitcherModal = getAsyncLifecycle(
 );
 
 export const visitContextHeader = getAsyncLifecycle(
-  () => import('./visit/visits-widget/visit-context/visit-context-header.component'),
+  () => import('./visit/visits-widget/visit-context/visit-context-header.extension'),
   { featureName: 'visit-context-header', moduleName },
 );
 

package/src/mark-patient-deceased/mark-patient-deceased-form.test.tsx

@@ -6,10 +6,14 @@ import { esmPatientChartSchema, type ChartConfig } from '../config-schema';
 import { mockPatient } from 'tools';
 import { markPatientDeceased, useCausesOfDeath } from '../data.resource';
 import MarkPatientDeceasedForm from './mark-patient-deceased-form.workspace';
+import { type PatientWorkspace2DefinitionProps } from '@openmrs/esm-patient-common-lib/src';
 
-const originalLocation = window.location;
-delete window.location;
-window.location = { ...originalLocation, reload: jest.fn() };
+const mockReload = jest.fn();
+
+Object.defineProperty(window, 'location', {
+  value: { ...window.location, reload: mockReload },
+  writable: true,
+});
 
 const mockMarkPatientDeceased = jest.mocked(markPatientDeceased);
 const mockUseCausesOfDeath = jest.mocked(useCausesOfDeath);
@@ -17,7 +21,7 @@ const mockUseConfig = jest.mocked(useConfig<ChartConfig>);
 const mockShowSnackbar = jest.mocked(showSnackbar);
 const mockCloseWorkspace = jest.fn();
 
-jest.mock('../data.resource.ts', () => ({
+jest.mock('../data.resource', () => ({
   markPatientDeceased: jest.fn().mockResolvedValue({}),
   useCausesOfDeath: jest.fn(),
 }));
@@ -25,13 +29,20 @@ jest.mock('../data.resource.ts', () => ({
 describe('MarkPatientDeceasedForm', () => {
   const freeTextFieldConceptUuid = '1234e218-6c8a-4ca3-8edb-9f6d9c8c8c7f';
 
-  const defaultProps = {
-    patientUuid: mockPatient.id,
-    patient: mockPatient,
+  const defaultProps: PatientWorkspace2DefinitionProps<{}, {}> = {
     closeWorkspace: mockCloseWorkspace,
-    closeWorkspaceWithSavedChanges: jest.fn(),
-    promptBeforeClosing: jest.fn(),
-    setTitle: jest.fn(),
+    workspaceName: null,
+    launchChildWorkspace: jest.fn(),
+    windowProps: {},
+    workspaceProps: {},
+    groupProps: {
+      patientUuid: mockPatient.id,
+      patient: mockPatient,
+      visitContext: null,
+      mutateVisitContext: null,
+    },
+    windowName: '',
+    isRootWorkspace: false,
   };
 
   const codedCausesOfDeath = [
@@ -71,7 +82,7 @@ describe('MarkPatientDeceasedForm', () => {
   });
 
   afterAll(() => {
-    window.location = originalLocation;
+    jest.restoreAllMocks();
   });
 
   it('renders the cause of death form', () => {