@openmrs/esm-patient-tests-app 12.2.0 → 12.2.1

package/src/test-results/filter/filter-context.tsx

@@ -4,11 +4,12 @@ import { type MappedObservation, type TestResult, type GroupedObservation, type
 import {
   ReducerActionType,
   type FilterContextProps,
+  type ObservationData,
   type ReducerState,
   type TimelineData,
   type TreeNode,
 } from './filter-types';
-import reducer from './filter-reducer';
+import reducer, { mergeObsMultisetMax } from './filter-reducer';
 
 function parseTime(sortedTimes: Array<string>) {
   const yearColumns: Array<{ year: string; size: number }> = [],
@@ -45,6 +46,16 @@ function deriveGroupKey(flatName: string): string {
   return flatNameParts.length >= 2 ? flatNameParts[1] : flatNameParts[0];
 }
 
+// A rendered branch: one concept under one rendered panel, after collapsing the
+// duplicate branches the obstree backend can return for the same concept (e.g.
+// one branch per order placed for a test).
+interface NormalizedBranch {
+  test: TestResult;
+  stateKey: string;
+  flatNames: Array<string>;
+  obs: Array<ObservationData>;
+}
+
 const initialState: ReducerState = {
   checkboxes: {},
   parents: {},
@@ -99,6 +110,44 @@ const FilterProvider = ({ roots, isLoading, children }: FilterProviderProps) =>
 
   const someChecked = Boolean(activeTests.length);
 
+  // Normalize rendered branches by the concept's identity within its rendered
+  // panel. The obstree backend can return the same concept under several
+  // branches (e.g. one branch per order), each carrying a copy of the same obs
+  // list. Duplicate branches within one panel merge their obs with the same
+  // multiset-max union the reducer applies to same-flatName duplicates, so
+  // copied lists collapse while equal obs within one list survive as distinct
+  // results. A concept that legitimately renders under two different panels
+  // stays as two branches. tableData, timelineData, and both result counts
+  // derive from this list, keeping the header count aligned with rendered rows.
+  const normalizedTests = useMemo<NormalizedBranch[]>(() => {
+    const branchesByIdentity = new Map<string, NormalizedBranch>();
+
+    for (const key in state.tests) {
+      const test = state.tests[key] as TestResult;
+      if (!test.obs || !Array.isArray(test.obs) || test.obs.length === 0) {
+        continue;
+      }
+
+      const groupKey = deriveGroupKey(test.flatName);
+      const identity = `${groupKey}_${test.conceptUuid ?? test.flatName}`;
+      const existing = branchesByIdentity.get(identity);
+
+      if (existing) {
+        existing.flatNames.push(test.flatName);
+        existing.obs = mergeObsMultisetMax(existing.obs, test.obs);
+      } else {
+        branchesByIdentity.set(identity, {
+          test,
+          stateKey: key,
+          flatNames: [test.flatName],
+          obs: [...test.obs],
+        });
+      }
+    }
+
+    return [...branchesByIdentity.values()];
+  }, [state.tests]);
+
   const timelineData: TimelineData = useMemo(() => {
     if (!state?.tests) {
       return {
@@ -107,27 +156,25 @@ const FilterProvider = ({ roots, isLoading, children }: FilterProviderProps) =>
       };
     }
 
-    const tests: ReducerState['tests'] = activeTests?.length
-      ? Object.fromEntries(Object.entries(state.tests).filter(([key]) => activeTests.includes(key)))
-      : state.tests;
+    const tests = activeTests.length
+      ? normalizedTests.filter((branch) => branch.flatNames.some((flatName) => activeTests.includes(flatName)))
+      : normalizedTests;
 
     const allTimes = [
       ...new Set(
-        Object.values(tests)
-          .filter((test) => test?.obs && Array.isArray(test.obs))
-          .map((test: ReducerState['tests']) => test?.obs?.map((entry) => entry.obsDatetime))
-          .flat(),
+        tests
+          .map(({ obs }) => obs.map((entry) => entry.obsDatetime))
+          .flat()
+          .filter(Boolean),
       ),
     ];
 
     allTimes.sort((a, b) => new Date(b).getTime() - new Date(a).getTime());
 
     const rows = [];
-    Object.values(tests).forEach((testData) => {
-      if (testData?.obs && Array.isArray(testData.obs)) {
-        const newEntries = allTimes.map((time) => testData.obs.find((entry) => entry.obsDatetime === time));
-        rows.push({ ...testData, entries: newEntries });
-      }
+    tests.forEach(({ test, stateKey, flatNames, obs }) => {
+      const newEntries = allTimes.map((time) => obs.find((entry) => entry.obsDatetime === time));
+      rows.push({ ...test, key: stateKey, flatNames, obs, entries: newEntries });
     });
 
     const panelName = 'timeline';
@@ -135,39 +182,22 @@ const FilterProvider = ({ roots, isLoading, children }: FilterProviderProps) =>
       data: { parsedTime: parseTime(allTimes), rowData: rows, panelName },
       loaded: true,
     };
-  }, [activeTests, state.tests]);
+  }, [activeTests, normalizedTests, state.tests]);
 
   const tableData = useMemo<GroupedObservation[]>(() => {
     const flattenedObs: Observation[] = [];
-    const seenTests = new Set<string>();
 
-    for (const key in state.tests) {
-      const test = state.tests[key] as TestResult;
-      if (test.obs && Array.isArray(test.obs)) {
-        test.obs.forEach((obs) => {
-          // Dedupe by the observation's concept identity within its rendered panel.
-          // The obstree backend can return the same concept under several branches
-          // of the orderable-tests tree (e.g. one branch per order), each carrying
-          // the same single obs. Keying on flatName (which differs per branch) left
-          // those as separate rows, so a single result showed up N times. Scoping
-          // to the panel group key keeps the same concept that legitimately appears
-          // under different panels (e.g. mounted beneath two roots) as separate
-          // rows, while collapsing true duplicates within one panel.
-          const groupKey = deriveGroupKey(test.flatName);
-          const testKey = `${groupKey}_${test.conceptUuid ?? test.flatName}_${obs.obsDatetime}_${obs.value}`;
-
-          if (!seenTests.has(testKey)) {
-            seenTests.add(testKey);
-            const flattenedEntry = {
-              ...test,
-              ...obs,
-              key: key,
-            };
-            flattenedObs.push(flattenedEntry);
-          }
-        });
-      }
-    }
+    normalizedTests.forEach(({ test, stateKey, flatNames, obs }) => {
+      obs.forEach((ob) => {
+        const flattenedEntry = {
+          ...test,
+          ...ob,
+          key: stateKey,
+          flatNames,
+        };
+        flattenedObs.push(flattenedEntry);
+      });
+    });
 
     const groupedObs: Record<string, GroupedObservation> = {};
 
@@ -194,7 +224,7 @@ const FilterProvider = ({ roots, isLoading, children }: FilterProviderProps) =>
     );
 
     return resultArray;
-  }, [state.tests]);
+  }, [normalizedTests]);
 
   useEffect(() => {
     if (roots.length) {
@@ -202,33 +232,27 @@ const FilterProvider = ({ roots, isLoading, children }: FilterProviderProps) =>
     }
   }, [actions, roots]);
 
