@nocobase/client-v2 2.3.0-alpha.1 → 2.3.0-beta.11

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

@@ -86,6 +86,10 @@ export class FormValueRuntime {
 
     this.ruleEngine = new RuleEngine({
       getBlockModelUid: () => String(this.model?.uid),
+      getAssignRulesModelUid: () => {
+        const grid = this.model?.subModels?.grid;
+        return !Array.isArray(grid) && grid?.uid ? String(grid.uid) : undefined;
+      },
       getActionName: () => this.model?.getAclActionName?.() ?? this.model?.context?.actionName,
       getBlockContext: () => this.model?.context,
       getEngine: () => this.model?.context?.engine,
@@ -190,13 +194,32 @@ export class FormValueRuntime {
     return values;
   }
 
-  private toMirrorSnapshot(value: any) {
-    const raw = isObservable(value) ? toJS(value) : value;
-    return _.cloneDeepWith(raw, (item) => {
-      if (!item || typeof item !== 'object') return undefined;
-      if (Array.isArray(item) || _.isPlainObject(item)) return undefined;
-      return item;
-    });
+  private toMirrorSnapshot<T>(value: T): T {
+    const cloneValue = (input: unknown): unknown =>
+      _.cloneDeepWith(input, (item: unknown) => {
+        if (isObservable(item)) {
+          const plainItem = toJS(item);
+          if (plainItem !== item) return cloneValue(plainItem);
+        }
+
+        // Tracking form-value array proxies hide `constructor`, while Lodash's array
+        // clone relies on it being callable.
+        if (Array.isArray(item) && typeof item.constructor !== 'function') {
+          const plainArray = new Array(item.length);
+          for (let index = 0; index < item.length; index++) {
+            if (Object.hasOwn(item, index)) {
+              plainArray[index] = cloneValue(item[index]);
+            }
+          }
+          return plainArray;
+        }
+
+        if (!item || typeof item !== 'object') return undefined;
+        if (Array.isArray(item) || _.isPlainObject(item)) return undefined;
+        return item;
+      });
+
+    return cloneValue(value) as T;
   }
 
   canApplyDefaultValuePatch(namePath: NamePath, resolved: any) {
@@ -940,11 +963,12 @@ export class FormValueRuntime {
       const changedPaths: NamePath[] = [];
 
       if (!Array.isArray(patch)) {
-        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 patchEntries = Object.entries(patch || {})
+          .map(([pathKey, rawValue]) => [pathKey, this.toMirrorSnapshot(rawValue)] as const)
+          .filter(([pathKey, value]) => {
+            if (shouldSkipByLinkageScope(pathKey)) return false;
+            return !_.isEqual(this.getFormValueAtPath([pathKey]), value);
+          });
         const patchToApply = Object.fromEntries(patchEntries);
         const patchKeys = patchEntries.map(([pathKey]) => pathKey);
         if (!patchKeys.length) {
@@ -955,8 +979,7 @@ export class FormValueRuntime {
         }
         this.suppressFormCallbackDepth++;
         try {
-          for (const [pathKey, rawValue] of patchEntries) {
-            const value = isObservable(rawValue) ? toJS(rawValue) : rawValue;
+          for (const [pathKey, value] of patchEntries) {
             if (typeof form.setFieldValue === 'function') {
               form.setFieldValue(pathKey, value);
             } else if (typeof (form as any).setFields === 'function') {
@@ -1017,7 +1040,7 @@ export class FormValueRuntime {
         const namePath = this.resolveNamePath(callerCtx, item.path);
         const pathKey = namePathToPathKey(namePath);
         const rawValue = item.value;
-        const value = isObservable(rawValue) ? toJS(rawValue) : rawValue;
+        const value = this.toMirrorSnapshot(rawValue);
 
         if (shouldSkipByLinkageScope(pathKey)) continue;
 
@@ -1156,17 +1179,18 @@ export class FormValueRuntime {
     if (!form) return;
     if (source === 'override' && this.findUserEditedHit(pathKey)) return;
 
+    const value = this.toMirrorSnapshot(nextValue);
     const prevValue = _.get(this.valuesMirror, namePath);
-    if (_.isEqual(prevValue, nextValue)) return;
+    if (_.isEqual(prevValue, value)) return;
 
     this.writeSeq += 1;
     const writeSeq = this.writeSeq;
 
     this.suppressFormCallbackDepth++;
     try {
-      form.setFieldValue?.(namePath, nextValue);
-      _.set(this.valuesMirror, namePath, this.toMirrorSnapshot(nextValue));
-      this.syncMountedFieldModelValue(namePath, nextValue);
+      form.setFieldValue?.(namePath, value);
+      _.set(this.valuesMirror, namePath, this.toMirrorSnapshot(value));
+      this.syncMountedFieldModelValue(namePath, value);
       this.bumpChangeTick();
     } finally {
       this.suppressFormCallbackDepth--;

package/src/flow/models/blocks/js-block/JSBlock.tsx

@@ -235,7 +235,7 @@ export class JSBlockModel extends BlockModel {
     const cardProps = {
       ...rest,
       height,
-      style,
+      ...(style === undefined ? {} : { style }),
       ...(beforeContent === undefined ? {} : { beforeContent }),
       ...(afterContent === undefined ? {} : { afterContent }),
     };

package/src/flow/models/blocks/table/JSColumnModel.tsx

@@ -9,13 +9,14 @@
 
 import { LockOutlined, QuestionCircleOutlined } from '@ant-design/icons';
 import { css } from '@emotion/css';
-import type { PropertyMetaFactory } from '@nocobase/flow-engine';
+import type { FlowModelOptions, PropertyMetaFactory } from '@nocobase/flow-engine';
 import {
   Droppable,
   tExpr,
   FlowsFloatContextMenu,
   DragHandler,
   MemoFlowModelRenderer,
+  createCurrentRecordMetaFactory,
   createRecordMetaFactory,
   createRecordResolveOnServerWithLocal,
   ElementProxy,
@@ -51,6 +52,14 @@ function getRecordRenderSignature(record: any) {
 export class JSColumnModel extends TableCustomColumnModel {
   // Stable per‑instance render component to avoid remounts across re-renders
   private _RenderComponent?: React.ComponentType;
+
+  onInit(options: FlowModelOptions): void {
+    super.onInit(options);
+    this.context.defineProperty('record', {
+      meta: createCurrentRecordMetaFactory(this.context, () => this.context.collection),
+    });
+  }
+
   renderHiddenInConfig() {
     return (
       <Tooltip

package/src/flow/models/blocks/table/TableBlockModel.tsx

@@ -36,7 +36,15 @@ import { BlockSceneEnum } from '../../base/BlockModel';
 import { CollectionBlockModel } from '../../base/CollectionBlockModel';
 import { QuickEditFormModel } from '../form/QuickEditFormModel';
 import { TableColumnModel } from './TableColumnModel';
-import { extractIndex, adjustColumnOrder, setNestedValue, extractIds, getRowKey, useBlockHeight } from './utils';
+import {
+  extractIndex,
+  adjustColumnOrder,
+  setNestedValue,
+  extractIds,
+  extractRowKeys,
+  getRowKey,
+  useBlockHeight,
+} from './utils';
 import { resolveTableSorterField } from './sortUtils';
 import { commonConditionHandler, ConditionBuilder } from '../../../components/ConditionBuilder';
 import { BulkDeleteActionModel } from '../../actions/BulkDeleteActionModel';
@@ -222,6 +230,22 @@ export class TableBlockModel extends CollectionBlockModel<TableBlockModelStructu
     return super.resource as MultiRecordResource;
   }
 
+  resetAfterFilterChange() {
+    if (!this.props.treeTable) {
+      return;
+    }
+
+    const expandAll = !!this.props.defaultExpandAllRows;
+    const expandedRowKeys = expandAll ? extractRowKeys(this.resource.getData(), this.collection.filterTargetKey) : [];
+
+    this.setProps('expandedRowKeys', expandedRowKeys);
+    this.mapSubModels('actions', (action) => {
+      if ('setExpandFlag' in action && typeof action.setExpandFlag === 'function') {
+        action.setExpandFlag(expandAll);
+      }
+    });
+  }
+
   private readonly columns = observable.ref([]);
   private disposeAutorun: () => void;
 
@@ -244,7 +268,9 @@ export class TableBlockModel extends CollectionBlockModel<TableBlockModelStructu
   }
 
   createResource(ctx, params) {
-    return this.context.createResource(MultiRecordResource);
+    const resource = this.context.createResource(MultiRecordResource);
+    resource.addRequestHeader('X-With-ACL-Meta', 'true');
+    return resource;
   }
 
   /**

package/src/flow/models/blocks/table/TableColumnModel.tsx

@@ -27,6 +27,7 @@ import {
   ModelRenderMode,
   useFlowModel,
 } from '@nocobase/flow-engine';
+import type { FlowModel } from '@nocobase/flow-engine';
 import { useTranslation } from 'react-i18next';
 import { TableColumnProps, Tooltip, Space, InputNumber, Button, Divider } from 'antd';
 import { get, omit, capitalize } from 'lodash';
@@ -61,19 +62,28 @@ export function FieldDeletePlaceholder(props: any) {
   );
 }
 
-function FieldWithoutPermissionPlaceholder() {
+type FieldPermissionPlaceholderModel = FlowModel & {
+  fieldPath?: string;
+  forbidden?: { actionName?: string } | null;
+};
+
+export function FieldWithoutPermissionPlaceholder({
+  targetModel,
+}: {
+  targetModel?: FieldPermissionPlaceholderModel;
+} = {}) {
   const { t } = useTranslation();
-  const model: any = useFlowModel();
-  const blockModel = model.context.blockModel;
-  const collection = model.context.collectionField?.collection || blockModel.collection;
-  const dataSource = collection.dataSource;
+  const contextModel = useFlowModel<FieldPermissionPlaceholderModel>();
+  const model = targetModel || contextModel;
+  const collection = model.context.collectionField?.collection || model.context.blockModel?.collection;
+  const dataSource = collection?.dataSource;
   const name = model.context.collectionField?.name || model.fieldPath;
   const nameValue = useMemo(() => {
-    const dataSourcePrefix = `${t(dataSource.displayName || dataSource.key)} > `;
+    const dataSourcePrefix = dataSource ? `${t(dataSource.displayName || dataSource.key)} > ` : '';
     const collectionPrefix = collection ? `${t(collection.title) || collection.name || collection.tableName} > ` : '';
     return `${dataSourcePrefix}${collectionPrefix}${name}`;
-  }, [collection, dataSource.displayName, dataSource.key, name, t]);
-  const { actionName } = model.forbidden;
+  }, [collection, dataSource, name, t]);
+  const actionName = model.forbidden?.actionName || 'view';
   const messageValue = useMemo(() => {
     return t(
       `The current user only has the UI configuration permission, but don't have "{{actionName}}" permission for field "{{name}}"`,
@@ -194,6 +204,35 @@ export class TableColumnModel extends DisplayItemModel {
       .filter(Boolean);
   }
 
+  canQuickEdit(record: Record<string, unknown>): boolean {
+    if (!this.props.editable) {
+      return false;
+    }
+    if (this.context.skipAclCheck) {
+      return true;
+    }
+
+    const blockModel = this.context.blockModel;
+    const collection = blockModel?.collection;
+    const resource = blockModel?.resource;
+    const collectionField = this.collectionField;
+    if (!collection || !resource || !collectionField) {
+      return false;
+    }
+
+    const filterByTk = collection.getFilterByTK(record);
+    const recordPkValue = typeof filterByTk === 'string' || typeof filterByTk === 'number' ? filterByTk : undefined;
+
+    return this.context.acl.can({
+      dataSourceKey: collection.dataSourceKey,
+      resourceName: resource.getResourceName() || collection.name,
+      actionName: 'update',
+      recordPkValue,
+      allowedActions: resource.getMeta('allowedActions'),
+      fields: [collectionField.name],
+    });
+  }
+
   getColumnProps(): TableColumnProps & { sortField?: string } {
     if (!this.props.width) {
       return;
@@ -250,7 +289,7 @@ export class TableColumnModel extends DisplayItemModel {
           record,
           recordIndex: record?.__index || recordIndex,
           width: this.props.width - 16,
-          editable: this.props.editable,
+          editable: this.canQuickEdit(record),
           dataIndex: this.props.dataIndex,
           title: this.props.title,
           overflowMode: this.props.overflowMode,

package/src/flow/models/blocks/table/__tests__/JSColumnModel.test.tsx

@@ -11,17 +11,62 @@ import { FlowEngine } from '@nocobase/flow-engine';
 import { describe, expect, it, vi } from 'vitest';
 import { JSColumnModel } from '../JSColumnModel';
 
-describe('JSColumnModel row refresh', () => {
+describe('JSColumnModel', () => {
+  it('declares current record metadata before rendering any row', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({ JSColumnModel });
+    const model = engine.createModel<JSColumnModel>({
+      use: 'JSColumnModel',
+      uid: 'js-column-record-meta',
+      props: {
+        width: 200,
+        title: 'JS column',
+      },
+    });
+
+    engine.context.dataSourceManager.getDataSource('main').addCollection({
+      name: 'users',
+      filterTargetKey: 'id',
+      fields: [
+        { name: 'id', type: 'integer', interface: 'number' },
+        { name: 'age', type: 'integer', interface: 'integer' },
+      ],
+    });
+
+    const collection = engine.context.dataSourceManager.getCollection('main', 'users');
+    model.context.defineProperty('collection', {
+      value: collection,
+    });
+
+    const recordNode = model.context.getPropertyMetaTree().find((node) => node.name === 'record');
+    const recordFields =
+      typeof recordNode?.children === 'function' ? await recordNode.children() : recordNode?.children || [];
+
+    expect(model.context.record).toBeUndefined();
+    expect(recordNode).toMatchObject({
+      name: 'record',
+      title: 'Current record',
+      paths: ['record'],
+    });
+    expect(recordFields).toEqual(
+      expect.arrayContaining([
+        expect.objectContaining({ name: 'id', paths: ['record', 'id'] }),
+        expect.objectContaining({ name: 'age', paths: ['record', 'age'] }),
+      ]),
+    );
+  });
+
   it('changes renderer key and invalidates beforeRender cache when row content changes', () => {
     const engine = new FlowEngine();
-    const model = new JSColumnModel({
+    engine.registerModels({ JSColumnModel });
+    const model = engine.createModel<JSColumnModel>({
+      use: 'JSColumnModel',
       uid: 'js-column-row-refresh',
-      flowEngine: engine,
       props: {
         width: 200,
         title: 'JS column',
       },
-    } as any);
+    });
 
     engine.context.dataSourceManager.getDataSource('main').addCollection({
       name: 'users',
@@ -39,12 +84,14 @@ describe('JSColumnModel row refresh', () => {
     });
 
     const column = model.getColumnProps();
-    const first = column.render(null, { id: 1, age: 3, workyears: 39.2 }, 0) as any;
+    const firstRecord = { id: 1, age: 3, workyears: 39.2 };
+    const first = column.render(null, firstRecord, 0) as any;
     const fork = model.getFork('1') as any;
     const invalidateFlowCache = vi.fn();
     fork.invalidateFlowCache = invalidateFlowCache;
     const second = column.render(null, { id: 1, age: 37, workyears: 39.2 }, 0) as any;
 
+    expect(fork.context.record).toEqual({ id: 1, age: 37, workyears: 39.2 });
     expect(first.key).not.toBe(second.key);
     expect(invalidateFlowCache).toHaveBeenCalledWith('beforeRender');
   });

package/src/flow/models/blocks/table/__tests__/TableBlockModel.filterReset.test.ts

@@ -0,0 +1,78 @@
+/**
+ * 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 { TableBlockModel } from '../TableBlockModel';
+
+describe('TableBlockModel filter reset', () => {
+  it('collapses the filtered tree when rows are not expanded by default', () => {
+    const setExpandFlag = vi.fn();
+    const setProps = vi.fn();
+    const model = {
+      props: { treeTable: true, defaultExpandAllRows: false, expandedRowKeys: [1, 2] },
+      resource: { getData: () => [{ id: 3, children: [{ id: 4 }] }] },
+      setProps,
+      mapSubModels: (_key, callback) => callback({ setExpandFlag }),
+    };
+
+    TableBlockModel.prototype.resetAfterFilterChange.call(model);
+
+    expect(setProps).toHaveBeenCalledWith('expandedRowKeys', []);
+    expect(setExpandFlag).toHaveBeenCalledWith(false);
+  });
+
+  it('expands the filtered tree when rows are expanded by default', () => {
+    const setExpandFlag = vi.fn();
+    const setProps = vi.fn();
+    const model = {
+      props: { treeTable: true, defaultExpandAllRows: true, expandedRowKeys: [1, 2] },
+      collection: { filterTargetKey: 'id' },
+      resource: { getData: () => [{ id: 3, children: [{ id: 4 }] }] },
+      setProps,
+      mapSubModels: (_key, callback) => callback({ setExpandFlag }),
+    };
+
+    TableBlockModel.prototype.resetAfterFilterChange.call(model);
+
+    expect(setProps).toHaveBeenCalledWith('expandedRowKeys', [3, 4]);
+    expect(setExpandFlag).toHaveBeenCalledWith(true);
+  });
+
+  it('uses the collection filter target key when expanding the filtered tree', () => {
+    const setProps = vi.fn();
+    const model = {
+      props: { treeTable: true, defaultExpandAllRows: true },
+      collection: { filterTargetKey: ['tenant', 'slug'] },
+      resource: {
+        getData: () => [{ tenant: 'acme', slug: 'root', children: [{ tenant: 'acme', slug: 'child' }] }],
+      },
+      setProps,
+      mapSubModels: vi.fn(),
+    };
+
+    TableBlockModel.prototype.resetAfterFilterChange.call(model);
+
+    expect(setProps).toHaveBeenCalledWith('expandedRowKeys', ['acme-root', 'acme-child']);
+  });
+
+  it('does not change expansion state for a regular table', () => {
+    const setProps = vi.fn();
+    const mapSubModels = vi.fn();
+    const model = {
+      props: { treeTable: false },
+      setProps,
+      mapSubModels,
+    };
+
+    TableBlockModel.prototype.resetAfterFilterChange.call(model);
+
+    expect(setProps).not.toHaveBeenCalled();
+    expect(mapSubModels).not.toHaveBeenCalled();
+  });
+});

package/src/flow/models/blocks/table/__tests__/TableBlockModel.quickEditRefresh.test.ts

@@ -9,8 +9,20 @@
 
 import { FlowEngine, MultiRecordResource } from '@nocobase/flow-engine';
 import { describe, expect, it } from 'vitest';
+import { TableBlockModel } from '../TableBlockModel';
 
 describe('TableBlockModel quick edit refresh', () => {
+  it('requests record-level ACL metadata for table data', () => {
+    const engine = new FlowEngine();
+    const model = {
+      context: engine.context,
+    };
+
+    const resource = TableBlockModel.prototype.createResource.call(model, {}, {});
+
+    expect(resource.getRequestOptions().headers['X-With-ACL-Meta']).toBe('true');
+  });
+
   it('updates table data through a new array reference after quick editing a flat row', () => {
     const engine = new FlowEngine();
     const resource = engine.context.createResource(MultiRecordResource);

package/src/flow/models/blocks/table/__tests__/TableColumnModel.test.tsx

@@ -66,6 +66,39 @@ describe('TableColumnModel sorter settings', () => {
     expect(setProps).toHaveBeenCalledWith('editable', false);
   });
 
+  it('checks record update scope and field permission before enabling quick edit', () => {
+    const can = vi.fn(() => false);
+    const model = {
+      props: { editable: true },
+      collectionField: { name: 'title' },
+      context: {
+        skipAclCheck: false,
+        acl: { can },
+        blockModel: {
+          collection: {
+            dataSourceKey: 'main',
+            name: 'posts',
+            getFilterByTK: () => 2,
+          },
+          resource: {
+            getResourceName: () => 'posts',
+            getMeta: () => ({ update: [1] }),
+          },
+        },
+      },
+    };
+
+    expect(TableColumnModel.prototype.canQuickEdit.call(model, { id: 2 })).toBe(false);
+    expect(can).toHaveBeenCalledWith({
+      dataSourceKey: 'main',
+      resourceName: 'posts',
+      actionName: 'update',
+      recordPkValue: 2,
+      allowedActions: { update: [1] },
+      fields: ['title'],
+    });
+  });
+
   it('hides sortable setting for association fields', async () => {
     const engine = new FlowEngine();
     const model = new TableColumnModel({ uid: 'table-column-association-sorter', flowEngine: engine } as any);

package/src/flow/models/blocks/table/utils.ts

@@ -67,6 +67,13 @@ export function extractIds(data) {
   return ids;
 }
 
+export function extractRowKeys(data: Record<string, unknown>[], key: string | string[]) {
+  return data.flatMap((item) => {
+    const children = Array.isArray(item.children) ? extractRowKeys(item.children, key) : [];
+    return [getRowKey(item, key), ...children];
+  });
+}
+
 /**
  * 生成表格行唯一 key
  * @param record 当前行数据

package/src/flow/models/fields/AssociationFieldModel/CascadeSelectFieldModel.tsx

@@ -8,7 +8,13 @@
  */
 
 import { Cascader, Space, Button } from 'antd';
-import { CollectionField, EditableItemModel, tExpr, MultiRecordResource } from '@nocobase/flow-engine';
+import {
+  CollectionField,
+  EditableItemModel,
+  FilterableItemModel,
+  MultiRecordResource,
+  tExpr,
+} from '@nocobase/flow-engine';
 import { DeleteOutlined } from '@ant-design/icons';
 import { css, cx } from '@emotion/css';
 import { debounce, castArray, omit, last, isEqual } from 'lodash';
@@ -31,6 +37,23 @@ function normalizeLabelKeys(labelKeyOrKeys?: string | string[]): string[] {
   return Array.from(new Set(list.filter((item): item is string => !!item && typeof item === 'string')));
 }
 
+function normalizeCascadeFieldKey(key: unknown): string | undefined {
+  if (typeof key === 'string' && key) {
+    return key;
+  }
+  if (Array.isArray(key) && key.length === 1 && typeof key[0] === 'string') {
+    return key[0];
+  }
+  return undefined;
+}
+
+function getDefaultCascadeFieldNames(field: CollectionField) {
+  const targetCollection = field?.targetCollection;
+  const value = normalizeCascadeFieldKey(targetCollection?.filterTargetKey) || 'id';
+  const label = targetCollection?.titleCollectionField?.name || value;
+  return { label, value };
+}
+
 function getRecordDisplayLabel(item: any, labelKeyOrKeys?: string | string[]): string | null {
   if (!isPlainRecord(item)) return null;
   const labelKeys = normalizeLabelKeys(labelKeyOrKeys);
@@ -815,6 +838,15 @@ EditableItemModel.bindModelToInterface('CascadeSelectFieldModel', ['m2o', 'o2o',
   order: 60,
 });
 
+FilterableItemModel.bindModelToInterface('CascadeSelectFieldModel', ['m2o', 'o2o', 'oho', 'obo'], {
+  when: (ctx, field) => field.targetCollection?.template === 'tree',
+  isDefault: true,
+  order: 60,
+  defaultProps: (ctx, field) => ({
+    fieldNames: getDefaultCascadeFieldNames(field),
+  }),
+});
+
 EditableItemModel.bindModelToInterface('CascadeSelectListFieldModel', ['m2m', 'o2m', 'mbm'], {
   when: (ctx, field) => field.targetCollection?.template === 'tree',
   isDefault: true,

package/src/flow/models/fields/AssociationFieldModel/PopupSubTableFieldModel/PopupSubTableFieldModel.tsx

@@ -19,7 +19,7 @@ import {
   createCurrentRecordMetaFactory,
   useFlowModel,
 } from '@nocobase/flow-engine';
-import { Table, Button, Space } from 'antd';
+import { Table, Button, Space, theme } from 'antd';
 import { uid } from '@formily/shared';
 import classNames from 'classnames';
 import { DragEndEvent } from '@dnd-kit/core';
@@ -28,6 +28,7 @@ import { observer } from '@formily/reactive-react';
 import React, { useEffect, useMemo, useState, useRef } from 'react';
 import { useTranslation } from 'react-i18next';
 import { buildRecordPickerPopupContextInputArgs, RecordPickerContent } from '../RecordPickerFieldModel';
+import { buildOpenerUids } from '../recordSelectShared';
 import { AssociationFieldModel } from '../AssociationFieldModel';
 import { adjustColumnOrder } from '../../../blocks/table/utils';
 import { isSubTableColumnFieldComponentContext } from '../SubTableFieldModel/SubTableColumnModel';
@@ -189,6 +190,7 @@ const AddFieldColumn = ({ model }) => {
 };
 
 const DisplayTable = (props) => {
+  const { token } = theme.useToken();
   const {
     pageSize,
     value,
@@ -268,7 +270,7 @@ const DisplayTable = (props) => {
           },
         },
         ...baseColumns,
-        { key: 'empty' },
+        { key: 'empty', render: () => <div style={{ minHeight: token.controlHeight }} /> },
       ].filter(Boolean),
     ) as any[];
 
@@ -282,7 +284,7 @@ const DisplayTable = (props) => {
     }
 
     return cols;
-  }, [baseColumns, enableIndexColumn, currentPage, currentPageSize, isConfigMode, model]);
+  }, [baseColumns, enableIndexColumn, currentPage, currentPageSize, isConfigMode, model, token.controlHeight]);
   return (
     <Table
       tableLayout="fixed"
@@ -653,6 +655,11 @@ PopupSubTableFieldModel.registerFlow({
         const parentItemOptions = ctx?.getPropertyOptions?.('item');
         const itemIndex = Array.isArray(ctx.model?.props?.value) ? ctx.model.props.value.length : 0;
         const itemLength = itemIndex + 1;
+        const associationName = ctx.collectionField?.resourceName;
+        const sourceId = parentItem?.value
+          ? ctx.collectionField?.collection?.getFilterByTK?.(parentItem.value)
+          : undefined;
+        const openerUids = buildOpenerUids(ctx, ctx.inputArgs);
         ctx.viewer.open({
           type: openMode,
           width: sizeToWidthMap[openMode][size],
@@ -663,12 +670,14 @@ PopupSubTableFieldModel.registerFlow({
             scene: 'subForm',
             dataSourceKey: ctx.collection.dataSourceKey,
             collectionName: ctx.collectionField?.target,
+            ...(associationName && sourceId != null ? { associationName, sourceId } : {}),
             collectionField: ctx.collectionField,
             parentItem,
             parentItemMeta: parentItemOptions?.meta,
             parentItemResolver: parentItemOptions?.resolveOnServer,
             itemIndex,
             itemLength,
+            openerUids,
           },
           content: () => <EditFormContent model={ctx.model} scene="create" />,
           styles: {