@nocobase/flow-engine 2.1.0-beta.43 → 2.1.0-beta.44

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

@@ -207,8 +207,17 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
   const [visible, setVisible] = (0, import_react.useState)(false);
   const [refreshTick, setRefreshTick] = (0, import_react.useState)(0);
   const [extraMenuItems, setExtraMenuItems] = (0, import_react.useState)([]);
+  const [extraMenuItemsLoaded, setExtraMenuItemsLoaded] = (0, import_react.useState)(false);
   const [configurableFlowsAndSteps, setConfigurableFlowsAndSteps] = (0, import_react.useState)([]);
   const [isLoading, setIsLoading] = (0, import_react.useState)(true);
+  const commonExtras = (0, import_react.useMemo)(
+    () => extraMenuItems.filter((it) => it.group === "common-actions").sort((a, b) => (a.sort ?? 0) - (b.sort ?? 0)),
+    [extraMenuItems]
+  );
+  const hasCommonActions = showCopyUidButton || showDeleteButton || commonExtras.length > 0;
+  const shouldDeferConfigLoading = flattenSubMenus && menuLevels > 1 && hasCommonActions;
+  const shouldWaitForCommonActionProbe = flattenSubMenus && menuLevels > 1 && !showCopyUidButton && !showDeleteButton && !extraMenuItemsLoaded;
+  const canRenderIcon = hasCommonActions || !isLoading && configurableFlowsAndSteps.length > 0;
   const closeDropdown = (0, import_react.useCallback)(() => {
     setVisible(false);
     onDropdownVisibleChange == null ? void 0 : onDropdownVisibleChange(false);
@@ -240,24 +249,28 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
     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
-            }))
-          );
+      setExtraMenuItemsLoaded(false);
+      try {
+        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) {
+          return;
         }
-      }
-      if (mounted) {
         const seen = /* @__PURE__ */ new Set();
         const dedupedExtras = allExtras.filter((item) => {
           if (seen.has(`${item.key}`)) {
@@ -267,15 +280,22 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
           return true;
         });
         setExtraMenuItems(dedupedExtras);
+      } catch (error) {
+        console.error("Failed to load extra menu items:", error);
+        if (mounted) {
+          setExtraMenuItems([]);
+        }
+      } finally {
+        if (mounted) {
+          setExtraMenuItemsLoaded(true);
+        }
       }
     }, "loadExtras");
-    if (visible) {
-      loadExtras();
-    }
+    loadExtras();
     return () => {
       mounted = false;
     };
-  }, [model, menuLevels, t, refreshTick, visible]);
+  }, [model, menuLevels, t, refreshTick]);
   const copyUidToClipboard = (0, import_react.useCallback)(
     async (uid) => {
       var _a;
@@ -520,7 +540,7 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
         return [];
       }
     },
-    []
+    [t]
   );
   const getConfigurableFlowsAndSteps = (0, import_react.useCallback)(async () => {
     const result = [];
@@ -558,20 +578,47 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
     };
   }, [model, menuLevels, refreshTick]);
   (0, import_react.useEffect)(() => {
+    let mounted = true;
     const loadConfigurableFlowsAndSteps = /* @__PURE__ */ __name(async () => {
       setIsLoading(true);
+      if (shouldDeferConfigLoading) {
+        setConfigurableFlowsAndSteps([]);
+      }
       try {
         const flows = await getConfigurableFlowsAndSteps();
-        setConfigurableFlowsAndSteps(flows);
+        if (mounted) {
+          setConfigurableFlowsAndSteps(flows);
+        }
       } catch (error) {
         console.error("Failed to load configurable flows and steps:", error);
-        setConfigurableFlowsAndSteps([]);
+        if (mounted) {
+          setConfigurableFlowsAndSteps([]);
+        }
       } finally {
-        setIsLoading(false);
+        if (mounted) {
+          setIsLoading(false);
+        }
       }
     }, "loadConfigurableFlowsAndSteps");
+    if (shouldWaitForCommonActionProbe) {
+      setConfigurableFlowsAndSteps([]);
+      setIsLoading(false);
+      return () => {
+        mounted = false;
+      };
+    }
+    if (!visible && shouldDeferConfigLoading) {
+      setConfigurableFlowsAndSteps([]);
+      setIsLoading(false);
+      return () => {
+        mounted = false;
+      };
+    }
     loadConfigurableFlowsAndSteps();
-  }, [getConfigurableFlowsAndSteps, refreshTick]);
+    return () => {
+      mounted = false;
+    };
+  }, [getConfigurableFlowsAndSteps, refreshTick, shouldDeferConfigLoading, shouldWaitForCommonActionProbe, visible]);
   const menuItems = (0, import_react.useMemo)(() => {
     const items = [];
     const keyCounter = /* @__PURE__ */ new Map();
@@ -696,10 +743,9 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
       }
     }
     return items;
