Revert "feat: Add extensibility for tmtv and segmentation modes"

This reverts commit 84c7d17b13.

modes/basic/src/index.tsx

@@ -2,11 +2,6 @@ import update from 'immutability-helper';
 import { utils } from '@ohif/core';
 
 import initToolGroups from './initToolGroups';
-import {
-  applyToolGroupAdditions,
-  registerModeToolbar,
-  resolvePanelList,
-} from './modeCustomization';
 import { id } from './id';
 
 const { structuredCloneWithFunctions } = utils;
@@ -133,38 +128,41 @@ export function isValidMode({ modalities }) {
   };
 }
 
-export function onModeEnter({ servicesManager, extensionManager, commandsManager }: withAppTypes) {
-  const {
-    measurementService,
-    toolbarService,
-    toolGroupService,
-    customizationService,
-    panelService,
-    segmentationService,
-  } = servicesManager.services;
+export function onModeEnter({
+  servicesManager,
+  extensionManager,
+  commandsManager,
+  panelService,
+  segmentationService,
+}: withAppTypes) {
+  const { measurementService, toolbarService, toolGroupService, customizationService } =
+    servicesManager.services;
 
   measurementService.clearMeasurements();
 
-  // Init the mode's tool groups.  The function is a mode instance property so
-  // extending modes can substitute their own tool group setup.
-  this.initToolGroups?.(extensionManager, toolGroupService, commandsManager);
+  // Init Default and SR ToolGroups
+  initToolGroups(extensionManager, toolGroupService, commandsManager);
 
-  // Toolbar buttons and layout are supplied as customization references
-  // (extensions register the defaults; `?customization=` modules can extend
-  // them) or as literal values for modes that define them inline.
-  registerModeToolbar({ toolbarService, customizationService }, this);
+  // Toolbar buttons and layout may be supplied either as a customization name
+  // (a string, resolved through the customization service so `?customization=`
+  // modules can extend the cornerstone-registered defaults) or as a literal
+  // value (the button array / sections object) for modes that define them inline.
+  const resolveToolbarCustomization = (value: unknown) =>
+    typeof value === 'string' ? customizationService.getCustomization(value) : value;
 
-  // Extra tools (e.g. segmentation editing tools added by a customization)
-  // are layered onto the tool groups created above.
-  applyToolGroupAdditions({ toolGroupService, customizationService }, this.toolGroupAdditions);
+  const toolbarButtons = resolveToolbarCustomization(this.toolbarButtons) as any;
+  const toolbarSections = (resolveToolbarCustomization(this.toolbarSections) ?? {}) as Record<
+    string,
+    string[]
+  >;
 
-  // Segmentation panel editing is disabled by default in this mode, but only
-  // when no global/mode customization has expressed a preference — a site
-  // customization (e.g. `segmentationEditing`) can enable it.
-  if (
-    !this.enableSegmentationEdit &&
-    !customizationService.hasCustomization('panelSegmentation.disableEditing')
-  ) {
+  toolbarService.register(toolbarButtons);
+
+  for (const [key, section] of Object.entries(toolbarSections)) {
+    toolbarService.updateSection(key, section);
+  }
+
+  if (!this.enableSegmentationEdit) {
     customizationService.setCustomizations({
       'panelSegmentation.disableEditing': {
         $set: true,
@@ -228,12 +226,9 @@ export function onModeExit({ servicesManager }: withAppTypes) {
 export const basicLayout = {
   id: ohif.layout,
   props: {
-    // Panel lists are customization names; the cornerstone extension registers
-    // the defaults and `?customization=` modules can replace them (e.g. to
-    // swap in the segmentation panels with editing tools).
-    leftPanels: 'basic.leftPanels',
+    leftPanels: [ohif.thumbnailList],
     leftPanelResizable: true,
-    rightPanels: 'basic.rightPanels',
+    rightPanels: [cornerstone.segmentation, cornerstone.measurements],
     rightPanelClosed: true,
     rightPanelResizable: true,
     viewports: [
@@ -270,15 +265,8 @@ export const basicLayout = {
   },
 };
 
-export function layoutTemplate({ servicesManager }: withAppTypes = {} as withAppTypes) {
-  const layout = structuredCloneWithFunctions(this.layoutInstance);
-  const customizationService = servicesManager?.services?.customizationService;
-  if (customizationService) {
-    const { props } = layout;
-    props.leftPanels = resolvePanelList(customizationService, props.leftPanels);
-    props.rightPanels = resolvePanelList(customizationService, props.rightPanels);
-  }
-  return layout;
+export function layoutTemplate() {
+  return structuredCloneWithFunctions(this.layoutInstance);
 }
 
 export const basicRoute = {
@@ -297,14 +285,10 @@ export const modeInstance = {
   hide: false,
   displayName: 'Non-Longitudinal Basic',
   _activatePanelTriggersSubscriptions: [],
-  // Toolbar buttons/layout and tool group additions are referenced by
-  // customization name; the cornerstone extension registers the defaults and
-  // `?customization=` modules can extend them. onModeEnter resolves these
-  // names via the customization service.
-  toolbarSections: 'basic.toolbarSections',
-  toolGroupAdditions: 'basic.toolGroupAdditions',
-  // Tool group setup used by onModeEnter; extending modes can replace it.
-  initToolGroups,
+  // Toolbar buttons and layout are referenced by customization name; the
+  // cornerstone extension registers the defaults and `?customization=` modules
+  // can extend them. onModeEnter resolves these names via the customization service.
+  toolbarSections: 'cornerstone.toolbarSections',
 
   /**
    * Lifecycle hooks
@@ -326,7 +310,7 @@ export const modeInstance = {
   // general handler needs to come last.  For this case, the dicomvideo must
   // come first to remove video transfer syntax before ohif uses images
   sopClassHandlers,
-  toolbarButtons: 'basic.toolbarButtons',
+  toolbarButtons: 'cornerstone.toolbarButtons',
   enableSegmentationEdit: false,
   nonModeModalities: NON_IMAGE_MODALITIES,
 };
@@ -352,9 +336,3 @@ export const mode = {
 
 export default mode;
 export { initToolGroups };
-export {
-  applyToolGroupAdditions,
-  registerModeToolbar,
-  resolveCustomizationList,
-  resolvePanelList,
-} from './modeCustomization';

modes/basic/src/modeCustomization.ts

@@ -1,124 +0,0 @@
-/**
- * Helpers for resolving mode configuration (toolbar buttons, toolbar sections,
- * tool group additions and panel lists) through the customization service.
- *
- * The pattern: extensions register the default values as named customizations
- * (at Default scope), modes reference those values by name, and site
- * `?customization=` JSON modules extend or replace the named values with
- * immutability-helper commands.  Wherever a list is resolved, a string entry is
- * treated as the name of another customization, so a JSON module can add a
- * whole capability block that an extension exports (for example
- * `$push: ['cornerstone.segmentationToolbarButtons']`) without having to
- * restate its contents.
- */
-
-/**
- * Resolves a customization list value into a flat array of concrete values.
- *
- * The input may be:
- *   - a string: the name of a customization to resolve (recursively)
- *   - an array: each entry resolved recursively (strings are names, objects
- *     are literal values)
- *   - an object: a literal value, returned as a single-element array
- *
- * Names are only resolved once per call (repeats and cycles are skipped), so a
- * capability block referenced from two places is applied a single time.
- */
-export function resolveCustomizationList(
-  customizationService: AppTypes.CustomizationService,
-  value: unknown,
-  _seen = new Set<string>()
-): any[] {
-  if (value === undefined || value === null) {
-    return [];
-  }
-  if (typeof value === 'string') {
-    if (_seen.has(value)) {
-      return [];
-    }
-    _seen.add(value);
-    const resolved = customizationService.getCustomization(value);
-    if (resolved === undefined) {
-      console.warn(`resolveCustomizationList: no customization registered for "${value}"`);
-      return [];
-    }
-    return resolveCustomizationList(customizationService, resolved, _seen);
-  }
-  if (Array.isArray(value)) {
-    return value.flatMap(entry => resolveCustomizationList(customizationService, entry, _seen));
-  }
-  return [value];
-}
-
-/**
- * Registers a mode's toolbar from customization references.
- *
- * `toolbarButtons` resolves to a flat list of button definitions which are
- * registered with the toolbar service.  `toolbarSections` resolves to one or
- * more `{ sectionKey: buttonIds[] }` objects which are shallow-merged in order
- * (later values win per section) and applied with `updateSection`.
- */
-export function registerModeToolbar(
-  { toolbarService, customizationService },
-  { toolbarButtons, toolbarSections }
-): void {
-  const buttons = resolveCustomizationList(customizationService, toolbarButtons);
-  toolbarService.register(buttons);
-
-  const sections: Record<string, string[]> = Object.assign(
-    {},
-    ...resolveCustomizationList(customizationService, toolbarSections)
-  );
-  for (const [key, section] of Object.entries(sections)) {
-    toolbarService.updateSection(key, section);
-  }
-}
-
-/**
- * Adds extra tools to the tool groups a mode has already created.
- *
- * `toolGroupAdditions` is (the name of) an object mapping a tool group id to a
- * list of tool blocks; each block is either a literal
- * `{ active/passive/enabled/disabled }` object or the name of a customization
- * holding one (for example `cornerstone.segmentationToolGroupTools`).  Tool
- * groups the mode did not create are skipped, so a single additions object can
- * be shared between modes with different tool group sets.
- */
-export function applyToolGroupAdditions(
-  { toolGroupService, customizationService },
-  toolGroupAdditions
-): void {
-  if (!toolGroupAdditions) {
-    return;
-  }
-  for (const additions of resolveCustomizationList(customizationService, toolGroupAdditions)) {
-    for (const [toolGroupId, toolBlocks] of Object.entries(additions)) {
-      if (!toolGroupService.getToolGroup(toolGroupId)) {
-        continue;
-      }
-      for (const tools of resolveCustomizationList(customizationService, toolBlocks)) {
-        toolGroupService.addToolsToToolGroup(toolGroupId, tools);
-      }
-    }
-  }
-}
-
-/**
- * Resolves a layout panel list.  Panel lists hold extension module ids (which
- * are themselves strings), so unlike the list helpers above only the top-level
- * value may be a customization name.
- */
-export function resolvePanelList(
-  customizationService: AppTypes.CustomizationService,
-  panels: string | string[]
-): string[] {
-  if (typeof panels !== 'string') {
-    return panels;
-  }
-  const resolved = customizationService.getCustomization(panels);
-  if (resolved === undefined) {
-    console.warn(`resolvePanelList: no customization registered for "${panels}"`);
-    return [];
-  }
-  return resolved as string[];
-}

modes/longitudinal/src/index.ts

@@ -1,6 +1,6 @@
 import i18n from 'i18next';
 import { id } from './id';
-import { initToolGroups,
+import { initToolGroups, cornerstone,
   ohif,
   dicomsr,
   dicomvideo,
@@ -28,10 +28,8 @@ export const longitudinalInstance = {
   id: ohif.layout,
   props: {
     ...basicLayout.props,
-    // Panel lists are customization names; the measurement-tracking extension
-    // registers the defaults and `?customization=` modules can replace them.
-    leftPanels: 'longitudinal.leftPanels',
-    rightPanels: 'longitudinal.rightPanels',
+    leftPanels: [tracked.thumbnailList],
+    rightPanels: [cornerstone.segmentation, tracked.measurements],
     viewports: [
       {
         namespace: tracked.viewport,

modes/segmentation/src/index.tsx

@@ -1,138 +1,249 @@
 import { id } from './id';
+import toolbarButtons from './toolbarButtons';
 import initToolGroups from './initToolGroups';
 import setUpAutoTabSwitchHandler from './utils/setUpAutoTabSwitchHandler';
-import {
-  ohif,
-  cornerstone,
-  extensionDependencies,
-  dicomRT,
-  segmentation,
-  onModeEnter as basicOnModeEnter,
-  onModeExit as basicOnModeExit,
-  layoutTemplate,
-  modeFactory,
-} from '@ohif/mode-basic';
+import { ohif, cornerstone, extensionDependencies, dicomRT, segmentation } from '@ohif/mode-basic';
+export * from './toolbarButtons';
 
-/**
- * Indicate this is a valid mode unless the studies ONLY contain modalities
- * that segmentation cannot be performed on.
- */
-export function isValidMode({ modalities }) {
-  const modalitiesArray = modalities.split('\\');
+function modeFactory({ modeConfiguration }) {
+  const _unsubscriptions = [];
   return {
-    valid:
-      modalitiesArray.length === 1 ? !['SM', 'ECG', 'OT', 'DOC'].includes(modalitiesArray[0]) : true,
-    description:
-      'The mode does not support studies that ONLY include the following modalities: SM, OT, DOC',
+    /**
+     * Mode ID, which should be unique among modes used by the viewer. This ID
+     * is used to identify the mode in the viewer's state.
+     */
+    id,
+    routeName: 'segmentation',
+    /**
+     * Mode name, which is displayed in the viewer's UI in the workList, for the
+     * user to select the mode.
+     */
+    displayName: 'Segmentation',
+    /**
+     * Runs when the Mode Route is mounted to the DOM. Usually used to initialize
+     * Services and other resources.
+     */
+    onModeEnter: ({ servicesManager, extensionManager, commandsManager }: withAppTypes) => {
+      const {
+        measurementService,
+        toolbarService,
+        toolGroupService,
+        segmentationService,
+        viewportGridService,
+        panelService,
+      } = servicesManager.services;
+
+      measurementService.clearMeasurements();
+
+      // Init Default and SR ToolGroups
+      initToolGroups(extensionManager, toolGroupService, commandsManager);
+
+      toolbarService.register(toolbarButtons);
+
+      toolbarService.updateSection(toolbarService.sections.primary, [
+        'WindowLevel',
+        'Pan',
+        'Zoom',
+        'TrackballRotate',
+        'Capture',
+        'Layout',
+        'Crosshairs',
+        'MoreTools',
+      ]);
+
+      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('MoreTools', [
+        'Reset',
+        'rotate-right',
+        'flipHorizontal',
+        'ReferenceLines',
+        'ImageOverlayViewer',
+        'StackScroll',
+        'invert',
+        'Cine',
+        'Magnify',
+        'TagBrowser',
+      ]);
+
+      toolbarService.updateSection(toolbarService.sections.labelMapSegmentationToolbox, [
+        'LabelMapTools',
+      ]);
+      toolbarService.updateSection(toolbarService.sections.contourSegmentationToolbox, [
+        'ContourTools',
+      ]);
+
+      toolbarService.updateSection('LabelMapTools', [
+        'LabelmapSlicePropagation',
+        'BrushTools',
+        'MarkerLabelmap',
+        'RegionSegmentPlus',
+        'Shapes',
+        'LabelMapEditWithContour',
+      ]);
+      toolbarService.updateSection('ContourTools', [
+        'PlanarFreehandContourSegmentationTool',
+        'SculptorTool',
+        'SplineContourSegmentationTool',
+        'LivewireContourSegmentationTool',
+      ]);
+
+      toolbarService.updateSection(toolbarService.sections.labelMapSegmentationUtilities, [
+        'LabelMapUtilities',
+      ]);
+      toolbarService.updateSection(toolbarService.sections.contourSegmentationUtilities, [
+        'ContourUtilities',
+      ]);
+
+      toolbarService.updateSection('LabelMapUtilities', [
+        'InterpolateLabelmap',
+        'SegmentBidirectional',
+      ]);
+      toolbarService.updateSection('ContourUtilities', [
+        'LogicalContourOperations',
+        'SimplifyContours',
+        'SmoothContours',
+      ]);
+
+      toolbarService.updateSection('BrushTools', ['Brush', 'Eraser', 'Threshold']);
+
+      const { unsubscribeAutoTabSwitchEvents } = setUpAutoTabSwitchHandler({
+        segmentationService,
+        viewportGridService,
+        panelService,
+      });
+
+      _unsubscriptions.push(...unsubscribeAutoTabSwitchEvents);
+    },
+    onModeExit: ({ servicesManager }: withAppTypes) => {
+      const {
+        toolGroupService,
+        syncGroupService,
+        segmentationService,
+        cornerstoneViewportService,
+        uiDialogService,
+        uiModalService,
+      } = servicesManager.services;
+
+      _unsubscriptions.forEach(unsubscribe => unsubscribe());
+      _unsubscriptions.length = 0;
+
+      uiDialogService.hideAll();
+      uiModalService.hide();
+      toolGroupService.destroy();
+      syncGroupService.destroy();
+      segmentationService.destroy();
+      cornerstoneViewportService.destroy();
+    },
+    /** */
+    validationTags: {
+      study: [],
+      series: [],
+    },
+    /**
+     * A boolean return value that indicates whether the mode is valid for the
+     * modalities of the selected studies. Currently we don't have stack viewport
+     * segmentations and we should exclude them
+     */
+    isValidMode: ({ modalities }) => {
+      // Don't show the mode if the selected studies have only one modality
+      // that is not supported by the mode
+      const modalitiesArray = modalities.split('\\');
+      return {
+        valid:
+          modalitiesArray.length === 1
+            ? !['SM', 'ECG', 'OT', 'DOC'].includes(modalitiesArray[0])
+            : true,
+        description:
+          'The mode does not support studies that ONLY include the following modalities: SM, OT, DOC',
+      };
+    },
+    /**
+     * Mode Routes are used to define the mode's behavior. A list of Mode Route
+     * that includes the mode's path and the layout to be used. The layout will
+     * include the components that are used in the layout. For instance, if the
+     * default layoutTemplate is used (id: '@ohif/extension-default.layoutTemplateModule.viewerLayout')
+     * it will include the leftPanels, rightPanels, and viewports. However, if
+     * you define another layoutTemplate that includes a Footer for instance,
+     * you should provide the Footer component here too. Note: We use Strings
+     * to reference the component's ID as they are registered in the internal
+     * ExtensionManager. The template for the string is:
+     * `${extensionId}.{moduleType}.${componentId}`.
+     */
+    routes: [
+      {
+        path: 'template',
+        layoutTemplate: ({ location, servicesManager }) => {
+          return {
+            id: ohif.layout,
+            props: {
+              leftPanels: [ohif.thumbnailList],
+              leftPanelResizable: true,
+              rightPanels: [
+                cornerstone.labelMapSegmentationPanel,
+                cornerstone.contourSegmentationPanel,
+              ],
+              rightPanelResizable: true,
+              // leftPanelClosed: true,
+              viewports: [
+                {
+                  namespace: cornerstone.viewport,
+                  displaySetsToDisplay: [ohif.sopClassHandler],
+                },
+                {
+                  namespace: segmentation.viewport,
+                  displaySetsToDisplay: [segmentation.sopClassHandler],
+                },
+                {
+                  namespace: dicomRT.viewport,
+                  displaySetsToDisplay: [dicomRT.sopClassHandler],
+                },
+              ],
+            },
+          };
+        },
+      },
+    ],
+    /** List of extensions that are used by the mode */
+    extensions: extensionDependencies,
+    /** HangingProtocol used by the mode */
+    // Commented out to just use the most applicable registered hanging protocol
+    // The example is used for a grid layout to specify that as a preferred layout
+    hangingProtocol: ['@ohif/mnGrid'],
+    /** SopClassHandlers used by the mode */
+    sopClassHandlers: [ohif.sopClassHandler, segmentation.sopClassHandler, dicomRT.sopClassHandler],
   };
 }
 
-/**
- * Extends the basic mode enter with the segmentation panel auto tab switch
- * handling (switching between labelmap/contour panels as segmentations of the
- * relevant type become active).
- */
-export function onModeEnter(ctx: withAppTypes) {
-  basicOnModeEnter.call(this, ctx);
-
-  const { segmentationService, viewportGridService, panelService } =
-    ctx.servicesManager.services;
-
-  const { unsubscribeAutoTabSwitchEvents } = setUpAutoTabSwitchHandler({
-    segmentationService,
-    viewportGridService,
-    panelService,
-  });
-
-  this._unsubscriptions.push(...unsubscribeAutoTabSwitchEvents);
-}
-
-export function onModeExit(ctx: withAppTypes) {
-  this._unsubscriptions.forEach(unsubscribe => unsubscribe());
-  this._unsubscriptions.length = 0;
-
-  basicOnModeExit.call(this, ctx);
-}
-
-export const segmentationLayout = {
-  id: ohif.layout,
-  props: {
-    // Panel lists are customization names; the cornerstone extension registers
-    // the defaults and `?customization=` modules can replace them.
-    leftPanels: 'segmentation.leftPanels',
-    leftPanelResizable: true,
-    rightPanels: 'segmentation.rightPanels',
-    rightPanelResizable: true,
-    viewports: [
-      {
-        namespace: cornerstone.viewport,
-        displaySetsToDisplay: [ohif.sopClassHandler],
-      },
-      {
-        namespace: segmentation.viewport,
-        displaySetsToDisplay: [segmentation.sopClassHandler],
-      },
-      {
-        namespace: dicomRT.viewport,
-        displaySetsToDisplay: [dicomRT.sopClassHandler],
-      },
-    ],
-  },
-};
-
-export const segmentationRoute = {
-  path: 'template',
-  layoutTemplate,
-  layoutInstance: segmentationLayout,
-};
-
-export const modeInstance = {
-  id,
-  routeName: 'segmentation',
-  displayName: 'Segmentation',
-  _activatePanelTriggersSubscriptions: [],
-  _unsubscriptions: [],
-  // Toolbar buttons/layout and tool group additions are referenced by
-  // customization name; the cornerstone extension registers the defaults and
-  // `?customization=` modules can extend them (e.g. add new segmentation
-  // tools, remove defaults, or add the annotation tools).
-  toolbarButtons: 'segmentation.toolbarButtons',
-  toolbarSections: 'segmentation.toolbarSections',
-  toolGroupAdditions: 'segmentation.toolGroupAdditions',
-  // Tool group setup used by onModeEnter; extending modes can replace it.
-  initToolGroups,
-  // The segmentation panel is editable in this mode.
-  enableSegmentationEdit: true,
-
-  /**
-   * Lifecycle hooks
-   */
-  onModeEnter,
-  onModeExit,
-  validationTags: {
-    study: [],
-    series: [],
-  },
-
-  isValidMode,
-  routes: [segmentationRoute],
-  extensions: extensionDependencies,
-  // Prefer the grid layout hanging protocol when applicable.
-  hangingProtocol: ['@ohif/mnGrid'],
-  sopClassHandlers: [ohif.sopClassHandler, segmentation.sopClassHandler, dicomRT.sopClassHandler],
-};
-
-/**
- * The mode uses the basic mode's `modeFactory`, which applies
- * immutability-helper commands from `modeConfiguration` onto `modeInstance`,
- * so a site can define a `mySegmentation` mode that extends this one.
- */
 const mode = {
   id,
   modeFactory,
-  modeInstance,
   extensionDependencies,
 };
 
 export default mode;
-export { initToolGroups };

modes/tmtv/package.json

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

modes/tmtv/src/index.ts

@@ -1,38 +1,32 @@
 import { classes } from '@ohif/core';
-import {
-  applyToolGroupAdditions,
-  layoutTemplate,
-  modeFactory,
-  registerModeToolbar,
-} from '@ohif/mode-basic';
-import i18n from 'i18next';
-
+import toolbarButtons from './toolbarButtons';
 import { id } from './id.js';
 import initToolGroups from './initToolGroups.js';
 import setCrosshairsConfiguration from './utils/setCrosshairsConfiguration.js';
 import setFusionActiveVolume from './utils/setFusionActiveVolume.js';
+import i18n from 'i18next';
 
 const { MetadataProvider } = classes;
 
-export const ohif = {
+const ohif = {
   layout: '@ohif/extension-default.layoutTemplateModule.viewerLayout',
   sopClassHandler: '@ohif/extension-default.sopClassHandlerModule.stack',
   thumbnailList: '@ohif/extension-default.panelModule.seriesList',
 };
 
-export const cs3d = {
+const cs3d = {
   viewport: '@ohif/extension-cornerstone.viewportModule.cornerstone',
   segPanel: '@ohif/extension-cornerstone.panelModule.panelSegmentationNoHeader',
   measurements: '@ohif/extension-cornerstone.panelModule.measurements',
 };
 
-export const tmtv = {
+const tmtv = {
   hangingProtocol: '@ohif/extension-tmtv.hangingProtocolModule.ptCT',
   petSUV: '@ohif/extension-tmtv.panelModule.petSUV',
   tmtv: '@ohif/extension-tmtv.panelModule.tmtv',
 };
 
-export const extensionDependencies = {
+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',
@@ -40,214 +34,234 @@ export const extensionDependencies = {
   '@ohif/extension-tmtv': '^3.0.0',
 };
 
-export function onModeEnter({ servicesManager, extensionManager, commandsManager }: withAppTypes) {
-  const {
-    toolbarService,
-    toolGroupService,
-    customizationService,
-    hangingProtocolService,
-    displaySetService,
-  } = servicesManager.services;
-
-  const utilityModule = extensionManager.getModuleEntry(
-    '@ohif/extension-cornerstone.utilityModule.tools'
-  );
-
-  const { toolNames, Enums } = utilityModule.exports;
-
-  // Init Default and SR ToolGroups
-  this.initToolGroups?.(toolNames, Enums, toolGroupService, commandsManager);
-
-  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
-      );
-
-      setFusionActiveVolume(
-        displaySetMatchDetails,
-        toolNames,
-        toolGroupService,
-        displaySetService
-      );
-    }
-  );
-
-  this._unsubscriptions.push(unsubscribe);
-
-  // Toolbar buttons and layout are supplied as customization references (the
-  // tmtv extension registers the defaults; `?customization=` modules can
-  // extend them) or as literal values for modes that define them inline.
-  registerModeToolbar({ toolbarService, customizationService }, this);
-
-  // Extra tools (e.g. annotation tools added by a customization) are layered
-  // onto the tool groups created above.
-  applyToolGroupAdditions({ toolGroupService, customizationService }, this.toolGroupAdditions);
-
-  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;
-    }
-  );
-}
-
-export function onModeExit({ servicesManager }: withAppTypes) {
-  const {
-    toolGroupService,
-    syncGroupService,
-    segmentationService,
-    cornerstoneViewportService,
-    uiDialogService,
-    uiModalService,
-  } = servicesManager.services;
-
-  this._unsubscriptions.forEach(unsubscribe => unsubscribe());
-  this._unsubscriptions.length = 0;
-
-  uiDialogService.hideAll();
-  uiModalService.hide();
-  toolGroupService.destroy();
-  syncGroupService.destroy();
-  segmentationService.destroy();
-  cornerstoneViewportService.destroy();
-}
-
-export function 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
+const unsubscriptions = [];
+function modeFactory({ modeConfiguration }) {
   return {
-    valid: isValid,
-    description: 'The mode requires both PT and CT series in the study',
+    // 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;
+
+      const utilityModule = extensionManager.getModuleEntry(
+        '@ohif/extension-cornerstone.utilityModule.tools'
+      );
+
+      const { toolNames, Enums } = utilityModule.exports;
+
+      // Init Default and SR ToolGroups
+      initToolGroups(toolNames, Enums, toolGroupService, commandsManager);
+
+      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
+          );
+
+          setFusionActiveVolume(
+            displaySetMatchDetails,
+            toolNames,
+            toolGroupService,
+            displaySetService
+          );
+        }
+      );
+
+      unsubscriptions.push(unsubscribe);
+      toolbarService.register(toolbarButtons);
+      toolbarService.updateSection(toolbarService.sections.primary, [
+        'MeasurementTools',
+        'Zoom',
+        'Pan',
+        'WindowLevel',
+        'Crosshairs',
+      ]);
+
+      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],
+                },
+              ],
+            },
+          };
+        },
+      },
+    ],
+    extensions: extensionDependencies,
+    hangingProtocol: tmtv.hangingProtocol,
+    sopClassHandlers: [ohif.sopClassHandler],
+    ...modeConfiguration,
   };
 }
 
-export const tmtvLayout = {
-  id: ohif.layout,
-  props: {
-    // Panel lists are customization names; the tmtv extension registers the
-    // defaults and `?customization=` modules can replace them.
-    leftPanels: 'tmtv.leftPanels',
-    leftPanelResizable: true,
-    leftPanelClosed: true,
-    rightPanels: 'tmtv.rightPanels',
-    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'),
-  _unsubscriptions: [],
-  // Toolbar buttons/layout and tool group additions are referenced by
-  // customization name; the tmtv extension registers the defaults and
-  // `?customization=` modules can extend them.
-  toolbarButtons: 'tmtv.toolbarButtons',
-  toolbarSections: 'tmtv.toolbarSections',
-  toolGroupAdditions: 'tmtv.toolGroupAdditions',
-  // Tool group setup used by onModeEnter; extending modes can replace it.
-  initToolGroups,
-
-  /**
-   * Lifecycle hooks
-   */
-  onModeEnter,
-  onModeExit,
-  validationTags: {
-    study: [],
-    series: [],
-  },
-  isValidMode,
-  routes: [tmtvRoute],
-  extensions: extensionDependencies,
-  hangingProtocol: tmtv.hangingProtocol,
-  sopClassHandlers: [ohif.sopClassHandler],
-};
-
-/**
- * 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,
 };
 
 export default mode;
-export { initToolGroups };

modes/tmtv/src/initToolGroups.js

@@ -1,8 +1,12 @@
-import { toolGroupIds } from '@ohif/extension-tmtv';
-
 import { MIN_SEGMENTATION_DRAWING_RADIUS, MAX_SEGMENTATION_DRAWING_RADIUS } from './constants';
 
-export { toolGroupIds };
+export const toolGroupIds = {
+  CT: 'ctToolGroup',
+  PT: 'ptToolGroup',
+  Fusion: 'fusionToolGroup',
+  MIP: 'mipToolGroup',
+  default: 'default',
+};
 
 function _initToolGroups(toolNames, Enums, toolGroupService, commandsManager) {
   const tools = {

modes/tmtv/src/toolbarButtons.ts

@@ -0,0 +1,461 @@
+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;