@nocobase/flow-engine 2.1.0-alpha.40 → 2.1.0-alpha.46

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/__tests__/flowEngine.removeModel.test.ts

@@ -7,7 +7,7 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { beforeEach, describe, expect, it } from 'vitest';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
 import { FlowEngine } from '../flowEngine';
 import { FlowModel } from '../models';
 
@@ -20,6 +20,7 @@ describe('FlowEngine removeModel', () => {
   });
 
   it('removeModel should remove model but keep sub-models in cache (current behavior)', () => {
+    const loggerSpy = vi.spyOn(engine.logger, 'debug').mockImplementation(() => {});
     const parent = engine.createModel({ uid: 'parent', use: 'FlowModel' });
     const child = engine.createModel({
       uid: 'child',
@@ -32,14 +33,53 @@ describe('FlowEngine removeModel', () => {
     expect(engine.getModel('parent')).toBe(parent);
     expect(engine.getModel('child')).toBe(child);
 
-    engine.removeModel('parent');
+    try {
+      engine.removeModel('parent');
+    } finally {
+      loggerSpy.mockRestore();
+    }
 
     expect(engine.getModel('parent')).toBeUndefined();
     // Current behavior: child is still in cache
     expect(engine.getModel('child')).toBeDefined();
   });
 
+  it('removeModel should log missing models at debug level', () => {
+    const consoleWarnSpy = vi.spyOn(console, 'warn').mockImplementation(() => {});
+    const loggerSpy = vi.spyOn(engine.logger, 'debug').mockImplementation(() => {});
+
+    try {
+      expect(engine.removeModel('missing')).toBe(false);
+      expect(consoleWarnSpy).not.toHaveBeenCalled();
+      expect(loggerSpy).toHaveBeenCalledWith("FlowEngine: Model with UID 'missing' does not exist.");
+    } finally {
+      consoleWarnSpy.mockRestore();
+      loggerSpy.mockRestore();
+    }
+  });
+
+  it('should reduce default logger verbosity in production', () => {
+    const originalNodeEnv = process.env.NODE_ENV;
+
+    try {
+      process.env.NODE_ENV = 'production';
+
+      const productionEngine = new FlowEngine();
+
+      expect(productionEngine.logger.level).toBe('warn');
+      expect(productionEngine.logger.isLevelEnabled('debug')).toBe(false);
+      expect(productionEngine.logger.isLevelEnabled('warn')).toBe(true);
+    } finally {
+      if (originalNodeEnv === undefined) {
+        delete process.env.NODE_ENV;
+      } else {
+        process.env.NODE_ENV = originalNodeEnv;
+      }
+    }
+  });
+
   it('removeModelWithSubModels should remove model and all sub-models from cache', () => {
+    const loggerSpy = vi.spyOn(engine.logger, 'debug').mockImplementation(() => {});
     const parent = engine.createModel({ uid: 'parent', use: 'FlowModel' });
     const child = engine.createModel({
       uid: 'child',
@@ -63,7 +103,11 @@ describe('FlowEngine removeModel', () => {
     expect(engine.getModel('child')).toBe(child);
     expect(engine.getModel('grandChild')).toBe(grandChild);
 
-    engine.removeModelWithSubModels('parent');
+    try {
+      engine.removeModelWithSubModels('parent');
+    } finally {
+      loggerSpy.mockRestore();
+    }
 
     expect(engine.getModel('parent')).toBeUndefined();
     expect(engine.getModel('child')).toBeUndefined();

package/src/__tests__/runjsContext.test.ts

@@ -88,6 +88,19 @@ describe('flowRunJSContext registry and doc', () => {
       const doc = getRunJSDocFor(ctx as any, { version: 'v1' });
       expect(doc).toBeTruthy();
       expect(doc?.label).toMatch(/RunJS base/);
+      expect(doc?.properties?.element).toBeUndefined();
+    });
+
+    it('should mark element-dependent base completions with element requirement', () => {
+      const ctx: any = { model: { constructor: { name: 'UnknownModel' } } };
+      const doc = getRunJSDocFor(ctx as any, { version: 'v1' });
+
+      expect((doc?.methods?.render as any)?.completion?.requires).toContain('element');
+      expect((doc?.properties?.viewer as any)?.properties?.popover?.completion?.requires).toContain('element');
+      expect((doc?.properties?.viewer as any)?.properties?.embed?.completion?.requires).toContain('element');
+      expect(
+        (doc?.properties?.libs as any)?.properties?.ReactDOM?.properties?.createRoot?.completion?.requires,
+      ).toContain('element');
     });
 
     it('should support locale-specific doc', () => {
@@ -99,6 +112,11 @@ describe('flowRunJSContext registry and doc', () => {
       const messageText =
         typeof message === 'string' ? message : (message as any)?.description ?? (message as any)?.detail ?? '';
       expect(String(messageText)).toMatch(/Ant Design 全局消息/);
+      expect((doc?.methods?.render as any)?.completion?.requires).toContain('element');
+      expect((doc?.properties?.viewer as any)?.properties?.popover?.completion?.requires).toContain('element');
+      expect(
+        (doc?.properties?.libs as any)?.properties?.ReactDOM?.properties?.createRoot?.completion?.requires,
+      ).toContain('element');
     });
 
     it('should fallback to English when locale is not found', () => {

package/src/__tests__/runjsContextImplementations.test.ts

@@ -27,7 +27,10 @@ describe('Specific RunJSContext implementations', () => {
       const ctx: any = { model: { constructor: { name: 'JSColumnModel' } } };
       const doc = getRunJSDocFor(ctx as any, { version: 'v1' });
       expect(doc?.properties?.element).toBeTruthy();
-      expect(doc?.properties?.element).toContain('ElementProxy');
+      const elementDoc: any = doc?.properties?.element;
+      expect(elementDoc?.detail).toContain('ElementProxy');
+      expect(elementDoc?.properties?.setAttribute).toBeTruthy();
+      expect(elementDoc?.properties?.querySelector).toBeTruthy();
     });
 
     it('should have record property in doc', () => {
@@ -68,7 +71,9 @@ describe('Specific RunJSContext implementations', () => {
       (ctx as any).defineProperty('api', { value: { auth: { locale: 'zh-CN' } } });
       const doc = getRunJSDocFor(ctx as any, { version: 'v1' });
       expect(doc?.label).toMatch(/JS 列/);
-      expect(doc?.properties?.element).toContain('表格单元格');
+      const elementDoc: any = doc?.properties?.element;
+      expect(elementDoc?.description).toContain('表格单元格');
+      expect(elementDoc?.properties?.addEventListener).toBeTruthy();
     });
 
     it('should create instance successfully', () => {
@@ -162,6 +167,7 @@ describe('Specific RunJSContext implementations', () => {
       const ctx: any = { model: { constructor: { name: 'JSRecordActionModel' } } };
       const doc = getRunJSDocFor(ctx as any, { version: 'v1' });
       expect(doc?.properties?.record).toBeTruthy();
+      expect(doc?.properties?.element).toBeUndefined();
     });
 
     it('should have filterByTk property', () => {
@@ -184,6 +190,7 @@ describe('Specific RunJSContext implementations', () => {
       const ctx: any = { model: { constructor: { name: 'JSCollectionActionModel' } } };
       const doc = getRunJSDocFor(ctx as any, { version: 'v1' });
       expect(doc?.properties?.resource).toBeTruthy();
+      expect(doc?.properties?.element).toBeUndefined();
     });
 
     it('should support zh-CN locale', () => {

package/src/__tests__/runjsLocales.test.ts

@@ -12,6 +12,10 @@ import { getRunJSDocFor } from '..';
 import { setupRunJSContexts } from '../runjs-context/setup';
 import { FlowContext } from '../flowContext';
 
+function getRunJSDocText(doc: unknown) {
+  return typeof doc === 'string' ? doc : (doc as any)?.description ?? (doc as any)?.detail ?? '';
+}
+
 describe('RunJS locales patch (engine doc)', () => {
   beforeAll(async () => {
     await setupRunJSContexts();
@@ -30,10 +34,7 @@ describe('RunJS locales patch (engine doc)', () => {
     (ctx as any).defineProperty('model', { value: { constructor: { name: 'JSBlockModel' } } });
     (ctx as any).defineProperty('api', { value: { auth: { locale: 'zh-CN' } } });
     const doc = getRunJSDocFor(ctx as any, { version: 'v1' });
-    const message = doc?.properties?.message;
-    const messageText =
-      typeof message === 'string' ? message : (message as any)?.description ?? (message as any)?.detail ?? '';
-    expect(String(messageText)).toMatch(/Ant Design 全局消息 API/);
-    expect(String(doc?.methods?.t || '')).toMatch(/国际化函数/);
+    expect(String(getRunJSDocText(doc?.properties?.message))).toMatch(/Ant Design 全局消息 API/);
+    expect(String(getRunJSDocText(doc?.methods?.t))).toMatch(/国际化函数/);
   });
 });

package/src/__tests__/viewScopedFlowEngine.test.ts

@@ -18,6 +18,33 @@ import { APIClient as SDKApiClient } from '@nocobase/sdk';
 import { FlowEngine } from '../flowEngine';
 import { createViewScopedEngine } from '../ViewScopedFlowEngine';
 import { FlowModel } from '../models';
+import type { IFlowModelRepository } from '../types';
+
+const clone = <T>(value: T): T => (value == null ? value : JSON.parse(JSON.stringify(value)));
+
+class DirtyPageRepository implements IFlowModelRepository<FlowModel> {
+  public findOneCalls = 0;
+  public data: Record<string, any> | null = null;
+
+  async findOne(): Promise<Record<string, any> | null> {
+    this.findOneCalls += 1;
+    return clone(this.data);
+  }
+
+  async save(model: FlowModel): Promise<Record<string, any>> {
+    return model.serialize();
+  }
+
+  async destroy(): Promise<boolean> {
+    return true;
+  }
+
+  async move(): Promise<void> {}
+
+  async duplicate(): Promise<Record<string, any> | null> {
+    return null;
+  }
+}
 
 describe('ViewScopedFlowEngine', () => {
   it('shares global actions/events and model classes with parent', async () => {
@@ -307,4 +334,110 @@ describe('ViewScopedFlowEngine', () => {
     expect(result).not.toBeNull();
     expect(result?.uid).toBe('child-normal');
   });
+
+  it('reloads a dirty loaded page from repository and replaces stale parent reference', async () => {
+    const root = new FlowEngine();
+    const repository = new DirtyPageRepository();
+    root.setModelRepository(repository);
+
+    class ParentModel extends FlowModel {}
+    class PageModel extends FlowModel {}
+    class BlockModel extends FlowModel {}
+    root.registerModels({ ParentModel, PageModel, BlockModel });
+
+    const parent = root.createModel<ParentModel>({ use: 'ParentModel', uid: 'popup-action' });
+    const oldScoped = createViewScopedEngine(root);
+    const stalePage = oldScoped.createModel<PageModel>({
+      use: 'PageModel',
+      uid: 'popup-page',
+      parentId: parent.uid,
+      subKey: 'page',
+      subType: 'object',
+      subModels: {
+        items: [{ use: 'BlockModel', uid: 'stale-block' }],
+      },
+    });
+    const staleBlock = stalePage.findSubModel('items' as any, (item) => item.uid === 'stale-block') as FlowModel;
+    parent.setSubModel('page', stalePage);
+    oldScoped.unlinkFromStack();
+
+    repository.data = {
+      use: 'PageModel',
+      uid: 'popup-page',
+      parentId: parent.uid,
+      subKey: 'page',
+      subType: 'object',
+      subModels: {
+        items: [{ use: 'BlockModel', uid: 'fresh-block' }],
+      },
+    };
+
+    root.flowSettings.enable();
+    await staleBlock.saveStepParams();
+    root.flowSettings.disable();
+    repository.findOneCalls = 0;
+
+    const runtimeScoped = createViewScopedEngine(root);
+    const loaded = await runtimeScoped.loadOrCreateModel<PageModel>({
+      async: true,
+      parentId: parent.uid,
+      subKey: 'page',
+      subType: 'object',
+      use: 'PageModel',
+    });
+
+    expect(repository.findOneCalls).toBe(1);
+    expect(loaded).not.toBe(stalePage);
+    expect((parent.subModels as any).page).toBe(loaded);
+    expect(loaded?.mapSubModels('items' as any, (item) => item.uid)).toEqual(['fresh-block']);
+
+    repository.findOneCalls = 0;
+    const nextRuntimeScoped = createViewScopedEngine(root);
+    const loadedAgain = await nextRuntimeScoped.loadOrCreateModel<PageModel>({
+      async: true,
+      parentId: parent.uid,
+      subKey: 'page',
+      subType: 'object',
+      use: 'PageModel',
+    });
+
+    expect(repository.findOneCalls).toBe(0);
+    expect(loadedAgain?.uid).toBe('popup-page');
+  });
+
+  it('does not bypass loaded page cache after a non-config save', async () => {
+    const root = new FlowEngine();
+    const repository = new DirtyPageRepository();
+    root.setModelRepository(repository);
+
+    class ParentModel extends FlowModel {}
+    class PageModel extends FlowModel {}
+    root.registerModels({ ParentModel, PageModel });
+
+    const parent = root.createModel<ParentModel>({ use: 'ParentModel', uid: 'normal-parent' });
+    const stalePage = root.createModel<PageModel>({
+      use: 'PageModel',
+      uid: 'normal-page',
+      parentId: parent.uid,
+      subKey: 'page',
+      subType: 'object',
+    });
+    parent.setSubModel('page', stalePage);
+
+    root.flowSettings.disable();
+    await root.saveModel(stalePage);
+    repository.findOneCalls = 0;
+
+    const runtimeScoped = createViewScopedEngine(root);
+    const loaded = await runtimeScoped.loadOrCreateModel<PageModel>({
+      async: true,
+      parentId: parent.uid,
+      subKey: 'page',
+      subType: 'object',
+      use: 'PageModel',
+    });
+
+    expect(repository.findOneCalls).toBe(0);
+    expect(loaded?.uid).toBe('normal-page');
+  });
 });

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

@@ -237,6 +237,15 @@ const getToolbarPopupContainer = (triggerNode?: HTMLElement | null) => {
   );
 };
 
+const removeExtraMenuItemClickHandlers = (item: FlowModelExtraMenuItem): FlowModelExtraMenuItem => {
+  const { onClick: _onClick, children, ...rest } = item;
+
+  return {
+    ...rest,
+    children: children?.length ? children.map(removeExtraMenuItemClickHandlers) : undefined,
+  };
+};
+
 export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
   model,
   showDeleteButton = true,
@@ -254,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);
@@ -294,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}`)) {
@@ -323,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(
@@ -623,7 +652,7 @@ export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
         return [];
       }
     },
-    [],
+    [t],
   );
 
   // 获取可配置的flows和steps
@@ -666,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']> => {
@@ -847,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',
@@ -870,7 +924,8 @@ export const DefaultSettingsIcon: React.FC<DefaultSettingsIconProps> = ({
       // });
 
       if (commonExtras.length > 0) {
-        items.push(...(commonExtras as MenuProps['items']));
+        // Antd Menu 会同时触发 item.onClick 和 menu.onClick，这里统一交给 handleMenuClick 执行。
+        items.push(...(commonExtras.map(removeExtraMenuItemClickHandlers) as MenuProps['items']));
       }
 
       // 添加复制uid按钮
@@ -891,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;
   }