@nocobase/flow-engine 2.0.0-alpha.7 → 2.0.0-alpha.71

package/lib/components/settings/wrappers/contextual/DefaultSettingsIcon.js

@@ -46,6 +46,52 @@ var import_react = __toESM(require("react"));
 var import_models = require("../../../../models");
 var import_utils = require("../../../../utils");
 var import_hooks = require("../../../../hooks");
+var import_SwitchWithTitle = require("../component/SwitchWithTitle");
+var import_SelectWithTitle = require("../component/SelectWithTitle");
+const walkSubModels = /* @__PURE__ */ __name((rootModel, options, cb) => {
+  const maxDepth = options.maxDepth;
+  const arrayLimit = typeof options.arrayLimit === "number" ? options.arrayLimit : Number.POSITIVE_INFINITY;
+  const mode = options.mode ?? "stack";
+  const visited = /* @__PURE__ */ new Set();
+  const stackIds = /* @__PURE__ */ new Set();
+  const walk = /* @__PURE__ */ __name((model, depth, modelKey) => {
+    if (!model || depth > maxDepth) return;
+    const run = /* @__PURE__ */ __name(() => {
+      cb(model, { depth, modelKey });
+      if (depth >= maxDepth) return;
+      Object.entries(model.subModels || {}).forEach(([subKey, subModelValue]) => {
+        if (Array.isArray(subModelValue)) {
+          const limit = Number.isFinite(arrayLimit) ? Math.min(subModelValue.length, arrayLimit) : subModelValue.length;
+          for (let index = 0; index < limit; index++) {
+            const subModel = subModelValue[index];
+            if (subModel instanceof import_models.FlowModel) {
+              walk(subModel, depth + 1, `${subKey}[${index}]`);
+            }
+          }
+          return;
+        }
+        if (subModelValue instanceof import_models.FlowModel) {
+          walk(subModelValue, depth + 1, subKey);
+        }
+      });
+    }, "run");
+    if (mode === "visited") {
+      if (visited.has(model)) return;
+      visited.add(model);
+      run();
+      return;
+    }
+    const modelId = model.uid || `temp-${Date.now()}`;
+    if (stackIds.has(modelId)) return;
+    stackIds.add(modelId);
+    try {
+      run();
+    } finally {
+      stackIds.delete(modelId);
+    }
+  }, "walk");
+  walk(rootModel, 1);
+}, "walkSubModels");
 const findSubModelByKey = /* @__PURE__ */ __name((model, subModelKey) => {
   var _a;
   if (!model || !subModelKey || typeof subModelKey !== "string") {
@@ -82,6 +128,18 @@ const findSubModelByKey = /* @__PURE__ */ __name((model, subModelKey) => {
     return subModel instanceof import_models.FlowModel ? subModel : null;
   }
 }, "findSubModelByKey");
+const componentMap = {
+  switch: import_SwitchWithTitle.SwitchWithTitle,
+  select: import_SelectWithTitle.SelectWithTitle
+};
+const MenuLabelItem = /* @__PURE__ */ __name(({ title, uiMode, itemProps }) => {
+  const type = (uiMode == null ? void 0 : uiMode.type) || uiMode;
+  const Component = type ? componentMap[type] : null;
+  if (!Component) {
+    return /* @__PURE__ */ import_react.default.createElement(import_react.default.Fragment, null, title);
+  }
+  return /* @__PURE__ */ import_react.default.createElement(Component, { title, ...itemProps });
+}, "MenuLabelItem");
 const DefaultSettingsIcon = /* @__PURE__ */ __name(({
   model,
   showDeleteButton = true,
@@ -91,8 +149,13 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
   flattenSubMenus = true
 }) => {
   const { message } = import_antd.App.useApp();
-  const t = (0, import_utils.getT)(model);
+  const t = (0, import_react.useMemo)(() => (0, import_utils.getT)(model), [model]);
   const [visible, setVisible] = (0, import_react.useState)(false);
+  const [refreshTick, setRefreshTick] = (0, import_react.useState)(0);
+  const [extraMenuItems, setExtraMenuItems] = (0, import_react.useState)([]);
+  const closeDropdown = (0, import_react.useCallback)(() => {
+    setVisible(false);
+  }, []);
   const handleOpenChange = (0, import_react.useCallback)((nextOpen, info) => {
     if (info.source === "trigger" || nextOpen) {
       (0, import_react.startTransition)(() => {
@@ -101,14 +164,66 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
     }
   }, []);
   const dropdownMaxHeight = (0, import_hooks.useNiceDropdownMaxHeight)([visible]);
+  (0, import_react.useEffect)(() => {
+    let mounted = true;
+    const loadExtras = /* @__PURE__ */ __name(async () => {
+      var _a;
+      const allExtras = [];
+      const modelsToProcess = [];
+      walkSubModels(model, { maxDepth: menuLevels, arrayLimit: 50, mode: "stack" }, (targetModel, { modelKey }) => {
+        modelsToProcess.push({ model: targetModel, modelKey });
+      });
+      for (const { model: targetModel, modelKey } of modelsToProcess) {
+        const Cls = targetModel.constructor;
+        const extras = await ((_a = Cls.getExtraMenuItems) == null ? void 0 : _a.call(Cls, targetModel, t));
+        if (extras == null ? void 0 : extras.length) {
+          allExtras.push(
+            ...extras.map((item) => ({
+              ...item,
+              key: modelKey ? `${modelKey}:${item.key}` : item.key
+            }))
+          );
+        }
+      }
+      if (mounted) {
+        const seen = /* @__PURE__ */ new Set();
+        const dedupedExtras = allExtras.filter((item) => {
+          if (seen.has(`${item.key}`)) {
+            return false;
+          }
+          seen.add(`${item.key}`);
+          return true;
+        });
+        setExtraMenuItems(dedupedExtras);
+      }
+    }, "loadExtras");
+    if (visible) {
+      loadExtras();
+    }
+    return () => {
+      mounted = false;
+    };
+  }, [model, menuLevels, t, refreshTick, visible, message]);
   const copyUidToClipboard = (0, import_react.useCallback)(
     async (uid) => {
+      var _a;
       try {
         await navigator.clipboard.writeText(uid);
         message.success(t("UID copied to clipboard"));
       } catch (error) {
         console.error(t("Copy failed"), ":", error);
-        message.error(t("Copy failed, please copy [{{uid}}] manually.", { uid }));
+        const isHttps = typeof window !== "undefined" && ((_a = window.location) == null ? void 0 : _a.protocol) === "https:";
+        if (!isHttps) {
+          message.error(
+            t(
+              "Copy failed under HTTP. Clipboard API is unavailable on non-HTTPS pages. Please copy [{{uid}}] manually.",
+              { uid }
+            )
+          );
+          return;
+        } else {
+          message.error(t("Copy failed, please copy [{{uid}}] manually.", { uid }));
+        }
       }
     },
     [message, t]
@@ -137,6 +252,7 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
     [model, copyUidToClipboard]
   );
   const handleDelete = (0, import_react.useCallback)(() => {
+    closeDropdown();
     import_antd.Modal.confirm({
       title: t("Confirm delete"),
       icon: /* @__PURE__ */ import_react.default.createElement(import_icons.ExclamationCircleOutlined, null),
@@ -157,7 +273,7 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
         }
       }
     });
-  }, [model]);
+  }, [closeDropdown, model, t]);
   const handleStepConfiguration = (0, import_react.useCallback)(
     (key) => {
       const keyParts = key.split(":");
@@ -182,6 +298,7 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
         [flowKey, stepKey] = keyParts;
       }
       try {
+        closeDropdown();
         targetModel.openFlowSettings({
           flowKey,
           stepKey
@@ -190,17 +307,26 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
         console.log(t("Configuration popup cancelled or error"), ":", error);
       }
     },
-    [model]
+    [closeDropdown, model, t]
   );
   const handleMenuClick = (0, import_react.useCallback)(
     ({ key }) => {
+      const originalKey = key;
       const cleanKey = key.includes("-") && /^(.+)-\d+$/.test(key) ? key.replace(/-\d+$/, "") : key;
       if (cleanKey.startsWith("copy-pop-uid:")) {
+        closeDropdown();
         handleCopyPopupUid(cleanKey);
         return;
       }
+      const extra = extraMenuItems.find((it) => (it == null ? void 0 : it.key) === originalKey || (it == null ? void 0 : it.key) === cleanKey);
+      if (extra == null ? void 0 : extra.onClick) {
+        closeDropdown();
+        extra.onClick();
+        return;
+      }
       switch (cleanKey) {
         case "copy-uid":
+          closeDropdown();
           handleCopyUid();
           break;
         case "delete":
@@ -211,41 +337,47 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
           break;
       }
     },
-    [handleCopyUid, handleDelete, handleStepConfiguration, handleCopyPopupUid]
+    [closeDropdown, handleCopyUid, handleDelete, handleStepConfiguration, handleCopyPopupUid, extraMenuItems]
   );
   const getModelConfigurableFlowsAndSteps = (0, import_react.useCallback)(
     async (targetModel, modelKey) => {
       try {
-        const flows = targetModel.getFlows();
+        const flowsMap = new Map(targetModel.constructor.globalFlowRegistry.getFlows());
+        const flows = flowsMap;
         const flowsArray = Array.from(flows.values());
         const flowsWithSteps = await Promise.all(
           flowsArray.map(async (flow) => {
             const configurableSteps = await Promise.all(
               Object.entries(flow.steps).map(async ([stepKey, stepDefinition]) => {
-                var _a, _b;
+                var _a;
                 const actionStep = stepDefinition;
-                if (actionStep.hideInSettings) {
+                let step = actionStep;
+                if (await (0, import_utils.shouldHideStepInSettings)(targetModel, flow, actionStep)) {
                   return null;
                 }
+                let uiMode = await (0, import_utils.resolveUiMode)(actionStep.uiMode, targetModel.context);
                 const hasStepUiSchema = actionStep.uiSchema != null;
                 let hasActionUiSchema = false;
                 let stepTitle = actionStep.title;
                 if (actionStep.use) {
                   try {
-                    const action = (_b = (_a = targetModel.flowEngine) == null ? void 0 : _a.getAction) == null ? void 0 : _b.call(_a, actionStep.use);
+                    const action = (_a = targetModel.getAction) == null ? void 0 : _a.call(targetModel, actionStep.use);
+                    step = { ...action || {}, ...actionStep };
+                    uiMode = await (0, import_utils.resolveUiMode)((action == null ? void 0 : action.uiMode) || uiMode, targetModel.context);
                     hasActionUiSchema = action && action.uiSchema != null;
-                    stepTitle = stepTitle || action.title;
+                    stepTitle = stepTitle || (action == null ? void 0 : action.title);
                   } catch (error) {
                     console.warn(t("Failed to get action {{action}}", { action: actionStep.use }), ":", error);
                   }
                 }
-                if (!hasStepUiSchema && !hasActionUiSchema) {
+                const selectOrSwitchMode = ["select", "switch"].includes((uiMode == null ? void 0 : uiMode.type) || uiMode);
+                if (!selectOrSwitchMode && !hasStepUiSchema && !hasActionUiSchema) {
                   return null;
                 }
                 let mergedUiSchema = {};
                 try {
                   const resolvedSchema = await (0, import_utils.resolveStepUiSchema)(targetModel, flow, actionStep);
-                  if (!resolvedSchema) {
+                  if (!resolvedSchema && !selectOrSwitchMode) {
                     return null;
                   }
                   mergedUiSchema = resolvedSchema;
@@ -255,11 +387,12 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
                 }
                 return {
                   stepKey,
-                  step: actionStep,
+                  step,
                   uiSchema: mergedUiSchema,
                   title: t(stepTitle) || stepKey,
-                  modelKey
+                  modelKey,
                   // 添加模型标识
+                  uiMode
                 };
               })
             ).then((steps) => steps.filter(Boolean));
@@ -280,61 +413,41 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
   );
   const getConfigurableFlowsAndSteps = (0, import_react.useCallback)(async () => {
     const result = [];
-    const processedModels = /* @__PURE__ */ new Set();
-    const processModel = /* @__PURE__ */ __name(async (targetModel, depth, modelKey) => {
-      if (depth > menuLevels) {
-        return;
-      }
-      const modelId = targetModel.uid || `temp-${Date.now()}`;
-      if (processedModels.has(modelId)) {
-        return;
-      }
-      processedModels.add(modelId);
-      try {
-        const modelFlows = await getModelConfigurableFlowsAndSteps(targetModel, modelKey);
-        result.push(...modelFlows);
-        if (depth < menuLevels && targetModel.subModels) {
-          await Promise.all(
-            Object.entries(targetModel.subModels).map(async ([subKey, subModelValue]) => {
-              if (Array.isArray(subModelValue)) {
-                await Promise.all(
-                  subModelValue.map(async (subModel, index) => {
-                    if (subModel instanceof import_models.FlowModel && index < 50) {
-                      await processModel(subModel, depth + 1, `${subKey}[${index}]`);
-                    }
-                  })
-                );
-              } else if (subModelValue instanceof import_models.FlowModel) {
-                await processModel(subModelValue, depth + 1, subKey);
-              }
-            })
-          );
-        }
-      } finally {
-        processedModels.delete(modelId);
-      }
-    }, "processModel");
-    await processModel(model, 1);
+    const modelsToProcess = [];
+    walkSubModels(model, { maxDepth: menuLevels, arrayLimit: 50, mode: "stack" }, (targetModel, { modelKey }) => {
+      modelsToProcess.push({ model: targetModel, modelKey });
+    });
+    for (const { model: targetModel, modelKey } of modelsToProcess) {
+      const modelFlows = await getModelConfigurableFlowsAndSteps(targetModel, modelKey);
+      result.push(...modelFlows);
+    }
     return result;
   }, [model, menuLevels, getModelConfigurableFlowsAndSteps]);
   const [configurableFlowsAndSteps, setConfigurableFlowsAndSteps] = (0, import_react.useState)([]);
   const [isLoading, setIsLoading] = (0, import_react.useState)(true);
-  const [refreshTick, setRefreshTick] = (0, import_react.useState)(0);
   (0, import_react.useEffect)(() => {
-    const triggerRebuild = /* @__PURE__ */ __name(() => setRefreshTick((v) => v + 1), "triggerRebuild");
-    if (model == null ? void 0 : model.emitter) {
-      model.emitter.on("onSubModelAdded", triggerRebuild);
-      model.emitter.on("onSubModelRemoved", triggerRebuild);
-      model.emitter.on("onSubModelReplaced", triggerRebuild);
-    }
-    return () => {
-      if (model == null ? void 0 : model.emitter) {
-        model.emitter.off("onSubModelAdded", triggerRebuild);
-        model.emitter.off("onSubModelRemoved", triggerRebuild);
-        model.emitter.off("onSubModelReplaced", triggerRebuild);
+    const triggerRebuild = /* @__PURE__ */ __name(() => {
+      setRefreshTick((v) => v + 1);
+    }, "triggerRebuild");
+    const cleanups = [];
+    walkSubModels(model, { maxDepth: menuLevels, mode: "visited" }, (targetModel, { depth }) => {
+      const eventNames = ["onStepParamsChanged"];
+      if (depth === 1) {
+        eventNames.push("onSubModelAdded", "onSubModelRemoved", "onSubModelReplaced");
       }
+      eventNames.forEach((eventName) => {
+        var _a;
+        (_a = targetModel.emitter) == null ? void 0 : _a.on(eventName, triggerRebuild);
+        cleanups.push(() => {
+          var _a2;
+          return (_a2 = targetModel.emitter) == null ? void 0 : _a2.off(eventName, triggerRebuild);
+        });
+      });
+    });
+    return () => {
+      cleanups.forEach((dispose) => dispose());
     };
-  }, [model]);
+  }, [model, menuLevels, refreshTick]);
   (0, import_react.useEffect)(() => {
     const loadConfigurableFlowsAndSteps = /* @__PURE__ */ __name(async () => {
       setIsLoading(true);
@@ -362,26 +475,60 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
       if (flattenSubMenus) {
         configurableFlowsAndSteps.forEach(({ flow, steps, modelKey }) => {
           const groupKey = generateUniqueKey(`flow-group-${modelKey ? `${modelKey}-` : ""}${flow.key}`);
-          items.push({
-            key: groupKey,
-            label: t(flow.title) || flow.key,
-            type: "group"
-          });
+          if (flow.options.divider === "top") {
+            items.push({
+              type: "divider"
+            });
+          }
+          if (flow.options.enableTitle) {
+            items.push({
+              key: groupKey,
+              label: t(flow.title) || flow.key,
+              type: "group"
+            });
+          }
           steps.forEach((stepInfo) => {
             const baseMenuKey = modelKey ? `${modelKey}:${flow.key}:${stepInfo.stepKey}` : `${flow.key}:${stepInfo.stepKey}`;
             const uniqueKey = generateUniqueKey(baseMenuKey);
+            const uiMode = stepInfo.uiMode;
+            const subModel = stepInfo.modelKey ? findSubModelByKey(model, stepInfo.modelKey) : null;
+            const targetModel = subModel || model;
+            const stepParams = targetModel.getStepParams(flow.key, stepInfo.stepKey) || {};
+            const itemProps = {
+              getDefaultValue: /* @__PURE__ */ __name(async () => {
+                var _a;
+                let defaultParams = await (0, import_utils.resolveDefaultParams)(stepInfo.step.defaultParams, targetModel.context);
+                if (stepInfo.step.use) {
+                  const action = (_a = targetModel.getAction) == null ? void 0 : _a.call(targetModel, stepInfo.step.use);
+                  defaultParams = await (0, import_utils.resolveDefaultParams)(action.defaultParams, targetModel.context);
+                }
+                return { ...defaultParams, ...stepParams };
+              }, "getDefaultValue"),
+              onChange: /* @__PURE__ */ __name(async (val) => {
+                var _a;
+                targetModel.setStepParams(flow.key, stepInfo.stepKey, val);
+                if (typeof stepInfo.step.beforeParamsSave === "function") {
+                  await stepInfo.step.beforeParamsSave(targetModel.context, val, stepParams);
+                }
+                await targetModel.saveStepParams();
+                (_a = message == null ? void 0 : message.success) == null ? void 0 : _a.call(message, t("Configuration saved"));
+                if (typeof stepInfo.step.afterParamsSave === "function") {
+                  await stepInfo.step.afterParamsSave(targetModel.context, val, stepParams);
+                }
+              }, "onChange"),
+              ...(uiMode == null ? void 0 : uiMode.props) || {},
+              itemKey: uiMode == null ? void 0 : uiMode.key
+            };
             items.push({
               key: uniqueKey,
-              label: t(stepInfo.title)
+              label: /* @__PURE__ */ import_react.default.createElement(MenuLabelItem, { title: stepInfo.title, uiMode, itemProps })
             });
-            if (flow.key === "popupSettings") {
-              const copyKey = generateUniqueKey(`copy-pop-uid:${baseMenuKey}`);
-              items.push({
-                key: copyKey,
-                label: t("Copy popup UID")
-              });
-            }
           });
+          if (flow.options.divider === "bottom") {
+            items.push({
+              type: "divider"
+            });
+          }
         });
       } else {
         const modelGroups = /* @__PURE__ */ new Map();
@@ -408,15 +555,8 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
                 const uniqueKey = generateUniqueKey(`${flow.key}:${stepInfo.stepKey}`);
                 items.push({
                   key: uniqueKey,
-                  label: t(stepInfo.title)
+                  label: stepInfo.title
                 });
-                if (flow.key === "popupSettings") {
-                  const copyKey = generateUniqueKey(`copy-pop-uid:${flow.key}:${stepInfo.stepKey}`);
-                  items.push({
-                    key: copyKey,
-                    label: t("Copy popup UID")
-                  });
-                }
               });
             });
           } else {
@@ -427,15 +567,8 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
                 const uniqueKey = generateUniqueKey(`${modelKey}:${flow.key}:${stepInfo.stepKey}`);
                 subMenuChildren.push({
                   key: uniqueKey,
-                  label: t(stepInfo.title)
+                  label: stepInfo.title
                 });
-                if (flow.key === "popupSettings") {
-                  const copyKey = generateUniqueKey(`copy-pop-uid:${modelKey}:${flow.key}:${stepInfo.stepKey}`);
-                  subMenuChildren.push({
-                    key: copyKey,
-                    label: t("Copy popup UID")
-                  });
-                }
               });
             });
             items.push({
@@ -451,12 +584,14 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
   }, [configurableFlowsAndSteps, flattenSubMenus, t]);
   const finalMenuItems = (0, import_react.useMemo)(() => {
     const items = [...menuItems];
-    if (showCopyUidButton || showDeleteButton) {
+    const commonExtras = extraMenuItems.filter((it) => it.group === "common-actions").sort((a, b) => (a.sort ?? 0) - (b.sort ?? 0));
+    if (showCopyUidButton || showDeleteButton || commonExtras.length > 0) {
       items.push({
-        key: "common-actions",
-        label: t("Common actions"),
-        type: "group"
+        type: "divider"
       });
+      if (commonExtras.length > 0) {
+        items.push(...commonExtras);
+      }
       if (showCopyUidButton && model.uid) {
         items.push({
           key: "copy-uid",
@@ -471,8 +606,9 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
       }
     }
     return items;
-  }, [menuItems, showCopyUidButton, showDeleteButton, model.uid, model.destroy, t]);
-  if (isLoading || configurableFlowsAndSteps.length === 0 && !showDeleteButton && !showCopyUidButton) {
+  }, [menuItems, showCopyUidButton, showDeleteButton, model.uid, model.destroy, t, extraMenuItems]);
+  const hasExtras = extraMenuItems.some((it) => it.group === "common-actions");
+  if (isLoading || configurableFlowsAndSteps.length === 0 && !showDeleteButton && !showCopyUidButton && !hasExtras) {
     return null;
   }
   if (!model || !model.uid) {