@nocobase/client-v2 2.1.0-beta.32 → 2.1.0-beta.33

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/client-v2",
-  "version": "2.1.0-beta.32",
+  "version": "2.1.0-beta.33",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.mjs",
@@ -24,19 +24,22 @@
     "@formily/antd-v5": "1.2.3",
     "@formily/react": "^2.2.27",
     "@formily/shared": "^2.2.27",
-    "@nocobase/flow-engine": "2.1.0-beta.32",
-    "@nocobase/sdk": "2.1.0-beta.32",
-    "@nocobase/shared": "2.1.0-beta.32",
+    "@nocobase/evaluators": "2.1.0-beta.33",
+    "@nocobase/flow-engine": "2.1.0-beta.33",
+    "@nocobase/sdk": "2.1.0-beta.33",
+    "@nocobase/shared": "2.1.0-beta.33",
     "ahooks": "^3.7.2",
     "antd": "5.24.2",
+    "antd-style": "3.7.1",
     "axios": "^1.7.0",
     "classnames": "^2.3.1",
     "dayjs": "^1.11.10",
+    "file-saver": "^2.0.5",
     "i18next": "^22.4.9",
     "json5": "^2.2.3",
     "lodash": "4.17.21",
     "react-i18next": "^11.15.1",
     "react-router-dom": "^6.30.1"
   },
-  "gitHead": "659c5efe992da7118d33c768bbd9e837a2c4716f"
+  "gitHead": "4815c394e80a264fa8ed619246280923c47aeb72"
 }

package/src/__tests__/globalDeps.test.ts

