fix(contextMenu): fixes for context menu icon (#3275)

extensions/default/src/CustomizeableContextMenu/ContextMenuItemsBuilder.ts

@@ -111,7 +111,7 @@ export function findMenu(
  * @returns
  */
 export function getMenuItems(
-  selectorProps: Types.IProps,
+  selectorProps: SelectorProps,
   event: Event,
   menus: Menu[],
   menuIdFilter?: string
@@ -171,7 +171,7 @@ export function adaptItem(
   };
 
   if (item.actionType === 'ShowSubMenu' && !newItem.iconRight) {
-    newItem.iconRight = 'chevron-right';
+    newItem.iconRight = 'chevron-menu';
   }
   if (!item.action) {
     newItem.action = (itemRef, componentProps) => {

extensions/default/src/CustomizeableContextMenu/types.ts

@@ -1,13 +1,12 @@
 import { Types } from '@ohif/core';
 
 /**
- * SelectorProps are properties used to decide whether to select a manu or
+ * SelectorProps are properties used to decide whether to select a menu or
  * menu item for display.
  * An instance of SelectorProps is provided to the selector functions, which
  * return true to include the item or false to exclude it.
  * The point of this is to allow more specific conext menus which hide
  * non-relevant menu options, optimizing the speed of selection of menus
- * (See Bill Wallace's masters thesis for selection time versus complexity of user menus).
  */
 export interface SelectorProps {
   // If the context menu is invoked in the context of a measurement, then it
@@ -17,7 +16,7 @@ export interface SelectorProps {
   // The tool name for the nearby tool
   toolName?: string;
 
-  // An annotation UID - this will be present if nearyToolData is present.
+  // An annotation UID - this will be present if nearbyToolData is present.
   uid?: string;
 
   // If the context menu is invoked on an active viewport, then it will contain
@@ -112,12 +111,15 @@ export type Point = {
  */
 export type ContextMenuProps = {
   event?: EventTarget;
-  subMenu?: string;
+  menuCustomizationId?: string;
   menuId: string;
+  element?: HTMLElement;
 
   /** A set of menus to choose from for this context menu */
   menus: Menu[];
 
   /** The properties used to decide the menu type */
   selectorProps: SelectorProps;
+
+  defaultPointsPosition?: [number, number] | [];
 };

extensions/default/src/commandsModule.ts

@@ -10,6 +10,8 @@ import findViewportsByPosition, {
   findOrCreateViewport as layoutFindOrCreate,
 } from './findViewportsByPosition';
 
+import { ContextMenuProps } from './CustomizeableContextMenu/types';
+
 export type HangingProtocolParams = {
   protocolId?: string;
   stageIndex?: number;
@@ -57,7 +59,7 @@ const commandsModule = ({
      * @param options.event is the event that caused the context menu
      * @param options.selectorProps is the set of selection properties to use
      */
-    showContextMenu: options => {
+    showContextMenu: (options: ContextMenuProps) => {
       const {
         menuCustomizationId,
         element,

extensions/default/src/getCustomizationModule.tsx

@@ -113,11 +113,14 @@ export default function getCustomizationModule() {
         {
           id: 'ohif.contextMenu',
 
-          /** Applies the customizationType to all the menu items */
+          /** Applies the customizationType to all the menu items.
+           * This function clones the object and child objects to prevent
+           * changes to the original customization object.
+           */
           transform: function (customizationService: CustomizationService) {
             // Don't modify the children, as those are copied by reference
             const clonedObject = { ...this };
-            clonedObject.menus = this.menus.map(it => ({ ...it }));
+            clonedObject.menus = this.menus.map(menu => ({ ...menu }));
 
             for (const menu of clonedObject.menus) {
               const { items: originalItems } = menu;