@nocobase/client-v2 2.1.0-alpha.37 → 2.1.0-alpha.38

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@nocobase/client-v2",
-  "version": "2.1.0-alpha.37",
+  "version": "2.1.0-alpha.38",
   "license": "Apache-2.0",
   "main": "lib/index.js",
   "module": "es/index.mjs",
@@ -24,10 +24,10 @@
     "@formily/antd-v5": "1.2.3",
     "@formily/react": "^2.2.27",
     "@formily/shared": "^2.2.27",
-    "@nocobase/evaluators": "2.1.0-alpha.37",
-    "@nocobase/flow-engine": "2.1.0-alpha.37",
-    "@nocobase/sdk": "2.1.0-alpha.37",
-    "@nocobase/shared": "2.1.0-alpha.37",
+    "@nocobase/evaluators": "2.1.0-alpha.38",
+    "@nocobase/flow-engine": "2.1.0-alpha.38",
+    "@nocobase/sdk": "2.1.0-alpha.38",
+    "@nocobase/shared": "2.1.0-alpha.38",
     "ahooks": "^3.7.2",
     "antd": "5.24.2",
     "antd-style": "3.7.1",
@@ -41,5 +41,5 @@
     "react-i18next": "^11.15.1",
     "react-router-dom": "^6.30.1"
   },
-  "gitHead": "8b45f4586ea5b386b376188cfc1012ec12e9bc8b"
+  "gitHead": "cc99815fc9ae0612d6db0db5ebbc87a774fff8ed"
 }

package/src/flow/admin-shell/admin-layout/AdminLayoutMenuModels.tsx

