Filter context menu items through isActionEnabled.

src/components/Actions.tsx

@@ -3,7 +3,7 @@ import { ActionManager } from "../actions/manager";
 import { getNonDeletedElements } from "../element";
 import { ExcalidrawElement, PointerType } from "../element/types";
 import { t } from "../i18n";
-import { useDevice } from "../components/App";
+import { useDevice, useExcalidrawActionManager } from "../components/App";
 import {
   canChangeRoundness,
   canHaveArrowheads,
@@ -36,12 +36,10 @@ export const SelectedShapeActions = ({
   appState,
   elements,
   renderAction,
-  getCustomActions,
 }: {
   appState: AppState;
   elements: readonly ExcalidrawElement[];
   renderAction: ActionManager["renderAction"];
-  getCustomActions: ActionManager["getCustomActions"];
 }) => {
   const targetElements = getTargetElements(
     getNonDeletedElements(elements),
@@ -94,9 +92,9 @@ export const SelectedShapeActions = ({
       {showChangeBackgroundIcons && (
         <div>{renderAction("changeBackgroundColor")}</div>
       )}
-      {getCustomActions({ elements: targetElements }).map((action) =>
-        renderAction(action.name),
-      )}
+      {useExcalidrawActionManager()
+        .getCustomActions({ elements: targetElements })
+        .map((action) => renderAction(action.name))}
       {showFillIcons && renderAction("changeFillStyle")}
 
       {(hasStrokeWidth(appState.activeTool.type) ||

src/components/App.tsx

@@ -6167,20 +6167,29 @@ class App extends React.Component<AppProps, AppState> {
     type: "canvas" | "element" | "custom",
     source?: string,
   ): ContextMenuItems => {
-    const options: ContextMenuItems = [];
-    let addedCustom = false;
+    const custom: ContextMenuItems = [];
     this.actionManager
-      .getCustomActions({ data: { source } })
-      .forEach((action) => {
-        addedCustom = true;
-        options.push(action);
-      });
+      .getCustomActions({ data: { source: source ?? "" } })
+      .forEach((action) => custom.push(action));
     if (type === "custom") {
-      return options;
+      return custom;
     }
-    if (addedCustom) {
-      options.push(CONTEXT_MENU_SEPARATOR);
+    if (custom.length > 0) {
+      custom.push(CONTEXT_MENU_SEPARATOR);
     }
+    const standard: ContextMenuItems = this._getContextMenuItems(type).filter(
+      (item) =>
+        !item ||
+        item === CONTEXT_MENU_SEPARATOR ||
+        this.actionManager.isActionEnabled(item, { guardsOnly: true }),
+    );
+    return [...custom, ...standard];
+  };
+
+  private _getContextMenuItems = (
+    type: "canvas" | "element",
+  ): ContextMenuItems => {
+    const options: ContextMenuItems = [];
 
     options.push(actionCopyAsPng, actionCopyAsSvg);
 

src/components/LayerUI.tsx

@@ -244,7 +244,6 @@ const LayerUI = ({
           appState={appState}
           elements={elements}
           renderAction={actionManager.renderAction}
-          getCustomActions={actionManager.getCustomActions}
         />
       </Island>
     </Section>

src/components/MobileMenu.tsx

@@ -193,7 +193,6 @@ export const MobileMenu = ({
                 appState={appState}
                 elements={elements}
                 renderAction={actionManager.renderAction}
-                getCustomActions={actionManager.getCustomActions}
               />
             </Section>
           ) : null}