@nocobase/client-v2 2.1.0-alpha.30 → 2.1.0-alpha.31

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/client-v2",
-  "version": "2.1.0-alpha.30",
+  "version": "2.1.0-alpha.31",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.mjs",
@@ -24,9 +24,9 @@
     "@formily/antd-v5": "1.2.3",
     "@formily/react": "^2.2.27",
     "@formily/shared": "^2.2.27",
-    "@nocobase/flow-engine": "2.1.0-alpha.30",
-    "@nocobase/sdk": "2.1.0-alpha.30",
-    "@nocobase/shared": "2.1.0-alpha.30",
+    "@nocobase/flow-engine": "2.1.0-alpha.31",
+    "@nocobase/sdk": "2.1.0-alpha.31",
+    "@nocobase/shared": "2.1.0-alpha.31",
     "ahooks": "^3.7.2",
     "antd": "5.24.2",
     "classnames": "^2.3.1",
@@ -36,5 +36,5 @@
     "react-i18next": "^11.15.1",
     "react-router-dom": "^6.30.1"
   },
-  "gitHead": "292ae0ad87f195ed201b274902d21ecd96f5ddd0"
+  "gitHead": "e2bc6b461a9bfd336043069c3211c9c5b01ebcc3"
 }

package/src/BaseApplication.tsx

@@ -356,7 +356,7 @@ export abstract class BaseApplication<
   addRoutes() {
     this.router.add('not-found', {
       path: '*',
-      Component: this.components['AppNotFound'],
+      Component: () => null,
     });
   }
 

package/src/__tests__/app.test.tsx

@@ -72,29 +72,46 @@ describe('app', () => {
     });
   });
 
