Group / ungroup should not always be present in the context menu (#1890)

Co-authored-by: rene_mbp <harryloveslearning@googlemail.com>
Co-authored-by: dwelle <luzar.david@gmail.com>

src/actions/actionGroup.ts

@@ -90,6 +90,8 @@ export const actionGroup = register({
   },
   contextMenuOrder: 4,
   contextItemLabel: "labels.group",
+  contextItemPredicate: (elements, appState) =>
+    getSelectedElements(getNonDeletedElements(elements), appState).length > 1,
   keyTest: (event) => {
     return (
       !event.shiftKey &&
@@ -136,4 +138,6 @@ export const actionUngroup = register({
   },
   contextMenuOrder: 5,
   contextItemLabel: "labels.ungroup",
+  contextItemPredicate: (elements, appState) =>
+    getSelectedGroupIds(appState).length > 0,
 });

src/actions/manager.tsx

@@ -82,6 +82,14 @@ export class ActionManager implements ActionsManagerInterface {
     return Object.values(this.actions)
       .filter(actionFilter)
       .filter((action) => "contextItemLabel" in action)
+      .filter((action) =>
+        action.contextItemPredicate
+          ? action.contextItemPredicate(
+              this.getElementsIncludingDeleted(),
+              this.getAppState(),
+            )
+          : true,
+      )
       .sort(
         (a, b) =>
           (a.contextMenuOrder !== undefined ? a.contextMenuOrder : 999) -

src/actions/types.ts

@@ -81,6 +81,10 @@ export interface Action {
   ) => boolean;
   contextItemLabel?: string;
   contextMenuOrder?: number;
+  contextItemPredicate?: (
+    elements: readonly ExcalidrawElement[],
+    appState: AppState,
+  ) => boolean;
 }
 
 export interface ActionsManagerInterface {