@nocobase/client-v2 2.1.0-alpha.40 → 2.1.0-alpha.46

package/src/flow/models/base/__tests__/GridModel.render.test.tsx

@@ -0,0 +1,53 @@
+/**
+ * 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 { FlowEngine, FlowEngineProvider } from '@nocobase/flow-engine';
+import { render } from '@testing-library/react';
+import React from 'react';
+import { beforeEach, describe, expect, it } from 'vitest';
+import { GridModel } from '../GridModel';
+
+describe('GridModel.render', () => {
+  let engine: FlowEngine;
+
+  beforeEach(async () => {
+    engine = new FlowEngine();
+    engine.registerModels({ GridModel });
+    await engine.flowSettings.disable();
+  });
+
+  it('renders the Space wrapper as block-level flex to avoid inline baseline spacing', () => {
+    const item = engine.createModel({ use: 'FlowModel', uid: 'item-1' });
+    const model = engine.createModel<GridModel>({
+      use: 'GridModel',
+      uid: 'grid-render',
+      props: {
+        rows: {
+          row1: [['item-1']],
+        },
+        sizes: {
+          row1: [24],
+        },
+        rowGap: 16,
+      },
+      structure: {} as any,
+    });
+    (model as any).subModels = { items: [item] };
+
+    expect(Object.keys((model as any).getVisibleLayout().rows)).toEqual(['row1']);
+
+    const { container } = render(<FlowEngineProvider engine={engine}>{model.render()}</FlowEngineProvider>);
+    const space = container.querySelector('.ant-space') as HTMLElement;
+
+    expect(space).toBeTruthy();
+    expect(space.style.width).toBe('100%');
+    expect(space.style.marginBottom).toBe('16px');
+    expect(space.style.display).toBe('flex');
+  });
+});

package/src/flow/models/blocks/assign-form/AssignFormGridModel.tsx

@@ -12,11 +12,16 @@ import { AddSubModelButton, FlowSettingsButton, tExpr, EditableItemModel } from
 import { SettingOutlined } from '@ant-design/icons';
 import { FormGridModel } from '../form/FormGridModel';
 
+const MAX_ASSIGN_FORM_ASSOCIATION_FIELD_DEPTH = 2;
+
 // 使用范型准确标注 subModels.items 的类型
 export class AssignFormGridModel extends FormGridModel {
   renderAddSubModelButton() {
     const collection = (this.context as any)?.collection;
     const fields = collection?.getFields?.() || [];
+    const associationDepth = this.context.prefixFieldPath
+      ? this.context.prefixFieldPath.split('.').filter(Boolean).length
+      : 0;
     // 过滤主键/过滤键字段，避免产生“更新主键”的无效配置
     const pk = typeof collection?.getPrimaryKey === 'function' ? collection.getPrimaryKey() : undefined;
     const filterKey = collection?.filterTargetKey;
@@ -29,6 +34,12 @@ export class AssignFormGridModel extends FormGridModel {
     };
     const items = fields
       .filter((field: any) => !isForbidden(field?.name))
+      .filter((field: any) => {
+        if (associationDepth < MAX_ASSIGN_FORM_ASSOCIATION_FIELD_DEPTH) {
+          return true;
+        }
+        return !(field?.isAssociationField?.() || field?.target || field?.targetCollection);
+      })
       .map((field: any) => {
         const fullName = field.name as string;
         const label = field.title || field.name;
@@ -111,7 +122,7 @@ export class AssignFormGridModel extends FormGridModel {
       return;
     }
     const fieldModel = binding.modelName;
-    const created = this.flowEngine.createModel({
+    const created = this.addSubModel('items', {
       use: 'AssignFormItemModel',
       stepParams: {
         fieldSettings: {
@@ -137,8 +148,6 @@ export class AssignFormGridModel extends FormGridModel {
           },
         },
       },
-      parentId: this.uid,
-      subKey: 'items',
     });
     created['assignValue'] = value;
   }

package/src/flow/models/blocks/assign-form/AssignFormItemModel.tsx

@@ -28,6 +28,72 @@ import { customAlphabet as Alphabet } from 'nanoid';
 import { ensureOptionsFromUiSchemaEnumIfAbsent } from '../../../internal/utils/enumOptionsUtils';
 import { RunJSValueEditor } from '../../../components/RunJSValueEditor';
 
+type AssignFormTempOriginField = {
+  uid?: string;
+  props?: {
+    fieldNames?: unknown;
+    titleField?: unknown;
+  };
+  getStepParams?: (flowKey: string, stepKey: string) => unknown;
+};
+
+function getAssignFormTempFieldOptions(
+  originField: AssignFormTempOriginField | undefined,
+  init: Record<string, unknown>,
+) {
+  const inheritedFieldNames = originField?.props?.fieldNames;
+  const inheritedTitleField = originField?.props?.titleField;
+  const inheritedSelectFieldNamesStep = originField?.getStepParams?.('selectSettings', 'fieldNames');
+
+  return {
+    stepParams: {
+      fieldSettings: {
+        init,
+      },
+      ...(inheritedSelectFieldNamesStep
+        ? {
+            selectSettings: {
+              fieldNames: inheritedSelectFieldNamesStep,
+            },
+          }
+        : {}),
+    },
+    props: {
+      ...(typeof inheritedFieldNames !== 'undefined' ? { fieldNames: inheritedFieldNames } : {}),
+      ...(typeof inheritedTitleField !== 'undefined' ? { titleField: inheritedTitleField } : {}),
+    },
+  };
+}
+
+function stringifyAssignFormTempFieldOption(value: unknown) {
+  try {
+    return JSON.stringify(value) ?? '';
+  } catch {
+    return String(value);
+  }
+}
+
+function getAssignFormTempFieldRefreshKey(originField: AssignFormTempOriginField | undefined) {
+  const inheritedFieldNames = originField?.props?.fieldNames;
+  const inheritedTitleField = originField?.props?.titleField;
+  const inheritedSelectFieldNamesStep = originField?.getStepParams?.('selectSettings', 'fieldNames');
+
+  return [
+    originField?.uid || '',
+    stringifyAssignFormTempFieldOption(inheritedFieldNames),
+    stringifyAssignFormTempFieldOption(inheritedTitleField),
+    stringifyAssignFormTempFieldOption(inheritedSelectFieldNamesStep),
+  ].join('|');
+}
+
+function normalizeAssignFormInputValue(value: unknown) {
+  if (!value || typeof value !== 'object' || !('target' in value)) {
+    return value;
+  }
+  const target = (value as { target?: { value?: unknown } }).target;
+  return target && 'value' in target ? target.value : value;
+}
+
 /**
  * 使用 FormItemModel 的“表单项”包装，内部渲染 VariableInput，并将“常量”映射到临时字段模型。
  */