-  const totalResultsCount: number = useMemo(() => {
-    let count = 0;
-    Object.values(state.tests).forEach((testData) => {
-      if (testData?.obs && Array.isArray(testData.obs)) {
-        count += testData.obs.length;
-      }
-    });
-
-    return count;
-  }, [state.tests]);
+  // Both counts derive from the same normalized branches that tableData
+  // renders, so the header count stays aligned with the visible rows.
+  const totalResultsCount: number = useMemo(
+    () => normalizedTests.reduce((count, branch) => count + branch.obs.length, 0),
+    [normalizedTests],
+  );
 
   const filteredResultsCount: number = useMemo(() => {
     if (!someChecked) {
       return totalResultsCount; // No filters applied, show total
     }
 
-    // Count only the tests that are currently selected
-    let count = 0;
-    activeTests.forEach((testKey) => {
-      const test = state.tests[testKey];
-      if (test?.obs && Array.isArray(test.obs)) {
-        count += test.obs.length;
-      }
-    });
-
-    return count;
-  }, [someChecked, activeTests, state.tests, totalResultsCount]);
+    // Count only the tests that are currently selected. Checkboxes are keyed by
+    // flatName, so a normalized branch counts if any of its contributing
+    // flatNames is checked.
+    return normalizedTests.reduce(
+      (count, branch) =>
+        branch.flatNames.some((flatName) => activeTests.includes(flatName)) ? count + branch.obs.length : count,
+      0,
+    );
+  }, [someChecked, activeTests, normalizedTests, totalResultsCount]);
 
   return (
     <FilterContext.Provider

package/src/test-results/filter/filter-reducer.test.ts

@@ -587,4 +587,55 @@ describe('filterReducer', () => {
       expect(newState).toEqual(currentState);
     });
   });
