fix(SegmentationPanel): should be able to hide and only show one segment (#3270)

* fix(SegmentationPanel): should be able to hide and only show one segment

* fix imports

* bump package versions

extensions/cornerstone/package.json

@@ -44,9 +44,9 @@
   "dependencies": {
     "@babel/runtime": "^7.20.13",
     "@cornerstonejs/adapters": "^0.4.1",
-    "@cornerstonejs/core": "^0.36.0",
-    "@cornerstonejs/streaming-image-volume-loader": "^0.14.1",
-    "@cornerstonejs/tools": "^0.50.2",
+    "@cornerstonejs/core": "^0.36.2",
+    "@cornerstonejs/streaming-image-volume-loader": "^0.15.1",
+    "@cornerstonejs/tools": "^0.55.1",
     "@kitware/vtk.js": "26.5.6",
     "html2canvas": "^1.4.1",
     "lodash.debounce": "4.0.8",

extensions/cornerstone/src/index.tsx

@@ -151,5 +151,6 @@ const cornerstoneExtension: Types.Extensions.Extension = {
   },
 };
 
+export type { PublicViewportOptions };
+export { measurementMappingUtils };
 export default cornerstoneExtension;
-export { measurementMappingUtils, PublicViewportOptions };

extensions/cornerstone/src/services/SegmentationService/SegmentationService.ts

@@ -1,22 +1,22 @@
 import cloneDeep from 'lodash.clonedeep';
 
-import { pubSubServiceInterface } from '@ohif/core';
 import {
-  utilities as cstUtils,
-  segmentation as cstSegmentation,
-  CONSTANTS as cstConstants,
-  Enums as csToolsEnums,
-  Types as cstTypes,
-} from '@cornerstonejs/tools';
-import {
-  eventTarget,
   cache,
+  eventTarget,
+  getEnabledElementByIds,
+  metaData,
+  Types,
   utilities as csUtils,
   volumeLoader,
-  Types,
-  metaData,
-  getEnabledElementByIds,
 } from '@cornerstonejs/core';
+import {
+  CONSTANTS as cstConstants,
+  Enums as csToolsEnums,
+  segmentation as cstSegmentation,
+  Types as cstTypes,
+  utilities as cstUtils,
+} from '@cornerstonejs/tools';
+import { pubSubServiceInterface } from '@ohif/core';
 import isEqual from 'lodash.isequal';
 import { easeInOutBell } from '../../utils/transitions';
 import {
@@ -202,7 +202,7 @@ class SegmentationService {
       this._setActiveSegment(segmentationId, segmentIndex, suppressEvents);
     }
 
-    // Todo: this includes nonhydrated segmentations which might not be
+    // Todo: this includes non-hydrated segmentations which might not be
     // persisted in the store
     this._broadcastEvent(this.EVENTS.SEGMENTATION_UPDATED, {
       segmentation,
@@ -1598,6 +1598,13 @@ class SegmentationService {
       isVisible
     );
 
+    // make sure to update the isVisible flag on the segmentation
+    // if a segment becomes invisible then the segmentation should be invisible
+    // in the status as well, and show correct icon
+    segmentation.isVisible = segmentation.segments
+      .filter(Boolean)
+      .every(segment => segment.isVisible);
+
     if (suppressEvents === false) {
       this._broadcastEvent(this.EVENTS.SEGMENTATION_UPDATED, {
         segmentation,
@@ -1917,28 +1924,27 @@ class SegmentationService {
         representation => representation.segmentationId === segmentationId
       );
 
-      const visibility = cstSegmentation.config.visibility.getSegmentationVisibility(
-        toolGroupId,
-        representation.segmentationRepresentationUID
-      );
+      const { segmentsHidden } = representation;
+
+      const currentVisibility = segmentsHidden.size === 0 ? true : false;
+      const newVisibility = !currentVisibility;
 
       cstSegmentation.config.visibility.setSegmentationVisibility(
         toolGroupId,
         representation.segmentationRepresentationUID,
-        !visibility
+        newVisibility
       );
 
-      // set all segments to visible as well
-      const segments = this.getSegmentation(segmentationId).segments;
-      Object.keys(segments).forEach(segmentIndex => {
-        if (segmentIndex !== '0') {
-          this._setSegmentVisibility(
-            segmentationId,
-            Number(segmentIndex),
-            !visibility,
-            toolGroupId
-          );
-        }
+      // update segments visibility
+      const { segmentation } = this._getSegmentationInfo(
+        segmentationId,
+        toolGroupId
+      );
+
+      const segments = segmentation.segments.filter(Boolean);
+
+      segments.forEach(segment => {
+        segment.isVisible = newVisibility;
       });
     });
   };

extensions/cornerstone/src/services/ViewportService/Viewport.ts

@@ -1,14 +1,14 @@
 import { Types, Enums } from '@cornerstonejs/core';
 import { Types as UITypes } from '@ohif/ui';
+import {
+  StackViewportData,
+  VolumeViewportData,
+} from '../../types/CornerstoneCacheService';
 import getCornerstoneBlendMode from '../../utils/getCornerstoneBlendMode';
 import getCornerstoneOrientation from '../../utils/getCornerstoneOrientation';
 import getCornerstoneViewportType from '../../utils/getCornerstoneViewportType';
 import JumpPresets from '../../utils/JumpPresets';
 import { SyncGroup } from '../SyncGroupService/SyncGroupService';
-import {
-  StackViewportData,
-  VolumeViewportData,
-} from '../../types/CornerstoneCacheService';
 
 export type InitialImageOptions = {
   index?: number;
@@ -247,7 +247,7 @@ class ViewportInfo {
     return this.viewportOptions.background || [0, 0, 0];
   }
 
-  public getOrientation(): Types.Orientation {
+  public getOrientation(): Enums.OrientationAxis {
     return this.viewportOptions.orientation;
   }
 

extensions/cornerstone/src/utils/getCornerstoneOrientation.ts

@@ -1,5 +1,4 @@
 import { Enums } from '@cornerstonejs/core';
-import { log } from '@ohif/core';
 
 const AXIAL = 'axial';
 const SAGITTAL = 'sagittal';