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

package/src/flow/models/blocks/filter-form/__tests__/defaultValues.wiring.test.ts

@@ -7,10 +7,97 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
+import React from 'react';
+import { render, waitFor } from '@testing-library/react';
+import { FlowEngine } from '@nocobase/flow-engine';
 import { describe, expect, it, vi } from 'vitest';
 import { filterFormDefaultValues } from '../../../../actions/filterFormDefaultValues';
 import { FilterFormBlockModel } from '../FilterFormBlockModel';
 
+function resolveTemplateValue(raw: any, values: Record<string, any>): any {
+  if (typeof raw === 'string') {
+    const matched = raw.match(/^\{\{\s*ctx\.formValues\.([^}]+?)\s*\}\}$/);
+    return matched ? values[matched[1]] : raw;
+  }
+  if (Array.isArray(raw)) {
+    return raw.map((item) => resolveTemplateValue(item, values));
+  }
+  if (raw && typeof raw === 'object') {
+    return Object.fromEntries(Object.entries(raw).map(([key, value]) => [key, resolveTemplateValue(value, values)]));
+  }
+  return raw;
+}
+
+function createFilterFormDefaultValuesModel(rules: any[], initialValues: Record<string, any> = {}) {
+  const values = { ...initialValues };
+  const createItem = (fieldPath: string, uid: string) => ({
+    uid,
+    fieldPath,
+    props: { name: `${fieldPath}_${uid}` },
+    getProps() {
+      return this.props;
+    },
+    getStepParams(flowKey: string, stepKey: string) {
+      if (flowKey === 'fieldSettings' && stepKey === 'init') {
+        return { fieldPath };
+      }
+      return undefined;
+    },
+    subModels: {
+      field: {},
+    },
+  });
+  const model = {
+    defaultValuesRefreshSeq: 0,
+    lastDefaultValueByFieldName: new Map<string, any>(),
+    form: {
+      getFieldsValue: () => ({ ...values }),
+      getFieldValue: (name: string) => values[name],
+      setFieldValue: (name: string, value: any) => {
+        values[name] = value;
+      },
+      setFieldsValue: (next: Record<string, any>) => {
+        Object.assign(values, next);
+      },
+    },
+    context: {
+      resolveJsonTemplate: vi.fn((raw) => resolveTemplateValue(raw, values)),
+      app: {
+        jsonLogic: {
+          apply: vi.fn((logic: Record<string, any[]>) => {
+            const [[operator, args]] = Object.entries(logic);
+            if (operator === '$eq') return args[0] === args[1];
+            return true;
+          }),
+        },
+      },
+    },
+    subModels: {
+      grid: {
+        subModels: {
+          items: [createItem('nickname', 'nick'), createItem('username', 'user')],
+        },
+      },
+    },
+    getStepParams: vi.fn((flowKey: string, stepKey: string) => {
+      if (flowKey === 'formFilterBlockModelSettings' && stepKey === 'defaultValues') {
+        return { value: rules };
+      }
+      return undefined;
+    }),
+    canApplyFormDefaultValue: (FilterFormBlockModel.prototype as any).canApplyFormDefaultValue,
+    matchDefaultValueCondition: (FilterFormBlockModel.prototype as any).matchDefaultValueCondition,
+    applyFormDefaultValues: FilterFormBlockModel.prototype.applyFormDefaultValues,
+    handleFilterFormValuesChange: (FilterFormBlockModel.prototype as any).handleFilterFormValuesChange,
+    dispatchEvent: vi.fn(),
+    emitter: {
+      emit: vi.fn(),
+    },
+  };
+
+  return { model, values };
+}
+
 describe('filter-form defaultValues wiring', () => {
   it('loads action and model modules', () => {
     expect(filterFormDefaultValues).toBeTruthy();
@@ -48,4 +135,254 @@ describe('filter-form defaultValues wiring', () => {
     expect(model.initialDefaultsPromise).toBeUndefined();
     expect(model.applyFormDefaultValues).not.toHaveBeenCalled();
   });
+
+  it('exposes current form values in the filter form variable meta tree', async () => {
+    const engine = new FlowEngine();
+
+    const dataSource = engine.context.dataSourceManager.getDataSource('main');
+    dataSource.addCollection({
+      name: 'users',
+      filterTargetKey: ['id', 'tenantId'],
+      fields: [
+        { name: 'id', type: 'integer', interface: 'number' },
+        { name: 'tenantId', type: 'string', interface: 'text' },
+        { name: 'name', type: 'string', interface: 'text' },
+      ],
+    });
+    dataSource.addCollection({
+      name: 'departments',
+      filterTargetKey: 'id',
+      fields: [
+        { name: 'id', type: 'integer', interface: 'number' },
+        { name: 'name', type: 'string', interface: 'text' },
+        { name: 'owner', type: 'belongsTo', target: 'users', interface: 'm2o' },
+      ],
+    });
+    dataSource.addCollection({
+      name: 'tasks',
+      filterTargetKey: 'id',
+      fields: [
+        { name: 'id', type: 'integer', interface: 'number' },
+        { name: 'title', type: 'string', interface: 'text' },
+        { name: 'department', type: 'belongsTo', target: 'departments', interface: 'm2o' },
+      ],
+    });
+
+    engine.registerModels({ FilterFormBlockModel });
+    const model = engine.createModel<FilterFormBlockModel>({
+      use: 'FilterFormBlockModel',
+      uid: 'filter-form-current-form',
+      subModels: {
+        grid: {
+          subModels: {
+            items: [],
+          },
+        },
+      },
+    } as any);
+
+    function HookCaller() {
+      model.useHooksBeforeRender();
+      return null;
+    }
+
+    render(React.createElement(HookCaller));
+
+    const store = {
+      title: 'bug',
+      'department_department-filter': 1,
+      'department.owner_owner-filter': { id: 7, tenantId: 'tenant-a' },
+    };
+    const fakeForm = {
+      getFieldsValue: () => ({ ...store }),
+    };
+    model.context.defineProperty('form', { value: fakeForm });
+    model.subModels.grid.subModels.items = [
+      {
+        uid: 'department-filter',
+        fieldPath: 'department',
+        props: { name: 'department_department-filter' },
+        subModels: {
+          field: {
+            context: {
+              collectionField: dataSource.getCollection('tasks').getField('department'),
+            },
+          },
+        },
+      },
+      {
+        uid: 'owner-filter',
+        fieldPath: 'department.owner',
+        props: { name: 'department.owner_owner-filter' },
+        subModels: {
+          field: {
+            context: {
+              collectionField: dataSource.getCollection('departments').getField('owner'),
+            },
+          },
+        },
+      },
+    ];
+
+    expect((model.context as any).formValues).toMatchObject({
+      ...store,
+      department: {
+        'owner_owner-filter': { id: 7, tenantId: 'tenant-a' },
+      },
+    });
+
+    const options = (model.context as any).getPropertyOptions('formValues');
+    const meta = await options.meta();
+    const properties = await meta.properties();
+    const metaTree = await (model.context as any).getPropertyMetaTree();
+
+    expect(options.resolveOnServer('department_department-filter')).toBe(false);
+    expect(options.resolveOnServer('department_department-filter.name')).toBe(true);
+    expect(options.resolveOnServer('department_department-filter[0].name')).toBe(true);
+    expect(options.resolveOnServer('department.owner_owner-filter.name')).toBe(true);
+    expect(options.serverOnlyWhenContextParams).toBe(true);
+    expect(meta.title).toBe('Current form');
+    expect(properties.department.properties['owner_owner-filter'].title).toBe('owner');
+    expect(metaTree).toEqual(
+      expect.arrayContaining([
+        expect.objectContaining({
+          name: 'formValues',
+          title: 'Current form',
+        }),
+      ]),
+    );
+    expect(await meta.buildVariablesParams(model.context)).toMatchObject({
+      'department_department-filter': { collection: 'departments', dataSourceKey: 'main', filterByTk: 1 },
+      department: {
+        'owner_owner-filter': {
+          collection: 'users',
+          dataSourceKey: 'main',
+          filterByTk: { id: 7, tenantId: 'tenant-a' },
+        },
+      },
+    });
+  });
+
+  it('refreshes default values that depend on current filter form values', async () => {
+    const { model, values } = createFilterFormDefaultValuesModel(
+      [
+        {
+          key: 'username-default',
+          enable: true,
+          targetPath: 'username',
+          mode: 'default',
+          value: '{{ ctx.formValues.nickname_nick }}',
+        },
+      ],
+      { nickname_nick: 'Alice' },
+    );
+
+    await FilterFormBlockModel.prototype.applyFormDefaultValues.call(model as any);
+    expect(values.username_user).toBe('Alice');
+
+    values.nickname_nick = 'Bob';
+    model.defaultValuesRefreshSeq += 1;
+    await FilterFormBlockModel.prototype.applyFormDefaultValues.call(model as any, {
+      refreshSeq: model.defaultValuesRefreshSeq,
+    });
+    expect(values.username_user).toBe('Bob');
+
+    values.username_user = 'Manual';
+    values.nickname_nick = 'Carol';
+    model.defaultValuesRefreshSeq += 1;
+    await FilterFormBlockModel.prototype.applyFormDefaultValues.call(model as any, {
+      refreshSeq: model.defaultValuesRefreshSeq,
+    });
+    expect(values.username_user).toBe('Manual');
+  });
+
+  it('applies fixed values even when the target filter field already has a value', async () => {
+    const { model, values } = createFilterFormDefaultValuesModel(
+      [
+        {
+          key: 'username-fixed',
+          enable: true,
+          targetPath: 'username',
+          mode: 'assign',
+          value: '{{ ctx.formValues.nickname_nick }}',
+        },
+      ],
+      { nickname_nick: 'Bob', username_user: 'Manual' },
+    );
+
+    await FilterFormBlockModel.prototype.applyFormDefaultValues.call(model as any);
+
+    expect(values.username_user).toBe('Bob');
+  });
+
+  it('skips filter form field values when the rule condition does not match', async () => {
+    const { model, values } = createFilterFormDefaultValuesModel(
+      [
+        {
+          key: 'username-condition',
+          enable: true,
+          targetPath: 'username',
+          mode: 'assign',
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.formValues.nickname_nick }}', operator: '$eq', value: 'allow' }],
+          },
+          value: 'Matched',
+        },
+      ],
+      { nickname_nick: 'deny' },
+    );
+
+    await FilterFormBlockModel.prototype.applyFormDefaultValues.call(model as any);
+    expect(values.username_user).toBeUndefined();
+
+    values.nickname_nick = 'allow';
+    await FilterFormBlockModel.prototype.applyFormDefaultValues.call(model as any);
+    expect(values.username_user).toBe('Matched');
+  });
+
+  it('emits formValuesChange with final values after applying dependent field values', async () => {
+    const { model, values } = createFilterFormDefaultValuesModel(
+      [
+        {
+          key: 'username-fixed',
+          enable: true,
+          targetPath: 'username',
+          mode: 'assign',
+          value: '{{ ctx.formValues.nickname_nick }}',
+        },
+      ],
+      { nickname_nick: 'Bob' },
+    );
+
+    (model as any).handleFilterFormValuesChange({ nickname_nick: 'Bob' }, { nickname_nick: 'Bob' });
+
+    await waitFor(() => {
+      expect(values.username_user).toBe('Bob');
+      expect(model.dispatchEvent).toHaveBeenCalledWith(
+        'formValuesChange',
+        {
+          changedValues: {
+            nickname_nick: 'Bob',
+            username_user: 'Bob',
+          },
+          allValues: {
+            nickname_nick: 'Bob',
+            username_user: 'Bob',
+          },
+        },
+        { debounce: true },
+      );
+    });
+    expect(model.emitter.emit).toHaveBeenCalledWith('formValuesChange', {
+      changedValues: {
+        nickname_nick: 'Bob',
+        username_user: 'Bob',
+      },
+      allValues: {
+        nickname_nick: 'Bob',
+        username_user: 'Bob',
+      },
+    });
+  });
 });

