feat: Add extensibility for tmtv and segmentation modes (#6128)

* feat: Add extensibility for tmtv and segmentation modes

* Fixes for ordering issues on laod

* Remove unnecessary reference lookup

* Chane side panel timing to fix tests

* PR comments - change how mode definitions get created

* Improvements to mode customizations

* Start organizing customizations

* Misc fixes for a customization demo page

* Security fixes

* PR requested changes to naming

modes/tmtv/package.json

@@ -35,7 +35,9 @@
     "@ohif/extension-default": "workspace:*",
     "@ohif/extension-dicom-pdf": "workspace:*",
     "@ohif/extension-dicom-video": "workspace:*",
-    "@ohif/extension-measurement-tracking": "workspace:*"
+    "@ohif/extension-measurement-tracking": "workspace:*",
+    "@ohif/extension-tmtv": "workspace:*",
+    "@ohif/mode-basic": "workspace:*"
   },
   "dependencies": {
     "@babel/runtime": "7.29.7",

modes/tmtv/src/index.ts

@@ -1,32 +1,39 @@
 import { classes } from '@ohif/core';
-import toolbarButtons from './toolbarButtons';
+import {
+  isValidMode,
+  layoutTemplate,
+  modeFactory,
+  onModeEnter as basicOnModeEnter,
+  onModeExit,
+} from '@ohif/mode-basic';
+import i18n from 'i18next';
+
 import { id } from './id.js';
-import initToolGroups from './initToolGroups.js';
+import initToolGroups, { toolGroupIds } from './initToolGroups.js';
 import setCrosshairsConfiguration from './utils/setCrosshairsConfiguration.js';
 import setFusionActiveVolume from './utils/setFusionActiveVolume.js';
-import i18n from 'i18next';
 
 const { MetadataProvider } = classes;
 
-const ohif = {
+export const ohif = {
   layout: '@ohif/extension-default.layoutTemplateModule.viewerLayout',
   sopClassHandler: '@ohif/extension-default.sopClassHandlerModule.stack',
   thumbnailList: '@ohif/extension-default.panelModule.seriesList',
 };
 
-const cs3d = {
+export const cs3d = {
   viewport: '@ohif/extension-cornerstone.viewportModule.cornerstone',
   segPanel: '@ohif/extension-cornerstone.panelModule.panelSegmentationNoHeader',
   measurements: '@ohif/extension-cornerstone.panelModule.measurements',
 };
 
-const tmtv = {
+export const tmtv = {
   hangingProtocol: '@ohif/extension-tmtv.hangingProtocolModule.ptCT',
   petSUV: '@ohif/extension-tmtv.panelModule.petSUV',
   tmtv: '@ohif/extension-tmtv.panelModule.tmtv',
 };
 
-const extensionDependencies = {
+export const extensionDependencies = {
   // Can derive the versions at least process.env.from npm_package_version
   '@ohif/extension-default': '^3.0.0',
   '@ohif/extension-cornerstone': '^3.0.0',
@@ -34,234 +41,187 @@ const extensionDependencies = {
   '@ohif/extension-tmtv': '^3.0.0',
 };
 
-const unsubscriptions = [];
-function modeFactory({ modeConfiguration }) {
-  return {
-    // TODO: We're using this as a route segment
-    // We should not be.
-    id,
-    routeName: 'tmtv',
-    displayName: i18n.t('Modes:Total Metabolic Tumor Volume'),
-    /**
-     * Lifecycle hooks
-     */
-    onModeEnter: ({ servicesManager, extensionManager, commandsManager }: withAppTypes) => {
-      const {
-        toolbarService,
-        toolGroupService,
-        customizationService,
-        hangingProtocolService,
-        displaySetService,
-      } = servicesManager.services;
+/**
+ * Extends the basic mode enter (tool groups, toolbar, tool group additions)
+ * with the TMTV specifics: the fusion viewport crosshairs/active-volume
+ * configuration and the PT VOI hanging protocol attribute.
+ */
+export function onModeEnter(ctx: withAppTypes) {
+  basicOnModeEnter.call(this, ctx);
 
-      const utilityModule = extensionManager.getModuleEntry(
-        '@ohif/extension-cornerstone.utilityModule.tools'
-      );
+  const { servicesManager, extensionManager, commandsManager } = ctx;
+  const { toolGroupService, customizationService, hangingProtocolService, displaySetService } =
+    servicesManager.services;
 
-      const { toolNames, Enums } = utilityModule.exports;
+  const utilityModule = extensionManager.getModuleEntry(
+    '@ohif/extension-cornerstone.utilityModule.tools'
+  );
 
-      // Init Default and SR ToolGroups
-      initToolGroups(toolNames, Enums, toolGroupService, commandsManager);
+  const { toolNames } = utilityModule.exports;
 
-      const { unsubscribe } = toolGroupService.subscribe(
-        toolGroupService.EVENTS.VIEWPORT_ADDED,
-        () => {
-          // For fusion toolGroup we need to add the volumeIds for the crosshairs
-          // since in the fusion viewport we don't want both PT and CT to render MIP
-          // when slabThickness is modified
-          const { displaySetMatchDetails } = hangingProtocolService.getMatchDetails();
+  const { unsubscribe } = toolGroupService.subscribe(toolGroupService.EVENTS.VIEWPORT_ADDED, () => {
+    // For fusion toolGroup we need to add the volumeIds for the crosshairs
+    // since in the fusion viewport we don't want both PT and CT to render MIP
+    // when slabThickness is modified
+    const { displaySetMatchDetails } = hangingProtocolService.getMatchDetails();
 
-          setCrosshairsConfiguration(
-            displaySetMatchDetails,
-            toolNames,
-            toolGroupService,
-            displaySetService
-          );
+    setCrosshairsConfiguration(
+      displaySetMatchDetails,
+      toolNames,
+      toolGroupService,
+      displaySetService
+    );
 
-          setFusionActiveVolume(
-            displaySetMatchDetails,
-            toolNames,
-            toolGroupService,
-            displaySetService
-          );
-        }
-      );
+    setFusionActiveVolume(displaySetMatchDetails, toolNames, toolGroupService, displaySetService);
+  });
 
-      unsubscriptions.push(unsubscribe);
-      toolbarService.register(toolbarButtons);
-      toolbarService.updateSection(toolbarService.sections.primary, [
-        'MeasurementTools',
-        'Zoom',
-        'Pan',
-        'WindowLevel',
-        'Crosshairs',
-      ]);
+  this._unsubscriptions.push(unsubscribe);
 
-      toolbarService.updateSection(toolbarService.sections.viewportActionMenu.topLeft, [
-        'orientationMenu',
-        'dataOverlayMenu',
-      ]);
-
-      toolbarService.updateSection(toolbarService.sections.viewportActionMenu.bottomMiddle, [
-        'AdvancedRenderingControls',
-      ]);
-
-      toolbarService.updateSection('AdvancedRenderingControls', [
-        'windowLevelMenuEmbedded',
-        'voiManualControlMenu',
-        'Colorbar',
-        'opacityMenu',
-        'thresholdMenu',
-      ]);
-
-      toolbarService.updateSection(toolbarService.sections.viewportActionMenu.topRight, [
-        'modalityLoadBadge',
-        'trackingStatus',
-        'navigationComponent',
-      ]);
-
-      toolbarService.updateSection(toolbarService.sections.viewportActionMenu.bottomLeft, [
-        'windowLevelMenu',
-      ]);
-
-      toolbarService.updateSection('MeasurementTools', [
-        'Length',
-        'Bidirectional',
-        'ArrowAnnotate',
-        'EllipticalROI',
-      ]);
-
-      toolbarService.updateSection('ROIThresholdToolbox', ['SegmentationTools']);
-      toolbarService.updateSection('SegmentationTools', [
-        'RectangleROIStartEndThreshold',
-        'BrushTools',
-      ]);
-
-      toolbarService.updateSection('BrushTools', ['Brush', 'Eraser', 'Threshold']);
-
-      customizationService.setCustomizations({
-        'panelSegmentation.tableMode': {
-          $set: 'expanded',
-        },
-        'panelSegmentation.onSegmentationAdd': {
-          $set: () => {
-            commandsManager.run('createNewLabelmapFromPT');
-          },
-        },
-      });
-
-      // For the hanging protocol we need to decide on the window level
-      // based on whether the SUV is corrected or not, hence we can't hard
-      // code the window level in the hanging protocol but we add a custom
-      // attribute to the hanging protocol that will be used to get the
-      // window level based on the metadata
-      hangingProtocolService.addCustomAttribute(
-        'getPTVOIRange',
-        'get PT VOI based on corrected or not',
-        props => {
-          const ptDisplaySet = props.find(imageSet => imageSet.Modality === 'PT');
-
-          if (!ptDisplaySet) {
-            return;
-          }
-
-          const { imageId } = ptDisplaySet.images[0];
-          const imageIdScalingFactor = MetadataProvider.get('scalingModule', imageId);
-
-          const isSUVAvailable = imageIdScalingFactor && imageIdScalingFactor.suvbw;
-
-          if (isSUVAvailable) {
-            return {
-              windowWidth: 5,
-              windowCenter: 2.5,
-            };
-          }
-
-          return;
-        }
-      );
-    },
-    onModeExit: ({ servicesManager }: withAppTypes) => {
-      const {
-        toolGroupService,
-        syncGroupService,
-        segmentationService,
-        cornerstoneViewportService,
-        uiDialogService,
-        uiModalService,
-      } = servicesManager.services;
-
-      unsubscriptions.forEach(unsubscribe => unsubscribe());
-      uiDialogService.hideAll();
-      uiModalService.hide();
-      toolGroupService.destroy();
-      syncGroupService.destroy();
-      segmentationService.destroy();
-      cornerstoneViewportService.destroy();
-    },
-    validationTags: {
-      study: [],
-      series: [],
-    },
-    isValidMode: ({ modalities, study }) => {
-      const modalities_list = modalities.split('\\');
-      const invalidModalities = ['SM'];
-
-      const isValid =
-        modalities_list.includes('CT') &&
-        study.mrn !== 'M1' &&
-        modalities_list.includes('PT') &&
-        !invalidModalities.some(modality => modalities_list.includes(modality)) &&
-        // This is study is a 4D study with PT and CT and not a 3D study for the tmtv
-        // mode, until we have a better way to identify 4D studies we will use the
-        // StudyInstanceUID to identify the study
-        // Todo: when we add the 4D mode which comes with a mechanism to identify
-        // 4D studies we can use that
-        study.studyInstanceUid !== '1.3.6.1.4.1.12842.1.1.14.3.20220915.105557.468.2963630849';
-
-      // there should be both CT and PT modalities and the modality should not be SM
-      return {
-        valid: isValid,
-        description: 'The mode requires both PT and CT series in the study',
-      };
-    },
-    routes: [
-      {
-        path: 'tmtv',
-        /*init: ({ servicesManager, extensionManager }) => {
-          //defaultViewerRouteInit
-        },*/
-        layoutTemplate: () => {
-          return {
-            id: ohif.layout,
-            props: {
-              leftPanels: [ohif.thumbnailList],
-              leftPanelResizable: true,
-              leftPanelClosed: true,
-              rightPanels: [tmtv.tmtv, tmtv.petSUV],
-              rightPanelResizable: true,
-              viewports: [
-                {
-                  namespace: cs3d.viewport,
-                  displaySetsToDisplay: [ohif.sopClassHandler],
-                },
-              ],
-            },
-          };
-        },
+  // Function-valued customization; kept out of the registered
+  // `tmtvModeCustomizations` block because it needs the mode's
+  // commandsManager.  Written at mode scope, so a global-scope customization
+  // still overrides it by scope precedence.
+  customizationService.setCustomizations({
+    'panelSegmentation.onSegmentationAdd': {
+      $set: () => {
+        commandsManager.run('createNewLabelmapFromPT');
       },
-    ],
-    extensions: extensionDependencies,
-    hangingProtocol: tmtv.hangingProtocol,
-    sopClassHandlers: [ohif.sopClassHandler],
-    ...modeConfiguration,
-  };
+    },
+  });
+
+  // For the hanging protocol we need to decide on the window level
+  // based on whether the SUV is corrected or not, hence we can't hard
+  // code the window level in the hanging protocol but we add a custom
+  // attribute to the hanging protocol that will be used to get the
+  // window level based on the metadata
+  hangingProtocolService.addCustomAttribute(
+    'getPTVOIRange',
+    'get PT VOI based on corrected or not',
+    props => {
+      const ptDisplaySet = props.find(imageSet => imageSet.Modality === 'PT');
+
+      if (!ptDisplaySet) {
+        return;
+      }
+
+      const { imageId } = ptDisplaySet.images[0];
+      const imageIdScalingFactor = MetadataProvider.get('scalingModule', imageId);
+
+      const isSUVAvailable = imageIdScalingFactor && imageIdScalingFactor.suvbw;
+
+      if (isSUVAvailable) {
+        return {
+          windowWidth: 5,
+          windowCenter: 2.5,
+        };
+      }
+
+      return;
+    }
+  );
 }
 
+export const tmtvLayout = {
+  id: ohif.layout,
+  props: {
+    // Literal panel lists; the mode route seeds them into the standard
+    // `leftPanels` / `rightPanels` customizations so `mode` phase
+    // blocks and global customizations can modify them.
+    leftPanels: [ohif.thumbnailList],
+    leftPanelResizable: true,
+    leftPanelClosed: true,
+    rightPanels: [tmtv.tmtv, tmtv.petSUV],
+    rightPanelResizable: true,
+    viewports: [
+      {
+        namespace: cs3d.viewport,
+        displaySetsToDisplay: [ohif.sopClassHandler],
+      },
+    ],
+  },
+};
+
+export const tmtvRoute = {
+  path: 'tmtv',
+  layoutTemplate,
+  layoutInstance: tmtvLayout,
+};
+
+export const modeInstance = {
+  // TODO: We're using this as a route segment
+  // We should not be.
+  id,
+  routeName: 'tmtv',
+  displayName: i18n.t('Modes:Total Metabolic Tumor Volume'),
+  // Toolbar/tool-group composition: which capability packs this mode uses.
+  // The mode route seeds these onto the Mode customization scope on enter, so
+  // `?customization=` modules extend them through the `mode` phase. The tmtv
+  // extension supplies the TMTV-specific button/section packs.
+  toolbarButtons: [{ $reference: 'tmtv.toolbarButtons' }],
+  toolbarSections: [{ $reference: 'tmtv.toolbarSections' }],
+  toolGroupAdditions: {
+    [toolGroupIds.CT]: [],
+    [toolGroupIds.PT]: [],
+    [toolGroupIds.Fusion]: [],
+    [toolGroupIds.MIP]: [],
+    [toolGroupIds.default]: [],
+  },
+  // Tool group setup used by onModeEnter; extending modes can replace it.
+  initToolGroups,
+  // The mode's own customizations, referenced by name: the block is registered
+  // at default scope when the mode loads (see `customizations` below), and the
+  // mode route applies it as the bottom layer of the mode scope on enter.
+  modeCustomizations: 'tmtvModeCustomizations',
+  activatePanelTriggers: [],
+
+  /**
+   * Lifecycle hooks
+   */
+  onModeEnter,
+  onModeExit,
+  validationTags: {
+    study: [],
+    series: [],
+  },
+  // Data-driven validity: requires both PT and CT, rejects SM, and excludes
+  // the demo studies that belong to the preclinical 4D mode.  Until we have a
+  // better way to identify 4D studies we use the mrn/StudyInstanceUID.
+  isValidMode,
+  modeModalities: [['PT', 'CT']],
+  excludedModalities: ['SM'],
+  excludedStudies: [
+    { mrn: 'M1' },
+    { studyInstanceUid: '1.3.6.1.4.1.12842.1.1.14.3.20220915.105557.468.2963630849' },
+  ],
+  routes: [tmtvRoute],
+  extensions: extensionDependencies,
+  hangingProtocol: tmtv.hangingProtocol,
+  sopClassHandlers: [ohif.sopClassHandler],
+};
+
+/**
+ * Customizations the mode registers (Default scope) when it loads — before
+ * the bootstrap phase applies, so bootstrap / `?customization=` modules can
+ * modify them before anything reads them.  Values are plain data.
+ */
+export const customizations = {
+  tmtvModeCustomizations: {
+    'panelSegmentation.tableMode': 'expanded',
+  },
+};
+
+/**
+ * The mode uses the basic mode's `modeFactory`, which applies
+ * immutability-helper commands from `modeConfiguration` onto `modeInstance`,
+ * so a site can define a mode that extends this one.
+ */
 const mode = {
   id,
   modeFactory,
+  modeInstance,
   extensionDependencies,
+  customizations,
 };
 
 export default mode;
+export { initToolGroups };

modes/tmtv/src/initToolGroups.js

@@ -1,12 +1,8 @@
+import { toolGroupIds } from '@ohif/extension-tmtv';
+
 import { MIN_SEGMENTATION_DRAWING_RADIUS, MAX_SEGMENTATION_DRAWING_RADIUS } from './constants';
 
-export const toolGroupIds = {
-  CT: 'ctToolGroup',
-  PT: 'ptToolGroup',
-  Fusion: 'fusionToolGroup',
-  MIP: 'mipToolGroup',
-  default: 'default',
-};
+export { toolGroupIds };
 
 function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager) {
   const tools = {
@@ -189,7 +185,16 @@ function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager) {
   toolGroupService.createToolGroupAndAddTools(toolGroupIds.MIP, mipTools);
 }
 
-function initToolGroups(toolNames, Enums, toolGroupService, commandsManager) {
+/**
+ * Mode tool group setup, sharing the options-object signature used by all
+ * modes so implementations are interchangeable via the `initToolGroups` mode
+ * instance property.
+ */
+function initToolGroups({ extensionManager, toolGroupService, commandsManager }) {
+  const utilityModule = extensionManager.getModuleEntry(
+    '@ohif/extension-cornerstone.utilityModule.tools'
+  );
+  const { toolNames, Enums } = utilityModule.exports;
   _initToolGroups(toolNames, Enums, toolGroupService, commandsManager);
 }
 

modes/tmtv/src/toolbarButtons.ts

@@ -1,461 +0,0 @@
-import { toolGroupIds } from './initToolGroups';
-import i18n from 'i18next';
-
-import { MIN_SEGMENTATION_DRAWING_RADIUS, MAX_SEGMENTATION_DRAWING_RADIUS } from './constants';
-
-const setToolActiveToolbar = {
-  commandName: 'setToolActiveToolbar',
-  commandOptions: {
-    toolGroupIds: [toolGroupIds.CT, toolGroupIds.PT, toolGroupIds.Fusion],
-  },
-};
-
-const toolbarButtons = [
-  {
-    id: 'MeasurementTools',
-    uiType: 'ohif.toolButtonList',
-    props: {
-      buttonSection: true,
-    },
-  },
-  {
-    id: 'SegmentationTools',
-    uiType: 'ohif.toolBoxButton',
-    props: {
-      buttonSection: true,
-    },
-  },
-  {
-    id: 'BrushTools',
-    uiType: 'ohif.toolBoxButtonGroup',
-    props: {
-      buttonSection: true,
-    },
-  },
-  {
-    id: 'AdvancedRenderingControls',
-    uiType: 'ohif.advancedRenderingControls',
-    props: {
-      buttonSection: true,
-    },
-  },
-  {
-    id: 'modalityLoadBadge',
-    uiType: 'ohif.modalityLoadBadge',
-    props: {
-      icon: 'Status',
-      label: i18n.t('Buttons:Status'),
-      tooltip: i18n.t('Buttons:Status'),
-      evaluate: {
-        name: 'evaluate.modalityLoadBadge',
-        hideWhenDisabled: true,
-      },
-    },
-  },
-  {
-    id: 'Colorbar',
-    uiType: 'ohif.colorbar',
-    props: {
-      type: 'tool',
-      label: i18n.t('Buttons:Colorbar'),
-    },
-  },
-  {
-    id: 'navigationComponent',
-    uiType: 'ohif.navigationComponent',
-    props: {
-      icon: 'Navigation',
-      label: i18n.t('Buttons:Navigation'),
-      tooltip: i18n.t('Buttons:Navigate between segments/measurements and manage their visibility'),
-      evaluate: {
-        name: 'evaluate.navigationComponent',
-        hideWhenDisabled: true,
-      },
-    },
-  },
-  {
-    id: 'windowLevelMenuEmbedded',
-    uiType: 'ohif.windowLevelMenuEmbedded',
-    props: {
-      icon: 'WindowLevel',
-      label: i18n.t('Buttons:Window Level'),
-      tooltip: i18n.t('Buttons:Adjust window/level presets and customize image contrast settings'),
-      evaluate: {
-        name: 'evaluate.windowLevelMenuEmbedded',
-        hideWhenDisabled: true,
-      },
-    },
-  },
-  {
-    id: 'trackingStatus',
-    uiType: 'ohif.trackingStatus',
-    props: {
-      icon: 'TrackingStatus',
-      label: i18n.t('Buttons:Tracking Status'),
-      tooltip: i18n.t('Buttons:View and manage tracking status of measurements and annotations'),
-      evaluate: {
-        name: 'evaluate.trackingStatus',
-        hideWhenDisabled: true,
-      },
-    },
-  },
-  {
-    id: 'Length',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'tool-length',
-      label: i18n.t('Buttons:Length'),
-      tooltip: i18n.t('Buttons:Length Tool'),
-      commands: setToolActiveToolbar,
-      evaluate: 'evaluate.cornerstoneTool',
-    },
-  },
-  {
-    id: 'Bidirectional',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'tool-bidirectional',
-      label: i18n.t('Buttons:Bidirectional'),
-      tooltip: i18n.t('Buttons:Bidirectional Tool'),
-      commands: setToolActiveToolbar,
-      evaluate: 'evaluate.cornerstoneTool',
-    },
-  },
-  {
-    id: 'ArrowAnnotate',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'tool-annotate',
-      label: i18n.t('Buttons:Arrow Annotate'),
-      tooltip: i18n.t('Buttons:Arrow Annotate Tool'),
-      commands: setToolActiveToolbar,
-      evaluate: 'evaluate.cornerstoneTool',
-    },
-  },
-  {
-    id: 'EllipticalROI',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'tool-ellipse',
-      label: i18n.t('Buttons:Ellipse'),
-      tooltip: i18n.t('Buttons:Ellipse Tool'),
-      commands: setToolActiveToolbar,
-      evaluate: 'evaluate.cornerstoneTool',
-    },
-  },
-  {
-    id: 'Zoom',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'tool-zoom',
-      label: i18n.t('Buttons:Zoom'),
-      commands: setToolActiveToolbar,
-      evaluate: 'evaluate.cornerstoneTool',
-    },
-  },
-  {
-    id: 'WindowLevel',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'tool-window-level',
-      label: i18n.t('Buttons:Window Level'),
-      commands: setToolActiveToolbar,
-      evaluate: 'evaluate.cornerstoneTool',
-    },
-  },
-  {
-    id: 'Crosshairs',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'tool-crosshair',
-      label: i18n.t('Buttons:Crosshairs'),
-      commands: setToolActiveToolbar,
-      evaluate: 'evaluate.cornerstoneTool',
-    },
-  },
-  {
-    id: 'Pan',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'tool-move',
-      label: i18n.t('Buttons:Pan'),
-      commands: setToolActiveToolbar,
-      evaluate: 'evaluate.cornerstoneTool',
-    },
-  },
-  {
-    id: 'RectangleROIStartEndThreshold',
-    uiType: 'ohif.toolBoxButton',
-    props: {
-      icon: 'tool-create-threshold',
-      label: i18n.t('Buttons:Rectangle ROI Threshold'),
-      commands: setToolActiveToolbar,
-      evaluate: [
-        'evaluate.cornerstone.segmentation',
-        {
-          name: 'evaluate.cornerstoneTool',
-          disabledText: i18n.t('Buttons:Select the PT Axial to enable this tool'),
-        },
-      ],
-      options: 'tmtv.RectangleROIThresholdOptions',
-    },
-  },
-
-  {
-    id: 'Brush',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'icon-tool-brush',
-      label: i18n.t('Buttons:Brush'),
-      evaluate: [
-        {
-          name: 'evaluate.cornerstone.segmentation',
-          toolNames: ['CircularBrush', 'SphereBrush'],
-          disabledText: i18n.t('Buttons:Create new segmentation to enable this tool.'),
-        },
-        {
-          name: 'evaluate.cornerstone.segmentation.synchronizeDrawingRadius',
-          radiusOptionId: 'brush-radius',
-        },
-      ],
-      options: [
-        {
-          name: i18n.t('Buttons:Radius (mm)'),
-          id: 'brush-radius',
-          type: 'range',
-          explicitRunOnly: true,
-          min: MIN_SEGMENTATION_DRAWING_RADIUS,
-          max: MAX_SEGMENTATION_DRAWING_RADIUS,
-          step: 0.5,
-          value: 25,
-          commands: {
-            commandName: 'setBrushSize',
-            commandOptions: { toolNames: ['CircularBrush', 'SphereBrush'] },
-          },
-        },
-        {
-          name: i18n.t('Buttons:Shape'),
-          type: 'radio',
-          id: 'brush-mode',
-          value: 'CircularBrush',
-          values: [
-            { value: 'CircularBrush', label: i18n.t('Buttons:Circle') },
-            { value: 'SphereBrush', label: i18n.t('Buttons:Sphere') },
-          ],
-          commands: 'setToolActiveToolbar',
-        },
-      ],
-    },
-  },
-  {
-    id: 'Eraser',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'icon-tool-eraser',
-      label: i18n.t('Buttons:Eraser'),
-      evaluate: [
-        {
-          name: 'evaluate.cornerstone.segmentation',
-          toolNames: ['CircularEraser', 'SphereEraser'],
-        },
-        {
-          name: 'evaluate.cornerstone.segmentation.synchronizeDrawingRadius',
-          radiusOptionId: 'eraser-radius',
-        },
-      ],
-      options: [
-        {
-          name: i18n.t('Buttons:Radius (mm)'),
-          id: 'eraser-radius',
-          type: 'range',
-          explicitRunOnly: true,
-          min: MIN_SEGMENTATION_DRAWING_RADIUS,
-          max: MAX_SEGMENTATION_DRAWING_RADIUS,
-          step: 0.5,
-          value: 25,
-          commands: {
-            commandName: 'setBrushSize',
-            commandOptions: { toolNames: ['CircularEraser', 'SphereEraser'] },
-          },
-        },
-        {
-          name: i18n.t('Buttons:Shape'),
-          type: 'radio',
-          id: 'eraser-mode',
-          value: 'CircularEraser',
-          values: [
-            { value: 'CircularEraser', label: i18n.t('Buttons:Circle') },
-            { value: 'SphereEraser', label: i18n.t('Buttons:Sphere') },
-          ],
-          commands: 'setToolActiveToolbar',
-        },
-      ],
-    },
-  },
-  {
-    id: 'Threshold',
-    uiType: 'ohif.toolButton',
-    props: {
-      icon: 'icon-tool-threshold',
-      label: i18n.t('Buttons:Threshold Tool'),
-      evaluate: [
-        {
-          name: 'evaluate.cornerstone.segmentation',
-          toolNames: ['ThresholdCircularBrush', 'ThresholdSphereBrush', 'ThresholdCircularBrushDynamic'],
-        },
-        {
-          name: 'evaluate.cornerstone.segmentation.synchronizeDrawingRadius',
-          radiusOptionId: 'threshold-radius',
-        },
-      ],
-      options: [
-        {
-          name: i18n.t('Buttons:Radius (mm)'),
-          id: 'threshold-radius',
-          type: 'range',
-          explicitRunOnly: true,
-          min: MIN_SEGMENTATION_DRAWING_RADIUS,
-          max: MAX_SEGMENTATION_DRAWING_RADIUS,
-          step: 0.5,
-          value: 25,
-          commands: {
-            commandName: 'setBrushSize',
-            commandOptions: {
-              toolNames: [
-                'ThresholdCircularBrush',
-                'ThresholdSphereBrush',
-                'ThresholdCircularBrushDynamic',
-              ],
-            },
-          },
-        },
-        {
-          name: i18n.t('Buttons:Threshold'),
-          type: 'radio',
-          id: 'dynamic-mode',
-          value: 'ThresholdRange',
-          values: [
-            { value: 'ThresholdDynamic', label: i18n.t('Buttons:Dynamic') },
-            { value: 'ThresholdRange', label: i18n.t('Buttons:Range') },
-          ],
-          commands: ({ value, commandsManager }) => {
-            if (value === 'ThresholdDynamic') {
-              commandsManager.run('setToolActive', {
-                toolName: 'ThresholdCircularBrushDynamic',
-              });
-            } else {
-              commandsManager.run('setToolActive', {
-                toolName: 'ThresholdCircularBrush',
-              });
-            }
-          },
-        },
-        {
-          name: i18n.t('Buttons:Shape'),
-          type: 'radio',
-          id: 'eraser-mode',
-          value: 'ThresholdCircularBrush',
-          values: [
-            { value: 'ThresholdCircularBrush', label: i18n.t('Buttons:Circle') },
-            { value: 'ThresholdSphereBrush', label: i18n.t('Buttons:Sphere') },
-          ],
-          condition: ({ options }) =>
-            options.find(option => option.id === 'dynamic-mode').value === 'ThresholdRange',
-          commands: 'setToolActiveToolbar',
-        },
-        {
-          name: i18n.t('ROIThresholdConfiguration:ThresholdRange'),
-          type: 'double-range',
-          id: 'threshold-range',
-          min: 0,
-          max: 50,
-          step: 0.5,
-          value: [2.5, 50],
-          condition: ({ options }) =>
-            options.find(option => option.id === 'dynamic-mode').value === 'ThresholdRange',
-          commands: {
-            commandName: 'setThresholdRange',
-            commandOptions: {
-              toolNames: ['ThresholdCircularBrush', 'ThresholdSphereBrush'],
-            },
-          },
-        },
-      ],
-    },
-  },
-  {
-    id: 'dataOverlayMenu',
-    uiType: 'ohif.dataOverlayMenu',
-    props: {
-      icon: 'ViewportViews',
-      label: i18n.t('Buttons:Data Overlay'),
-      tooltip: i18n.t(
-        'Buttons:Configure data overlay options and manage foreground/background display sets'
-      ),
-      evaluate: 'evaluate.dataOverlayMenu',
-    },
-  },
-  {
-    id: 'orientationMenu',
-    uiType: 'ohif.orientationMenu',
-    props: {
-      icon: 'OrientationSwitch',
-      label: i18n.t('Buttons:Orientation'),
-      tooltip: i18n.t(
-        'Buttons:Change viewport orientation between axial, sagittal, coronal and reformat planes'
-      ),
-      evaluate: {
-        name: 'evaluate.orientationMenu',
-        // hideWhenDisabled: true,
-      },
-    },
-  },
-  {
-    id: 'windowLevelMenu',
-    uiType: 'ohif.windowLevelMenu',
-    props: {
-      icon: 'WindowLevel',
-      label: i18n.t('Buttons:Window Level'),
-      tooltip: i18n.t('Buttons:Adjust window/level presets and customize image contrast settings'),
-      evaluate: 'evaluate.windowLevelMenu',
-    },
-  },
-  {
-    id: 'voiManualControlMenu',
-    uiType: 'ohif.voiManualControlMenu',
-    props: {
-      icon: 'WindowLevelAdvanced',
-      label: i18n.t('Buttons:Advanced Window Level'),
-      tooltip: i18n.t('Buttons:Advanced window/level settings with manual controls and presets'),
-      evaluate: 'evaluate.voiManualControlMenu',
-    },
-  },
-  {
-    id: 'thresholdMenu',
-    uiType: 'ohif.thresholdMenu',
-    props: {
-      icon: 'Threshold',
-      label: i18n.t('Buttons:Threshold'),
-      tooltip: i18n.t('Buttons:Image threshold settings'),
-      evaluate: {
-        name: 'evaluate.thresholdMenu',
-        hideWhenDisabled: true,
-      },
-    },
-  },
-  {
-    id: 'opacityMenu',
-    uiType: 'ohif.opacityMenu',
-    props: {
-      icon: 'Opacity',
-      label: i18n.t('Buttons:Opacity'),
-      tooltip: i18n.t('Buttons:Image opacity settings'),
-      evaluate: {
-        name: 'evaluate.opacityMenu',
-        hideWhenDisabled: true,
-      },
-    },
-  },
-];
-
-export default toolbarButtons;