context menu refactor

packages/web/src/utility/contextMenu.ts

@@ -1,6 +1,12 @@
 import _ from 'lodash';
+import { getContext, setContext } from 'svelte';
 import { currentDropDownMenu } from '../stores';
 
+export function registerMenu(items) {
+  const parentMenu = getContext('componentContextMenu');
+  setContext('componentContextMenu', parentMenu ? [parentMenu, items] : items);
+}
+
 export default function contextMenu(node, items) {
   const handleContextMenu = e => {
     e.preventDefault();
@@ -8,7 +14,7 @@ export default function contextMenu(node, items) {
     if (items) {
       const left = e.pageX;
       const top = e.pageY;
-      currentDropDownMenu.set({ left, top, items: _.isFunction(items) ? items() : items });
+      currentDropDownMenu.set({ left, top, items });
     }
   };
 
@@ -23,3 +29,21 @@ export default function contextMenu(node, items) {
     },
   };
 }
+
+function doExtractMenuItems(menu, res) {
+  if (_.isFunction(menu)) {
+    doExtractMenuItems(menu(), res);
+  } else if (_.isArray(menu)) {
+    for (const item of menu) {
+      doExtractMenuItems(item, res);
+    }
+  } else if (_.isPlainObject(menu)) {
+    res.push(menu);
+  }
+}
+
+export function extractMenuItems(menu) {
+  const res = [];
+  doExtractMenuItems(menu, res);
+  return res;
+}