+
+  describe('Merging same-flatName duplicates across trees', () => {
+    const obs = (value: string) =>
+      ({ obsDatetime: '2024-11-04T05:48:00.000Z', value, interpretation: 'LOW' }) as TreeNode['obs'][number];
+
+    const treeWithPlatelets = (rootFlatName: string, plateletObs: TreeNode['obs']): TreeNode => ({
+      flatName: rootFlatName,
+      display: rootFlatName,
+      hasData: true,
+      subSets: [
+        {
+          // Both roots resolve to the same leaf flatName, mirroring the
+          // augmentation that drops the Bloodwork prefix for overlapping roots.
+          flatName: 'Hematology: Platelets',
+          display: 'Platelets',
+          obs: plateletObs,
+          hasData: true,
+        },
+      ],
+    });
+
+    it('collapses copies of the same obs list instead of concatenating them', () => {
+      const trees = [treeWithPlatelets('Hematology', [obs('56')]), treeWithPlatelets('Bloodwork', [obs('56')])];
+
+      const newState = reducer(initialState, { type: ReducerActionType.INITIALIZE, trees });
+
+      expect(newState.tests['Hematology: Platelets'].obs).toHaveLength(1);
+    });
+
+    it('keeps genuinely repeated equal obs that appear within a single list', () => {
+      const trees = [
+        treeWithPlatelets('Hematology', [obs('56'), obs('56')]),
+        treeWithPlatelets('Bloodwork', [obs('56')]),
+      ];
+
+      const newState = reducer(initialState, { type: ReducerActionType.INITIALIZE, trees });
+
+      expect(newState.tests['Hematology: Platelets'].obs).toHaveLength(2);
+    });
+
+    it('does not mutate the source trees and stays idempotent across re-initialization', () => {
+      const trees = [treeWithPlatelets('Hematology', [obs('56')]), treeWithPlatelets('Bloodwork', [obs('56')])];
+
+      const firstState = reducer(initialState, { type: ReducerActionType.INITIALIZE, trees });
+      const secondState = reducer(firstState, { type: ReducerActionType.INITIALIZE, trees });
+
+      expect(trees[0].subSets[0].obs).toHaveLength(1);
+      expect(trees[1].subSets[0].obs).toHaveLength(1);
+      expect(secondState.tests['Hematology: Platelets'].obs).toHaveLength(1);
+    });
+  });
 });

package/src/test-results/filter/filter-reducer.ts

@@ -1,12 +1,43 @@
 import {
   ReducerActionType,
   type LowestNode,
+  type ObservationData,
   type ReducerAction,
   type ReducerState,
   type TreeNode,
   type TreeParents,
 } from './filter-types';
 
+// Merge two copies of a concept's obs list as a multiset union: for each
+// (obsDatetime, value) identity, keep the highest count seen in either list.
+// The obstree backend serializes a concept's full obs list once per branch, so
+// equal obs within one list are genuinely distinct results, while equal lists
+// across branches are copies of the same results. obsDatetime + value is the
+// best identity available until the backend exposes obs uuids; it cannot
+// distinguish a copy from a real duplicate that only ever appears in separate
+// lists, which is a documented limitation rather than a bug to fix here.
+export function mergeObsMultisetMax(
+  existing: Array<ObservationData>,
+  incoming: Array<ObservationData>,
+): Array<ObservationData> {
+  const merged = [...existing];
+  const existingCounts = new Map<string, number>();
+  for (const obs of existing) {
+    const id = `${obs.obsDatetime}|${obs.value}`;
+    existingCounts.set(id, (existingCounts.get(id) ?? 0) + 1);
+  }
+  const incomingCounts = new Map<string, number>();
+  for (const obs of incoming) {
+    const id = `${obs.obsDatetime}|${obs.value}`;
+    const seen = (incomingCounts.get(id) ?? 0) + 1;
+    incomingCounts.set(id, seen);
+    if (seen > (existingCounts.get(id) ?? 0)) {
+      merged.push(obs);
+    }
+  }
+  return merged;
+}
+
 const ROOT_PREFIX = '';
 
 export const getName = (prefix: string | undefined, name: string): string => {
@@ -95,19 +126,18 @@ function reducer(state: ReducerState, action: ReducerAction): ReducerState {
         lowestParents = [...lowestParents, ...newLowestParents];
       });
 