package/src/flow/models/blocks/table/dragSort/dragSortComponents.tsx

@@ -7,84 +7,4 @@
  * For more information, please refer to: https://www.nocobase.com/agreement.
  */
 
-import { MenuOutlined } from '@ant-design/icons';
-import { TinyColor } from '@ctrl/tinycolor';
-import { useSortable } from '@dnd-kit/sortable';
-import { css } from '@emotion/css';
-import { theme } from 'antd';
-import classNames from 'classnames';
-import React, { useMemo } from 'react';
-
-type DragSortRowContextValue = {
-  attributes?: Record<string, unknown>;
-  listeners?: Record<string, unknown>;
-  setActivatorNodeRef?: (node: HTMLElement | null) => void;
-};
-
-const DragSortRowContext = React.createContext<DragSortRowContextValue | null>(null);
-
-const sortHandleClass = css`
-  display: inline-flex;
-  align-items: center;
-  justify-content: center;
-  cursor: grab;
-`;
-
-export const SortHandle: React.FC<{ id: string | number; style?: React.CSSProperties }> = (props) => {
-  const { id: _id, ...otherProps } = props;
-  const dragSortContext = React.useContext(DragSortRowContext);
-  // return <MenuOutlined ref={setNodeRef} {...otherProps} {...listeners} style={{ cursor: 'grab' }} />;
-  return (
-    <span
-      ref={dragSortContext?.setActivatorNodeRef}
-      {...dragSortContext?.attributes}
-      {...dragSortContext?.listeners}
-      {...otherProps}
-      className={classNames(sortHandleClass)}
-    >
-      <MenuOutlined />
-    </span>
-  );
-};
-
-export const SortableRow = (props) => {
-  const { token }: any = theme.useToken();
-  const id = props['data-row-key']?.toString();
-  const { setNodeRef, setActivatorNodeRef, attributes, listeners, active, over } = useSortable({
-    id,
-  });
-  const { rowIndex, ...others } = props;
-  const isOver = over?.id === id;
-  const classObj = useMemo(() => {
-    const borderColor = new TinyColor(token.colorPrimary).setAlpha(0.6).toHex8String();
-    return {
-      topActiveClass: css`
-        & > td {
-          border-top: 2px solid ${borderColor} !important;
-        }
-      `,
-      bottomActiveClass: css`
-        & > td {
-          border-bottom: 2px solid ${borderColor} !important;
-        }
-      `,
-    };
-  }, [token.colorPrimary]);
-
-  const className =
-    (active?.data.current?.sortable.index ?? -1) > rowIndex ? classObj.topActiveClass : classObj.bottomActiveClass;
-
-  const row = (
-    <DragSortRowContext.Provider value={{ listeners, setActivatorNodeRef }}>
-      <tr
-        ref={(node) => {
-          setNodeRef(node);
-        }}
-        {...others}
-        className={classNames(props.className, { [className]: active && isOver })}
-      />
-    </DragSortRowContext.Provider>
-  );
-
-  return row;
-};
+export { DragSortRowContext, SortHandle, SortableRow } from '../../../../../components/form/table/dnd/SortableRow';

