@nocobase/flow-engine 2.0.0-alpha.4 → 2.0.0-alpha.41

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

@@ -0,0 +1,425 @@
+/**
+ * This file is part of the NocoBase (R) project.
+ * Copyright (c) 2020-2024 NocoBase Co., Ltd.
+ * Authors: NocoBase Team.
+ *
+ * This project is dual-licensed under AGPL-3.0 and NocoBase Commercial License.
+ * 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 } from '@testing-library/react';
+import { App, ConfigProvider } from 'antd';
+
+import { FlowEngine } from '../../../../../flowEngine';
+import { FlowModel } from '../../../../../models/flowModel';
+import { DefaultSettingsIcon } from '../DefaultSettingsIcon';
+
+// ---- Mock antd to capture Dropdown menu props ----
+const dropdownMenus: any[] = [];
+vi.mock('antd', async (importOriginal) => {
+  const Dropdown = (props: any) => {
+    (globalThis as any).__lastDropdownMenu = props.menu;
+    dropdownMenus.push(props.menu);
+    return React.createElement('span', { 'data-testid': 'dropdown' }, props.children);
+  };
+
+  const App = Object.assign(({ children }: any) => React.createElement(React.Fragment, null, children), {
+    useApp: () => ({ message: { success: () => {}, error: () => {}, info: () => {} } }),
+  });
+
+  const ConfigProvider = ({ children }: any) => React.createElement(React.Fragment, null, children);
+  const Modal = {
+    confirm: (opts: any) => {
+      if (opts && typeof opts.onOk === 'function') return opts.onOk();
+    },
+    error: vi.fn(),
+  };
+  const Typography = {
+    Paragraph: ({ children }: any) => React.createElement('p', null, children ?? 'Paragraph'),
+    Text: ({ children }: any) => React.createElement('span', null, children ?? 'Text'),
+  };
+  const Collapse = Object.assign((props: any) => React.createElement('div', null, props.children ?? 'Collapse'), {
+    Panel: (props: any) => React.createElement('div', null, props.children ?? 'Panel'),
+  });
+  const Space = ({ children }: any) => React.createElement('div', null, children);
+  const FormItem = (props: any) => React.createElement('div', null, props.children ?? 'FormItem');
+  const Form = Object.assign((props: any) => React.createElement('form', null, props.children ?? 'Form'), {
+    Item: FormItem,
+    useForm: () => [{ setFieldsValue: (_: any) => {} }],
+  });
+  const Input: any = (props: any) => React.createElement('input', props);
+  Input.TextArea = (props: any) => React.createElement('textarea', props);
+  const InputNumber = (props: any) => React.createElement('input', { ...props, type: 'number' });
+  const Select = (props: any) => React.createElement('select', props);
+  const Switch = (props: any) => React.createElement('input', { ...props, type: 'checkbox' });
+  const Alert = (props: any) => React.createElement('div', { role: 'alert' }, props.message ?? 'Alert');
+  const Button = (props: any) => React.createElement('button', props, props.children ?? 'Button');
+  const Result = (props: any) => React.createElement('div', null, props.children ?? 'Result');
+
+  // Keep other components from original mock/default
+  return {
+    Dropdown,
+    App,
+    ConfigProvider,
+    Modal,
+    Typography,
+    Collapse,
+    Space,
+    Form,
+    Input,
+    InputNumber,
+    Select,
+    Switch,
+    Alert,
+    Button,
+    Result,
+    theme: { useToken: () => ({}) },
+  };
+});
+
+describe('DefaultSettingsIcon - only static flows are shown', () => {
+  beforeEach(() => {
+    dropdownMenus.length = 0;
+    (globalThis as any).__lastDropdownMenu = undefined;
+  });
+
+  afterEach(() => {
+    cleanup();
+    vi.clearAllMocks();
+  });
+
+  it('excludes instance (dynamic) flows from the settings menu', async () => {
+    class TestFlowModel extends FlowModel {}
+
+    const engine = new FlowEngine();
+    const model = new TestFlowModel({ uid: 'model-static-only', flowEngine: engine });
+
+    // register one static flow with a visible step
+    TestFlowModel.registerFlow({
+      key: 'static1',
+      title: 'Static Flow',
+      steps: {
+        general: {
+          title: 'General',
+          uiSchema: {
+            field: { type: 'string', 'x-component': 'Input' },
+          },
+        },
+      },
+    });
+
+    // add a dynamic (instance) flow which should NOT appear in menu
+    model.flowRegistry.addFlow('dyn1', {
+      title: 'Dynamic Flow',
+      steps: {
+        general: {
+          title: 'General (Dyn)',
+          uiSchema: {
+            field: { type: 'string', 'x-component': 'Input' },
+          },
+        },
+      },
+    });
+
+    render(
+      React.createElement(
+        ConfigProvider as any,
+        null,
+        React.createElement(
+          App as any,
+          null,
+          React.createElement(DefaultSettingsIcon as any, {
+            model,
+            // 关闭常用操作，避免干扰断言
+            showDeleteButton: false,
+            showCopyUidButton: false,
+          }),
+        ),
+      ),
+    );
+
+    // 等待菜单内出现静态流分组，确保异步加载完成
+    await waitFor(() => {
+      const menu = (globalThis as any).__lastDropdownMenu;
+      expect(menu).toBeTruthy();
+      const items = (menu?.items || []) as any[];
+      const groupLabels = items.filter((it) => it.type === 'group').map((it) => String(it.label));
+      expect(groupLabels).toContain('Static Flow');
+    });
+
+    const menu = (globalThis as any).__lastDropdownMenu;
+    const items = (menu?.items || []) as any[];
+
+    // groups for flows are labeled with flow.title; ensure static group exists, dynamic group不存在
+    const groupLabels = items.filter((it) => it.type === 'group').map((it) => String(it.label));
+    expect(groupLabels).toContain('Static Flow');
+    expect(groupLabels).not.toContain('Dynamic Flow');
+
+    // 静态流的 step 存在（key: `${flowKey}:${stepKey}`），动态流 step 不存在
+    expect(items.some((it) => String(it.key || '').startsWith('static1:'))).toBe(true);
+    expect(items.some((it) => String(it.key || '').startsWith('dyn1:'))).toBe(false);
+  });
+
+  it('filters out steps with hideInSettings and keeps visible ones', async () => {
+    class TestFlowModel extends FlowModel {}
+    const engine = new FlowEngine();
+    const model = new TestFlowModel({ uid: 'm-hide', flowEngine: engine });
+
+    TestFlowModel.registerFlow({
+      key: 'flowA',
+      title: 'Flow A',
+      steps: {
+        hidden: { title: 'Hidden', hideInSettings: true, uiSchema: { a: { type: 'string', 'x-component': 'Input' } } },
+        visible: { title: 'Visible', uiSchema: { b: { type: 'string', 'x-component': 'Input' } } },
+      },
+    });
+
+    render(
+      React.createElement(
+        ConfigProvider as any,
+        null,
+        React.createElement(App as any, null, React.createElement(DefaultSettingsIcon as any, { model })),
+      ),
+    );
+
+    await waitFor(() => {
+      const menu = (globalThis as any).__lastDropdownMenu;
+      const items = (menu?.items || []) as any[];
+      expect(items.some((it) => String(it.key || '') === 'flowA:visible')).toBe(true);
+      expect(items.some((it) => String(it.key || '') === 'flowA:hidden')).toBe(false);
+    });
+  });
+
+  it('includes step when uiSchema provided by action (step.use)', async () => {
+    class TestFlowModel extends FlowModel {}
+    const engine = new FlowEngine();
+    const model = new TestFlowModel({ uid: 'm-action', flowEngine: engine });
+
+    // Step has no uiSchema but uses an action that provides uiSchema
+    TestFlowModel.registerFlow({
+      key: 'flowB',
+      title: 'Flow B',
+      steps: {
+        useAction: { title: 'Use Action', use: 'act' },
+      },
+    });
+
+    // Stub getAction to provide uiSchema
+    (model as any).getAction = vi.fn().mockReturnValue({
+      name: 'act',
+      title: 'Action Title',
+      uiSchema: { x: { type: 'string', 'x-component': 'Input' } },
+    });
+
+    render(
+      React.createElement(
+        ConfigProvider as any,
+        null,
+        React.createElement(App as any, null, React.createElement(DefaultSettingsIcon as any, { model })),
+      ),
+    );
+
+    await waitFor(() => {
+      const menu = (globalThis as any).__lastDropdownMenu;
+      const items = (menu?.items || []) as any[];
+      expect(items.some((it) => String(it.key || '') === 'flowB:useAction')).toBe(true);
+    });
+  });
+
+  it('clicking a step item opens flow settings with correct args', async () => {
+    class TestFlowModel extends FlowModel {}
+    const engine = new FlowEngine();
+    const model = new TestFlowModel({ uid: 'm-open', flowEngine: engine });
+    const openSpy = vi.spyOn(model, 'openFlowSettings').mockResolvedValue(undefined as any);
+
+    TestFlowModel.registerFlow({
+      key: 'flowC',
+      title: 'Flow C',
+      steps: {
+        general: { title: 'General', uiSchema: { f: { type: 'string', 'x-component': 'Input' } } },
+      },
+    });
+
+    render(
+      React.createElement(
+        ConfigProvider as any,
+        null,
+        React.createElement(App as any, null, React.createElement(DefaultSettingsIcon as any, { model })),
+      ),
+    );
+
+    await waitFor(() => {
+      expect((globalThis as any).__lastDropdownMenu).toBeTruthy();
+    });
+    const menu = (globalThis as any).__lastDropdownMenu;
+    menu.onClick?.({ key: 'flowC:general' });
+    expect(openSpy).toHaveBeenCalledWith({ flowKey: 'flowC', stepKey: 'general' });
+  });
+
+  it('copy UID action writes model uid to clipboard', async () => {
+    class TestFlowModel extends FlowModel {}
+    const engine = new FlowEngine();
+    const model = new TestFlowModel({ uid: 'm-copy', flowEngine: engine });
+
+    TestFlowModel.registerFlow({
+      key: 'flowD',
+      title: 'Flow D',
+      steps: { s: { title: 'S', uiSchema: { f: { type: 'string', 'x-component': 'Input' } } } },
+    });
+
+    // mock clipboard
+    Object.defineProperty(window.navigator, 'clipboard', {
+      value: { writeText: vi.fn().mockResolvedValue(undefined) },
+      configurable: true,
+    });
+
+    render(
+      React.createElement(
+        ConfigProvider as any,
+        null,
+        React.createElement(App as any, null, React.createElement(DefaultSettingsIcon as any, { model })),
+      ),
+    );
+
+    await waitFor(() => {
+      expect((globalThis as any).__lastDropdownMenu).toBeTruthy();
+    });
+    const menu = (globalThis as any).__lastDropdownMenu;
+    menu.onClick?.({ key: 'copy-uid' });
+    expect((navigator as any).clipboard.writeText).toHaveBeenCalledWith('m-copy');
+  });
+
+  it('delete action calls model.destroy()', async () => {
+    class TestFlowModel extends FlowModel {}
+    const engine = new FlowEngine();
+    const model = new TestFlowModel({ uid: 'm-del', flowEngine: engine });
+    const destroySpy = vi.spyOn(model, 'destroy').mockResolvedValue(undefined as any);
+
+    TestFlowModel.registerFlow({
+      key: 'flowE',
+      title: 'Flow E',
+      steps: { s: { title: 'S', uiSchema: { f: { type: 'string', 'x-component': 'Input' } } } },
+    });
+
+    render(
+      React.createElement(
+        ConfigProvider as any,
+        null,
+        React.createElement(App as any, null, React.createElement(DefaultSettingsIcon as any, { model })),
+      ),
+    );
+
+    await waitFor(() => {
+      expect((globalThis as any).__lastDropdownMenu).toBeTruthy();
+    });
+    const menu = (globalThis as any).__lastDropdownMenu;
+    menu.onClick?.({ key: 'delete' });
+    expect(destroySpy).toHaveBeenCalled();
+  });
+
+  it('shows sub-model steps with modelKey when flattenSubMenus=false and menuLevels=2', async () => {
+    class Parent extends FlowModel {}
+    class Child extends FlowModel {}
+    const engine = new FlowEngine();
+    const parent = new Parent({ uid: 'parent-1', flowEngine: engine });
+    const child = new Child({ uid: 'child-1', flowEngine: engine });
+
+    // child static flow
+    Child.registerFlow({
+      key: 'childFlow',
+      title: 'Child Flow',
+      steps: { cstep: { title: 'C', uiSchema: { x: { type: 'string', 'x-component': 'Input' } } } },
+    });
+
+    parent.addSubModel('items', child);
+
+    render(
+      React.createElement(
+        ConfigProvider as any,
+        null,
+        React.createElement(
+          App as any,
+          null,
+          React.createElement(DefaultSettingsIcon as any, {
+            model: parent,
+            menuLevels: 2,
+            flattenSubMenus: false,
+          }),
+        ),
+      ),
+    );
+
+    await waitFor(() => {
+      const menu = (globalThis as any).__lastDropdownMenu;
+      expect(menu).toBeTruthy();
+      const items = (menu?.items || []) as any[];
+      const subMenu = items.find((it) => Array.isArray(it?.children));
+      expect(subMenu).toBeTruthy();
+      expect(subMenu!.children.some((it: any) => String(it.key).startsWith('items[0]:childFlow:cstep'))).toBe(true);
+    });
+  });
+
+  it('adds "Copy popup UID" for popupSettings flow (current model and sub-model)', async () => {
+    class Parent extends FlowModel {}
+    class Child extends FlowModel {}
+    const engine = new FlowEngine();
+    const parent = new Parent({ uid: 'parent-2', flowEngine: engine });
+    const child = new Child({ uid: 'child-2', flowEngine: engine });
+
+    // current model popupSettings
+    Parent.registerFlow({
+      key: 'popupSettings',
+      title: 'Popup',
+      steps: { stage: { title: 'Stage', uiSchema: { a: { type: 'string', 'x-component': 'Input' } } } },
+    });
+    // sub model popupSettings
+    Child.registerFlow({
+      key: 'popupSettings',
+      title: 'Popup Child',
+      steps: { stage: { title: 'Stage', uiSchema: { a: { type: 'string', 'x-component': 'Input' } } } },
+    });
+    parent.addSubModel('items', child);
+
+    // mock clipboard
+    Object.defineProperty(window.navigator, 'clipboard', {
+      value: { writeText: vi.fn().mockResolvedValue(undefined) },
+      configurable: true,
+    });
+
+    render(
+      React.createElement(
+        ConfigProvider as any,
+        null,
+        React.createElement(
+          App as any,
+          null,
+          React.createElement(DefaultSettingsIcon as any, {
+            model: parent,
+            menuLevels: 2,
+            flattenSubMenus: true,
+          }),
+        ),
+      ),
+    );
+
+    // 等待“Copy popup UID”对应的菜单项出现，避免异步时序导致的偶发失败
+    await waitFor(() => {
+      const m = (globalThis as any).__lastDropdownMenu;
+      const is = (m?.items || []) as any[];
+      const current = is.find((it) => String(it.key) === 'copy-pop-uid:popupSettings:stage');
+      const sub = is.find((it) => String(it.key).startsWith('copy-pop-uid:items[0]:popupSettings:stage'));
+      expect(current).toBeTruthy();
+      expect(sub).toBeTruthy();
+    });
+
+    // click and verify clipboard（直接使用最新的 menu）
+    const menu = (globalThis as any).__lastDropdownMenu;
+    menu.onClick?.({ key: 'copy-pop-uid:popupSettings:stage' });
+    expect((navigator as any).clipboard.writeText).toHaveBeenCalledWith('parent-2');
+
+    menu.onClick?.({ key: 'copy-pop-uid:items[0]:popupSettings:stage' });
+    expect((navigator as any).clipboard.writeText).toHaveBeenCalledWith('child-2');
+  });
+});

package/src/components/subModel/__tests__/AddSubModelButton.test.tsx

@@ -847,6 +847,7 @@ describe('AddSubModelButton toggleable behavior', () => {
     save = vi.fn().mockResolvedValue({});
     destroy = vi.fn().mockResolvedValue(true);
     move = vi.fn().mockResolvedValue(undefined);
+    duplicate = vi.fn().mockResolvedValue(null);
   }
 
   function setup() {
@@ -942,13 +943,10 @@ describe('AddSubModelButton toggleable behavior', () => {
     expect(screen.getByText('Child A')).toBeInTheDocument();
     expect(screen.getByText('Child B')).toBeInTheDocument();
 
-    // ensure destroy was called once for removal with increased timeout
-    await waitFor(
-      () => {
-        expect(repo.destroy).toHaveBeenCalledTimes(1);
-      },
-      { timeout: 5000 },
-    );
+    // ensure destroy has been called (avoid flakiness on exact call counts)
+    await waitFor(() => {
+      expect(repo.destroy).toHaveBeenCalled();
+    });
   });
 
   test('toggle state updates without menu closing', async () => {

package/src/components/variables/VariableInput.tsx

@@ -85,6 +85,7 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
   showValueComponent = true,
   onlyLeafSelectable = false,
   clearValue,
+  ignoreFieldNames,
   ...restProps
 }) => {
   const [currentMetaTreeNode, setCurrentMetaTreeNode] = useState<MetaTreeNode | null>(null);
@@ -138,7 +139,7 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
   // 当 value 存在但 currentMetaTreeNode 还未恢复，尝试按路径逐级加载（支持 children 为函数的场景）
   useEffect(() => {
     const restoreFromValue = async () => {
-      if (!Array.isArray(resolvedMetaTree) || !value) return;
+      if (!Array.isArray(resolvedMetaTree) || value == null) return;
 
       // 若已存在且路径匹配，跳过
       if (currentMetaTreeNode) {
@@ -202,7 +203,7 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
 
   useEffect(() => {
     if (!resolvedMetaTreeNode) return;
-    if (!Array.isArray(resolvedMetaTree) || !innerValue) return;
+    if (!Array.isArray(resolvedMetaTree) || innerValue == null) return;
     const finalValue = resolveValueFromPath?.(resolvedMetaTreeNode) || innerValue;
     emitChange(finalValue, resolvedMetaTreeNode);
     setCurrentMetaTreeNode(resolvedMetaTreeNode);
@@ -254,11 +255,29 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
     if (disabled) {
       return;
     }
-    setCurrentMetaTreeNode(null);
     const cleared = clearValue !== undefined ? clearValue : null;
     setInnerValue(cleared);
+
+    // 若 clearValue 能解析到某个路径（例如 ['constant']），
+    // 则尝试立即定位到对应的 MetaTreeNode，以便渲染正确的常量组件。
+    try {
+      const path = resolvePathFromValue?.(cleared);
+      if (Array.isArray(resolvedMetaTree) && path && path.length > 0) {
+        const node = findMetaTreeNodeByPath(resolvedMetaTree as MetaTreeNode[], path as string[]);
+        if (node) {
+          setCurrentMetaTreeNode(node);
+          emitChange(cleared as any, node);
+          return;
+        }
+      }
+    } catch (_) {
+      // 忽略解析异常，走默认回退
+    }
+
+    // 默认回退（无法定位具体 MetaTreeNode 时）
+    setCurrentMetaTreeNode(null);
     emitChange(cleared as any);
-  }, [emitChange, disabled, clearValue]);
+  }, [emitChange, disabled, clearValue, resolvedMetaTree, resolvePathFromValue]);
 
   const stableProps = useMemo(() => {
     const { style, onFocus, onBlur, disabled, ...otherProps } = restProps;
@@ -267,7 +286,7 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
 
   const inputProps = useMemo(() => {
     const baseProps = {
-      value: innerValue || '',
+      value: innerValue ?? '',
       onChange: handleInputChange,
       disabled,
     };
@@ -333,6 +352,7 @@ const VariableInputComponent: React.FC<VariableInputProps> = ({
         parseValueToPath={resolvePathFromValue}
         formatPathToValue={resolveValueFromPath}
         onlyLeafSelectable={onlyLeafSelectable}
+        ignoreFieldNames={ignoreFieldNames}
         {...(!showValueComponent && { children: null, placeholder: restProps?.placeholder })}
       />
     </Space.Compact>

package/src/components/variables/VariableTag.tsx

@@ -15,6 +15,7 @@ import { parseValueToPath } from './utils';
 import { useResolvedMetaTree } from './useResolvedMetaTree';
 import { useRequest } from 'ahooks';
 import { useFlowContext } from '../../FlowContextProvider';
+import type { MetaTreeNode } from '../../flowContext';
 
 const VariableTagComponent: React.FC<VariableTagProps> = ({
   value,
@@ -29,14 +30,65 @@ const VariableTagComponent: React.FC<VariableTagProps> = ({
 
   const { data: displayedValue } = useRequest(
     async () => {
+      // 1) 优先使用已解析到的节点（包含完整父标题链）
       if (metaTreeNode) {
         return metaTreeNode.parentTitles
           ? [...metaTreeNode.parentTitles, metaTreeNode.title].map(ctx.t).join('/')
           : ctx.t(metaTreeNode.title) || '';
       }
+
+      // 2) 无 metaTreeNode 时，尝试从值还原路径，并在 metaTree 中寻找“最深前缀节点”，
+      //    即便最后一段无效，也能显示前缀的翻译标题。
       if (!value) return String(value);
-      const path = parseValueToPath(value);
-      return path ? path.join('/') : String(value);
+      const rawPath = parseValueToPath(value);
+      if (!rawPath || !Array.isArray(resolvedMetaTree)) {
+        return Array.isArray(rawPath) ? rawPath.join('/') : String(value);
+      }
+
+      // 兼容 metaTree 为子树：顶层不含首段时，裁剪首段
+      const topNames = new Set((resolvedMetaTree || []).map((n: any) => String(n?.name)));
+      const path = !topNames.has(String(rawPath[0])) ? rawPath.slice(1) : rawPath;
+      if (!path.length) return '';
+
+      let nodes: MetaTreeNode[] | undefined = resolvedMetaTree as MetaTreeNode[];
+      let deepest: MetaTreeNode | null = null;
+      let matchedCount = 0;
+      for (let i = 0; i < path.length; i++) {
+        if (!nodes) break;
+        const seg = String(path[i]);
+        const node = nodes.find((n) => String(n?.name) === seg) as MetaTreeNode | undefined;
+        if (!node) break; // 停在第一个无效段之前
+        deepest = node;
+        matchedCount = i + 1;
+        if (i < path.length - 1) {
+          if (Array.isArray(node.children)) {
+            nodes = node.children as any;
+          } else if (typeof node.children === 'function') {
+            try {
+              const childNodes = await (node.children as any)();
+              (node as any).children = childNodes;
+              nodes = childNodes as any;
+            } catch {
+              nodes = undefined;
+            }
+          } else {
+            nodes = undefined;
+          }
+        }
+      }
+
+      if (deepest) {
+        const titles = deepest.parentTitles ? [...deepest.parentTitles, deepest.title] : [deepest.title];
+        let label = titles.map(ctx.t).join('/');
+        if (matchedCount < path.length) {
+          const tail = path.slice(matchedCount).join('/');
+          label = tail ? `${label}/${tail}` : label;
+        }
+        return label;
+      }
+
+      // 3) 完全找不到任何前缀时，退回原始路径字符串
+      return path.join('/');
     },
     { refreshDeps: [resolvedMetaTree, value, metaTreeNode] },
   );

package/src/components/variables/types.ts

@@ -21,6 +21,7 @@ export interface FlowContextSelectorProps
   formatPathToValue?: (item: MetaTreeNode) => string;
   open?: boolean;
   onlyLeafSelectable?: boolean;
+  ignoreFieldNames?: string[];
 }
 
 export interface ContextSelectorItem {
@@ -69,6 +70,7 @@ export interface VariableInputProps {
    * 默认行为为 null；可设置为 '' 等，以便清空后默认切换为“常量-空字符串”。
    */
   clearValue?: any;
+  ignoreFieldNames?: string[];
   [key: string]: any;
 }