@nocobase/client-v2 2.2.0-beta.15 → 2.2.0-beta.17

package/src/flow/actions/__tests__/actionLinkageRules.forkProps.test.ts

@@ -0,0 +1,314 @@
+/**
+ * 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 } from '@nocobase/flow-engine';
+import { describe, expect, it, vi } from 'vitest';
+import { ActionModel as ConfiguredActionModel } from '../../models/base/ActionModel';
+import { ActionModel } from '../../models/base/ActionModelCore';
+import { actionLinkageRules, linkageSetActionProps, updateLinkageRules } from '../linkageRules';
+
+class TestActionModel extends ActionModel {}
+
+describe('action linkage rules on action forks', () => {
+  it('does not snapshot unrelated master props when disabling an action', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({ TestActionModel });
+    const master = engine.createModel<TestActionModel>({
+      use: 'TestActionModel',
+      props: { title: 'Edit' },
+    });
+    const fork = master.createFork({ className: 'row-action' });
+
+    const ctx = {
+      flowKey: 'buttonSettings',
+      model: fork,
+      app: {
+        jsonLogic: {
+          apply: vi.fn(() => true),
+        },
+      },
+      t: (value: string) => value,
+      resolveJsonTemplate: vi.fn(async (value: unknown) => value),
+      getAction: (name: string) => {
+        if (name !== 'linkageSetActionProps') return undefined;
+        return {
+          handler: async (_ctx: unknown, params: { setProps: Function }) => {
+            params.setProps(fork, { disabled: true });
+          },
+        };
+      },
+    } as never;
+
+    await actionLinkageRules.handler(ctx, {
+      value: [
+        {
+          key: 'disable-edit',
+          enable: true,
+          condition: { logic: '$and', items: [] },
+          actions: [{ name: 'linkageSetActionProps', params: { value: 'disabled' } }],
+        },
+      ],
+    });
+
+    expect(fork.localProps.title).toBeUndefined();
+    expect(fork.__originalProps.title).toBeUndefined();
+    expect(fork.localProps.disabled).toBe(true);
+
+    master.setProps('title', 'Updated');
+    await actionLinkageRules.handler(ctx, {
+      value: [
+        {
+          key: 'disable-edit',
+          enable: true,
+          condition: { logic: '$and', items: [] },
+          actions: [{ name: 'linkageSetActionProps', params: { value: 'disabled' } }],
+        },
+      ],
+    });
+
+    expect(fork.getProps().title).toBe('Updated');
+    expect(fork.serialize().props).toMatchObject({ title: 'Updated' });
+    expect(fork.serialize().props).not.toHaveProperty('disabled');
+
+    const refreshedFork = master.createFork({ className: 'row-action' });
+    expect(refreshedFork.getProps().title).toBe('Updated');
+  });
+
+  it.each(['disable', 'delete'] as const)(
+    'restores a row action when linkage rules are %sd without persisting disabled',
+    async (change) => {
+      const engine = new FlowEngine();
+      engine.registerModels({ ConfiguredActionModel });
+      engine.registerActions({ actionLinkageRules, linkageSetActionProps });
+
+      let savedData: ReturnType<ConfiguredActionModel['serialize']> | undefined;
+      engine.setModelRepository({
+        save: async (model) => {
+          savedData = model.serialize();
+          return savedData;
+        },
+      } as Parameters<FlowEngine['setModelRepository']>[0]);
+
+      const enabledRules = [
+        {
+          key: 'disable-edit',
+          enable: true,
+          condition: { logic: '$and', items: [] },
+          actions: [{ name: 'linkageSetActionProps', params: { value: 'disabled' } }],
+        },
+      ];
+      const master = engine.createModel<ConfiguredActionModel>({
+        use: 'ConfiguredActionModel',
+        props: { title: 'Edit' },
+        stepParams: {
+          buttonSettings: {
+            linkageRules: { value: enabledRules },
+          },
+        },
+      });
+      const fork = master.createFork({ className: 'row-action' });
+
+      await fork.dispatchEvent('beforeRender', undefined, { useCache: false });
+      expect(fork.getProps().disabled).toBe(true);
+
+      const nextRules =
+        change === 'disable'
+          ? updateLinkageRules(enabledRules, (rules) => {
+              rules[0].enable = false;
+            })
+          : [];
+      fork.setStepParams('buttonSettings', 'linkageRules', { value: nextRules });
+      await fork.saveStepParams();
+      await fork.rerender();
+
+      expect(savedData).toBeDefined();
+      expect(savedData?.props).not.toHaveProperty('disabled');
+      expect(savedData?.stepParams.buttonSettings.linkageRules.value).toEqual(nextRules);
+      expect(fork.getProps().disabled).toBeUndefined();
+
+      const reloadedEngine = new FlowEngine();
+      reloadedEngine.registerModels({ ConfiguredActionModel });
+      reloadedEngine.registerActions({ actionLinkageRules, linkageSetActionProps });
+      const reloadedMaster = reloadedEngine.createModel<ConfiguredActionModel>({
+        use: 'ConfiguredActionModel',
+        props: savedData?.props,
+        stepParams: savedData?.stepParams,
+      });
+      const reloadedFork = reloadedMaster.createFork({ className: 'row-action' });
+
+      await reloadedFork.dispatchEvent('beforeRender', undefined, { useCache: false });
+      expect(reloadedFork.getProps().disabled).toBeUndefined();
+    },
+  );
+
+  it.each(['disabled', 'deleted'] as const)(
+    'ignores a historical disabled prop after the linkage rule is %s',
+    async (state) => {
+      const engine = new FlowEngine();
+      engine.registerModels({ ConfiguredActionModel });
+      engine.registerActions({ actionLinkageRules, linkageSetActionProps });
+      const rules =
+        state === 'disabled'
+          ? [
+              {
+                key: 'disable-edit',
+                enable: false,
+                condition: { logic: '$and', items: [] },
+                actions: [{ name: 'linkageSetActionProps', params: { value: 'disabled' } }],
+              },
+            ]
+          : [];
+      const master = engine.createModel<ConfiguredActionModel>({
+        use: 'ConfiguredActionModel',
+        props: { title: 'Edit', disabled: true },
+        stepParams: {
+          buttonSettings: {
+            linkageRules: { value: rules },
+          },
+        },
+      });
+      const fork = master.createFork({ className: 'row-action' });
+
+      expect(master.getProps()).not.toHaveProperty('disabled');
+      await fork.dispatchEvent('beforeRender', undefined, { useCache: false });
+
+      expect(fork.getProps().disabled).toBeUndefined();
+    },
+  );
+
+  it('still applies an enabled linkage rule after dropping a historical disabled prop', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({ ConfiguredActionModel });
+    engine.registerActions({ actionLinkageRules, linkageSetActionProps });
+    const master = engine.createModel<ConfiguredActionModel>({
+      use: 'ConfiguredActionModel',
+      props: { title: 'Edit', disabled: true },
+      stepParams: {
+        buttonSettings: {
+          linkageRules: {
+            value: [
+              {
+                key: 'disable-edit',
+                enable: true,
+                condition: { logic: '$and', items: [] },
+                actions: [{ name: 'linkageSetActionProps', params: { value: 'disabled' } }],
+              },
+            ],
+          },
+        },
+      },
+    });
+    const fork = master.createFork({ className: 'row-action' });
+
+    expect(master.getProps()).not.toHaveProperty('disabled');
+    await fork.dispatchEvent('beforeRender', undefined, { useCache: false });
+
+    expect(fork.getProps().disabled).toBe(true);
+  });
+
+  it('preserves a default disabled state as runtime-only state', async () => {
+    class DefaultDisabledActionModel extends ConfiguredActionModel {
+      defaultProps = { ...this.defaultProps, disabled: true };
+    }
+    const engine = new FlowEngine();
+    engine.registerModels({ DefaultDisabledActionModel });
+    engine.registerActions({ actionLinkageRules, linkageSetActionProps });
+    const master = engine.createModel<DefaultDisabledActionModel>({
+      use: 'DefaultDisabledActionModel',
+      props: { title: 'Edit' },
+      stepParams: {
+        buttonSettings: {
+          linkageRules: { value: [] },
+        },
+      },
+    });
+    const fork = master.createFork({ className: 'row-action' });
+
+    await fork.dispatchEvent('beforeRender', undefined, { useCache: false });
+
+    expect(fork.getProps().disabled).toBe(true);
+    expect(fork.serialize().props).not.toHaveProperty('disabled');
+  });
+
+  it('updates a disabled row action title through the real beforeRender flow', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({ ConfiguredActionModel });
+    engine.registerActions({ actionLinkageRules, linkageSetActionProps });
+    let savedData: ReturnType<ConfiguredActionModel['serialize']> | undefined;
+    engine.setModelRepository({
+      save: async (model) => {
+        savedData = model.serialize();
+        return savedData;
+      },
+    } as Parameters<FlowEngine['setModelRepository']>[0]);
+    const master = engine.createModel<ConfiguredActionModel>({
+      use: 'ConfiguredActionModel',
+      props: { title: 'Edit' },
+      stepParams: {
+        buttonSettings: {
+          general: { title: 'Edit' },
+          linkageRules: {
+            value: [
+              {
+                key: 'disable-edit',
+                enable: true,
+                condition: { logic: '$and', items: [] },
+                actions: [{ name: 'linkageSetActionProps', params: { value: 'disabled' } }],
+              },
+            ],
+          },
+        },
+      },
+    });
+    const fork = master.createFork({ className: 'row-action' });
+
+    await fork.dispatchEvent('beforeRender', undefined, { useCache: false });
+    expect(fork.getProps()).toMatchObject({ title: 'Edit', disabled: true });
+
+    fork.setStepParams('buttonSettings', 'general', { title: 'Updated' });
+    await fork.saveStepParams();
+    await fork.rerender();
+
+    expect(savedData?.props).not.toHaveProperty('disabled');
+    expect(savedData?.stepParams.buttonSettings.general.title).toBe('Updated');
+    expect(fork.getProps()).toMatchObject({ title: 'Updated', disabled: true });
+
+    const reloadedEngine = new FlowEngine();
+    reloadedEngine.registerModels({ ConfiguredActionModel });
+    reloadedEngine.registerActions({ actionLinkageRules, linkageSetActionProps });
+    const reloadedMaster = reloadedEngine.createModel<ConfiguredActionModel>({
+      use: 'ConfiguredActionModel',
+      props: savedData?.props,
+      stepParams: savedData?.stepParams,
+    });
+    const reloadedFork = reloadedMaster.createFork({ className: 'row-action' });
+
+    await reloadedFork.dispatchEvent('beforeRender', undefined, { useCache: false });
+    expect(reloadedFork.getProps()).toMatchObject({ title: 'Updated', disabled: true });
+  });
+
+  it('creates a new rules value when disabling a linkage rule', () => {
+    const rules = [
+      {
+        key: 'disable-edit',
+        title: 'Linkage rule',
+        enable: true,
+        condition: { logic: '$and', items: [] },
+        actions: [],
+      },
+    ];
+    const nextRules = updateLinkageRules(rules, (next) => {
+      next[0].enable = false;
+    });
+
+    expect(nextRules).toEqual([expect.objectContaining({ key: 'disable-edit', enable: false })]);
+    expect(nextRules).not.toBe(rules);
+    expect(rules[0].enable).toBe(true);
+  });
+});

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

@@ -225,6 +225,108 @@ describe('ensureFormValueDrivenDataScopeClear', () => {
     expect(onChange).toHaveBeenCalledWith(null);
   });
 
+  it('does not clear a popup form field when data scope depends on the external parent item', () => {
+    const emitter = new EventEmitter();
+    const formBlock = {
+      uid: 'form-1',
+      disposed: false,
+      emitter,
+      context: {
+        form: {},
+        formValues: { staff_m2o: null },
+      },
+    };
+
+    const onChange = vi.fn();
+    const model: any = {
+      disposed: false,
+      props: {
+        value: { id: 10 },
+        onChange,
+      },
+      context: {
+        blockModel: formBlock,
+      },
+    };
+
+    const ctx: any = {
+      model,
+      flowKey: 'selectSettings',
+    };
+
+    const filter = {
+      logic: '$and',
+      items: [{ path: 'orgId', operator: '$eq', value: '{{ ctx.item.parentItem.value.org_m2o.id }}' }],
+    };
+
+    ensureFormValueDrivenDataScopeClear(ctx, filter);
+
+    emitter.emit('formValuesChange', {
+      changedPaths: [['staff_m2o']],
+      allValues: { staff_m2o: { id: 10 } },
+    });
+
+    expect(onChange).not.toHaveBeenCalled();
+  });
+
+  it('maps popup current item dependencies to the popup form root', () => {
+    const emitter = new EventEmitter();
+    const formBlock = {
+      uid: 'form-1',
+      disposed: false,
+      emitter,
+      context: {
+        form: {},
+        formValues: {
+          org_m2o: { id: 1 },
+          staff_m2o: { id: 10 },
+        },
+      },
+    };
+
+    const onChange = vi.fn();
+    const model: any = {
+      disposed: false,
+      props: {
+        value: { id: 10 },
+        onChange,
+      },
+      context: {
+        blockModel: formBlock,
+      },
+    };
+
+    const ctx: any = {
+      model,
+      flowKey: 'selectSettings',
+    };
+
+    const filter = {
+      logic: '$and',
+      items: [{ path: 'orgId', operator: '$eq', value: '{{ ctx.item.value.org_m2o.id }}' }],
+    };
+
+    ensureFormValueDrivenDataScopeClear(ctx, filter);
+
+    emitter.emit('formValuesChange', {
+      changedPaths: [['staff_m2o']],
+      allValues: {
+        org_m2o: { id: 1 },
+        staff_m2o: { id: 10 },
+      },
+    });
+    expect(onChange).not.toHaveBeenCalled();
+
+    emitter.emit('formValuesChange', {
+      changedPaths: [['org_m2o']],
+      allValues: {
+        org_m2o: { id: 2 },
+        staff_m2o: { id: 10 },
+      },
+    });
+    expect(onChange).toHaveBeenCalledWith(null);
+  });
+
   it('does not clear a row field when a sibling field changes but the item dependency value is unchanged', () => {
     const emitter = new EventEmitter();
     const formBlock = {

package/src/flow/actions/__tests__/linkageRules.actionStates.test.ts

@@ -0,0 +1,33 @@
+/**
+ * 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 } from 'vitest';
+import { getActionLinkageStateOptions } from '../linkageRules';
+
+describe('getActionLinkageStateOptions', () => {
+  const t = (key: string) => key;
+
+  it('returns all states for regular action models', () => {
+    expect(getActionLinkageStateOptions({}, t).map((option) => option.value)).toEqual([
+      'visible',
+      'hidden',
+      'hiddenText',
+      'enabled',
+      'disabled',
+    ]);
+  });
+
+  it('filters states declared unsupported by the action model', () => {
+    expect(
+      getActionLinkageStateOptions({ supportedActionLinkageStates: ['visible', 'hidden'] }, t).map(
+        (option) => option.value,
+      ),
+    ).toEqual(['visible', 'hidden']);
+  });
+});

package/src/flow/actions/linkageRules.tsx

@@ -68,6 +68,12 @@ interface LinkageRule {
   }[];
 }
 
+export function updateLinkageRules<T>(rules: T[], updater: (nextRules: T[]) => void): T[] {
+  const nextRules = _.cloneDeep(rules);
+  updater(nextRules);
+  return nextRules;
+}
+
 const previewValueForLog = (value: any) => {
   if (value == null) return value;
   const t = typeof value;
@@ -654,6 +660,30 @@ export const linkageSetBlockProps = defineAction({
   },
 });
 
+const ACTION_LINKAGE_STATE_OPTIONS = [
+  { label: 'Visible', value: 'visible' },
+  { label: 'Hidden', value: 'hidden' },
+  { label: 'Hidden text', value: 'hiddenText' },
+  { label: 'Enabled', value: 'enabled' },
+  { label: 'Disabled', value: 'disabled' },
+] as const;
+
+type ActionLinkageState = (typeof ACTION_LINKAGE_STATE_OPTIONS)[number]['value'];
+
+export function getActionLinkageStateOptions(
+  model: { supportedActionLinkageStates?: readonly ActionLinkageState[] },
+  t: (key: string) => string,
+) {
+  const supportedStates = model.supportedActionLinkageStates ? new Set(model.supportedActionLinkageStates) : undefined;
+
+  return ACTION_LINKAGE_STATE_OPTIONS.filter((option) => !supportedStates || supportedStates.has(option.value)).map(
+    (option) => ({
+      label: t(option.label),
+      value: option.value,
+    }),
+  );
+}
+
 export const linkageSetActionProps = defineAction({
   name: 'linkageSetActionProps',
   title: tExpr('Set button state'),
@@ -674,13 +704,7 @@ export const linkageSetActionProps = defineAction({
             onChange={onChange}
             placeholder={t('Please select state')}
             style={{ width: '100%' }}
-            options={[
-              { label: t('Visible'), value: 'visible' },
-              { label: t('Hidden'), value: 'hidden' },
-              { label: t('Hidden text'), value: 'hiddenText' },
-              { label: t('Enabled'), value: 'enabled' },
-              { label: t('Disabled'), value: 'disabled' },
-            ]}
+            options={getActionLinkageStateOptions(ctx.model, t)}
             allowClear
           />
         );
@@ -1500,13 +1524,26 @@ async function resolveLinkageRulesParamsPreservingRunJsScripts(ctx: FlowContext,
 }
 
 const LinkageRulesUI = observer(
-  (props: { readonly value: LinkageRule[]; supportedActions: string[]; title?: string }) => {
-    const { value: rules, supportedActions } = props;
+  (props: {
+    readonly value: LinkageRule[];
+    onChange?: (value: LinkageRule[]) => void;
+    supportedActions: string[];
+    title?: string;
+  }) => {
+    const { value: rules = [], onChange, supportedActions } = props;
     const ctx = useFlowContext();
     const flowEngine = useFlowEngine();
     const t = ctx.model.translate.bind(ctx.model);
     const assignPriorityTip = t('Assignment takes precedence over form field assignment');
 
+    const replaceRules = (updater: (nextRules: LinkageRule[]) => void) => {
+      if (onChange) {
+        onChange(updateLinkageRules(rules, updater));
+      } else {
+        updater(rules);
+      }
+    };
+
     // 创建新规则的默认值
     const createNewRule = (): LinkageRule => ({
       key: uid(),
@@ -1523,7 +1560,7 @@ const LinkageRulesUI = observer(
 
     // 删除规则
     const handleDeleteRule = (index: number) => {
-      rules.splice(index, 1);
+      replaceRules((nextRules) => nextRules.splice(index, 1));
     };
 
     // 上移规则
@@ -1562,7 +1599,9 @@ const LinkageRulesUI = observer(
 
     // 切换规则启用状态
     const handleToggleEnable = (index: number, enable: boolean) => {
-      rules[index].enable = enable;
+      replaceRules((nextRules) => {
+        nextRules[index].enable = enable;
+      });
     };
 
     // 获取可用的动作类型
@@ -2222,7 +2261,7 @@ const commonLinkageRulesHandler = async (ctx: FlowContext, params: any) => {
           }
 
           rememberOriginalProp(key, model.props?.[key]);
-          if (key === 'hiddenText') {
+          if (key === 'hiddenText' && normalizedProps[key]) {
             rememberOriginalProp('title', model.props?.title);
           }
           if (key === 'required') {
@@ -2286,7 +2325,6 @@ const commonLinkageRulesHandler = async (ctx: FlowContext, params: any) => {
     const newProps = { ...model.__originalProps, ...patchProps };
     const prevHidden = !!model.hidden;
     const nextHidden = !!newProps.hiddenModel;
-
     model.setProps(_.omit(newProps, ['hiddenModel', 'value', 'hiddenText', LINKAGE_ASSIGN_MODE_PROP]));
     syncFieldOptionsToForks(model, patchProps);
     if (typeof model.setHidden === 'function') {

package/src/flow/common/Markdown/style.ts

@@ -26,6 +26,10 @@ export default function useStyle() {
     () => ({
       [`.${COMPONENT_CLS}`]: {
         '.vditor-reset': { fontSize: `${token.fontSize}px !important`, color: 'unset' },
+        '.vditor-reset h2': {
+          borderBottom: 'none !important',
+          boxShadow: 'none !important',
+        },
         '.vditor': {
           borderRadius: 8,
         },

package/src/flow/components/BlockItemCard.tsx

@@ -150,7 +150,7 @@ export const BlockItemCard = React.forwardRef(
   ) => {
     const { t } = useTranslation();
     const { token } = theme.useToken();
-    const { title: blockTitle, description, children, className, heightMode, ...rest } = props;
+    const { title: blockTitle, description, children, className, heightMode, style, ...rest } = props;
     const cardRef = useRef<HTMLDivElement | null>(null);
     const setCardRef = useCallback(
       (node: HTMLDivElement | null) => {
@@ -185,7 +185,7 @@ export const BlockItemCard = React.forwardRef(
       <Card
         ref={setCardRef as any}
         title={title}
-        style={{ display: 'flex', flexDirection: 'column', height: height }}
+        style={{ display: 'flex', flexDirection: 'column', ...style, height: height ?? style?.height }}
         styles={{
           body: { flex: 1, display: 'flex', flexDirection: 'column', overflow: 'auto' },
           header: {