-  it('should mount the app and display "Not Found"', async () => {
+  it('should mount the base app with blank fallback route', async () => {
     const app = createMockClient();
     const element = document.createElement('div');
     act(() => {
       app.mount(element);
     });
-    await waitFor(() => expect(element.textContent).toContain('Sorry, the page you visited does not exist.'));
+    await waitFor(() => expect(element.querySelector('.ant-app')).not.toBeNull());
+    expect(element.textContent).toBe('');
   });
 
-  it('should render default "Not Found" view', async () => {
+  it('should render blank fallback route by default', async () => {
     const app = createMockClient();
     await renderApp(app);
-    expect(screen.getByText('Sorry, the page you visited does not exist.')).toBeInTheDocument();
+    expect(screen.queryByText('Sorry, the page you visited does not exist.')).not.toBeInTheDocument();
   });
 
-  it('should render custom "Not Found" component', async () => {
+  it('should not render custom "Not Found" component before builtin routes are added', async () => {
     class PluginHelloClient extends Plugin {}
     const app = createMockClient({
       plugins: [PluginHelloClient],
       components: { AppNotFound: () => <div>Not Found2</div> },
     });
     await renderApp(app);
-    expect(screen.getByText('Not Found2')).toBeInTheDocument();
+    expect(screen.queryByText('Not Found2')).not.toBeInTheDocument();
+  });
+
+  it('should render builtin "Not Found" view after builtin routes are added', async () => {
+    const app = createMockClient({
+      plugins: [NocoBaseBuildInPlugin as any],
+      router: { type: 'memory', initialEntries: ['/missing'] },
+    });
+    app.apiMock.onGet('app:getLang').reply(200, {
+      data: {
+        lang: 'en-US',
+        resources: { client: {} },
+        cron: {},
+      },
+    });
+    await renderApp(app);
+    expect(screen.getByText('Sorry, the page you visited does not exist.')).toBeInTheDocument();
   });
 
   it('should support app provider functionality', async () => {

package/src/__tests__/globalDeps.test.ts

@@ -9,6 +9,8 @@
 
 import { defineGlobalDeps } from '../utils/globalDeps';
 
+vi.mock('../index', () => ({}));
+
 describe('client-v2 defineGlobalDeps', () => {
   it('should register shared AMD dependencies for remote plugins', () => {
     const define = vi.fn();
@@ -24,5 +26,8 @@ describe('client-v2 defineGlobalDeps', () => {
     expect(define).toHaveBeenCalledWith('@nocobase/client-v2', expect.any(Function));
     expect(define).toHaveBeenCalledWith('@nocobase/flow-engine', expect.any(Function));
     expect(define).toHaveBeenCalledWith('ahooks', expect.any(Function));
+    expect(define).toHaveBeenCalledWith('dayjs', expect.any(Function));
+    expect(define).toHaveBeenCalledWith('lodash', expect.any(Function));
+    expect(define).toHaveBeenCalledWith('@emotion/css', expect.any(Function));
   });
 });

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

@@ -0,0 +1,438 @@
+/**
+ * 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 { FlowContext, FlowRuntimeContext } from '@nocobase/flow-engine';
+import { waitFor } from '@testing-library/react';
+import { EventEmitter } from 'events';
+import { beforeEach, describe, expect, it, vi } from 'vitest';
+import { actionLinkageRules, blockLinkageRules } from '../linkageRules';
+
+function createRule(overrides: any = {}) {
+  return {
+    key: 'r1',
+    title: 'r1',
+    enable: true,
+    condition: { logic: '$and', items: [] },
+    actions: [],
+    ...overrides,
+  };
+}
+
+function createRuntime(
+  params: any,
+  options: { fieldIndex?: string[]; fieldIndexRef?: { current: string[] }; actionHandler?: any; engineEmitter?: any } = {},
+) {
+  const formEmitter = new EventEmitter();
+  const formBlock: any = {
+    uid: 'form-block',
+    emitter: formEmitter,
+    formValueRuntime: {},
+  };
+  const actionHandler = options.actionHandler || vi.fn(async () => {});
+  const linkageRunjsHandler = vi.fn(async () => {});
+  const modelContext: any = new FlowContext();
+  modelContext.defineProperty('blockModel', { value: formBlock });
+  modelContext.defineProperty('app', {
+    value: {
+      jsonLogic: {
+        apply: () => true,
+      },
+    },
+  });
+  modelContext.defineProperty('fieldIndex', {
+    get: () => options.fieldIndexRef?.current || options.fieldIndex || [],
+    cache: false,
+  });
+  modelContext.defineMethod('resolveJsonTemplate', async (_template: any) => _template);
+  modelContext.defineMethod('getAction', (name: string) => {
+    if (name === 'actionLinkageRules') {
+      return { useRawParams: true, handler: actionHandler };
+    }
+    if (name === 'blockLinkageRules') {
+      return { useRawParams: true, handler: actionHandler };
+    }
+    if (name === 'linkageRunjs') {
+      return { handler: linkageRunjsHandler };
+    }
+    return undefined;
+  });
+  modelContext.defineMethod('getActions', () => new Map());
+  modelContext.defineMethod('t', (s: string) => s);
+
+  const model: any = {
+    uid: 'action-model',
+    context: modelContext,
+    flowEngine: options.engineEmitter ? { emitter: options.engineEmitter } : undefined,
+    isFork: false,
+    forks: new Set(),
+    getFlow: vi.fn(() => ({})),
+    getStepParams: vi.fn(() => params),
+    getAction: (name: string) => modelContext.getAction(name),
+    getActions: () => new Map(),
+    translate: (s: string) => s,
+  };
+  const ctx: any = new FlowRuntimeContext(model, 'buttonSettings');
+  ctx.defineMethod('resolveJsonTemplate', async (_template: any) => _template);
+
+  return {
+    ctx,
+    model,
+    formEmitter,
+    actionHandler,
+    linkageRunjsHandler,
+  };
+}
+
+describe('linkageRules: form value driven refresh', () => {
+  beforeEach(() => {
+    vi.useRealTimers();
+  });
+
+  it('refreshes action linkage rules when a ctx.formValues dependency changes', async () => {
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.formValues.status }}', operator: '$eq', value: 'active' }],
+          },
+        }),
+      ],
+    };
+    const { ctx, formEmitter, actionHandler } = createRuntime(params);
+
+    await actionLinkageRules.handler(ctx, params);
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['other']],
+    });
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    expect(actionHandler).not.toHaveBeenCalled();
+
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-2',
+      changedPaths: [['status']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+    expect(actionHandler.mock.calls[0][0].inputArgs).toMatchObject({
+      source: 'user',
+      txId: 'tx-2',
+      linkageTxId: 'tx-2',
+      changedPaths: [['status']],
+    });
+  });
+
+  it('refreshes block linkage rules when a ctx.formValues dependency changes', async () => {
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.formValues.status }}', operator: '$eq', value: 'active' }],
+          },
+        }),
+      ],
+    };
+    const { ctx, formEmitter, actionHandler } = createRuntime(params);
+
+    await blockLinkageRules.handler(ctx, params);
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['status']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+  });
+
+  it('dedupes subscriptions for repeated handler runs', async () => {
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.formValues.status }}', operator: '$eq', value: 'active' }],
+          },
+        }),
+      ],
+    };
+    const { ctx, formEmitter, actionHandler } = createRuntime(params);
+
+    await actionLinkageRules.handler(ctx, params);
+    await actionLinkageRules.handler(ctx, params);
+
+    expect(formEmitter.listenerCount('formValuesChange')).toBe(1);
+
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['status']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+  });
+
+  it('keeps action refresh subscription after the action is hidden and unmounted', async () => {
+    const engineEmitter = new EventEmitter();
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.formValues.status }}', operator: '$eq', value: 'active' }],
+          },
+        }),
+      ],
+    };
+    const { ctx, model, formEmitter, actionHandler } = createRuntime(params, { engineEmitter });
+
+    await actionLinkageRules.handler(ctx, params);
+    expect(formEmitter.listenerCount('formValuesChange')).toBe(1);
+
+    engineEmitter.emit('model:unmounted', { model });
+    expect(formEmitter.listenerCount('formValuesChange')).toBe(1);
+
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['status']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+  });
+
+  it('maps ctx.item.value dependencies to the current row path', async () => {
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.item.value.nickname }}', operator: '$eq', value: 'A' }],
+          },
+        }),
+      ],
+    };
+    const { ctx, formEmitter, actionHandler } = createRuntime(params, { fieldIndex: ['users:1'] });
+
+    await actionLinkageRules.handler(ctx, params);
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['users', 0, 'nickname']],
+    });
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    expect(actionHandler).not.toHaveBeenCalled();
+
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-2',
+      changedPaths: [['users', 1, 'nickname']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+  });
+
+  it('parses object-patch changedPaths before matching ctx.item.value dependencies', async () => {
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.item.value.nickname }}', operator: '$eq', value: 'A' }],
+          },
+        }),
+      ],
+    };
+    const { ctx, formEmitter, actionHandler } = createRuntime(params, { fieldIndex: ['users:1'] });
+
+    await actionLinkageRules.handler(ctx, params);
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['users[1].nickname']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+  });
+
+  it('recomputes ctx.item.value dependencies from the latest fieldIndex', async () => {
+    const fieldIndexRef = { current: ['users:1'] };
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.item.value.nickname }}', operator: '$eq', value: 'A' }],
+          },
+        }),
+      ],
+    };
+    const { ctx, formEmitter, actionHandler } = createRuntime(params, { fieldIndexRef });
+
+    await actionLinkageRules.handler(ctx, params);
+    fieldIndexRef.current = ['users:0'];
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['users', 0, 'nickname']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+  });
+
+  it('maps ctx.item.index dependencies to the current list path', async () => {
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.item.index }}', operator: '$eq', value: 1 }],
+          },
+        }),
+      ],
+    };
+    const { ctx, formEmitter, actionHandler } = createRuntime(params, { fieldIndex: ['users:1'] });
+
+    await actionLinkageRules.handler(ctx, params);
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['users', 1, 'nickname']],
+    });
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    expect(actionHandler).not.toHaveBeenCalled();
+
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-2',
+      changedPaths: [['users']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+  });
+
+  it('collects ctx.formValues dependencies from linkageRunjs scripts without resolving the script early', async () => {
+    const params = {
+      value: [
+        createRule({
+          actions: [
+            {
+              key: 'a1',
+              name: 'linkageRunjs',
+              params: {
+                value: {
+                  script: 'return ctx.formValues.amount',
+                },
+              },
+            },
+          ],
+        }),
+      ],
+    };
+    const { ctx, formEmitter, actionHandler, linkageRunjsHandler } = createRuntime(params);
+
+    await actionLinkageRules.handler(ctx, params);
+    expect(linkageRunjsHandler).toHaveBeenCalledTimes(1);
+
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['amount']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+  });
+
+  it('reruns once with the latest relevant change after a refresh is already running', async () => {
+    let resolveFirstRefresh: () => void = () => undefined;
+    const firstRefresh = new Promise<void>((resolve) => {
+      resolveFirstRefresh = resolve;
+    });
+    const actionHandler = vi
+      .fn()
+      .mockImplementationOnce(() => firstRefresh)
+      .mockImplementation(async () => undefined);
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.formValues.status }}', operator: '$eq', value: 'active' }],
+          },
+        }),
+      ],
+    };
+    const { ctx, formEmitter } = createRuntime(params, { actionHandler });
+
+    await actionLinkageRules.handler(ctx, params);
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['status']],
+    });
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-2',
+      changedPaths: [['status']],
+    });
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    expect(actionHandler).toHaveBeenCalledTimes(1);
+
+    resolveFirstRefresh();
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(2));
+  });
+
+  it('does not recursively refresh while handling its own linkage write event', async () => {
+    const params = {
+      value: [
+        createRule({
+          condition: {
+            logic: '$and',
+            items: [{ path: '{{ ctx.formValues.status }}', operator: '$eq', value: 'active' }],
+          },
+        }),
+      ],
+    };
+    const formEmitter = new EventEmitter();
+    const actionHandler = vi.fn(async () => {
+      formEmitter.emit('formValuesChange', {
+        source: 'linkage',
+        txId: 'tx-linkage',
+        linkageTxId: 'tx-1',
+        changedPaths: [['status']],
+      });
+    });
+    const runtime = createRuntime(params, { actionHandler });
+    runtime.formEmitter.removeAllListeners();
+    formEmitter.on('formValuesChange', (...args) => runtime.formEmitter.emit('formValuesChange', ...args));
+
+    await actionLinkageRules.handler(runtime.ctx, params);
+    formEmitter.emit('formValuesChange', {
+      source: 'user',
+      txId: 'tx-1',
+      changedPaths: [['status']],
+    });
+
+    await waitFor(() => expect(actionHandler).toHaveBeenCalledTimes(1));
+
+    runtime.formEmitter.emit('formValuesChange', {
+      source: 'linkage',
+      txId: 'tx-linkage-late',
+      linkageTxId: 'tx-1',
+      changedPaths: [['status']],
+    });
+    await new Promise((resolve) => setTimeout(resolve, 0));
+    expect(actionHandler).toHaveBeenCalledTimes(1);
+  });
+});

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

@@ -161,4 +161,46 @@ describe('linkageRulesRefresh action', () => {
     expect(ctx.resolveJsonTemplate).toHaveBeenCalled();
     expect(handler).toHaveBeenCalledWith(ctx, { value: ['x'] });
   });
+
+  it('passes raw params to useRawParams linkage actions', async () => {
+    const handler = vi.fn(async () => {});
+    const rawParams = {
+      value: [
+        {
+          key: 'r1',
+          enable: true,
+          condition: { logic: '$and', items: [] },
+          actions: [
+            {
+              name: 'linkageRunjs',
+              params: {
+                value: {
+                  script: 'return ctx.formValues.amount',
+                },
+              },
+            },
+          ],
+        },
+      ],
+    };
+    const model: any = {
+      isFork: false,
+      forks: new Set(),
+      getFlow: vi.fn(() => ({})),
+      getStepParams: vi.fn(() => rawParams),
+    };
+    const ctx: any = {
+      model,
+      resolveJsonTemplate: vi.fn(async () => ({ value: ['resolved'] })),
+      getAction: vi.fn(() => ({ useRawParams: true, handler })),
+    };
+
+    await linkageRulesRefresh.handler(ctx, {
+      actionName: 'actionLinkageRules',
+      flowKey: 'buttonSettings',
+    });
+
+    expect(ctx.resolveJsonTemplate).not.toHaveBeenCalled();
+    expect(handler).toHaveBeenCalledWith(ctx, rawParams);
+  });
 });

package/src/flow/actions/linkageRules.tsx

@@ -51,7 +51,12 @@ import {
   getCollectionFromModel,
   isToManyAssociationField,
 } from '../internal/utils/modelUtils';
-import { namePathToPathKey, parsePathString, resolveDynamicNamePath } from '../models/blocks/form/value-runtime/path';
+import {
+  namePathToPathKey,
+  parsePathString,
+  resolveDynamicNamePath,
+} from '../models/blocks/form/value-runtime/path';
+import { ensureFormValueDrivenLinkageRefresh } from './linkageRulesFormValueRefresh';
 
 interface LinkageRule {
   /** 随机生成的字符串 */
@@ -2081,6 +2086,7 @@ export const blockLinkageRules = defineAction({
   },
   useRawParams: true,
   handler: async (ctx, params) => {
+    ensureFormValueDrivenLinkageRefresh(ctx, params, 'blockLinkageRules');
     const resolved = await resolveLinkageRulesParamsPreservingRunJsScripts(ctx, params);
     return commonLinkageRulesHandler(ctx, resolved);
   },
@@ -2107,6 +2113,7 @@ export const actionLinkageRules = defineAction({
   },
   useRawParams: true,
   handler: async (ctx, params) => {
+    ensureFormValueDrivenLinkageRefresh(ctx, params, 'actionLinkageRules');
     const resolved = await resolveLinkageRulesParamsPreservingRunJsScripts(ctx, params);
     return commonLinkageRulesHandler(ctx, resolved);
   },