@nocobase/client-v2 2.1.0-beta.42 → 2.1.0-beta.44

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/AssignFormItemModel.tsx

@@ -86,6 +86,14 @@ function getAssignFormTempFieldRefreshKey(originField: AssignFormTempOriginField
   ].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，并将“常量”映射到临时字段模型。
  */
@@ -259,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);
               },
             });
           }

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

@@ -10,7 +10,7 @@
 import React from 'react';
 import { App, ConfigProvider } from 'antd';
 import { describe, expect, it } from 'vitest';
-import { render, screen, waitFor } from '@nocobase/test/client';
+import { render, screen, userEvent, waitFor } from '@nocobase/test/client';
 import {
   FlowEngine,
   FlowEngineProvider,
@@ -24,6 +24,7 @@ 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> {
@@ -49,7 +50,13 @@ 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 });
+    engine.registerModels({
+      AssignFormModel,
+      AssignFormGridModel,
+      AssignFormItemModel,
+      InputFieldModel,
+      VariableFieldFormModel,
+    });
     engine.context.defineProperty('location', { value: { search: '' } });
     engine.context.defineProperty('themeToken', { value: { marginLG: 24 } });
 
@@ -120,5 +127,90 @@ describe('assignFieldValuesFlow (editor)', () => {
       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);
   });
 });

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

@@ -38,6 +38,9 @@ type AssignFieldValuesModel = {
   uid: string;
   assignFormUid?: string;
   context?: AssignFieldValuesContext;
+  subModels?: {
+    assignForm?: AssignFormModel;
+  };
   getStepParams?: (flowKey: string, stepKey: string) => { assignedValues?: AssignedValues } | undefined;
   setStepParams?: (flowKey: string, stepKey: string, params: { assignedValues: AssignedValues }) => void;
 };
@@ -88,11 +91,53 @@ function isValidResourceInit(init: unknown): init is {
   );
 }
 
-function clearResourceContextCache(model: { context?: { removeCache?: (key: string) => void } } | undefined) {
-  model?.context?.removeCache?.('dataSource');
-  model?.context?.removeCache?.('collection');
-  model?.context?.removeCache?.('resource');
-  model?.context?.removeCache?.('association');
+type LocalCacheContext = {
+  _observableCache?: Record<string, unknown>;
+  _cache?: Record<string, unknown>;
+  _pending?: Record<string, unknown>;
+};
+
+function toLocalCacheContext(context: unknown): LocalCacheContext | undefined {
+  return context && typeof context === 'object' ? (context as LocalCacheContext) : undefined;
+}
+
+function clearOwnContextCache(context: unknown, key: string) {
+  const localContext = toLocalCacheContext(context);
+  if (!localContext) {
+    return;
+  }
+  delete localContext._observableCache?.[key];
+  delete localContext._cache?.[key];
+  delete localContext._pending?.[key];
+}
+
+function clearResourceContextCache(model: { context?: unknown } | undefined) {
+  clearOwnContextCache(model?.context, 'dataSource');
+  clearOwnContextCache(model?.context, 'collection');
+  clearOwnContextCache(model?.context, 'resource');
+  clearOwnContextCache(model?.context, 'association');
+}
+
+function resolveAssignFormModel(ctx: {
+  model: AssignFieldValuesModel;
+  engine: {
+    getModel?: (uid: string, fromRoot?: boolean) => AssignFormModel | undefined;
+    findModelByParentId?: (parentId: string, subKey: string) => AssignFormModel | undefined | null;
+  };
+}) {
+  if (ctx.model.assignFormUid) {
+    const form = ctx.engine.getModel?.(ctx.model.assignFormUid, true);
+    if (form) {
+      return form;
+    }
+  }
+
+  const localForm = ctx.model.subModels?.assignForm;
+  if (localForm) {
+    return localForm;
+  }
+
+  return ctx.engine.findModelByParentId?.(ctx.model.uid, 'assignForm') || undefined;
 }
 
 export function createAssignFormSubModelOptions(ctx: AssignFieldValuesContext) {
@@ -235,14 +280,23 @@ export function createAssignFieldValuesStep(options: AssignFieldValuesStepOption
         },
       };
     },