-      // Handle duplicate keys by merging tests with the same flatName
+      // Tests reached through overlapping roots can resolve to the same flatName,
+      // each branch carrying a copy of the same concept's obs list. Merge the
+      // copies with a multiset-max union rather than concatenating, and copy the
+      // node so the SWR-cached trees are never mutated and INITIALIZE stays
+      // idempotent across re-dispatches.
       const flatTests: Record<string, TreeNode> = {};
       tests.forEach(([key, test]) => {
-        if (flatTests[key]) {
-          // If we already have this test, merge the obs data
-          if (test.obs && Array.isArray(test.obs)) {
-            if (!flatTests[key].obs) {
-              flatTests[key].obs = [];
-            }
-            flatTests[key].obs.push(...test.obs);
-          }
-        } else {
-          flatTests[key] = test;
+        const existing = flatTests[key];
+        if (!existing) {
+          flatTests[key] = { ...test, obs: test.obs ? [...test.obs] : test.obs };
+        } else if (test.obs && Array.isArray(test.obs)) {
+          existing.obs = mergeObsMultisetMax(existing.obs ?? [], test.obs);
         }
       });
 

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

@@ -23,9 +23,10 @@ export const GroupedTimeline: React.FC<{ patientUuid: string }> = ({ patientUuid
     return (
       <div className={styles.timelineDataContainer}>
         {tableData.map((panel, index) => {
-          // Filter rowData to only include tests that belong to this panel
-          const panelTestNames = panel.entries.map((entry) => entry.flatName);
-          const subRows = rowData?.filter((row: { flatName: string }) => panelTestNames.includes(row.flatName));
+          const panelTestNames = new Set(
+            panel.entries.flatMap((entry) => [...(entry.flatNames ?? []), entry.flatName]),
+          );
+          const subRows = rowData?.filter((row: { flatName: string }) => panelTestNames.has(row.flatName));
 
           return (
             subRows?.length > 0 && (

package/src/test-results/grouped-timeline/grouped-timeline.test.tsx

@@ -141,6 +141,61 @@ describe('GroupedTimeline', () => {
     // expect(screen.queryByText('Total bilirubin')).not.toBeInTheDocument();
   });
 
+  it('keeps timeline rows visible when filtering by a collapsed branch alias', () => {
+    const primaryFlatName = 'Hematology-Complete blood count-Platelets';
+    const selectedFlatName = 'Chemistry-Complete blood count-Platelets';
+    const obs = {
+      obsDatetime: '2024-11-04T05:48:00.000Z',
+      value: '56.0',
+      interpretation: 'LOW' as const,
+    };
+
+    renderGroupedTimeline({
+      ...mockFilterContext,
+      activeTests: [selectedFlatName],
+      someChecked: true,
+      tableData: [
+        {
+          key: 'Complete blood count',
+          date: '2024-11-04',
+          flatName: primaryFlatName,
+          entries: [
+            {
+              ...obs,
+              key: primaryFlatName,
+              display: 'Platelets',
+              flatName: primaryFlatName,
+              flatNames: [primaryFlatName, selectedFlatName],
+              hasData: true,
+              range: '',
+              conceptUuid: '729AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+            },
+          ],
+        },
+      ],
+      timelineData: {
+        data: {
+          parsedTime: mockFilterContext.timelineData.data.parsedTime,
+          panelName: 'timeline',
+          rowData: [
+            {
+              display: 'Platelets',
+              flatName: selectedFlatName,
+              conceptUuid: '729AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA',
+              hasData: true,
+              obs: [obs],
+              entries: [obs],
+            },
+          ],
+        },
+        loaded: true,
+      },
+    } as FilterContextProps);
+
+    expect(screen.getByText('Platelets')).toBeInTheDocument();
+    expect(screen.getByText('56.0')).toBeInTheDocument();
+  });
+
   it('correctly applies interpretation styling to results', () => {
     const contextWithInterpretations = {
       ...mockFilterContext,

package/src/test-results/tree-view/tree-view.component.tsx

@@ -28,6 +28,11 @@ const GroupedPanelsTables: React.FC<{ patientUuid: string; className: string; lo
   const { checkboxes, someChecked, tableData } = useContext(FilterContext);
   const selectedCheckboxes = Object.keys(checkboxes).filter((key) => checkboxes[key]);
 
+  // An entry can represent several collapsed branches; match a checkbox against
+  // every flatName that contributed to it, not just the one it carries.
+  const entryMatchesCheckbox = (entry: GroupedObservation['entries'][number], selectedKey: string) =>
+    (entry.flatNames ?? [entry.flatName]).includes(selectedKey) || entry.key === selectedKey;
+
   const tableFilteredSubRows = useMemo(
     () =>
       tableData
@@ -36,7 +41,9 @@ const GroupedPanelsTables: React.FC<{ patientUuid: string; className: string; lo
             !someChecked ||
             (row.entries &&
               Array.isArray(row.entries) &&
-              row.entries.some((entry) => selectedCheckboxes.some((selectedKey) => entry.flatName === selectedKey))),
+              row.entries.some((entry) =>
+                selectedCheckboxes.some((selectedKey) => entryMatchesCheckbox(entry, selectedKey)),
+              )),
         )
         .map((subRows: GroupedObservation, index) => {
           return {
@@ -46,9 +53,7 @@ const GroupedPanelsTables: React.FC<{ patientUuid: string; className: string; lo
                 ? subRows.entries.filter(
                     (entry) =>
                       !someChecked ||
-                      selectedCheckboxes.some(
-                        (selectedKey) => entry.flatName === selectedKey || entry.key === selectedKey,
-                      ),
+                      selectedCheckboxes.some((selectedKey) => entryMatchesCheckbox(entry, selectedKey)),
                   )
                 : [],
           };

package/src/test-results/tree-view/tree-view.test.tsx

@@ -108,6 +108,63 @@ describe('TreeView', () => {
     expect(screen.getAllByText('Hematocrit').length).toBeGreaterThan(0);
   });
 
+  describe('Checkbox filtering of collapsed duplicate branches', () => {
+    const sharedConceptUuid = '729AAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAAA';
+
+    const plateletBranch = (rootName: string) => ({
+      display: rootName,
+      flatName: rootName,
+      hasData: true,
+      subSets: [
+        {
+          display: 'Complete blood count',
+          flatName: `${rootName}-Complete blood count`,
+          hasData: true,
+          subSets: [
+            {
+              display: 'Platelets',
+              flatName: `${rootName}-Complete blood count-Platelets`,
+              conceptUuid: sharedConceptUuid,
+              hasData: true,
+              obs: [{ obsDatetime: '2024-11-04T05:48:00.000Z', value: '56.0', interpretation: 'LOW' as const }],
+              subSets: [],
+            },
+          ],
+        },
+      ],
+    });
+
+    it('keeps the collapsed row visible when filtering by its second contributing flatName', async () => {
+      const user = userEvent.setup();
+      // The same concept under two roots resolves to one rendered row in the
+      // "Complete blood count" panel, but both leaves stay checkable in the
+      // filter tree. Checking either one must keep the collapsed row visible.
+      const roots = [plateletBranch('Hematology'), plateletBranch('Chemistry')];
+
+      mockUseGetManyObstreeData.mockReturnValue({
+        roots: roots as unknown as Array<ObsTreeNode>,
+        isLoading: false,
+        error: null,
+      });
+
+      render(
+        <FilterProvider roots={roots as Roots} isLoading={false}>
+          <TreeView {...mockProps} />
+        </FilterProvider>,
+      );
+
+      expect(screen.getAllByRole('table').length).toBeGreaterThan(0);
+
+      const plateletsCheckboxes = screen.getAllByRole('checkbox', { name: /platelets/i });
+      expect(plateletsCheckboxes).toHaveLength(2);
+
+      await user.click(plateletsCheckboxes[1]);
+
+      expect(plateletsCheckboxes[1]).toBeChecked();
+      expect(screen.getAllByRole('table').length).toBeGreaterThan(0);
+    });
+  });
+
   describe('Reset button - Tablet overlay', () => {
     beforeEach(() => {
       mockUseLayoutType.mockReturnValue('tablet');

package/src/types.ts

@@ -188,6 +188,8 @@ export type MappedObservation = {
   hiAbsolute?: number;
   hiCritical?: number;
   flatName: string;
+  /** All flatNames that collapsed into this entry's normalized branch. */
+  flatNames?: Array<string>;
   hasData: boolean;
   range: string;
   obsDatetime: string;