fix: backward compatibility with toolbar service (#5052)

modes/preclinical-4d/src/getWorkflowSettings.ts

@@ -10,31 +10,35 @@ const cornerstone = {
   activeViewportWindowLevel: '@ohif/extension-cornerstone.panelModule.activeViewportWindowLevel',
 };
 
-const defaultButtons = [
-  {
-    buttonSection: 'primary',
-    buttons: ['MeasurementTools', 'Zoom', 'WindowLevel', 'Crosshairs', 'Pan'],
-  },
-  {
-    buttonSection: 'measurementSection',
-    buttons: ['Length', 'Bidirectional', 'ArrowAnnotate', 'EllipticalROI'],
-  },
-];
+function getDefaultButtons({ toolbarService }) {
+  return [
+    {
+      buttonSection: toolbarService.sections.primary,
+      buttons: ['MeasurementTools', 'Zoom', 'WindowLevel', 'Crosshairs', 'Pan'],
+    },
+    {
+      buttonSection: 'MeasurementTools',
+      buttons: ['Length', 'Bidirectional', 'ArrowAnnotate', 'EllipticalROI'],
+    },
+  ];
+}
 
-const ROIThresholdToolbox = [
-  {
-    buttonSection: 'dynamic-toolbox',
-    buttons: ['SegmentationTools'],
-  },
-  {
-    buttonSection: 'segmentationToolboxToolsSection',
-    buttons: ['BrushTools', 'RectangleROIStartEndThreshold'],
-  },
-  {
-    buttonSection: 'brushToolsSection',
-    buttons: ['Brush', 'Eraser', 'Threshold'],
-  },
-];
+function getROIThresholdToolbox({ toolbarService }) {
+  return [
+    {
+      buttonSection: toolbarService.sections.dynamicToolbox,
+      buttons: ['SegmentationTools'],
+    },
+    {
+      buttonSection: 'SegmentationTools',
+      buttons: ['BrushTools', 'RectangleROIStartEndThreshold'],
+    },
+    {
+      buttonSection: 'BrushTools',
+      buttons: ['Brush', 'Eraser', 'Threshold'],
+    },
+  ];
+}
 
 const defaultLeftPanel = [[dynamicVolume.leftPanel, cornerstone.activeViewportWindowLevel]];
 
@@ -46,6 +50,10 @@ const defaultLayout = {
 };
 
 function getWorkflowSettings({ servicesManager }) {
+  const { toolbarService } = servicesManager.services;
+  const defaultButtons = getDefaultButtons({ toolbarService });
+  const ROIThresholdToolbox = getROIThresholdToolbox({ toolbarService });
+
   return {
     steps: [
       {

modes/preclinical-4d/src/index.tsx

@@ -56,7 +56,7 @@ function modeFactory({ modeConfiguration }) {
 
       toolbarService.register(toolbarButtons);
 
-      toolbarService.updateSection('secondary', ['ProgressDropdown']);
+      toolbarService.updateSection(toolbarService.sections.secondary, ['ProgressDropdown']);
 
       toolbarService.updateSection(toolbarService.sections.viewportActionMenu.topLeft, [
         'orientationMenu',
@@ -72,7 +72,7 @@ function modeFactory({ modeConfiguration }) {
         'AdvancedRenderingControls',
       ]);
 
-      toolbarService.updateSection(toolbarService.sections.advancedRenderingControlsSection, [
+      toolbarService.updateSection('AdvancedRenderingControls', [
         'windowLevelMenuEmbedded',
         'voiManualControlMenu',
         'Colorbar',

modes/preclinical-4d/src/toolbarButtons.tsx

@@ -22,28 +22,28 @@ const toolbarButtons = [
     id: 'MeasurementTools',
     uiType: 'ohif.toolButtonList',
     props: {
-      buttonSection: 'measurementSection',
+      buttonSection: true,
     },
   },
   {
     id: 'BrushTools',
     uiType: 'ohif.toolBoxButtonGroup',
     props: {
-      buttonSection: 'brushToolsSection',
+      buttonSection: true,
     },
   },
   {
     id: 'SegmentationTools',
     uiType: 'ohif.toolBoxButton',
     props: {
-      buttonSection: 'segmentationToolboxToolsSection',
+      buttonSection: true,
     },
   },
   {
     id: 'AdvancedRenderingControls',
     uiType: 'ohif.advancedRenderingControls',
     props: {
-      buttonSection: 'advancedRenderingControlsSection',
+      buttonSection: true,
     },
   },
   {