-  }, [configurableFlowsAndSteps, disabledIconColor, flattenSubMenus, t]);
+  }, [configurableFlowsAndSteps, disabledIconColor, flattenSubMenus, message, model, t]);
   const finalMenuItems = (0, import_react.useMemo)(() => {
     const items = [...menuItems];
-    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({
         type: "divider"
@@ -721,9 +767,8 @@ const DefaultSettingsIcon = /* @__PURE__ */ __name(({
       }
     }
     return items;
-  }, [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) {
+  }, [menuItems, showCopyUidButton, showDeleteButton, commonExtras, model.uid, model.destroy, t]);
+  if (!canRenderIcon) {
     return null;
   }
   if (!model || !model.uid) {

package/lib/executor/FlowExecutor.js

@@ -153,9 +153,6 @@ const _FlowExecutor = class _FlowExecutor {
         const stepDefaultParams = await (0, import_utils.resolveDefaultParams)(step.defaultParams, runtimeCtx);
         combinedParams = { ...stepDefaultParams };
       } else {
-        flowContext.logger.warn(
-          `BaseModel.applyFlow: Step '${stepKey}' in flow '${flowKey}' has neither 'use' nor 'handler'. Skipping.`
-        );
         continue;
       }
       const modelStepParams = model.getStepParams(flowKey, stepKey);

package/lib/flowEngine.d.ts

@@ -538,11 +538,11 @@ export declare class FlowEngine {
     replaceModel<T extends FlowModel = FlowModel>(uid: string, optionsOrFn?: Partial<FlowModelOptions> | ((currentOptions: FlowModelOptions) => Partial<FlowModelOptions>)): Promise<T | null>;
     /**
      * Move a model instance within its parent model.
-     * @param {any} sourceId Source model UID
-     * @param {any} targetId Target model UID
+     * @param {string | number} sourceId Source model UID
+     * @param {string | number} targetId Target model UID
      * @returns {Promise<void>} No return value
      */
-    moveModel(sourceId: any, targetId: any, options?: PersistOptions): Promise<void>;
+    moveModel(sourceId: string | number, targetId: string | number, options?: PersistOptions): Promise<void>;
     /**
      * Filter model classes by parent class (supports multi-level inheritance).
      * @param {string | ModelConstructor} parentClass Parent class name or constructor

package/lib/flowEngine.js

@@ -1376,18 +1376,24 @@ const _FlowEngine = class _FlowEngine {
   }
   /**
    * Move a model instance within its parent model.
-   * @param {any} sourceId Source model UID
-   * @param {any} targetId Target model UID
+   * @param {string | number} sourceId Source model UID
+   * @param {string | number} targetId Target model UID
    * @returns {Promise<void>} No return value
    */
   async moveModel(sourceId, targetId, options) {
     var _a, _b;
-    const sourceModel = this.getModel(sourceId);
-    const targetModel = this.getModel(targetId);
+    const sourceUid = String(sourceId);
+    const targetUid = String(targetId);
+    if (!sourceUid || !targetUid || sourceUid === targetUid) {
+      return;
+    }
+    const sourceModel = this.getModel(sourceUid);
+    const targetModel = this.getModel(targetUid);
     if (!sourceModel || !targetModel) {
       console.warn(`FlowEngine: Cannot move model. Source or target model not found.`);
       return;
     }
+    let position = "after";
     const dirtyLoadedPageKey = this._loadedPageCache.getDirtyKeyForModel(sourceModel);
     const move = /* @__PURE__ */ __name((sourceModel2, targetModel2) => {
       if (!sourceModel2.parent || !targetModel2.parent || sourceModel2.parent !== targetModel2.parent) {
@@ -1411,6 +1417,7 @@ const _FlowEngine = class _FlowEngine {
         console.warn("FlowModel.moveTo: Current model is already at the target position. No action taken.");
         return false;
       }
+      position = currentIndex < targetIndex ? "after" : "before";
       const [movedModel] = subModelsCopy.splice(currentIndex, 1);
       subModelsCopy.splice(targetIndex, 0, movedModel);
       subModelsCopy.forEach((model, index) => {
@@ -1419,10 +1426,12 @@ const _FlowEngine = class _FlowEngine {
       subModels.splice(0, subModels.length, ...subModelsCopy);
       return true;
     }, "move");
-    move(sourceModel, targetModel);
+    const moved = move(sourceModel, targetModel);
+    if (!moved) {
+      return;
+    }
     if ((options == null ? void 0 : options.persist) !== false && this.ensureModelRepository()) {
-      const position = sourceModel.sortIndex - targetModel.sortIndex > 0 ? "after" : "before";
-      await this._modelRepository.move(sourceId, targetId, position);
+      await this._modelRepository.move(sourceUid, targetUid, position);
       this._loadedPageCache.markDirty(dirtyLoadedPageKey);
     }
     sourceModel.parent.emitter.emit("onSubModelMoved", { source: sourceModel, target: targetModel });

package/lib/models/flowModel.js

@@ -71,6 +71,18 @@ var _flowContext;
 const classActionRegistries = /* @__PURE__ */ new WeakMap();
 const classEventRegistries = /* @__PURE__ */ new WeakMap();
 const modelMetas = /* @__PURE__ */ new WeakMap();
+function getStableSortIndex(item, fallbackIndex) {
+  return typeof (item == null ? void 0 : item.sortIndex) === "number" && Number.isFinite(item.sortIndex) ? item.sortIndex : fallbackIndex + 1;
+}
+__name(getStableSortIndex, "getStableSortIndex");
+function sortByStableSortIndex(items) {
+  return items.map((item, index) => ({
+    item,
+    index,
+    sortIndex: getStableSortIndex(item, index)
+  })).sort((a, b) => a.sortIndex - b.sortIndex || a.index - b.index).map(({ item }) => item);
+}
+__name(sortByStableSortIndex, "sortByStableSortIndex");
 const modelGlobalRegistries = /* @__PURE__ */ new WeakMap();
 const classMenuExtensions = /* @__PURE__ */ new WeakMap();
 const sortExtraMenuItems = /* @__PURE__ */ __name((items) => {
@@ -204,7 +216,7 @@ const _FlowModel = class _FlowModel {
     };
     this.stepParams = options.stepParams || {};
     this.subModels = {};
-    this.sortIndex = options.sortIndex || 0;
+    this.sortIndex = getStableSortIndex({ sortIndex: options.sortIndex }, -1);
     this._options = options;
     this._title = "";
     this._extraTitle = "";
@@ -416,7 +428,7 @@ const _FlowModel = class _FlowModel {
     }
     Object.entries(mergedSubModels || {}).forEach(([key, value]) => {
       if (Array.isArray(value)) {
-        value.sort((a, b) => (a.sortIndex || 0) - (b.sortIndex || 0)).forEach((item) => {
+        sortByStableSortIndex(value).forEach((item) => {
           this.addSubModel(key, item);
         });
       } else {
@@ -628,26 +640,43 @@ const _FlowModel = class _FlowModel {
     return this.props;
   }
   setStepParams(flowKeyOrAllParams, stepKeyOrStepsParams, params) {
+    var _a;
+    let hasChanged = false;
     if (typeof flowKeyOrAllParams === "string") {
       const flowKey = flowKeyOrAllParams;
       if (typeof stepKeyOrStepsParams === "string" && params !== void 0) {
-        if (!this.stepParams[flowKey]) {
-          this.stepParams[flowKey] = {};
+        const currentStepParams = ((_a = this.stepParams[flowKey]) == null ? void 0 : _a[stepKeyOrStepsParams]) || {};
+        const nextStepParams = { ...currentStepParams, ...params };
+        if (!import_lodash.default.isEqual(currentStepParams, nextStepParams)) {
+          if (!this.stepParams[flowKey]) {
+            this.stepParams[flowKey] = {};
+          }
+          this.stepParams[flowKey][stepKeyOrStepsParams] = nextStepParams;
+          hasChanged = true;
         }
-        this.stepParams[flowKey][stepKeyOrStepsParams] = {
-          ...this.stepParams[flowKey][stepKeyOrStepsParams],
-          ...params
-        };
       } else if (typeof stepKeyOrStepsParams === "object" && stepKeyOrStepsParams !== null) {
-        this.stepParams[flowKey] = { ...this.stepParams[flowKey] || {}, ...stepKeyOrStepsParams };
+        const currentFlowParams = this.stepParams[flowKey] || {};
+        const nextFlowParams = { ...currentFlowParams, ...stepKeyOrStepsParams };
+        if (!import_lodash.default.isEqual(currentFlowParams, nextFlowParams)) {
+          this.stepParams[flowKey] = nextFlowParams;
+          hasChanged = true;
+        }
       }
     } else if (typeof flowKeyOrAllParams === "object" && flowKeyOrAllParams !== null) {
       for (const fk in flowKeyOrAllParams) {
         if (Object.prototype.hasOwnProperty.call(flowKeyOrAllParams, fk)) {
-          this.stepParams[fk] = { ...this.stepParams[fk] || {}, ...flowKeyOrAllParams[fk] };
+          const currentFlowParams = this.stepParams[fk] || {};
+          const nextFlowParams = { ...currentFlowParams, ...flowKeyOrAllParams[fk] };
+          if (!import_lodash.default.isEqual(currentFlowParams, nextFlowParams)) {
+            this.stepParams[fk] = nextFlowParams;
+            hasChanged = true;
+          }
         }
       }
     }
+    if (!hasChanged) {
+      return;
+    }
     this.emitter.emit("onStepParamsChanged");
   }
   getStepParams(flowKey, stepKey) {
@@ -933,7 +962,10 @@ const _FlowModel = class _FlowModel {
     if (!Array.isArray(subModels[subKey])) {
       subModels[subKey] = import_reactive.observable.shallow([]);
     }
-    const maxSortIndex = Math.max(...subModels[subKey].map((item) => item.sortIndex || 0), 0);
+    const maxSortIndex = Math.max(
+      ...subModels[subKey].map((item, index) => getStableSortIndex(item, index)),
+      0
+    );
     model.sortIndex = maxSortIndex + 1;
     subModels[subKey].push(model);
     actualParent.emitter.emit("onSubModelAdded", model);
@@ -981,7 +1013,7 @@ const _FlowModel = class _FlowModel {
       return [];
     }
     const results = [];
-    import_lodash.default.castArray(model).sort((a, b) => (a.sortIndex || 0) - (b.sortIndex || 0)).forEach((item, index) => {
+    sortByStableSortIndex(import_lodash.default.castArray(model)).forEach((item, index) => {
       const result = callback(item, index);
       if (result) {
         results.push(item);
@@ -995,7 +1027,7 @@ const _FlowModel = class _FlowModel {
       return [];
     }
     const results = [];
-    import_lodash.default.castArray(model).sort((a, b) => (a.sortIndex || 0) - (b.sortIndex || 0)).forEach((item, index) => {
+    sortByStableSortIndex(import_lodash.default.castArray(model)).forEach((item, index) => {
       const result = callback(item, index);
       results.push(result);
     });

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/flow-engine",
-  "version": "2.1.0-beta.43",
+  "version": "2.1.0-beta.44",
   "private": false,
   "description": "A standalone flow engine for NocoBase, managing workflows, models, and actions.",
   "main": "lib/index.js",
@@ -8,8 +8,8 @@
   "dependencies": {
     "@formily/antd-v5": "1.x",
     "@formily/reactive": "2.x",
-    "@nocobase/sdk": "2.1.0-beta.43",
-    "@nocobase/shared": "2.1.0-beta.43",
+    "@nocobase/sdk": "2.1.0-beta.44",
+    "@nocobase/shared": "2.1.0-beta.44",
     "ahooks": "^3.7.2",
     "axios": "^1.7.0",
     "dayjs": "^1.11.9",
@@ -37,5 +37,5 @@
   ],
   "author": "NocoBase Team",
   "license": "Apache-2.0",
-  "gitHead": "6d7750e2373bf2451d246de88cc1f62491685e18"
+  "gitHead": "540d4897b1696cc24c0754521b0b766978b4933c"
 }

package/src/__tests__/flowEngine.moveModel.test.ts

@@ -8,9 +8,30 @@
  */
 
 import { reaction } from '@nocobase/flow-engine';
-import { beforeEach, describe, expect, it } from 'vitest';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
 import { FlowEngine } from '../flowEngine';
 import { FlowModel } from '../models';
+import type { IFlowModelRepository } from '../types';
+
+class MoveRepository implements IFlowModelRepository {
+  move = vi.fn(async (_sourceId: string, _targetId: string, _position: 'before' | 'after'): Promise<void> => {});
+
+  async findOne(): Promise<Record<string, unknown> | null> {
+    return null;
+  }
+
+  async save(): Promise<Record<string, unknown>> {
+    return {};
+  }
+
+  async destroy(): Promise<boolean> {
+    return true;
+  }
+
+  async duplicate(): Promise<Record<string, unknown> | null> {
+    return null;
+  }
+}
 
 describe('FlowEngine moveModel', () => {
   let engine: FlowEngine;
@@ -20,6 +41,14 @@ describe('FlowEngine moveModel', () => {
     engine.registerModels({ FlowModel });
   });
 
+  const createParentWithChildren = () => {
+    const parent = engine.createModel({ uid: 'parent', use: 'FlowModel' });
+    parent.addSubModel('items', { uid: 'child-a', use: 'FlowModel' });
+    parent.addSubModel('items', { uid: 'child-b', use: 'FlowModel' });
+    parent.addSubModel('items', { uid: 'child-c', use: 'FlowModel' });
+    return parent;
+  };
+
   it('keeps subModels array reactive after move so later additions trigger reactions', async () => {
     const parent = engine.createModel({ uid: 'parent', use: 'FlowModel' });
     parent.addSubModel('items', { uid: 'child-a', use: 'FlowModel' });
@@ -40,4 +69,55 @@ describe('FlowEngine moveModel', () => {
     dispose();
     expect(seen).toEqual([3]);
   });
+
+  it('persists an after move when dragging forward', async () => {
+    const repository = new MoveRepository();
+    engine.setModelRepository(repository);
+    const parent = createParentWithChildren();
+
+    await engine.moveModel('child-a', 'child-c');
+
+    expect(repository.move).toHaveBeenCalledWith('child-a', 'child-c', 'after');
+    expect((parent.subModels.items as FlowModel[]).map((item) => item.uid)).toEqual(['child-b', 'child-c', 'child-a']);
+  });
+
+  it('persists a before move when dragging backward', async () => {
+    const repository = new MoveRepository();
+    engine.setModelRepository(repository);
+    const parent = createParentWithChildren();
+
+    await engine.moveModel('child-c', 'child-a');
+
+    expect(repository.move).toHaveBeenCalledWith('child-c', 'child-a', 'before');
+    expect((parent.subModels.items as FlowModel[]).map((item) => item.uid)).toEqual(['child-c', 'child-a', 'child-b']);
+  });
+
+  it('does not persist self-drop', async () => {
+    const repository = new MoveRepository();
+    engine.setModelRepository(repository);
+    const parent = createParentWithChildren();
+
+    await engine.moveModel('child-a', 'child-a');
+
+    expect(repository.move).not.toHaveBeenCalled();
+    expect((parent.subModels.items as FlowModel[]).map((item) => item.uid)).toEqual(['child-a', 'child-b', 'child-c']);
+  });
+
+  it('keeps null sortIndex subModels in stable order', () => {
+    const parent = engine.createModel({
+      uid: 'parent',
+      use: 'FlowModel',
+      subModels: {
+        items: [
+          { uid: 'child-a', use: 'FlowModel', sortIndex: null as unknown as number },
+          { uid: 'child-b', use: 'FlowModel', sortIndex: null as unknown as number },
+        ],
+      },
+    });
+
+    parent.addSubModel('items', { uid: 'child-c', use: 'FlowModel' });
+
+    expect((parent.subModels.items as FlowModel[]).map((item) => item.uid)).toEqual(['child-a', 'child-b', 'child-c']);
+    expect((parent.subModels.items as FlowModel[]).map((item) => item.sortIndex)).toEqual([1, 2, 3]);
+  });
 });

package/src/components/settings/wrappers/contextual/DefaultSettingsIcon.tsx

@@ -263,8 +263,18 @@ export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
   // 当模型发生子模型替换/增删等变化时，强制刷新菜单数据
   const [refreshTick, setRefreshTick] = useState(0);
   const [extraMenuItems, setExtraMenuItems] = useState<FlowModelExtraMenuItem[]>([]);
+  const [extraMenuItemsLoaded, setExtraMenuItemsLoaded] = useState(false);
   const [configurableFlowsAndSteps, setConfigurableFlowsAndSteps] = useState<FlowInfo[]>([]);
   const [isLoading, setIsLoading] = useState(true);
+  const commonExtras = useMemo(
+    () => extraMenuItems.filter((it) => it.group === 'common-actions').sort((a, b) => (a.sort ?? 0) - (b.sort ?? 0)),
+    [extraMenuItems],
+  );
+  const hasCommonActions = showCopyUidButton || showDeleteButton || commonExtras.length > 0;
+  const shouldDeferConfigLoading = flattenSubMenus && menuLevels > 1 && hasCommonActions;
+  const shouldWaitForCommonActionProbe =
+    flattenSubMenus && menuLevels > 1 && !showCopyUidButton && !showDeleteButton && !extraMenuItemsLoaded;
+  const canRenderIcon = hasCommonActions || (!isLoading && configurableFlowsAndSteps.length > 0);
   const closeDropdown = useCallback(() => {
     setVisible(false);
     onDropdownVisibleChange?.(false);
@@ -303,26 +313,30 @@ export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
   useEffect(() => {
     let mounted = true;
     const loadExtras = async () => {
-      const allExtras: FlowModelExtraMenuItem[] = [];
-      const modelsToProcess: Array<{ model: FlowModel; modelKey?: string }> = [];
-      walkSubModels(model, { maxDepth: menuLevels, arrayLimit: 50, mode: 'stack' }, (targetModel, { modelKey }) => {
-        modelsToProcess.push({ model: targetModel, modelKey });
-      });
+      setExtraMenuItemsLoaded(false);
+      try {
+        const allExtras: FlowModelExtraMenuItem[] = [];
+        const modelsToProcess: Array<{ model: FlowModel; modelKey?: string }> = [];
+        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 as typeof FlowModel;
-        const extras = await Cls.getExtraMenuItems?.(targetModel, t);
-        if (extras?.length) {
-          allExtras.push(
-            ...extras.map((item) => ({
-              ...item,
-              key: modelKey ? `${modelKey}:${item.key}` : item.key,
-            })),
-          );
+        for (const { model: targetModel, modelKey } of modelsToProcess) {
+          const Cls = targetModel.constructor as typeof FlowModel;
+          const extras = await Cls.getExtraMenuItems?.(targetModel, t);
+          if (extras?.length) {
+            allExtras.push(
+              ...extras.map((item) => ({
+                ...item,
+                key: modelKey ? `${modelKey}:${item.key}` : item.key,
+              })),
+            );
+          }
         }
-      }
 
-      if (mounted) {
+        if (!mounted) {
+          return;
+        }
         const seen = new Set<string>();
         const dedupedExtras = allExtras.filter((item) => {
           if (seen.has(`${item.key}`)) {
@@ -332,16 +346,22 @@ export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
           return true;
         });
         setExtraMenuItems(dedupedExtras);
+      } catch (error) {
+        console.error('Failed to load extra menu items:', error);
+        if (mounted) {
+          setExtraMenuItems([]);
+        }
+      } finally {
+        if (mounted) {
+          setExtraMenuItemsLoaded(true);
+        }
       }
     };
-    // 避免 effect 触发 setState 导致循环：仅在 visible 打开时加载一次，关闭后仍保留结果
-    if (visible) {
-      loadExtras();
-    }
+    loadExtras();
     return () => {
       mounted = false;
     };
-  }, [model, menuLevels, t, refreshTick, visible]);
+  }, [model, menuLevels, t, refreshTick]);
 
   // 统一的复制 UID 方法
   const copyUidToClipboard = useCallback(
@@ -632,7 +652,7 @@ export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
         return [];
       }
     },
-    [],
+    [t],
   );
 
   // 获取可配置的flows和steps
@@ -675,21 +695,50 @@ export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
   }, [model, menuLevels, refreshTick]);
 
   useEffect(() => {
+    let mounted = true;
     const loadConfigurableFlowsAndSteps = async () => {
       setIsLoading(true);
+      if (shouldDeferConfigLoading) {
+        setConfigurableFlowsAndSteps([]);
+      }
       try {
         const flows = await getConfigurableFlowsAndSteps();
-        setConfigurableFlowsAndSteps(flows);
+        if (mounted) {
+          setConfigurableFlowsAndSteps(flows);
+        }
       } catch (error) {
         console.error('Failed to load configurable flows and steps:', error);
-        setConfigurableFlowsAndSteps([]);
+        if (mounted) {
+          setConfigurableFlowsAndSteps([]);
+        }
       } finally {
-        setIsLoading(false);
+        if (mounted) {
+          setIsLoading(false);
+        }
       }
     };
 
+    if (shouldWaitForCommonActionProbe) {
+      setConfigurableFlowsAndSteps([]);
+      setIsLoading(false);
+      return () => {
+        mounted = false;
+      };
+    }
+
+    if (!visible && shouldDeferConfigLoading) {
+      setConfigurableFlowsAndSteps([]);
+      setIsLoading(false);
+      return () => {
+        mounted = false;
+      };
+    }
+
     loadConfigurableFlowsAndSteps();
-  }, [getConfigurableFlowsAndSteps, refreshTick]);
+    return () => {
+      mounted = false;
+    };
+  }, [getConfigurableFlowsAndSteps, refreshTick, shouldDeferConfigLoading, shouldWaitForCommonActionProbe, visible]);
 
   // 构建菜单项，包含错误处理和记忆化
   const menuItems = useMemo((): NonNullable<MenuProps['items']> => {
@@ -856,16 +905,12 @@ export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
     }
 
     return items;
-  }, [configurableFlowsAndSteps, disabledIconColor, flattenSubMenus, t]);
+  }, [configurableFlowsAndSteps, disabledIconColor, flattenSubMenus, message, model, t]);
 
   // 向菜单项添加额外按钮
   const finalMenuItems = useMemo((): NonNullable<MenuProps['items']> => {
     const items = [...menuItems];
 
-    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({
         type: 'divider',
@@ -901,12 +946,9 @@ export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
     }
 
     return items;
-  }, [menuItems, showCopyUidButton, showDeleteButton, model.uid, model.destroy, t, extraMenuItems]);
-
-  // 如果正在加载或没有可配置的flows且不显示删除按钮和复制UID按钮，不显示菜单
-  const hasExtras = extraMenuItems.some((it) => it.group === 'common-actions');
+  }, [menuItems, showCopyUidButton, showDeleteButton, commonExtras, model.uid, model.destroy, t]);
 
-  if (isLoading || (configurableFlowsAndSteps.length === 0 && !showDeleteButton && !showCopyUidButton && !hasExtras)) {
+  if (!canRenderIcon) {
     return null;
   }
 

package/src/components/settings/wrappers/contextual/__tests__/DefaultSettingsIcon.test.tsx

@@ -7,10 +7,10 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import React from 'react';
-import { describe, it, expect, vi, beforeEach, afterEach } from 'vitest';
-import { render, cleanup, waitFor, act } from '@testing-library/react';
+import { act, cleanup, render, waitFor } from '@testing-library/react';
 import { App, ConfigProvider } from 'antd';
+import React from 'react';
+import { afterEach, beforeEach, describe, expect, it, vi } from 'vitest';
 
 import { FlowEngine } from '../../../../../flowEngine';
 import { FlowModel } from '../../../../../models/flowModel';
@@ -141,6 +141,86 @@ describe('DefaultSettingsIcon - only static flows are shown', () => {
     vi.clearAllMocks();
   });
 
+  it('defers nested configurable step resolution and clears stale config while closed', async () => {
+    class TestFlowModel extends FlowModel {}
+
+    const engine = new FlowEngine();
+    const model = new TestFlowModel({ uid: 'model-lazy-settings', flowEngine: engine });
+    const hideInSettings = vi.fn((ctx) => !!ctx.getStepParams('general')?.hidden);
+    const uiSchema = vi.fn(() => ({
+      field: { type: 'string', 'x-component': 'Input' },
+    }));
+
+    TestFlowModel.registerFlow({
+      key: 'lazyFlow',
+      title: 'Lazy Flow',
+      steps: {
+        general: {
+          title: 'General',
+          hideInSettings,
+          uiSchema,
+        },
+      },
+    });
+
+    const { getByLabelText } = render(
+      React.createElement(
+        ConfigProvider as any,
+        null,
+        React.createElement(
+          App as any,
+          null,
+          React.createElement(DefaultSettingsIcon as any, { model, menuLevels: 2 }),
+        ),
+      ),
+    );
+
+    expect(getByLabelText('flows-settings')).toBeTruthy();
+    expect(hideInSettings).not.toHaveBeenCalled();
+    expect(uiSchema).not.toHaveBeenCalled();
+
+    await act(async () => {
+      (globalThis as any).__lastDropdownOnOpenChange?.(true, { source: 'trigger' });
+    });
+
+    await waitFor(() => {
+      expect(hideInSettings).toHaveBeenCalledTimes(1);
+      expect(uiSchema).toHaveBeenCalledTimes(1);
+      const menu = (globalThis as any).__lastDropdownMenu;
+      const items = (menu?.items || []) as any[];
+      expect(items.some((it) => String(it.key || '') === 'lazyFlow:general')).toBe(true);
+    });
+
+    await act(async () => {
+      (globalThis as any).__lastDropdownOnOpenChange?.(false, { source: 'trigger' });
+    });
+
+    await waitFor(() => {
+      const menu = (globalThis as any).__lastDropdownMenu;
+      const items = (menu?.items || []) as any[];
+      expect(items.some((it) => String(it.key || '') === 'lazyFlow:general')).toBe(false);
+    });
+
+    await act(async () => {
+      model.setStepParams('lazyFlow', 'general', { hidden: true });
+    });
+
+    expect(hideInSettings).toHaveBeenCalledTimes(1);
+    expect(uiSchema).toHaveBeenCalledTimes(1);
+
+    await act(async () => {
+      (globalThis as any).__lastDropdownOnOpenChange?.(true, { source: 'trigger' });
+    });
+
+    await waitFor(() => {
+      expect(hideInSettings).toHaveBeenCalledTimes(2);
+      const menu = (globalThis as any).__lastDropdownMenu;
+      const items = (menu?.items || []) as any[];
+      expect(items.some((it) => String(it.key || '') === 'lazyFlow:general')).toBe(false);
+    });
+    expect(uiSchema).toHaveBeenCalledTimes(1);
+  });
+
   it('excludes instance (dynamic) flows from the settings menu', async () => {
     class TestFlowModel extends FlowModel {}
 
@@ -720,6 +800,10 @@ describe('DefaultSettingsIcon - only static flows are shown', () => {
       ),
     );
 
+    await act(async () => {
+      (globalThis as any).__lastDropdownOnOpenChange?.(true, { source: 'trigger' });
+    });
+
     await waitFor(() => {
       const menu = (globalThis as any).__lastDropdownMenu;
       expect(menu).toBeTruthy();
@@ -903,4 +987,67 @@ describe('DefaultSettingsIcon - extra menu items', () => {
       dispose?.();
     }
   });
+
+  it('uses common extra actions to defer nested configurable step resolution', async () => {
+    const onClick = vi.fn();
+
+    class TestFlowModel extends FlowModel {}
+    const dispose = TestFlowModel.registerExtraMenuItems({
+      group: 'common-actions',
+      sort: 10,
+      items: [{ key: 'extra-action', label: 'Extra Action', onClick }],
+    });
+
+    const engine = new FlowEngine();
+    const model = new TestFlowModel({ uid: 'm-extra-lazy', flowEngine: engine });
+    const uiSchema = vi.fn(() => ({
+      f: { type: 'string', 'x-component': 'Input' },
+    }));
+
+    TestFlowModel.registerFlow({
+      key: 'flow',
+      title: 'Flow',
+      steps: { s: { title: 'S', uiSchema } },
+    });
+
+    try {
+      const { getByLabelText } = render(
+        React.createElement(
+          ConfigProvider as any,
+          null,
+          React.createElement(
+            App as any,
+            null,
+            React.createElement(DefaultSettingsIcon as any, {
+              model,
+              menuLevels: 2,
+              showCopyUidButton: false,
+              showDeleteButton: false,
+            }),
+          ),
+        ),
+      );
+
+      await waitFor(() => {
+        expect(getByLabelText('flows-settings')).toBeTruthy();
+        const menu = (globalThis as any).__lastDropdownMenu;
+        const items = (menu?.items || []) as any[];
+        expect(items.some((it) => String(it.key || '') === 'extra-action')).toBe(true);
+      });
+      expect(uiSchema).not.toHaveBeenCalled();
+
+      await act(async () => {
+        (globalThis as any).__lastDropdownOnOpenChange?.(true, { source: 'trigger' });
+      });
+
+      await waitFor(() => {
+        expect(uiSchema).toHaveBeenCalledTimes(1);
+        const menu = (globalThis as any).__lastDropdownMenu;
+        const items = (menu?.items || []) as any[];
+        expect(items.some((it) => String(it.key || '') === 'flow:s')).toBe(true);
+      });
+    } finally {
+      dispose?.();
+    }
+  });
 });

package/src/executor/FlowExecutor.ts

@@ -158,9 +158,6 @@ export class FlowExecutor {
         const stepDefaultParams = await resolveDefaultParams(step.defaultParams, runtimeCtx);
         combinedParams = { ...stepDefaultParams };
       } else {
-        flowContext.logger.warn(
-          `BaseModel.applyFlow: Step '${stepKey}' in flow '${flowKey}' has neither 'use' nor 'handler'. Skipping.`,
-        );
         continue;
       }
 

package/src/executor/__tests__/flowExecutor.test.ts

@@ -81,7 +81,7 @@ describe('FlowExecutor', () => {
     expect(result.step2).toBe('step2-ok');
   });
 
-  it('runFlow warns and skips steps without use or handler', async () => {
+  it('runFlow silently skips steps without use or handler', async () => {
     const flows = {
       referenceSettings: {
         steps: {
@@ -98,9 +98,7 @@ describe('FlowExecutor', () => {
       const result = await engine.executor.runFlow(model, 'referenceSettings');
 
       expect(result).toEqual({});
-      expect(loggerWarnSpy).toHaveBeenCalledWith(
-        "BaseModel.applyFlow: Step 'target' in flow 'referenceSettings' has neither 'use' nor 'handler'. Skipping.",
-      );
+      expect(loggerWarnSpy).not.toHaveBeenCalled();
       expect(loggerErrorSpy).not.toHaveBeenCalled();
     } finally {
       loggerChildSpy.mockRestore();

package/src/flowEngine.ts

@@ -1631,17 +1631,24 @@ export class FlowEngine {
 
   /**
    * Move a model instance within its parent model.
-   * @param {any} sourceId Source model UID
-   * @param {any} targetId Target model UID
+   * @param {string | number} sourceId Source model UID
+   * @param {string | number} targetId Target model UID
    * @returns {Promise<void>} No return value
    */
-  async moveModel(sourceId: any, targetId: any, options?: PersistOptions): Promise<void> {
-    const sourceModel = this.getModel(sourceId);
-    const targetModel = this.getModel(targetId);
+  async moveModel(sourceId: string | number, targetId: string | number, options?: PersistOptions): Promise<void> {
+    const sourceUid = String(sourceId);
+    const targetUid = String(targetId);
+    if (!sourceUid || !targetUid || sourceUid === targetUid) {
+      return;
+    }
+
+    const sourceModel = this.getModel(sourceUid);
+    const targetModel = this.getModel(targetUid);
     if (!sourceModel || !targetModel) {
       console.warn(`FlowEngine: Cannot move model. Source or target model not found.`);
       return;
     }
+    let position: 'before' | 'after' = 'after';
     const dirtyLoadedPageKey = this._loadedPageCache.getDirtyKeyForModel(sourceModel);
     const move = (sourceModel: FlowModel, targetModel: FlowModel) => {
       if (!sourceModel.parent || !targetModel.parent || sourceModel.parent !== targetModel.parent) {
@@ -1672,6 +1679,8 @@ export class FlowEngine {
         return false;
       }
 
+      position = currentIndex < targetIndex ? 'after' : 'before';
+
       // 使用splice直接移动数组元素（O(n)比排序O(n log n)更快）
       const [movedModel] = subModelsCopy.splice(currentIndex, 1);
       subModelsCopy.splice(targetIndex, 0, movedModel);
@@ -1686,10 +1695,13 @@ export class FlowEngine {
 
       return true;
     };
-    move(sourceModel, targetModel);
+    const moved = move(sourceModel, targetModel);
+    if (!moved) {
+      return;
+    }
+
     if (options?.persist !== false && this.ensureModelRepository()) {
-      const position = sourceModel.sortIndex - targetModel.sortIndex > 0 ? 'after' : 'before';
-      await this._modelRepository.move(sourceId, targetId, position);
+      await this._modelRepository.move(sourceUid, targetUid, position);
       this._loadedPageCache.markDirty(dirtyLoadedPageKey);
     }
     // 触发事件以通知其他部分模型已移动

package/src/models/__tests__/flowModel.test.ts

@@ -313,6 +313,19 @@ describe('FlowModel', () => {
 
         model.emitter.off('onStepParamsChanged', listener);
       });
+
+      test('should not emit onStepParamsChanged when params are unchanged', () => {
+        const listener = vi.fn();
+        model.emitter.on('onStepParamsChanged', listener);
+
+        model.setStepParams('testFlow', 'step1', { param1: 'value1' });
+        model.setStepParams('testFlow', { step1: { param1: 'value1' } });
+        model.setStepParams({ testFlow: { step1: { param1: 'value1' } } });
+
+        expect(listener).not.toHaveBeenCalled();
+
+        model.emitter.off('onStepParamsChanged', listener);
+      });
     });
   });
 
@@ -550,34 +563,6 @@ describe('FlowModel', () => {
 
         loggerSpy.mockRestore();
       });
-
-      test('should warn and skip step when use and handler are both missing', async () => {
-        const warnSpy = vi.spyOn(model.context.logger, 'warn').mockImplementation(() => {});
-        const errorSpy = vi.spyOn(model.context.logger, 'error').mockImplementation(() => {});
-
-        TestFlowModel.registerFlow({
-          key: 'settingsOnlyFlow',
-          steps: {
-            edit: {
-              title: 'Edit',
-              uiSchema: {},
-            },
-          },
-        });
-
-        const result = await model.applyFlow('settingsOnlyFlow');
-
-        expect(result).toEqual({});
-        expect(warnSpy).toHaveBeenCalledWith(
-          expect.stringContaining("Step 'edit' in flow 'settingsOnlyFlow' has neither 'use' nor 'handler'"),
-        );
-        expect(errorSpy).not.toHaveBeenCalledWith(
-          expect.stringContaining("Step 'edit' in flow 'settingsOnlyFlow' has neither 'use' nor 'handler'"),
-        );
-
-        warnSpy.mockRestore();
-        errorSpy.mockRestore();
-      });
     });
 
     describe('beforeRender flows', () => {

package/src/models/flowModel.tsx

@@ -56,6 +56,25 @@ const classEventRegistries = new WeakMap<typeof FlowModel, ModelEventRegistry>()
 // 使用WeakMap存储每个类的meta
 const modelMetas = new WeakMap<typeof FlowModel, FlowModelMeta>();
 
+type SortableModelLike = {
+  sortIndex?: number | null;
+};
+
+function getStableSortIndex(item: SortableModelLike, fallbackIndex: number) {
+  return typeof item?.sortIndex === 'number' && Number.isFinite(item.sortIndex) ? item.sortIndex : fallbackIndex + 1;
+}
+
+function sortByStableSortIndex<T extends SortableModelLike>(items: T[]) {
+  return items
+    .map((item, index) => ({
+      item,
+      index,
+      sortIndex: getStableSortIndex(item, index),
+    }))
+    .sort((a, b) => a.sortIndex - b.sortIndex || a.index - b.index)
+    .map(({ item }) => item);
+}
+
 // 使用WeakMap存储每个类的 GlobalFlowRegistry
 const modelGlobalRegistries = new WeakMap<typeof FlowModel, GlobalFlowRegistry>();
 
@@ -242,7 +261,7 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
     };
     this.stepParams = options.stepParams || {};
     this.subModels = {};
-    this.sortIndex = options.sortIndex || 0;
+    this.sortIndex = getStableSortIndex({ sortIndex: options.sortIndex }, -1);
     this._options = options;
     this._title = '';
     this._extraTitle = '';
@@ -511,11 +530,9 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
 
     Object.entries(mergedSubModels || {}).forEach(([key, value]) => {
       if (Array.isArray(value)) {
-        value
-          .sort((a, b) => (a.sortIndex || 0) - (b.sortIndex || 0))
-          .forEach((item) => {
-            this.addSubModel(key, item);
-          });
+        sortByStableSortIndex(value).forEach((item) => {
+          this.addSubModel(key, item);
+        });
       } else {
         this.setSubModel(key, value);
       }
@@ -778,26 +795,43 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
     stepKeyOrStepsParams?: string | Record<string, ParamObject>,
     params?: ParamObject,
   ): void {
+    let hasChanged = false;
+
     if (typeof flowKeyOrAllParams === 'string') {
       const flowKey = flowKeyOrAllParams;
       if (typeof stepKeyOrStepsParams === 'string' && params !== undefined) {
-        if (!this.stepParams[flowKey]) {
-          this.stepParams[flowKey] = {};
+        const currentStepParams = this.stepParams[flowKey]?.[stepKeyOrStepsParams] || {};
+        const nextStepParams = { ...currentStepParams, ...params };
+        if (!_.isEqual(currentStepParams, nextStepParams)) {
+          if (!this.stepParams[flowKey]) {
+            this.stepParams[flowKey] = {};
+          }
+          this.stepParams[flowKey][stepKeyOrStepsParams] = nextStepParams;
+          hasChanged = true;
         }
-        this.stepParams[flowKey][stepKeyOrStepsParams] = {
-          ...this.stepParams[flowKey][stepKeyOrStepsParams],
-          ...params,
-        };
       } else if (typeof stepKeyOrStepsParams === 'object' && stepKeyOrStepsParams !== null) {
-        this.stepParams[flowKey] = { ...(this.stepParams[flowKey] || {}), ...stepKeyOrStepsParams };
+        const currentFlowParams = this.stepParams[flowKey] || {};
+        const nextFlowParams = { ...currentFlowParams, ...stepKeyOrStepsParams };
+        if (!_.isEqual(currentFlowParams, nextFlowParams)) {
+          this.stepParams[flowKey] = nextFlowParams;
+          hasChanged = true;
+        }
       }
     } else if (typeof flowKeyOrAllParams === 'object' && flowKeyOrAllParams !== null) {
       for (const fk in flowKeyOrAllParams) {
         if (Object.prototype.hasOwnProperty.call(flowKeyOrAllParams, fk)) {
-          this.stepParams[fk] = { ...(this.stepParams[fk] || {}), ...flowKeyOrAllParams[fk] };
+          const currentFlowParams = this.stepParams[fk] || {};
+          const nextFlowParams = { ...currentFlowParams, ...flowKeyOrAllParams[fk] };
+          if (!_.isEqual(currentFlowParams, nextFlowParams)) {
+            this.stepParams[fk] = nextFlowParams;
+            hasChanged = true;
+          }
         }
       }
     }
+    if (!hasChanged) {
+      return;
+    }
     // 发起配置修改事件
     this.emitter.emit('onStepParamsChanged');
   }
@@ -1206,7 +1240,10 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
     if (!Array.isArray(subModels[subKey])) {
       subModels[subKey] = observable.shallow([]);
     }
-    const maxSortIndex = Math.max(...(subModels[subKey] as FlowModel[]).map((item) => item.sortIndex || 0), 0);
+    const maxSortIndex = Math.max(
+      ...(subModels[subKey] as FlowModel[]).map((item, index) => getStableSortIndex(item, index)),
+      0,
+    );
     model.sortIndex = maxSortIndex + 1;
     subModels[subKey].push(model);
     actualParent.emitter.emit('onSubModelAdded', model);
@@ -1264,14 +1301,12 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
 
     const results: ArrayElementType<NonNullable<Structure['subModels']>[K]>[] = [];
 
-    _.castArray(model)
-      .sort((a, b) => (a.sortIndex || 0) - (b.sortIndex || 0))
-      .forEach((item, index) => {
-        const result = (callback as (model: any, index: number) => boolean)(item, index);
-        if (result) {
-          results.push(item);
-        }
-      });
+    sortByStableSortIndex(_.castArray(model)).forEach((item, index) => {
+      const result = (callback as (model: any, index: number) => boolean)(item, index);
+      if (result) {
+        results.push(item);
+      }
+    });
 
     return results;
   }
@@ -1288,12 +1323,10 @@ export class FlowModel<Structure extends DefaultStructure = DefaultStructure> {
 
     const results: R[] = [];
 
-    _.castArray(model)
-      .sort((a, b) => (a.sortIndex || 0) - (b.sortIndex || 0))
-      .forEach((item, index) => {
-        const result = (callback as (model: any, index: number) => R)(item, index);
-        results.push(result);
-      });
+    sortByStableSortIndex(_.castArray(model)).forEach((item, index) => {
+      const result = (callback as (model: any, index: number) => R)(item, index);
+      results.push(result);
+    });
 
     return results;
   }