package/src/flow/models/fields/JSEditableFieldModel.tsx

@@ -69,6 +69,106 @@ function resolveScriptCode(codeParam?: string) {
   return typeof raw === 'string' ? raw.trim() : '';
 }
 
+type NamePathPart = string | number;
+
+function toNamePath(input: unknown): NamePathPart[] | null {
+  if (Array.isArray(input)) {
+    return input.filter((item): item is NamePathPart => typeof item === 'string' || typeof item === 'number');
+  }
+  if (typeof input === 'number') {
+    return [input];
+  }
+  if (typeof input === 'string') {
+    return input
+      .split('.')
+      .map((item) => item.trim())
+      .filter(Boolean);
+  }
+  return null;
+}
+
+function startsWithNamePath(namePath: NamePathPart[], prefix: NamePathPart[]) {
+  return prefix.length <= namePath.length && prefix.every((item, index) => String(namePath[index]) === String(item));
+}
+
+function getFieldSettingsNamePath(model: any): NamePathPart[] | null {
+  const init =
+    model?.getStepParams?.('fieldSettings', 'init') || model?.parent?.getStepParams?.('fieldSettings', 'init');
+  const fieldPath = toNamePath(init?.fieldPath);
+  const associationPath = toNamePath(init?.associationPathName);
+
+  if (!fieldPath?.length) {
+    return null;
+  }
+
+  if (!associationPath?.length || startsWithNamePath(fieldPath, associationPath)) {
+    return fieldPath;
+  }
+
+  return [...associationPath, ...fieldPath];
+}
+
+function applyFieldIndex(namePath: NamePathPart[] | null, fieldIndex: unknown): NamePathPart[] | null {
+  if (!namePath?.length) {
+    return null;
+  }
+  if (namePath.some((item) => typeof item === 'number') || !Array.isArray(fieldIndex) || fieldIndex.length === 0) {
+    return namePath;
+  }
+
+  const indexQueues = new Map<string, number[]>();
+  for (const item of fieldIndex) {
+    if (typeof item !== 'string') continue;
+    const [fieldName, indexStr] = item.split(':');
+    const index = Number(indexStr);
+    if (!fieldName || !Number.isFinite(index)) continue;
+    const queue = indexQueues.get(fieldName) || [];
+    queue.push(index);
+    indexQueues.set(fieldName, queue);
+  }
+
+  if (!indexQueues.size) {
+    return namePath;
+  }
+
+  const result: NamePathPart[] = [];
+  for (const item of namePath) {
+    result.push(item);
+    const queue = indexQueues.get(String(item));
+    if (queue?.length) {
+      result.push(queue.shift() as number);
+    }
+  }
+  return result;
+}
+
+function resolveEffectiveNamePath(ctx: any): NamePathPart[] | null {
+  const namePath =
+    getFieldSettingsNamePath(ctx.model) || toNamePath(ctx.fieldPathArray) || toNamePath(ctx.model?.props?.name);
+  return applyFieldIndex(namePath, ctx.fieldIndex);
+}
+
+function setFormValue(form: any, namePath: NamePathPart[], value: any) {
+  if (typeof form?.setFieldValue === 'function') {
+    form.setFieldValue(namePath, value);
+    return;
+  }
+
+  if (typeof form?.setFieldsValue === 'function') {
+    const patch: any = {};
+    let cursor = patch;
+    namePath.forEach((item, index) => {
+      if (index === namePath.length - 1) {
+        cursor[item] = value;
+        return;
+      }
+      cursor[item] = typeof namePath[index + 1] === 'number' ? [] : {};
+      cursor = cursor[item];
+    });
+    form.setFieldsValue(patch);
+  }
+}
+
 const JSFormRuntime: React.FC<{
   model: JSEditableFieldModel;
   value?: any;
@@ -274,9 +374,9 @@ JSEditableFieldModel.registerFlow({
             cache: false,
           });
           ctx.defineMethod('getValue', () => {
-            const name = ctx.model.props?.name;
-            if (name !== undefined && name !== null) {
-              const fv = ctx.form?.getFieldValue?.(name);
+            const namePath = resolveEffectiveNamePath(ctx);
+            if (namePath?.length) {
+              const fv = ctx.form?.getFieldValue?.(namePath);
               return fv !== undefined ? fv : ctx.model.props?.value;
             }
             return ctx.model.props?.value;
@@ -284,15 +384,15 @@ JSEditableFieldModel.registerFlow({
           ctx.defineMethod('setValue', (v) => {
             try {
               ctx.model.setProps('value', v);
-              const name = ctx.model.props?.name;
-              if (name !== undefined && name !== null) {
-                ctx.form?.setFieldValue?.(name, v);
+              const namePath = resolveEffectiveNamePath(ctx);
+              if (namePath?.length) {
+                setFormValue(ctx.form, namePath, v);
               }
             } catch (_) {
               // ignore
             }
           });
-          ctx.defineProperty('namePath', { get: () => ctx.model.props?.name, cache: false });
+          ctx.defineProperty('namePath', { get: () => resolveEffectiveNamePath(ctx), cache: false });
           ctx.defineProperty('disabled', { get: () => !!ctx.model.props?.disabled, cache: false });
           ctx.defineProperty('readOnly', {
             get: () => isReadOnlyMode(ctx.model),