@@ -681,6 +681,7 @@ export class AdminLayoutMenuItemModel extends FlowModel<AdminLayoutMenuItemStruc
 AdminLayoutMenuItemModel.registerFlow({
   key: 'menuCreation',
   title: 'Add menu item',
+  manual: true,
   steps: {
     basic: {
       title: 'Add menu item',
@@ -697,6 +698,7 @@ AdminLayoutMenuItemModel.registerFlow({
 AdminLayoutMenuItemModel.registerFlow({
   key: 'menuSettings',
   title: 'Menu settings',
+  manual: true,
   steps: {
     edit: {
       title: 'Edit',

package/src/flow/components/code-editor/__tests__/useCodeRunner.test.tsx

@@ -14,6 +14,7 @@ import { render, waitFor } from '@testing-library/react';
 import { App, ConfigProvider } from 'antd';
 import { useCodeRunner } from '../hooks/useCodeRunner';
 import {
+  FlowContext,
   FlowEngine,
   FlowModel,
   FlowEngineProvider,
@@ -21,6 +22,7 @@ import {
   ElementProxy,
   createSafeWindow,
   createSafeDocument,
+  createViewScopedEngine,
 } from '@nocobase/flow-engine';
 import { JSEditableFieldModel } from '../../../models/fields/JSEditableFieldModel';
 
@@ -31,6 +33,20 @@ class DummyJsAutoModel extends FlowModel {
   }
 }
 
+function registerRunJsPreviewFlow(model: FlowModel) {
+  model.registerFlow('jsSettings', {
+    steps: {
+      runJs: {
+        useRawParams: true,
+        async handler(ctx) {
+          const code = ctx?.inputArgs?.preview?.code || '';
+          return ctx.runjs(code, undefined, { preprocessTemplates: true });
+        },
+      },
+    },
+  });
+}
+
 describe('useCodeRunner (beforeRender)', () => {
   it('logs success and captures console output', async () => {
     const engine = new FlowEngine();
@@ -192,6 +208,71 @@ describe('useCodeRunner (beforeRender)', () => {
     });
   });
 
+  it('keeps popup context when a top scoped engine has another model with the same uid', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({ DummyJsAutoModel });
+    const model = engine.createModel<DummyJsAutoModel>({ use: 'DummyJsAutoModel', uid: 'same-popup-uid' });
+    model.context.defineProperty('popup', {
+      value: {
+        uid: 'popup-view',
+        record: { username: 'alice' },
+      },
+    });
+    registerRunJsPreviewFlow(model);
+
+    const scopedEngine = createViewScopedEngine(engine);
+    const topModel = scopedEngine.createModel<DummyJsAutoModel>({ use: 'DummyJsAutoModel', uid: 'same-popup-uid' });
+    registerRunJsPreviewFlow(topModel);
+
+    const { result } = renderHook(() => useCodeRunner(model.context, 'v1'));
+    let runResult: any;
+    await act(async () => {
+      runResult = await result.current.run(`
+const currentUsername = await ctx.getVar('ctx.popup.record.username');
+console.log(currentUsername);
+return currentUsername;
+`);
+    });
+
+    expect(runResult?.success).toBe(true);
+    expect(runResult?.value).toBe('alice');
+    expect(result.current.logs.some((l) => l.level === 'log' && l.msg.includes('alice'))).toBe(true);
+  });
+
+  it('runs direct event-flow previews against the popup-bound model context when the settings view has no popup', async () => {
+    const engine = new FlowEngine();
+    engine.registerModels({ DummyJsAutoModel });
+    const model = engine.createModel<DummyJsAutoModel>({ use: 'DummyJsAutoModel', uid: 'direct-popup-uid' });
+    model.context.defineProperty('popup', {
+      value: {
+        uid: 'popup-view',
+        record: { username: 'alice' },
+      },
+    });
+
+    const scopedEngine = createViewScopedEngine(engine);
+    scopedEngine.createModel<DummyJsAutoModel>({ use: 'DummyJsAutoModel', uid: 'direct-popup-uid' });
+
+    const settingsCtx = new FlowContext();
+    settingsCtx.defineProperty('engine', { value: scopedEngine });
+    settingsCtx.defineProperty('popup', { value: undefined });
+    settingsCtx.addDelegate(model.context);
+
+    const { result } = renderHook(() => useCodeRunner(settingsCtx as any, 'v1'));
+    let runResult: any;
+    await act(async () => {
+      runResult = await result.current.run(`
+const currentUsername = await ctx.getVar('ctx.popup.record.username');
+console.log(currentUsername);
+return currentUsername;
+`);
+    });
+
+    expect(runResult?.success).toBe(true);
+    expect(runResult?.value).toBe('alice');
+    expect(result.current.logs.some((l) => l.level === 'log' && l.msg.includes('alice'))).toBe(true);
+  });
+
   it('compiles JSX in preview and renders antd Input without syntax error', async () => {
     const engine = new FlowEngine();
     engine.registerModels({ DummyJsAutoModel });

package/src/flow/components/code-editor/hooks/useCodeRunner.ts

@@ -112,6 +112,31 @@ function createLoggerWrapperFactory(append: (level: RunLog['level'], args: any[]
   return wrap;
 }
 
+function hasPopupViewMarkers(view: any): boolean {
+  const inputArgs = view?.inputArgs || {};
+  const openerUids = inputArgs?.openerUids;
+  const viewStack = view?.navigation?.viewStack;
+
+  return (Array.isArray(openerUids) && openerUids.length > 0) || (Array.isArray(viewStack) && viewStack.length >= 2);
+}
+
+async function hasPreviewPopupContext(ctx: any): Promise<boolean> {
+  if (!ctx) return false;
+
+  try {
+    const popup = await ctx.popup;
+    if (popup) return true;
+  } catch (_) {
+    // ignore unavailable popup getters
+  }
+
+  try {
+    return hasPopupViewMarkers(await ctx.view);
+  } catch (_) {
+    return false;
+  }
+}
+
 export function useCodeRunner(hostCtx: FlowModelContext, version = 'v1') {
   const [logs, setLogs] = useState<RunLog[]>([]);
   const [running, setRunning] = useState(false);
@@ -131,7 +156,14 @@ export function useCodeRunner(hostCtx: FlowModelContext, version = 'v1') {
         const model = hostCtx?.model;
         if (!model) throw new Error('No model in FlowContext');
         const engine = hostCtx.engine;
-        const runtimeModel = engine.getModel(model.uid, true) || model;
+        const globalRuntimeModel = engine.getModel(model.uid, true) || model;
+        const [hostHasPopupContext, modelHasPopupContext] = await Promise.all([
+          hasPreviewPopupContext(hostCtx),
+          hasPreviewPopupContext(model.context),
+        ]);
+        const shouldPreservePopupModel = hostHasPopupContext || modelHasPopupContext;
+        const runtimeModel = shouldPreservePopupModel ? model : globalRuntimeModel;
+        const directRunCtx = hostHasPopupContext ? hostCtx : modelHasPopupContext ? model.context : hostCtx;
 
         const nativeConsole: Record<RunLog['level'], (...args: any[]) => void> = {
           log: (...args) => console.log(...args),
@@ -255,7 +287,7 @@ export function useCodeRunner(hostCtx: FlowModelContext, version = 'v1') {
           if (!flow) {
             // 无可用流程（典型场景：联动规则里的 RunJS 预览），直接在当前上下文执行代码
             const navigator = createSafeNavigator();
-            await hostCtx.runjs(
+            await directRunCtx.runjs(
               code,
               { window: createSafeWindow({ navigator }), document: createSafeDocument(), navigator },
               { version },

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),

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

@@ -11,6 +11,7 @@ import React from 'react';
 import { act, render, screen, waitFor } from '@testing-library/react';
 import { describe, expect, it, vi } from 'vitest';
 import { FlowEngine, FlowEngineProvider, FlowModel, FlowModelRenderer } from '@nocobase/flow-engine';
+import { get as lodashGet, set as lodashSet } from 'lodash';
 import { JSEditableFieldModel } from '../JSEditableFieldModel';
 
 function createField(props?: Record<string, any>, code = '') {
@@ -73,6 +74,21 @@ const React = ctx.React;
 ctx.render(<span data-testid="js-readonly-state">{String(ctx.readOnly)}</span>);
 `;
 
+const SET_VALUE_AND_RENDER_NAME_PATH_CODE = `
+const React = ctx.React;
+ctx.setValue?.('44');
+ctx.render(<span data-testid="js-name-path">{JSON.stringify(ctx.namePath)}</span>);
+`;
+
+function createFormStub(initialValues: any = {}) {
+  const store = JSON.parse(JSON.stringify(initialValues));
+  return {
+    getFieldValue: (namePath: any) => lodashGet(store, namePath),
+    setFieldValue: (namePath: any, value: any) => lodashSet(store, namePath, value),
+    getFieldsValue: () => store,
+  };
+}
+
 class ParentModel extends FlowModel<any> {
   render() {
     return <FlowModelRenderer model={this.subModels.field} />;
@@ -83,6 +99,11 @@ function renderParentFieldWithFlowRenderer(
   fieldProps?: Record<string, any>,
   parentProps?: Record<string, any>,
   code = EDITABLE_CODE,
+  options?: {
+    fieldIndex?: string[];
+    fieldStepParams?: Record<string, any>;
+    form?: any;
+  },
 ) {
   const engine = new FlowEngine();
   engine.registerModels({ JSEditableFieldModel, ParentModel });
@@ -96,6 +117,7 @@ function renderParentFieldWithFlowRenderer(
         uid: 'js-field-with-parent',
         props: fieldProps,
         stepParams: {
+          ...(options?.fieldStepParams || {}),
           jsSettings: {
             runJs: {
               code,
@@ -106,6 +128,13 @@ function renderParentFieldWithFlowRenderer(
     },
   });
 
+  if (options?.form) {
+    parent.context.defineProperty('form', { value: options.form });
+  }
+  if (options?.fieldIndex) {
+    parent.subModels.field.context.defineProperty('fieldIndex', { value: options.fieldIndex });
+  }
+
   render(
     <FlowEngineProvider engine={engine}>
       <FlowModelRenderer model={parent} />
@@ -207,4 +236,72 @@ describe('JSEditableFieldModel', () => {
       applyFlowSpy.mockRestore();
     }
   });
+
+  it('writes top-level form values through the effective name path', async () => {
+    const form = createFormStub({});
+
+    renderParentFieldWithFlowRenderer({ name: 'staffname' }, undefined, SET_VALUE_AND_RENDER_NAME_PATH_CODE, {
+      form,
+      fieldStepParams: {
+        fieldSettings: {
+          init: {
+            fieldPath: 'staffname',
+          },
+        },
+      },
+    });
+
+    await waitFor(() => {
+      expect(form.getFieldValue(['staffname'])).toBe('44');
+      expect(screen.getByTestId('js-name-path')).toHaveTextContent(JSON.stringify(['staffname']));
+    });
+  });
+
+  it('writes subform list values under the association path instead of the form root', async () => {
+    const form = createFormStub({ org_o2m: [{}] });
+
+    renderParentFieldWithFlowRenderer({ name: 'orgname' }, undefined, SET_VALUE_AND_RENDER_NAME_PATH_CODE, {
+      form,
+      fieldIndex: ['org_o2m:0'],
+      fieldStepParams: {
+        fieldSettings: {
+          init: {
+            fieldPath: 'orgname',
+            associationPathName: 'org_o2m',
+          },
+        },
+      },
+    });
+
+    await waitFor(() => {
+      expect(form.getFieldValue(['org_o2m', 0, 'orgname'])).toBe('44');
+      expect(form.getFieldValue(['orgname'])).toBeUndefined();
+      expect(screen.getByTestId('js-name-path')).toHaveTextContent(JSON.stringify(['org_o2m', 0, 'orgname']));
+    });
+  });
+
+  it('writes nested subform list values with the full field index chain', async () => {
+    const form = createFormStub({ users: [{ roles: [{}, {}] }] });
+
+    renderParentFieldWithFlowRenderer({ name: 'roleName' }, undefined, SET_VALUE_AND_RENDER_NAME_PATH_CODE, {
+      form,
+      fieldIndex: ['users:0', 'roles:1'],
+      fieldStepParams: {
+        fieldSettings: {
+          init: {
+            fieldPath: 'roleName',
+            associationPathName: 'users.roles',
+          },
+        },
+      },
+    });
+
+    await waitFor(() => {
+      expect(form.getFieldValue(['users', 0, 'roles', 1, 'roleName'])).toBe('44');
+      expect(form.getFieldValue(['roleName'])).toBeUndefined();
+      expect(screen.getByTestId('js-name-path')).toHaveTextContent(
+        JSON.stringify(['users', 0, 'roles', 1, 'roleName']),
+      );
+    });
+  });
 });