@openmrs/esm-patient-tests-app 11.3.1-pre.9224 → 11.3.1-pre.9251

package/src/test-results/grouped-timeline/timeline-data-group.component.tsx

@@ -10,6 +10,7 @@ import type {
   TimelineDataGroupProps,
 } from './grouped-timeline-types';
 import FilterContext from '../filter/filter-context';
+import { getMostRecentObservationWithRange } from './reference-range-helpers';
 import styles from './grouped-timeline.scss';
 
 export const ShadowBox: React.FC = () => <div className={styles['shadow-box']} />;
@@ -196,14 +197,20 @@ const DataRows: React.FC<DataRowsProps> = ({ patientUuid, timeColumns, rowData,
     <Grid dataColumns={timeColumns.length} padding style={{ gridColumn: 'span 2' }}>
       {rowData.map((row, index) => {
         const obs = row.entries;
-        const { units = '', range = '', obs: values } = row;
+        const { obs: values } = row;
         const isString = isNaN(parseFloat(values?.[0]?.value));
+
+        // Note: Units are only at the concept/node level, not observation-level
+        const mostRecentObsWithRange = getMostRecentObservationWithRange(row.entries);
+        const displayRange = mostRecentObsWithRange?.range ?? row.range ?? '';
+        const displayUnits = row.units ?? '';
+
         return (
           <React.Fragment key={index}>
             <NewRowStartCell
               {...{
-                units,
-                range,
+                units: displayUnits,
+                range: displayRange,
                 title: row.display,
                 shadow: showShadow,
                 conceptUuid: row.conceptUuid,

package/src/test-results/grouped-timeline/useObstreeData.ts

@@ -4,6 +4,7 @@ import useSWRInfinite from 'swr/infinite';
 import { openmrsFetch, restBaseUrl, type FetchResponse } from '@openmrs/esm-framework';
 import { usePatientChartStore, type OBSERVATION_INTERPRETATION } from '@openmrs/esm-patient-common-lib';
 import { assessValue, exist } from '../loadPatientTestData/helpers';
+import { selectReferenceRange, formatReferenceRange, type ReferenceRanges } from './reference-range-helpers';
 
 export const getName = (prefix: string | undefined, name: string) => {
   return prefix ? `${prefix}-${name}` : name;
@@ -13,11 +14,28 @@ interface ObsTreeNode {
   flatName?: string;
   display: string;
   hasData: boolean;
+  hiAbsolute?: number;
+  hiCritical?: number;
   hiNormal?: number;
+  lowAbsolute?: number;
+  lowCritical?: number;
   lowNormal?: number;
+  units?: string;
   range?: string;
   subSets: Array<ObsTreeNode>;
-  obs: Array<{ value: string; interpretation?: OBSERVATION_INTERPRETATION }>;
+  obs: Array<{
+    value: string;
+    interpretation?: OBSERVATION_INTERPRETATION;
+    obsDatetime?: string;
+    // Observation-level reference ranges (criteria-based)
+    // Note: Units are only at the concept/node level, not observation-level
+    hiAbsolute?: number;
+    hiCritical?: number;
+    hiNormal?: number;
+    lowAbsolute?: number;
+    lowCritical?: number;
+    lowNormal?: number;
+  }>;
 }
 
 const augmentObstreeData = (node: ObsTreeNode, prefix: string | undefined) => {
@@ -40,12 +58,58 @@ const augmentObstreeData = (node: ObsTreeNode, prefix: string | undefined) => {
     outData.subSets = outData.subSets.map((subNode: ObsTreeNode) => augmentObstreeData(subNode, outData.flatName));
     outData.hasData = outData.subSets.some((subNode: ObsTreeNode) => subNode.hasData);
   }
+  // Format node-level range for display (using lowNormal/hiNormal)
   if (exist(outData?.hiNormal, outData?.lowNormal)) {
-    outData.range = `${outData.lowNormal} – ${outData.hiNormal}`;
+    outData.range = formatReferenceRange(
+      {
+        lowNormal: outData.lowNormal,
+        hiNormal: outData.hiNormal,
+        units: outData.units,
+      },
+      outData.units,
+    );
   }
+
   if (outData?.obs?.length) {
-    const assess = assessValue(outData);
-    outData.obs = outData.obs.map((ob) => ({ ...ob, interpretation: ob.interpretation ?? assess(ob.value) }));
+    outData.obs = outData.obs.map((ob) => {
+      // Note: Units are only at the concept/node level, not observation-level
+      const observationRanges: ReferenceRanges | undefined =
+        ob.lowNormal !== undefined || ob.hiNormal !== undefined
+          ? {
+              hiAbsolute: ob.hiAbsolute,
+              hiCritical: ob.hiCritical,
+              hiNormal: ob.hiNormal,
+              lowAbsolute: ob.lowAbsolute,
+              lowCritical: ob.lowCritical,
+              lowNormal: ob.lowNormal,
+            }
+          : undefined;
+
+      const nodeRanges: ReferenceRanges | undefined = {
+        hiAbsolute: outData.hiAbsolute,
+        hiCritical: outData.hiCritical,
+        hiNormal: outData.hiNormal,
+        lowAbsolute: outData.lowAbsolute,
+        lowCritical: outData.lowCritical,
+        lowNormal: outData.lowNormal,
+        units: outData.units,
+      };
+
+      const selectedRanges = selectReferenceRange(observationRanges, nodeRanges);
+      const assess = selectedRanges ? assessValue(selectedRanges) : assessValue(nodeRanges);
+      const interpretation = ob.interpretation ?? assess(ob.value);
+
+      // Always use node-level units since observation-level ranges don't have units
+      const displayRange = observationRanges
+        ? formatReferenceRange(observationRanges, outData.units)
+        : outData.range || '--';
+
+      return {
+        ...ob,
+        interpretation,
+        range: displayRange,
+      };
+    });
     outData.hasData = true;
   }
 

package/src/test-results/individual-results-table/individual-results-table.component.tsx

@@ -1,6 +1,7 @@
 import React, { useCallback, useMemo } from 'react';
 import classNames from 'classnames';
 import { useTranslation } from 'react-i18next';
+import { rangeAlreadyHasUnits } from '../grouped-timeline/reference-range-helpers';
 import {
   DataTable,
   DataTableSkeleton,
@@ -85,9 +86,19 @@ const IndividualResultsTable: React.FC<IndividualResultsTableProps> = ({ isLoadi
     () =>
       subRows?.entries.length &&
       subRows.entries.map((row, i) => {
-        const { units = '', range = '' } = row;
+        // Use observation-level range/units if available, otherwise fallback to node-level
+        // MappedObservation has range and units fields, but they may come from node-level
+        const displayRange = row.range ?? '';
+        const displayUnits = row.units ?? '';
         const isString = isNaN(parseFloat(row.value));
 
+        // Check if range already includes units to avoid duplication
+        // formatReferenceRange includes units, so if range has units, don't append again
+        const hasUnits = rangeAlreadyHasUnits(displayRange, displayUnits);
+        const referenceRangeDisplay = hasUnits
+          ? displayRange
+          : `${displayRange || '--'} ${displayUnits || ''}`.trim() || '--';
+
         return {
           ...row,
           id: `${i}-${index}`,
@@ -106,10 +117,10 @@ const IndividualResultsTable: React.FC<IndividualResultsTableProps> = ({ isLoadi
             </span>
           ),
           value: {
-            value: `${row.value} ${row.units ?? ''}`,
+            value: `${row.value} ${displayUnits}`,
             interpretation: row?.interpretation,
           },
-          referenceRange: `${range || '--'} ${units || '--'}`,
+          referenceRange: referenceRangeDisplay,
         };
       }),
     [index, subRows, launchResultsDialog],

package/src/test-results/individual-results-table/individual-results-table.test.tsx

@@ -21,10 +21,41 @@ describe('IndividualResultsTable', () => {
         units: 'copies/ml',
         flatName: 'HIV viral load-HIV viral load',
         hasData: true,
+        range: '0 – 50', // Node-level range
+        lowNormal: 0,
+        hiNormal: 50,
       },
     ],
   } as GroupedObservation;
 
+  const mockSubRowsWithObservationRange = {
+    key: 'Alkaline phosphatase',
+    date: '2024-10-15',
+    flatName: 'Alkaline phosphatase',
+    entries: [
+      {
+        obsDatetime: '2024-10-15 03:20:19.0',
+        value: '15',
+        interpretation: 'CRITICALLY_LOW',
+        key: 'Alkaline phosphatase',
+        datatype: 'Numeric',
+        lowAbsolute: 0,
+        display: 'Alkaline phosphatase',
+        conceptUuid: '785AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+        units: 'U/L',
+        flatName: 'Alkaline phosphatase',
+        hasData: true,
+        range: '35 – 147', // Observation-level range (different from node-level)
+        lowNormal: 35,
+        hiNormal: 147,
+        lowCritical: 25,
+        hiCritical: 200,
+      },
+    ],
+    range: '0 – 270', // Node-level range (fallback)
+    units: 'U/L',
+  } as GroupedObservation;
+
   const mockEmptySubRows = {
     key: 'HIV viral load',
     date: '2024-10-15',
@@ -45,6 +76,20 @@ describe('IndividualResultsTable', () => {
     expect(screen.getByText(/15-Oct-2024/i)).toBeInTheDocument();
     expect(screen.getByText(/test name/i)).toBeInTheDocument();
     expect(screen.getByText(/reference range/i)).toBeInTheDocument();
-    expect(screen.getByRole('row', { name: /hiv viral load 45 copies\/ml -- copies\/ml/i })).toBeInTheDocument();
+    expect(screen.getByRole('row', { name: /hiv viral load 45 copies\/ml 0 – 50 copies\/ml/i })).toBeInTheDocument();
+  });
+
+  it('uses observation-level range when available', () => {
+    render(
+      <IndividualResultsTable
+        isLoading={false}
+        subRows={mockSubRowsWithObservationRange}
+        index={0}
+        title={'Alkaline phosphatase'}
+      />,
+    );
+
+    // Should display observation-level range (35 – 147) not node-level (0 – 270)
+    expect(screen.getByRole('row', { name: /alkaline phosphatase 15 u\/l 35 – 147 u\/l/i })).toBeInTheDocument();
   });
 });

package/src/test-results/individual-results-table-tablet/lab-set-panel.component.tsx

@@ -1,6 +1,7 @@
 import React, { useMemo } from 'react';
 import classNames from 'classnames';
 import { useTranslation } from 'react-i18next';
+import { rangeAlreadyHasUnits } from '../grouped-timeline/reference-range-helpers';
 import {
   DataTable,
   TableContainer,
@@ -70,7 +71,10 @@ const LabSetPanel: React.FC<LabSetPanelProps> = ({ panel, activePanel, setActive
       hasRange
         ? panel.entries.map((test) => {
             const units = test.units ?? '';
-            const range = test.range ? `${test.range} ${units}` : '--';
+            // Check if range already includes units to avoid duplication
+            // formatReferenceRange includes units, so if range has units, don't append again
+            const hasUnits = rangeAlreadyHasUnits(test.range, units);
+            const range = hasUnits ? test.range : test.range ? `${test.range} ${units}` : '--';
             return {
               id: test.conceptUuid,
               testName: test.display,

package/src/test-results/loadPatientTestData/usePatientResultsData.ts

@@ -1,4 +1,4 @@
-import React from 'react';
+import React, { useEffect, useState } from 'react';
 import { type PatientData } from '@openmrs/esm-patient-common-lib';
 import loadPatientData from './loadPatientData';
 
@@ -9,13 +9,13 @@ type LoadingState = {
 };
 
 const usePatientResultsData = (patientUuid: string): LoadingState => {
-  const [state, setState] = React.useState<LoadingState>({
+  const [state, setState] = useState<LoadingState>({
     sortedObs: {},
     loaded: false,
     error: undefined,
   });
 
-  React.useEffect(() => {
+  useEffect(() => {
     let unmounted = false;
     if (patientUuid) {
       const [data, reloadedDataPromise] = loadPatientData(patientUuid);

package/src/test-results/trendline/trendline-resource.tsx

@@ -3,6 +3,11 @@ import useSWR from 'swr';
 import { type FetchResponse, openmrsFetch, showSnackbar, restBaseUrl } from '@openmrs/esm-framework';
 import { assessValue } from '../loadPatientTestData/helpers';
 import { type TreeNode } from '../filter/filter-types';
+import {
+  selectReferenceRange,
+  formatReferenceRange,
+  type ReferenceRanges,
+} from '../grouped-timeline/reference-range-helpers';
 
 function computeTrendlineData(treeNode: TreeNode): Array<TreeNode> {
   const tests: Array<TreeNode> = [];
@@ -11,14 +16,50 @@ function computeTrendlineData(treeNode: TreeNode): Array<TreeNode> {
   }
   treeNode?.subSets.forEach((subNode) => {
     if ((subNode as TreeNode)?.obs) {
-      const TreeNode = subNode as TreeNode;
-      const assess = assessValue(TreeNode);
+      const subTreeNode = subNode as TreeNode;
+      // Node-level reference ranges for trendline (aggregate view)
+      const nodeRanges: ReferenceRanges = {
+        hiAbsolute: subTreeNode.hiAbsolute,
+        hiCritical: subTreeNode.hiCritical,
+        hiNormal: subTreeNode.hiNormal,
+        lowAbsolute: subTreeNode.lowAbsolute,
+        lowCritical: subTreeNode.lowCritical,
+        lowNormal: subTreeNode.lowNormal,
+        units: subTreeNode.units,
+      };
+
+      const range = formatReferenceRange(nodeRanges, subTreeNode.units);
+
+      const processedObs = subTreeNode.obs.map((ob) => {
+        // Note: Units are only at the concept/node level, not observation-level
+        const observationRanges: ReferenceRanges | undefined =
+          ob.lowNormal !== undefined || ob.hiNormal !== undefined
+            ? {
+                hiAbsolute: ob.hiAbsolute,
+                hiCritical: ob.hiCritical,
+                hiNormal: ob.hiNormal,
+                lowAbsolute: ob.lowAbsolute,
+                lowCritical: ob.lowCritical,
+                lowNormal: ob.lowNormal,
+              }
+            : undefined;
+
+        const selectedRanges = selectReferenceRange(observationRanges, nodeRanges);
+        const assess = selectedRanges ? assessValue(selectedRanges) : assessValue(nodeRanges);
+        const interpretation = ob.interpretation ?? assess(ob.value);
+
+        return {
+          ...ob,
+          interpretation,
+          lowNormal: ob.lowNormal,
+          hiNormal: ob.hiNormal,
+        };
+      });
+
       tests.push({
-        ...TreeNode,
-        range: TreeNode.hiNormal && TreeNode.lowNormal ? `${TreeNode.lowNormal} - ${TreeNode.hiNormal}` : '',
-        obs: TreeNode.obs.map((ob) => {
-          return { ...ob, interpretation: ob.interpretation ?? assess(ob.value) };
-        }),
+        ...subTreeNode,
+        range,
+        obs: processedObs,
       });
     } else if (subNode?.subSets) {
       const subTreesTests = computeTrendlineData(subNode as TreeNode); // recursion

package/src/types.ts

@@ -142,6 +142,15 @@ export type Observation = {
   obsDatetime: string;
   value: string;
   interpretation: OBSERVATION_INTERPRETATION;
+  // Observation-level reference ranges (criteria-based)
+  // Note: Units are only at the concept/node level (TestResult.units), not observation-level
+  hiAbsolute?: number;
+  hiCritical?: number;
+  hiNormal?: number;
+  lowAbsolute?: number;
+  lowCritical?: number;
+  lowNormal?: number;
+  range?: string; // Formatted range string for display
 };
 
 export type TestResult = {
@@ -168,6 +177,8 @@ export type MappedObservation = {
   units: string;
   lowCritical: number;
   hiNormal: number;
+  hiAbsolute?: number;
+  hiCritical?: number;
   flatName: string;
   hasData: boolean;
   range: string;

package/translations/fr.json

@@ -13,7 +13,7 @@
   "clearFilters": "Effacer les filtres",
   "clearSearchResults": "Effacer les résultats",
   "closeSearchBar": "Fermer la recherche",
-  "collapseAll": "Collapse all",
+  "collapseAll": "Tout réduire",
   "confirmationText": "Voulez-vous modifier les résultats du test {{test}} pour le patient suivant ?",
   "data": "donnée",
   "dataLoadError": "Erreur lors du chargement des données",
@@ -29,7 +29,7 @@
   "endDate": "Date de fin",
   "error": "Erreur",
   "errorFetchingTestTypes": "Erreur lors de la récupération des résultats pour « {{searchTerm}} »",
-  "expandAll": "Expand all",
+  "expandAll": "Tout étendre",
   "female": "Féminin",
   "gender": "Sexe",
   "goToDrugOrderForm": "Prescrire",