8.33.1: Fix #1310 (#1311)

* Fix context menu not working issue (#1309) * Fix context menu not working issue * fix build * 8.33.1 Fix a bug in roosterjs-react
microsoft · Oct 5, 2022 · fd08bb5 · fd08bb5
1 parent 25102ce
commit fd08bb5
Show file tree

Hide file tree

Showing 4 changed files with 9 additions and 13 deletions.
diff --git a/package.json b/package.json
@@ -1,6 +1,6 @@
 {
     "name": "roosterjs",
-    "version": "8.33.0",
+    "version": "8.33.1",
     "description": "Framework-independent javascript editor",
     "repository": {
         "type": "git",

diff --git a/packages-ui/roosterjs-react/lib/contextMenu/menus/createImageEditMenuProvider.tsx b/packages-ui/roosterjs-react/lib/contextMenu/menus/createImageEditMenuProvider.tsx
@@ -87,12 +87,12 @@ const ImageCropMenuItem: ContextMenuItem<ImageEditMenuItemStringKey, ImageEdit>
     unlocalizedText: 'Crop image',
     shouldShow: (_, node, imageEdit) => {
         return (
-            imageEdit.isOperationAllowed(ImageEditOperation.Crop) &&
+            !!imageEdit?.isOperationAllowed(ImageEditOperation.Crop) &&
             canRegenerateImage(node as HTMLImageElement)
         );
     },
     onClick: (_, editor, node, strings, uiUtilities, imageEdit) => {
-        imageEdit.setEditingImage(node as HTMLImageElement, ImageEditOperation.Crop);
+        imageEdit?.setEditingImage(node as HTMLImageElement, ImageEditOperation.Crop);
     },
 };
 
@@ -103,7 +103,7 @@ const ImageRemoveMenuItem: ContextMenuItem<ImageEditMenuItemStringKey, ImageEdit
         if (editor.contains(node)) {
             editor.addUndoSnapshot(() => {
                 editor.deleteNode(node);
-                imageEdit.setEditingImage(null /*editingImage*/);
+                imageEdit?.setEditingImage(null /*editingImage*/);
             }, 'DeleteImage');
         }
     },

diff --git a/packages-ui/roosterjs-react/lib/contextMenu/types/ContextMenuItem.ts b/packages-ui/roosterjs-react/lib/contextMenu/types/ContextMenuItem.ts
@@ -31,7 +31,7 @@ export default interface ContextMenuItem<TString extends string, TContext = neve
         targetNode: Node,
         strings: LocalizedStrings<TString> | undefined,
         uiUtilities: UIUtilities,
-        context: TContext
+        context?: TContext
     ) => void;
 
     /**
@@ -40,7 +40,7 @@ export default interface ContextMenuItem<TString extends string, TContext = neve
      * @param targetNode The node that user is clicking onto
      * @param context A context object that passed in from context menu provider, can be anything
      */
-    shouldShow?: (editor: IEditor, targetNode: Node, context: TContext) => boolean;
+    shouldShow?: (editor: IEditor, targetNode: Node, context?: TContext) => boolean;
 
     /**
      * A key-value map for sub menu items, key is the key of menu item, value is unlocalized string

diff --git a/packages-ui/roosterjs-react/lib/contextMenu/utils/createContextMenuProvider.ts b/packages-ui/roosterjs-react/lib/contextMenu/utils/createContextMenuProvider.ts
@@ -1,9 +1,9 @@
 import ContextMenuItem from '../types/ContextMenuItem';
 import getLocalizedString from '../../common/utils/getLocalizedString';
 import { ContextMenuProvider, EditorPlugin, IEditor } from 'roosterjs-editor-types';
+import { getObjectKeys } from 'roosterjs-editor-dom';
 import { IContextualMenuItem } from '@fluentui/react/lib/ContextualMenu';
 import { LocalizedStrings, ReactEditorPlugin, UIUtilities } from '../../common/index';
-import { getObjectKeys } from 'roosterjs-editor-dom';
 
 /**
  * A plugin of editor to provide context menu items
@@ -57,11 +57,7 @@ class ContextMenuProviderImpl<TString extends string, TContext>
         return this.editor && this.shouldAddMenuItems?.(this.editor, node)
             ? this.items
                   .filter(
-                      item =>
-                          !item.shouldShow ||
-                          (this.editor &&
-                              this.context &&
-                              item.shouldShow(this.editor, node, this.context))
+                      item => !item.shouldShow || item.shouldShow(this.editor!, node, this.context)
                   )
                   .map(item => this.convertMenuItems(item))
             : [];
@@ -97,7 +93,7 @@ class ContextMenuProviderImpl<TString extends string, TContext>
     }
 
     private onClick(item: ContextMenuItem<TString, TContext>, key: TString) {
-        if (this.editor && this.targetNode && this.uiUtilities && this.context) {
+        if (this.editor && this.targetNode && this.uiUtilities) {
             item.onClick(
                 key,
                 this.editor,