feat: group measurements by study

extensions/cornerstone-dicom-sr/src/commandsModule.ts

@@ -42,9 +42,8 @@ const _generateReport = (measurementData, additionalFindingTypes, options = {})
 };
 
 const commandsModule = (props: withAppTypes) => {
-  const { servicesManager, extensionManager, commandsManager } = props;
-  const { customizationService, measurementService, viewportGridService, uiDialogService } =
-    servicesManager.services;
+  const { servicesManager, extensionManager } = props;
+  const { customizationService, displaySetService, viewportGridService } = servicesManager.services;
 
   const actions = {
     changeColorMeasurement: ({ uid }) => {

extensions/cornerstone/src/panels/PanelMeasurement.tsx

@@ -1,24 +1,27 @@
-import React, { useEffect, useRef, useState } from 'react';
+import React, { useEffect, useRef } from 'react';
 import { utils } from '@ohif/core';
 import { MeasurementTable } from '@ohif/ui-next';
 import debounce from 'lodash.debounce';
 import { useMeasurements } from '../hooks/useMeasurements';
 
-const { filterAdditionalFinding, filterOr, filterAny } = utils.MeasurementFilters;
+const { filterAdditionalFinding, filterAny } = utils.MeasurementFilters;
 
 export type withAppAndFilters = withAppTypes & {
   measurementFilters: Record<string, (item) => boolean>;
+  groupBy: string;
+  title: string;
 };
 
 export default function PanelMeasurementTable({
   servicesManager,
   commandsManager,
   customHeader,
   measurementFilters = { measurementFilter: filterAny },
+  title,
 }: withAppAndFilters): React.ReactNode {
   const measurementsPanelRef = useRef(null);
 
-  const { measurementService, customizationService } = servicesManager.services;
+  const { measurementService, displaySetService } = servicesManager.services;
 
   const displayMeasurements = useMeasurements(servicesManager, {
     measurementFilter: measurementFilters.measurementFilter.bind(measurementFilters),
@@ -49,9 +52,22 @@ export default function PanelMeasurementTable({
   const additionalFilter = filterAdditionalFinding(measurementService);
 
   const { measurementFilter: trackedFilter } = measurementFilters;
-  const measurements = displayMeasurements.filter(
-    item => !additionalFilter(item) && trackedFilter(item)
-  );
+  const measurements = displayMeasurements
+    .filter(item => !additionalFilter(item) && trackedFilter(item))
+    .reduce((groupedMeasurements, item) => {
+      const displaySet = displaySetService.getDisplaySetByUID(item.displaySetInstanceUID);
+      const key = displaySet.instances[0].StudyDescription;
+
+      if (!groupedMeasurements.has(key)) {
+        groupedMeasurements.set(key, [item]);
+        return groupedMeasurements;
+      }
+
+      const oldValues = groupedMeasurements.get(key);
+      oldValues.push(item);
+      return groupedMeasurements;
+    }, new Map()) as Map<string, object[]>;
+
   const additionalFindings = displayMeasurements.filter(
     item => additionalFilter(item) && trackedFilter(item)
   );
@@ -71,27 +87,31 @@ export default function PanelMeasurementTable({
         ref={measurementsPanelRef}
         data-cy={'trackedMeasurements-panel'}
       >
-        <MeasurementTable
-          key="tracked"
-          title="Measurements"
-          data={measurements}
-          {...onArgs}
-          // onColor={changeColorMeasurement}
-        >
-          <MeasurementTable.Header>
-            {customHeader && (
-              <>
-                {typeof customHeader === 'function'
-                  ? customHeader({
-                      additionalFindings,
-                      measurements,
-                    })
-                  : customHeader}
-              </>
-            )}
-          </MeasurementTable.Header>
-          <MeasurementTable.Body />
-        </MeasurementTable>
+        {Array.from(measurements).map(([key, value]) => {
+          return (
+            <MeasurementTable
+              key={`tracked-${key}`}
+              title={title ? title : `Measurements for ${key}`}
+              data={value}
+              {...onArgs}
+              // onColor={changeColorMeasurement}
+            >
+              <MeasurementTable.Header>
+                {customHeader && (
+                  <>
+                    {typeof customHeader === 'function'
+                      ? customHeader({
+                          additionalFindings,
+                          measurements,
+                        })
+                      : customHeader}
+                  </>
+                )}
+              </MeasurementTable.Header>
+              <MeasurementTable.Body />
+            </MeasurementTable>
+          );
+        })}
         {additionalFindings.length > 0 && (
           <MeasurementTable
             key="additional"

extensions/measurement-tracking/src/panels/PanelMeasurementTableTracking.tsx

@@ -1,12 +1,12 @@
 import React, { useEffect, useState } from 'react';
-import { DicomMetadataStore, utils } from '@ohif/core';
+import { utils } from '@ohif/core';
 import { useViewportGrid } from '@ohif/ui';
 import { Button, Icons } from '@ohif/ui-next';
 import { PanelMeasurement, StudySummaryFromMetadata } from '@ohif/extension-cornerstone';
 import { useTrackedMeasurements } from '../getContextModule';
 import { useTranslation } from 'react-i18next';
 
-const { filterAny, filterNone, filterNot, filterTracked } = utils.MeasurementFilters;
+const { filterAny, filterNot, filterTracked } = utils.MeasurementFilters;
 
 function PanelMeasurementTableTracking({
   servicesManager,
@@ -28,7 +28,7 @@ function PanelMeasurementTableTracking({
   });
 
   useEffect(() => {
-    let updatedMeasurementFilters = { ...measurementFilters };
+    const updatedMeasurementFilters = { ...measurementFilters };
     if (trackedMeasurements.matches('tracking') && trackedStudy) {
       updatedMeasurementFilters.measurementFilter = filterTracked(trackedStudy, trackedSeries);
     } else {
@@ -53,6 +53,7 @@ function PanelMeasurementTableTracking({
         extensionManager={extensionManager}
         commandsManager={commandsManager}
         measurementFilters={measurementFilters}
+        title="Measurements"
         customHeader={({ additionalFindings, measurements }) => {
           const disabled = additionalFindings.length === 0 && measurements.length === 0;