@@ -25,6 +25,7 @@ describe('client-v2 defineGlobalDeps', () => {
     expect(define).toHaveBeenCalledWith('@nocobase/utils/client', expect.any(Function));
     expect(define).toHaveBeenCalledWith('@nocobase/client-v2', expect.any(Function));
     expect(define).toHaveBeenCalledWith('@nocobase/flow-engine', expect.any(Function));
+    expect(define).toHaveBeenCalledWith('@nocobase/evaluators/client', expect.any(Function));
     expect(define).toHaveBeenCalledWith('ahooks', expect.any(Function));
     expect(define).toHaveBeenCalledWith('dayjs', expect.any(Function));
     expect(define).toHaveBeenCalledWith('lodash', expect.any(Function));

package/src/flow/actions/__tests__/formAssignRules.legacyMigration.test.tsx

@@ -0,0 +1,173 @@
+/**
+ * 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 { render, waitFor } from '@testing-library/react';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { FlowEngine, FlowModel, FlowSettingsContextProvider } from '@nocobase/flow-engine';
+import { formAssignRules } from '../formAssignRules';
+import { filterFormDefaultValues } from '../filterFormDefaultValues';
+
+const mockState = vi.hoisted(() => ({
+  editorProps: [] as any[],
+}));
+
+vi.mock('../../components/FieldAssignRulesEditor', () => ({
+  FieldAssignRulesEditor: (props: any) => {
+    mockState.editorProps.push(props);
+    return null;
+  },
+}));
+
+vi.mock('../../components/fieldAssignOptions', () => ({
+  collectFieldAssignCascaderOptions: vi.fn(() => []),
+}));
+
+vi.mock('../../components/useAssociationTitleFieldSync', () => ({
+  useAssociationTitleFieldSync: () => ({
+    isTitleFieldCandidate: vi.fn(() => false),
+    onSyncAssociationTitleField: vi.fn(),
+  }),
+}));
+
+vi.mock('../../internal/utils/modelUtils', () => ({
+  findFormItemModelByFieldPath: vi.fn(() => null),
+  getCollectionFromModel: vi.fn(() => null),
+}));
+
+function createLegacyField(fieldPath: string, value: any, legacyFlowKey: string) {
+  return {
+    props: {},
+    stepParams: {
+      fieldSettings: { init: { fieldPath } },
+      [legacyFlowKey]: { initialValue: { defaultValue: value } },
+    },
+    getProps() {
+      return this.props;
+    },
+    getStepParams(flowKey: string, stepKey: string) {
+      return this.stepParams?.[flowKey]?.[stepKey];
+    },
+  };
+}
+
+function createModel(legacyFlowKey: string, fields = [{ fieldPath: 'description', value: 'Legacy description' }]) {
+  const engine = new FlowEngine();
+  engine.translate = vi.fn((key: string) => key) as any;
+  const model = new FlowModel({ uid: `model-${legacyFlowKey}`, flowEngine: engine }) as any;
+  model.subModels.grid = {
+    subModels: {
+      items: fields.map((field) => createLegacyField(field.fieldPath, field.value, legacyFlowKey)),
+    },
+  };
+  return model;
+}
+
+function getActionComponent(action: any) {
+  const schema = typeof action.uiSchema === 'function' ? action.uiSchema() : action.uiSchema;
+  return schema.value['x-component'];
+}
+
+function renderAction(action: any, model: any, initialValue: any[] = []) {
+  const Comp = getActionComponent(action);
+  const onChange = vi.fn();
+
+  const Harness = () => {
+    const [value, setValue] = React.useState(initialValue);
+    const handleChange = React.useCallback(
+      (next: any[]) => {
+        onChange(next);
+        setValue(next);
+      },
+      [onChange],
+    );
+
+    return (
+      <FlowSettingsContextProvider value={model.context}>
+        <Comp value={value} onChange={handleChange} />
+      </FlowSettingsContextProvider>
+    );
+  };
+
+  render(<Harness />);
+  return { onChange };
+}
+
+function lastEditorValue() {
+  return mockState.editorProps.at(-1)?.value;
+}
+
+describe('Field values legacy default migration', () => {
+  beforeEach(() => {
+    mockState.editorProps.length = 0;
+    vi.clearAllMocks();
+  });
+
+  it('imports form field legacy defaults before form-level value is persisted', async () => {
+    const model = createModel('editItemSettings');
+    const { onChange } = renderAction(formAssignRules, model);
+
+    await waitFor(() => {
+      expect(onChange).toHaveBeenCalledWith([
+        expect.objectContaining({
+          key: 'legacy-default:description',
+          targetPath: 'description',
+          mode: 'default',
+          value: 'Legacy description',
+        }),
+      ]);
+    });
+    expect(lastEditorValue()).toEqual([
+      expect.objectContaining({
+        targetPath: 'description',
+        value: 'Legacy description',
+      }),
+    ]);
+  });
+
+  it('does not re-import form legacy defaults after an empty form-level value is persisted', async () => {
+    const model = createModel('editItemSettings');
+    model.setStepParams('formModelSettings', 'assignRules', { value: [] });
+    const { onChange } = renderAction(formAssignRules, model, []);
+
+    await waitFor(() => {
+      expect(mockState.editorProps.length).toBeGreaterThan(1);
+    });
+    expect(onChange).not.toHaveBeenCalled();
+    expect(lastEditorValue()).toEqual([]);
+  });
+
+  it('does not append deleted legacy form targets when another rule is already persisted', async () => {
+    const persisted = [{ key: 'kept', targetPath: 'title', mode: 'default', value: 'Kept title' }];
+    const model = createModel('editItemSettings', [
+      { fieldPath: 'title', value: 'Kept title' },
+      { fieldPath: 'description', value: 'Legacy description' },
+    ]);
+    model.setStepParams('formModelSettings', 'assignRules', { value: persisted });
+    const { onChange } = renderAction(formAssignRules, model, persisted);
+
+    await waitFor(() => {
+      expect(mockState.editorProps.length).toBeGreaterThan(1);
+    });
+    expect(onChange).not.toHaveBeenCalled();
+    expect(lastEditorValue()).toEqual(persisted);
+  });
+
+  it('does not re-import filter form legacy defaults after an empty form-level value is persisted', async () => {
+    const model = createModel('filterFormItemSettings');
+    model.setStepParams('formFilterBlockModelSettings', 'defaultValues', { value: [] });
+    const { onChange } = renderAction(filterFormDefaultValues, model, []);
+
+    await waitFor(() => {
+      expect(mockState.editorProps.length).toBeGreaterThan(1);
+    });
+    expect(onChange).not.toHaveBeenCalled();
+    expect(lastEditorValue()).toEqual([]);
+  });
+});

package/src/flow/actions/__tests__/pattern.test.ts

@@ -187,4 +187,138 @@ describe('pattern action', () => {
 
     getDisplayBindingSpy.mockRestore();
   });
+
+  it('falls back to the target collection title field for association display only mode', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({
+      DummyFormItemModel,
+      FieldModel,
+    });
+
+    const parent = engine.createModel<DummyFormItemModel>({
+      use: DummyFormItemModel,
+      uid: 'form-item-association',
+      subModels: {
+        field: {
+          use: FieldModel,
+          uid: 'field-association',
+          props: {},
+        },
+      },
+    });
+    const collectionField = {
+      targetCollectionTitleFieldName: 'name',
+      isAssociationField: () => true,
+    };
+    parent.collectionField = collectionField;
+
+    await pattern.beforeParamsSave?.(
+      {
+        model: parent,
+        collectionField,
+      } as any,
+      { pattern: 'readPretty' },
+      { pattern: 'editable' },
+    );
+
+    expect(parent.props).toMatchObject({
+      pattern: 'readPretty',
+      disabled: false,
+      titleField: 'name',
+    });
+    expect(parent.getStepParams('editItemSettings', 'titleField')).toEqual({
+      titleField: 'name',
+    });
+  });
+
+  it('passes the association title field to the rebuilt display field model', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({
+      DummyFormItemModel,
+      FieldModel,
+      DummyDisplayFieldModel,
+    });
+
+    const parent = engine.createModel<DummyFormItemModel>({
+      use: DummyFormItemModel,
+      uid: 'form-item-association-rebuild',
+      subModels: {
+        field: {
+          use: FieldModel,
+          uid: 'field-association-rebuild',
+          props: {},
+        },
+      },
+    });
+    const targetTitleField = { name: 'name' };
+    const collectionField = {
+      targetCollectionTitleFieldName: 'name',
+      targetCollection: {
+        getField: vi.fn(() => targetTitleField),
+      },
+      isAssociationField: () => true,
+    };
+    parent.collectionField = collectionField;
+    const getDisplayBindingSpy = vi.spyOn(DetailsItemModel, 'getDefaultBindingByField').mockReturnValue({
+      modelName: 'DummyDisplayFieldModel',
+      defaultProps: { display: true },
+    } as any);
+
+    await pattern.afterParamsSave?.(
+      {
+        model: parent,
+        collectionField,
+        engine,
+      } as any,
+      { pattern: 'readPretty' },
+      { pattern: 'editable' },
+    );
+
+    expect(parent.subModels.field).toBeInstanceOf(DummyDisplayFieldModel);
+    expect(parent.subModels.field?.props).toMatchObject({
+      display: true,
+      titleField: 'name',
+    });
+
+    getDisplayBindingSpy.mockRestore();
+  });
+
+  it('refreshes the parent model after leaving display only mode', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({
+      DummyFormItemModel,
+      FieldModel,
+      DummyDisplayFieldModel,
+    });
+
+    const host = engine.createModel<FlowModel>({
+      use: FlowModel,
+      uid: 'sub-table-host',
+    });
+    const parent = engine.createModel<DummyFormItemModel>({
+      use: DummyFormItemModel,
+      uid: 'sub-table-column',
+      subModels: {
+        field: {
+          use: FieldModel,
+          uid: 'sub-table-column-field',
+          stepParams: {
+            fieldBinding: {
+              use: 'DummyDisplayFieldModel',
+            },
+          },
+        },
+      },
+    });
+    parent.setParent(host);
+    const hostSetPropsSpy = vi.spyOn(host, 'setProps');
+
+    await pattern.afterParamsSave?.(makeCtx(parent), { pattern: 'editable' }, { pattern: 'readPretty' });
+
+    expect(parent.subModels.field).toBeInstanceOf(FieldModel);
+    expect(parent.subModels.field?.uid).toBe('sub-table-column-field');
+    expect(hostSetPropsSpy).toHaveBeenCalledWith({
+      __patternRefreshKey: expect.any(String),
+    });
+  });
 });

package/src/flow/actions/__tests__/titleField.test.ts

@@ -0,0 +1,45 @@
+/**
+ * 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 { describe, expect, it, vi } from 'vitest';
+import { titleField } from '../titleField';
+
+describe('titleField action', () => {
+  it('builds options from target field interface metadata', () => {
+    const titleableField = {
+      name: 'nickname',
+      title: 'Nickname',
+      getInterfaceOptions: vi.fn(() => ({ titleUsable: true })),
+    };
+    const nonTitleableField = {
+      name: 'profile',
+      title: 'Profile',
+      getInterfaceOptions: vi.fn(() => ({ titleUsable: false })),
+    };
+    const missingContextManager = {
+      collectionFieldInterfaceManager: {
+        getFieldInterface: vi.fn(() => undefined),
+      },
+    };
+
+    const uiMode = (titleField as any).uiMode({
+      dataSourceManager: missingContextManager,
+      collectionField: {
+        targetCollection: {
+          getFields: () => [titleableField, nonTitleableField],
+        },
+      },
+    });
+
+    expect(uiMode.props.options).toEqual([{ value: 'nickname', label: 'Nickname' }]);
+    expect(titleableField.getInterfaceOptions).toHaveBeenCalled();
+    expect(nonTitleableField.getInterfaceOptions).toHaveBeenCalled();
+    expect(missingContextManager.collectionFieldInterfaceManager.getFieldInterface).not.toHaveBeenCalled();
+  });
+});

package/src/flow/actions/filterFormDefaultValues.tsx

@@ -10,7 +10,8 @@
 import { defineAction, observer, tExpr, useFlowContext } from '@nocobase/flow-engine';
 import { isEqual } from 'lodash';
 import React from 'react';
-import { FieldAssignRulesEditor, type FieldAssignRuleItem } from '../components/FieldAssignRulesEditor';
+import { FieldAssignRulesEditor } from '../components/FieldAssignRulesEditor';
+import type { FieldAssignRuleItem } from '../components/FieldAssignRulesEditor';
 import { collectFieldAssignCascaderOptions } from '../components/fieldAssignOptions';
 import { useAssociationTitleFieldSync } from '../components/useAssociationTitleFieldSync';
 import { findFormItemModelByFieldPath, getCollectionFromModel } from '../internal/utils/modelUtils';
@@ -18,6 +19,7 @@ import {
   collectLegacyDefaultValueRulesFromFilterFormModel,
   mergeAssignRulesWithLegacyDefaults,
 } from '../models/blocks/filter-form/legacyDefaultValueMigration';
+import { hasPersistedAssignRulesValue } from '../models/blocks/shared/legacyDefaultValueMigrationBase';
 import { getDefaultOperator } from '../models/blocks/filter-manager/utils';
 import { operators } from '../../flow-compat';
 
@@ -36,6 +38,10 @@ const FilterFormDefaultValuesUI = observer(
       return collectLegacyDefaultValueRulesFromFilterFormModel(ctx.model);
     }, [ctx.model]);
 
+    const hasPersistedValue = React.useMemo(() => {
+      return hasPersistedAssignRulesValue(ctx.model, 'formFilterBlockModelSettings', 'defaultValues');
+    }, [ctx.model]);
+
     const getValueInputProps = React.useCallback(
       (item: FieldAssignRuleItem) => {
         const targetPath = item?.targetPath ? String(item.targetPath) : '';
@@ -57,7 +63,7 @@ const FilterFormDefaultValuesUI = observer(
     );
 
     // 兼容：将字段级默认值（filterFormItemSettings.initialValue）合并到表单级 defaultValues 里展示。
-    // 仅在首次打开时合并，后续以当前 step 表单值为准（便于用户在此处编辑/删除后统一保存）。
+    // 仅在表单级 defaultValues.value 尚未持久化时合并；已保存的空数组也代表用户显式删除。
     const hasInitializedMergeRef = React.useRef(false);
     const [hasInitializedMerge, setHasInitializedMerge] = React.useState(false);
     const markInitialized = React.useCallback(() => {
@@ -66,12 +72,23 @@ const FilterFormDefaultValuesUI = observer(
       setHasInitializedMerge(true);
     }, []);
 
+    const normalizedValue = React.useMemo(() => {
+      return Array.isArray(props.value) ? props.value : [];
+    }, [props.value]);
+
+    const legacyAwareValue = React.useMemo(() => {
+      if (hasPersistedValue) {
+        return normalizedValue;
+      }
+      return mergeAssignRulesWithLegacyDefaults(props.value, legacyDefaults);
+    }, [hasPersistedValue, legacyDefaults, normalizedValue, props.value]);
+
     const value = React.useMemo(() => {
       if (!canEdit || !hasInitializedMerge) {
-        return mergeAssignRulesWithLegacyDefaults(props.value, legacyDefaults);
+        return legacyAwareValue;
       }
-      return Array.isArray(props.value) ? props.value : [];
-    }, [canEdit, hasInitializedMerge, legacyDefaults, props.value]);
+      return normalizedValue;
+    }, [canEdit, hasInitializedMerge, legacyAwareValue, normalizedValue]);
 
     const handleChange = React.useCallback(
       (next: FieldAssignRuleItem[]) => {
@@ -87,12 +104,16 @@ const FilterFormDefaultValuesUI = observer(
       if (hasInitializedMergeRef.current) return;
       if (!canEdit) return;
 
-      const nextValue = mergeAssignRulesWithLegacyDefaults(props.value, legacyDefaults);
-      if (!isEqual(props.value || [], nextValue || [])) {
-        props.onChange?.(nextValue);
+      if (hasPersistedValue) {
+        markInitialized();
+        return;
+      }
+
+      if (!isEqual(normalizedValue, legacyAwareValue)) {
+        props.onChange?.(legacyAwareValue);
       }
       markInitialized();
-    }, [canEdit, legacyDefaults, markInitialized, props.onChange, props.value]);
+    }, [canEdit, hasPersistedValue, legacyAwareValue, markInitialized, normalizedValue, props.onChange]);
 
     return (
       <FieldAssignRulesEditor

package/src/flow/actions/formAssignRules.tsx

@@ -10,7 +10,8 @@
 import { defineAction, observer, tExpr, useFlowContext } from '@nocobase/flow-engine';
 import { isEqual } from 'lodash';
 import React from 'react';
-import { FieldAssignRulesEditor, type FieldAssignRuleItem } from '../components/FieldAssignRulesEditor';
+import { FieldAssignRulesEditor } from '../components/FieldAssignRulesEditor';
+import type { FieldAssignRuleItem } from '../components/FieldAssignRulesEditor';
 import { collectFieldAssignCascaderOptions } from '../components/fieldAssignOptions';
 import { useAssociationTitleFieldSync } from '../components/useAssociationTitleFieldSync';
 import { getCollectionFromModel } from '../internal/utils/modelUtils';
@@ -18,6 +19,7 @@ import {
   collectLegacyDefaultValueRulesFromFormModel,
   mergeAssignRulesWithLegacyDefaults,
 } from '../models/blocks/form/legacyDefaultValueMigration';
+import { hasPersistedAssignRulesValue } from '../models/blocks/shared/legacyDefaultValueMigrationBase';
 
 const FormAssignRulesUI = observer(
   (props: { value?: FieldAssignRuleItem[]; onChange?: (value: FieldAssignRuleItem[]) => void }) => {
@@ -34,8 +36,12 @@ const FormAssignRulesUI = observer(
       return collectLegacyDefaultValueRulesFromFormModel(ctx.model);
     }, [ctx.model]);
 
+    const hasPersistedValue = React.useMemo(() => {
+      return hasPersistedAssignRulesValue(ctx.model, 'formModelSettings', 'assignRules');
+    }, [ctx.model]);
+
     // 兼容：将字段级默认值（editItemSettings/formItemSettings.initialValue）合并到表单级 assignRules 里展示。
-    // 仅在首次打开时合并，后续以当前 step 表单值为准（便于用户在此处编辑/删除后统一保存）。
+    // 仅在表单级 assignRules.value 尚未持久化时合并；已保存的空数组也代表用户显式删除。
     const hasInitializedMergeRef = React.useRef(false);
     const [hasInitializedMerge, setHasInitializedMerge] = React.useState(false);
     const markInitialized = React.useCallback(() => {
@@ -49,12 +55,19 @@ const FormAssignRulesUI = observer(
       return base;
     }, [props.value]);
 
+    const legacyAwareValue = React.useMemo(() => {
+      if (hasPersistedValue) {
+        return normalizedValue;
+      }
+      return mergeAssignRulesWithLegacyDefaults(props.value, legacyDefaults);
+    }, [hasPersistedValue, legacyDefaults, normalizedValue, props.value]);
+
     const value = React.useMemo(() => {
       if (!canEdit || !hasInitializedMerge) {
-        return mergeAssignRulesWithLegacyDefaults(props.value, legacyDefaults);
+        return legacyAwareValue;
       }
       return normalizedValue;
-    }, [canEdit, hasInitializedMerge, legacyDefaults, normalizedValue, props.value]);
+    }, [canEdit, hasInitializedMerge, legacyAwareValue, normalizedValue]);
 
     const handleChange = React.useCallback(
       (next: FieldAssignRuleItem[]) => {
@@ -70,14 +83,16 @@ const FormAssignRulesUI = observer(
       if (hasInitializedMergeRef.current) return;
       if (!canEdit) return;
 
-      const merged = mergeAssignRulesWithLegacyDefaults(props.value, legacyDefaults);
-      const nextValue = merged;
+      if (hasPersistedValue) {
+        markInitialized();
+        return;
+      }
 
-      if (!isEqual(props.value || [], nextValue || [])) {
-        props.onChange?.(nextValue);
+      if (!isEqual(normalizedValue, legacyAwareValue)) {
+        props.onChange?.(legacyAwareValue);
       }
       markInitialized();
-    }, [canEdit, legacyDefaults, markInitialized, props.onChange, props.value]);
+    }, [canEdit, hasPersistedValue, legacyAwareValue, markInitialized, normalizedValue, props.onChange]);
 
     return (
       <FieldAssignRulesEditor

package/src/flow/actions/pattern.tsx

@@ -7,6 +7,7 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
+import { uid } from '@formily/shared';
 import { defineAction, tExpr } from '@nocobase/flow-engine';
 import { DetailsItemModel } from '../models/blocks/details/DetailsItemModel';
 import { getFieldBindingUse, rebuildFieldSubModel } from '../internal/utils/rebuildFieldSubModel';
@@ -19,6 +20,14 @@ type PatternAwareFieldModel = {
   scheduleApplyJsSettings?: () => void;
 };
 
+function resolveAssociationTitleField(ctx: any) {
+  return (
+    ctx.model.subModels?.field?.props?.fieldNames?.label ||
+    ctx.model.props.titleField ||
+    ctx.collectionField?.targetCollectionTitleFieldName
+  );
+}
+
 function shouldPreserveFieldModelOnPatternChange(ctx: any) {
   const fieldModel = ctx.model.subModels.field;
   const fieldUse = getFieldBindingUse(fieldModel) ?? fieldModel?.use;
@@ -27,6 +36,22 @@ function shouldPreserveFieldModelOnPatternChange(ctx: any) {
   return ((ModelClass?.meta as PatternAwareFieldModelMeta | undefined)?.preserveOnPatternChange ?? false) === true;
 }
 
+async function refreshPatternRuntime(ctx: any) {
+  ctx.model.invalidateFlowCache?.('beforeRender', true);
+  await ctx.model.rerender?.();
+
+  const parent = ctx.model.parent;
+  if (!parent) {
+    return;
+  }
+
+  parent.invalidateFlowCache?.('beforeRender', true);
+  parent.setProps?.({
+    __patternRefreshKey: uid(),
+  });
+  await parent.rerender?.();
+}
+
 export const pattern = defineAction({
   name: 'pattern',
   title: tExpr('Display mode'),
@@ -76,17 +101,25 @@ export const pattern = defineAction({
       if (params.pattern !== previousParams.pattern) {
         (ctx.model.subModels.field as PatternAwareFieldModel | undefined)?.scheduleApplyJsSettings?.();
       }
+      await refreshPatternRuntime(ctx);
       return;
     }
 
     const targetCollection = ctx.collectionField.targetCollection;
-    const targetCollectionTitleField = targetCollection?.getField(
-      ctx.model.subModels.field.props?.fieldNames?.label || ctx.model.props.titleField,
-    );
+    const associationTitleField = resolveAssociationTitleField(ctx);
+    const targetCollectionTitleField = targetCollection?.getField(associationTitleField);
     const { model } = ctx;
     const resolveDefaultProps = (binding, field = ctx.collectionField) => {
       if (!binding) return undefined;
-      return typeof binding.defaultProps === 'function' ? binding.defaultProps(ctx, field) : binding.defaultProps;
+      const defaultProps =
+        typeof binding.defaultProps === 'function' ? binding.defaultProps(ctx, field) : binding.defaultProps;
+      if (!ctx.collectionField?.isAssociationField?.() || !associationTitleField) {
+        return defaultProps;
+      }
+      return {
+        ...(defaultProps || {}),
+        titleField: associationTitleField,
+      };
     };
     if (params.pattern === 'readPretty') {
       const binding = DetailsItemModel.getDefaultBindingByField(ctx, ctx.collectionField, {
@@ -111,17 +144,19 @@ export const pattern = defineAction({
         });
       }
     }
+    await refreshPatternRuntime(ctx);
   },
   async beforeParamsSave(ctx, params, previousParams) {
     if (params.pattern === 'readPretty') {
+      const titleField = resolveAssociationTitleField(ctx);
       ctx.model.setProps({
         pattern: 'readPretty',
         disabled: false,
-        titleField: (ctx.model.subModels?.field as any)?.props.fieldNames?.label || ctx.model.props.titleField,
+        titleField,
       });
       if (ctx.collectionField.isAssociationField())
         await ctx.model.setStepParams('editItemSettings', 'titleField', {
-          titleField: (ctx.model.subModels.field as any).props?.fieldNames?.label || ctx.model.props.titleField,
+          titleField,
         });
     } else {
       ctx.model.setProps({

package/src/flow/actions/titleField.tsx

@@ -43,7 +43,9 @@ export const titleField = defineAction({
     const options = targetFields
       .filter((field) =>
         isTitleFieldInterface(
-          getFlowFieldInterfaceOptions(field.options?.interface || field.interface, dataSourceManager),
+          typeof field.getInterfaceOptions === 'function'
+            ? field.getInterfaceOptions()
+            : getFlowFieldInterfaceOptions(field.options?.interface || field.interface, dataSourceManager),
         ),
       )
       .map((field) => ({
@@ -59,7 +61,7 @@ export const titleField = defineAction({
     };
   },
   defaultParams: (ctx: any) => {
-    const titleField = ctx.model.context.collectionField.targetCollectionTitleFieldName;
+    const titleField = ctx.model?.context?.collectionField?.targetCollectionTitleFieldName;
     return {
       label: ctx.model.parent?.props?.titleField || ctx.model.props.titleField || titleField,
     };