feat: separate checks for addWindowLevelActionMenu and addSegmentationOverlay (#4813)

platform/core/src/types/AppTypes.ts

@@ -129,7 +129,6 @@ declare global {
       showStudyList?: boolean;
       whiteLabeling?: Record<string, unknown>;
       httpErrorHandler?: (error: Error) => void;
-      addWindowLevelActionMenu?: boolean;
       dangerouslyUseDynamicConfig?: {
         enabled: boolean;
         regex: RegExp;

platform/docs/docs/migration-guide/3p9-to-3p10/CustomizationService/index.md

@@ -207,6 +207,86 @@ customizationService.setCustomizations({
   },
 });
 ```
+```
+**Example: Customizing viewport action Menu**
+
+**Before (v3.9):**
+
+```javascript
+// In your configuration for global customizations
+window.config = {
+    // rest of config
+    addWindowLevelActionMenu: true,
+};
+```
+
+**After (v3.10):**
+
+```javascript
+// you can now handle each action menu item (windowLevelActionMenu and segmentationOverlay) separately
+
+// cornerstone extension getCustomizationModule
+function getCustomizationModule() {
+    return [
+        {
+            name: 'default',
+            value: {
+                'viewportActionMenu.windowLevelActionMenu': {
+                    enabled: true,
+                    location: viewportActionCornersService.LOCATIONS.topRight,
+                },
+                'viewportActionMenu.segmentationOverlay': {
+                    enabled: true,
+                    location: viewportActionCornersService.LOCATIONS.topRight,
+                },
+            },
+        },
+    ];
+}
+
+
+// Accessing customizations within your component (e.g., OHIFCornerstoneViewport.tsx)
+const windowLevelActionMenu = customizationService.getCustomization('viewportActionMenu.windowLevelActionMenu');
+const segmentationOverlay = customizationService.getCustomization('viewportActionMenu.segmentationOverlay');
+
+// Modifying customizations at runtime, for example, in your mode's onModeEnter
+customizationService.setCustomizations({
+    'viewportActionMenu.windowLevelActionMenu': {
+        $set: {
+            enabled: false,
+            location: viewportActionCornersService.LOCATIONS.bottomLeft,
+        },
+    },
+    'viewportActionMenu.segmentationOverlay': {
+        $set: {
+            enabled: true,
+            location: viewportActionCornersService.LOCATIONS.topLeft,
+        },
+    },
+});
+
+// Alternatively, setting global customizations via configuration
+window.config = {
+    // rest of config
+    customizationService: [
+        {
+            'viewportActionMenu.windowLevelActionMenu': {
+                $set: {
+                    enabled: false,
+                    location: 1,
+                },
+            },
+            'viewportActionMenu.segmentationOverlay': {
+                $set: {
+                    enabled: true,
+                    location: 1,
+                },
+            },
+        },
+    ],
+    // rest of config
+};
+```
 
 **Note:**
 
@@ -237,3 +317,5 @@ To keep our customization system consistent, you should be aware of a few key re
 | `cornerstoneOverlayTopRight`                  | `viewportOverlay.topRight`                   | Custom overlay items for the top-right corner of the viewport.                 |
 | `cornerstoneOverlayBottomLeft`                | `viewportOverlay.bottomLeft`                 | Custom overlay items for the bottom-left corner of the viewport.              |
 | `cornerstoneOverlayBottomRight`               | `viewportOverlay.bottomRight`                | Custom overlay items for the bottom-right corner of the viewport.             |
+| (New)                                         | `viewportActionMenu.windowLevelActionMenu`   | Controls the display and the location of the window level action menu in the viewport.      |
+| (New)                                         | `viewportActionMenu.segmentationOverlay`     | Controls the display and the location of segmentation overlays in the viewport.      |

platform/docs/docs/platform/services/customization-service/sampleCustomizations.tsx

@@ -16,6 +16,7 @@ import loadingIndicatorProgress from '../../../assets/img/loading-indicator-icon
 import loadingIndicatorPercent from '../../../assets/img/loading-indicator-percent.png';
 import viewportActionCorners from '../../../assets/img/viewport-action-corners.png';
 import contextMenu from '../../../assets/img/context-menu.jpg';
+import segmentationOverlay from '../../../assets/img/segmentation-overlay.png';
 
 import segDisplayEditingTrue from '../../../assets/img/segDisplayEditingTrue.png';
 import segDisplayEditingFalse from '../../../assets/img/segDisplayEditingFalse.png';
@@ -784,6 +785,57 @@ window.config = {
       };
         `,
   },
+  {
+    id: 'viewportActionMenu.windowLevelActionMenu',
+    description:
+        'Configures the display and location of the window level action menu in the viewport.',
+    image: windowLevelActionMenu,
+    default: null,
+    configuration: `
+      window.config = {
+        // rest of window config
+        customizationService: [
+          {
+            'viewportActionMenu.windowLevelActionMenu': {
+              $set: {
+               enabled: true,
+               location: 1, // Set the location of the menu in the viewport.
+                            // 0: topLeft
+                            // 1: topRight
+                            // 2: bottomLeft
+                            // 3: bottomRight
+              }
+            },
+          },
+        ],
+      };
+        `,
+  },
+  {
+    id: 'viewportActionMenu.segmentationOverlay',
+    description: 'Configures the display and location of the segmentation overlay in the viewport.',
+    image: segmentationOverlay,
+    default: null,
+    configuration: `
+      window.config = {
+        // rest of window config
+        customizationService: [
+          {
+            'viewportActionMenu.segmentationOverlay': {
+               $set: {
+                 enabled: true,
+                 location: 1, // Set the location of the overlay in the viewport.
+                              // 0: topLeft
+                              // 1: topRight
+                              // 2: bottomLeft
+                              // 3: bottomRight
+               }
+            },
+          },
+        ],
+      };
+        `,
+  },
 ];
 
 export const segmentationCustomizations = [

platform/docs/versioned_docs/version-3.9/configuration/configurationFiles.md

@@ -192,7 +192,6 @@ if auth headers are used, a preflight request is required.
 - `allowMultiSelectExport`: (default to false), if set to true, the user will be able to select the datasource to export the report to.
 - `activateViewportBeforeInteraction`: (default to true), if set to false, tools can be used directly without the need to click and activate the viewport.
 - `autoPlayCine`: (default to false), if set to true, data sets with the DICOM frame time tag (i.e. (0018,1063)) will auto play when displayed
-- `addWindowLevelActionMenu`: (default to true), if set to false, the window level action menu item is NOT added to the viewport action corners
 - `dangerouslyUseDynamicConfig`: Dynamic config allows user to pass `configUrl` query string. This allows to load config without recompiling application. If the `configUrl` query string is passed, the worklist and modes will load from the referenced json rather than the default .env config. If there is no `configUrl` path provided, the default behaviour is used and there should not be any deviation from current user experience.<br/>
 Points to consider while using `dangerouslyUseDynamicConfig`:<br/>
   - User have to enable this feature by setting `dangerouslyUseDynamicConfig.enabled:true`. By default it is `false`.