-    async beforeParamsSave(ctx: {
-      model: AssignFieldValuesModel;
-      engine: {
-        getModel?: (uid: string, fromRoot?: boolean) => AssignFormModel | undefined;
-      };
-    }) {
-      const form = ctx.model.assignFormUid ? ctx.engine.getModel?.(ctx.model.assignFormUid, true) : undefined;
-      if (!form) return;
+    async beforeParamsSave(
+      ctx: {
+        model: AssignFieldValuesModel;
+        engine: {
+          getModel?: (uid: string, fromRoot?: boolean) => AssignFormModel | undefined;
+          findModelByParentId?: (parentId: string, subKey: string) => AssignFormModel | undefined | null;
+        };
+      },
+      params?: { assignedValues?: AssignedValues },
+      previousParams?: { assignedValues?: AssignedValues },
+    ) {
+      const form = resolveAssignFormModel(ctx);
+      if (!form) {
+        const assignedValues = params?.assignedValues || previousParams?.assignedValues || {};
+        ctx.model.setStepParams?.(options.settingsFlowKey, ASSIGN_FIELD_VALUES_STEP_KEY, { assignedValues });
+        return;
+      }
       if (options.validateBeforeSave) {
         await form.form?.validateFields?.();
       }

package/src/flow/models/blocks/form/__tests__/FormBlockModel.test.tsx

@@ -221,6 +221,23 @@ describe('FlowModel core behaviors (collected)', () => {
     expect(i1).toEqual({ ping: 1 });
   });
 
+  it('unchanged stepParams do not trigger a beforeRender rerun', async () => {
+    vi.useFakeTimers();
+    const spy = vi.fn().mockResolvedValue([]);
+    (engine as any).executor.dispatchEvent = spy;
+    const model = engine.createModel<FlowModel>({
+      use: 'FlowModel',
+      uid: 'm-flow-3-noop',
+      stepParams: { anyFlow: { anyStep: { x: 1 } } },
+    });
+
+    await model.dispatchEvent('beforeRender', { ping: 1 });
+    model.setStepParams('anyFlow', 'anyStep', { x: 1 });
+    await vi.advanceTimersByTimeAsync(150);
+
+    expect(spy).toHaveBeenCalledTimes(1);
+  });
+
   it('applyFlow delegates to executor.runFlow', async () => {
     const spyRun = vi.fn().mockResolvedValue('ok');
     (engine as any).executor.runFlow = spyRun;

package/src/flow/models/blocks/form/value-runtime/__tests__/runtime.test.ts

@@ -15,6 +15,7 @@ import { observable } from '@formily/reactive';
 import { get as lodashGet, merge as lodashMerge, set as lodashSet } from 'lodash';
 import { FlowContext, JSRunner } from '@nocobase/flow-engine';
 import { FormValueRuntime } from '..';
+import type { FormInstance } from 'antd';
 
 function createFormStub(initialValues: any = {}) {
   const store: any = JSON.parse(JSON.stringify(initialValues || {}));
@@ -121,6 +122,34 @@ function createFieldContext(runtime: FormValueRuntime) {
 }
 
 describe('FormValueRuntime (default rules)', () => {
+  it('skips object patches when values are unchanged', async () => {
+    const engineEmitter = new EventEmitter();
+    const blockEmitter = new EventEmitter();
+    const formStub = createFormStub({ name: 'old' });
+    const dispatchEvent = vi.fn();
+
+    const blockModel = {
+      uid: 'form-noop-patch',
+      flowEngine: { emitter: engineEmitter },
+      emitter: blockEmitter,
+      dispatchEvent,
+      getAclActionName: () => 'create',
+    } as ConstructorParameters<typeof FormValueRuntime>[0]['model'];
+
+    const runtime = new FormValueRuntime({ model: blockModel, getForm: () => formStub as unknown as FormInstance });
+    runtime.mount({ sync: true });
+
+    const blockCtx = createFieldContext(runtime);
+    await runtime.setFormValues(blockCtx, { name: 'old' }, { source: 'system' });
+
+    expect(dispatchEvent).not.toHaveBeenCalled();
+
+    await runtime.setFormValues(blockCtx, { name: 'new' }, { source: 'system' });
+
+    expect(formStub.getFieldValue(['name'])).toBe('new');
+    expect(dispatchEvent).toHaveBeenCalledTimes(1);
+  });
+
   it('recomputes default on dependency change when current equals last default; user change disables default permanently', async () => {
     const engineEmitter = new EventEmitter();
     const blockEmitter = new EventEmitter();

package/src/flow/models/blocks/form/value-runtime/runtime.ts

@@ -846,7 +846,11 @@ export class FormValueRuntime {
       const changedPaths: NamePath[] = [];
 
       if (!Array.isArray(patch)) {
-        const patchEntries = Object.entries(patch || {}).filter(([pathKey]) => !shouldSkipByLinkageScope(pathKey));
+        const patchEntries = Object.entries(patch || {}).filter(([pathKey, rawValue]) => {
+          if (shouldSkipByLinkageScope(pathKey)) return false;
+          const value = isObservable(rawValue) ? toJS(rawValue) : rawValue;
+          return !_.isEqual(this.getFormValueAtPath([pathKey]), value);
+        });
         const patchToApply = Object.fromEntries(patchEntries);
         const patchKeys = patchEntries.map(([pathKey]) => pathKey);
         if (!patchKeys.length) {

package/src/flow/models/fields/mobile-components/MobileLazySelect.tsx

@@ -10,7 +10,7 @@
 import { useFlowModelContext } from '@nocobase/flow-engine';
 import { Select } from 'antd';
 import type { CSSProperties } from 'react';
-import React, { useCallback, useEffect, useMemo, useState } from 'react';
+import React, { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { Button, CheckList, Popup, SearchBar, SpinLoading } from 'antd-mobile';
 import { css } from '@emotion/css';
 import {
@@ -51,7 +51,7 @@ function deriveRecordsFromValue(
 ) {
   if (isMultiple) {
     if (Array.isArray(value)) {
-      return (value.filter(Boolean) as any[]).map((item) => {
+      return (value.filter((item) => item !== null && item !== undefined) as any[]).map((item) => {
         if (valueMode === 'value') {
           return optionMap.get(item) ?? { [valueKey]: item };
         }
@@ -113,11 +113,13 @@ export function MobileLazySelect(props: Readonly<LazySelectProps>) {
   );
 
   const [selectedRecords, setSelectedRecords] = useState<AssociationOption[]>(() => derivedRecords);
+  const wasVisibleRef = useRef(visible);
 
   useEffect(() => {
-    if (visible) {
+    if (visible && !wasVisibleRef.current) {
       setSelectedRecords(derivedRecords);
     }
+    wasVisibleRef.current = visible;
   }, [derivedRecords, visible]);
 
   useEffect(() => {

package/src/flow/models/fields/mobile-components/__tests__/MobileSelect.test.tsx

@@ -10,6 +10,7 @@
 import React from 'react';
 import { beforeEach, describe, it, expect, vi } from 'vitest';
 import { act, fireEvent, render, screen } from '@nocobase/test/client';
+import { MobileLazySelect } from '../MobileLazySelect';
 import { MobileSelect } from '../MobileSelect';
 
 const DEFAULT_OPTIONS = [
@@ -17,6 +18,11 @@ const DEFAULT_OPTIONS = [
   { label: 'Option B', value: 'b' },
 ];
 
+const RELATION_OPTIONS = [
+  { uuid: '05f6a3b4-bfb7-7943-578a-3819e2687a7e' },
+  { uuid: 'c7d99828-a1de-9e70-4c2d-b0139abdf02e' },
+];
+
 const mockState = vi.hoisted(() => ({
   selectProps: undefined as any,
   popupProps: undefined as any,
@@ -44,6 +50,13 @@ function openPopup() {
   expect(screen.getByTestId('popup')).toBeInTheDocument();
 }
 
+function openLazyPopup() {
+  act(() => {
+    mockState.selectProps?.onClick?.();
+  });
+  expect(screen.getByTestId('popup')).toBeInTheDocument();
+}
+
 function selectValues(values: string[]) {
   act(() => {
     mockState.checklistProps?.onChange?.(values);
@@ -73,6 +86,30 @@ function renderMobileSelect(props: Record<string, any> = {}) {
   return { onChange, onChangeComplete };
 }
 
+function renderMobileLazySelect(props: Record<string, any> = {}) {
+  const onChange = props.onChange ?? vi.fn();
+  const renderComponent = (nextProps: Record<string, any> = {}) => (
+    <MobileLazySelect
+      fieldNames={{ label: 'uuid', value: 'uuid' }}
+      value={[]}
+      multiple
+      allowMultiple
+      options={RELATION_OPTIONS}
+      {...props}
+      {...nextProps}
+      onChange={onChange}
+    />
+  );
+
+  const result = render(renderComponent());
+
+  return {
+    ...result,
+    onChange,
+    rerender: (nextProps: Record<string, any> = {}) => result.rerender(renderComponent(nextProps)),
+  };
+}
+
 vi.mock('@nocobase/flow-engine', async () => {
   const actual = await vi.importActual<any>('@nocobase/flow-engine');
   return {
@@ -80,6 +117,12 @@ vi.mock('@nocobase/flow-engine', async () => {
     useFlowModelContext: () => ({
       t: (value: string) => value,
     }),
+    useFlowModel: () => ({
+      context: {
+        collectionField: {},
+      },
+      subModels: {},
+    }),
   };
 });
 
@@ -240,3 +283,30 @@ describe('MobileSelect in SubForm/SubTable containers', () => {
     expect(onCommit).toHaveBeenNthCalledWith(2, ['a', 'b']);
   });
 });
+
+describe('MobileLazySelect', () => {
+  beforeEach(() => {
+    resetMockState();
+  });
+
+  it('keeps pending relation records selected until confirm', () => {
+    const { onChange, rerender } = renderMobileLazySelect();
+
+    openLazyPopup();
+    expect(mockState.checklistProps?.value).toEqual([]);
+
+    selectValues(['c7d99828-a1de-9e70-4c2d-b0139abdf02e']);
+    expect(mockState.checklistProps?.value).toEqual(['c7d99828-a1de-9e70-4c2d-b0139abdf02e']);
+
+    rerender({
+      options: RELATION_OPTIONS.map((item) => ({ ...item })),
+    });
+
+    expect(mockState.checklistProps?.value).toEqual(['c7d99828-a1de-9e70-4c2d-b0139abdf02e']);
+
+    confirmSelection();
+
+    expect(onChange).toHaveBeenCalledTimes(1);
+    expect(onChange).toHaveBeenCalledWith([RELATION_OPTIONS[1]]);
+  });
+});