@@ -108,6 +174,8 @@ export class AssignFormItemModel extends FormItemModel {
     const init = this.fieldInit;
     const namePath = this.props?.name || (this.fieldPath ? [this.fieldPath] : undefined);
     const fieldPath = this.fieldPath;
+    const originField = this.subModels?.field as AssignFormTempOriginField | undefined;
+    const tempFieldRefreshKey = getAssignFormTempFieldRefreshKey(originField);
 
     const FieldRow: React.FC = () => {
       const [tempRoot, setTempRoot] = React.useState<any>(null);
@@ -121,13 +189,14 @@ export class AssignFormItemModel extends FormItemModel {
           return;
         }
         const fieldModel = binding.modelName;
+        const tempFieldOptions = getAssignFormTempFieldOptions(originField, init);
         const created = ctx?.engine?.createModel?.({
           use: 'VariableFieldFormModel',
           subModels: {
             fields: [
               {
                 use: fieldModel,
-                stepParams: { fieldSettings: { init } },
+                ...tempFieldOptions,
               },
             ],
           },
@@ -169,7 +238,6 @@ export class AssignFormItemModel extends FormItemModel {
         fm?.setProps?.({
           disabled: false,
           readPretty: false,
-          pattern: 'editable',
           updateAssociation: false,
           multiple: multi,
         });
@@ -199,9 +267,12 @@ export class AssignFormItemModel extends FormItemModel {
           if (fm) {
             fm.setProps?.({
               value: inputProps?.value,
-              onChange: (...args: any[]) => {
-                const next = args && args.length ? args[0] : undefined;
-                inputProps?.onChange?.(next);
+              onChange: (...args: unknown[]) => {
+                const nextArg = args && args.length ? args[0] : undefined;
+                const nextValue = normalizeAssignFormInputValue(nextArg);
+                fm.setProps?.({ value: nextValue });
+                this.assignValue = nextValue;
+                inputProps?.onChange?.(nextValue);
               },
             });
           }
@@ -302,7 +373,7 @@ export class AssignFormItemModel extends FormItemModel {
       );
     };
 
-    return <FieldRow />;
+    return <FieldRow key={tempFieldRefreshKey} />;
   }
 }
 

package/src/flow/models/blocks/assign-form/__tests__/assignFieldValuesFlow.editor.test.tsx

@@ -0,0 +1,216 @@
+/**
+ * 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 { App, ConfigProvider } from 'antd';
+import { describe, expect, it } from 'vitest';
+import { render, screen, userEvent, waitFor } from '@nocobase/test/client';
+import {
+  FlowEngine,
+  FlowEngineProvider,
+  FlowRuntimeContext,
+  FlowSettingsContextProvider,
+  type FlowModel,
+  type IFlowModelRepository,
+} from '@nocobase/flow-engine';
+import { AssignFormGridModel } from '../AssignFormGridModel';
+import { AssignFormItemModel } from '../AssignFormItemModel';
+import { AssignFormModel } from '../AssignFormModel';
+import { createAssignFieldValuesStep } from '../assignFieldValuesFlow';
+import { InputFieldModel } from '../../../fields/InputFieldModel';
+import { VariableFieldFormModel } from '../../../fields/VariableFieldFormModel';
+
+class MockFlowModelRepository implements IFlowModelRepository {
+  async findOne(): Promise<Record<string, any> | null> {
+    return null;
+  }
+
+  async save(model: FlowModel): Promise<Record<string, any>> {
+    return { uid: model.uid };
+  }
+
+  async destroy(): Promise<boolean> {
+    return true;
+  }
+
+  async move(): Promise<void> {}
+
+  async duplicate(): Promise<Record<string, any> | null> {
+    return null;
+  }
+}
+
+describe('assignFieldValuesFlow (editor)', () => {
+  it('repairs AssignFormModel resource init and clears cached collection', async () => {
+    const engine = new FlowEngine();
+    engine.setModelRepository(new MockFlowModelRepository());
+    engine.registerModels({
+      AssignFormModel,
+      AssignFormGridModel,
+      AssignFormItemModel,
+      InputFieldModel,
+      VariableFieldFormModel,
+    });
+    engine.context.defineProperty('location', { value: { search: '' } });
+    engine.context.defineProperty('themeToken', { value: { marginLG: 24 } });
+
+    const dsm = engine.context.dataSourceManager;
+    const main = dsm.getDataSource('main');
+    main.addCollection({
+      name: 'users',
+      fields: [{ name: 'nickname', type: 'string', interface: 'input' }],
+    });
+    const users = dsm.getCollection('main', 'users');
+    expect(users?.name).toBe('users');
+
+    const action = engine.createModel({
+      use: 'FlowModel',
+      uid: 'act-assign',
+    });
+    action.setStepParams('assignSettings', 'assignFieldValues', { assignedValues: { nickname: '1111' } });
+
+    const existing = engine.createModel<AssignFormModel>({
+      use: 'AssignFormModel',
+      uid: 'form-assign',
+      parentId: action.uid,
+      subKey: 'assignForm',
+      stepParams: {
+        resourceSettings: {
+          init: {
+            dataSourceKey: 'main',
+            collectionName: 'missing',
+          },
+        },
+      },
+    });
+    expect(existing.context.collection).toBeUndefined();
+
+    action.context.defineProperty('blockModel', { value: { collection: users } });
+
+    const step = createAssignFieldValuesStep({ settingsFlowKey: 'assignSettings' });
+    const schema = step.uiSchema();
+    const Editor = schema.editor?.['x-component'] as React.ComponentType;
+    expect(Editor).toBeTypeOf('function');
+
+    const flowSettingsCtx = new FlowRuntimeContext(action as any, 'assignSettings', 'settings');
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <ConfigProvider>
+          <App>
+            <FlowSettingsContextProvider value={flowSettingsCtx}>
+              <Editor />
+            </FlowSettingsContextProvider>
+          </App>
+        </ConfigProvider>
+      </FlowEngineProvider>,
+    );
+
+    await waitFor(() => {
+      const form = engine.findModelByParentId<AssignFormModel>(action.uid, 'assignForm');
+      expect(form?.getStepParams('resourceSettings', 'init')).toEqual({
+        dataSourceKey: 'main',
+        collectionName: 'users',
+      });
+      expect(form?.context.collection?.name).toBe('users');
+      expect(form?.context.collection?.getFields?.().length).toBeGreaterThan(0);
+    });
+
+    await waitFor(() => {
+      expect(screen.getByText('nickname')).toBeInTheDocument();
+      const form = engine.findModelByParentId<AssignFormModel>(action.uid, 'assignForm');
+      expect(form?.subModels.grid.subModels.items.length).toBe(1);
+    });
+
+    await waitFor(() => {
+      expect(screen.getByDisplayValue('1111')).toBeInTheDocument();
+    });
+
+    const input = screen.getByDisplayValue('1111') as HTMLInputElement;
+    await userEvent.clear(input);
+    await userEvent.type(input, '2222');
+
+    await waitFor(() => {
+      const form = engine.findModelByParentId<AssignFormModel>(action.uid, 'assignForm');
+      expect(form?.getAssignedValues()).toEqual({ nickname: '2222' });
+    });
+  });
+
+  it('does not clear delegated parent resource cache when repairing AssignFormModel init', async () => {
+    const engine = new FlowEngine();
+    engine.setModelRepository(new MockFlowModelRepository());
+    engine.registerModels({ AssignFormModel, AssignFormGridModel, AssignFormItemModel, InputFieldModel });
+    engine.context.defineProperty('location', { value: { search: '' } });
+    engine.context.defineProperty('themeToken', { value: { marginLG: 24 } });
+
+    const dsm = engine.context.dataSourceManager;
+    const main = dsm.getDataSource('main');
+    main.addCollection({
+      name: 'users',
+      fields: [{ name: 'nickname', type: 'string', interface: 'input' }],
+    });
+    const users = dsm.getCollection('main', 'users');
+
+    const action = engine.createModel({
+      use: 'FlowModel',
+      uid: 'act-assign-parent-resource',
+    });
+
+    let resourceCreateCount = 0;
+    action.context.defineProperty('resource', {
+      get: () => ({ id: ++resourceCreateCount }),
+    });
+    const cachedResource = action.context.resource;
+
+    engine.createModel<AssignFormModel>({
+      use: 'AssignFormModel',
+      uid: 'form-assign-parent-resource',
+      parentId: action.uid,
+      subKey: 'assignForm',
+      stepParams: {
+        resourceSettings: {
+          init: {
+            dataSourceKey: 'main',
+            collectionName: 'missing',
+          },
+        },
+      },
+    });
+
+    action.context.defineProperty('blockModel', { value: { collection: users } });
+
+    const step = createAssignFieldValuesStep({ settingsFlowKey: 'assignSettings' });
+    const schema = step.uiSchema();
+    const Editor = schema.editor?.['x-component'] as React.ComponentType;
+    const flowSettingsCtx = new FlowRuntimeContext(action as any, 'assignSettings', 'settings');
+
+    render(
+      <FlowEngineProvider engine={engine}>
+        <ConfigProvider>
+          <App>
+            <FlowSettingsContextProvider value={flowSettingsCtx}>
+              <Editor />
+            </FlowSettingsContextProvider>
+          </App>
+        </ConfigProvider>
+      </FlowEngineProvider>,
+    );
+
+    await waitFor(() => {
+      const form = engine.findModelByParentId<AssignFormModel>(action.uid, 'assignForm');
+      expect(form?.getStepParams('resourceSettings', 'init')).toEqual({
+        dataSourceKey: 'main',
+        collectionName: 'users',
+      });
+    });
+
+    expect(action.context.resource).toBe(cachedResource);
+    expect(resourceCreateCount).toBe(1);
+  });
+});