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

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']),
+      );
+    });
+  });
 });

package/src/index.ts

@@ -9,6 +9,7 @@
 
 import 'antd/dist/reset.css';
 
+export * from './APIClient';
 export * from './BaseApplication';
 export * from './Application';
 export * from './PinnedPluginListContext';

package/src/nocobase-buildin-plugin/index.tsx

@@ -11,7 +11,7 @@ import { createCollectionContextMeta } from '@nocobase/flow-engine';
 import React, { createContext, type FC, useEffect, useRef, useState } from 'react';
 import { Navigate, Outlet, useLocation } from 'react-router-dom';
 import type { Application } from '../Application';
-import { getCurrentV2RedirectPath, getDefaultV2AdminRedirectPath, redirectToLegacySignin } from '../authRedirect';
+import { getCurrentV2RedirectPath, getDefaultV2AdminRedirectPath, redirectToV2Signin } from '../authRedirect';
 import { AppNotFound } from '../components';
 import { PluginFlowEngine } from '../flow';
 import { AdminLayoutMenuItemModel, AdminLayoutModel } from '../flow/admin-shell/admin-layout';
@@ -144,7 +144,7 @@ const CurrentUserProvider: FC = ({ children }) => {
 
         const user = res?.data?.data;
         if (user?.id == null) {
-          redirectToLegacySignin(app, getCurrentV2RedirectPath(app, locationRef.current), { replace: true });
+          redirectToV2Signin(app, getCurrentV2RedirectPath(app, locationRef.current), { replace: true });
           return;
         }
 
@@ -169,7 +169,7 @@ const CurrentUserProvider: FC = ({ children }) => {
       } catch (error: any) {
         const isAuthError = error?.response?.status === 401 || error?.status === 401;
         if (isAuthError) {
-          redirectToLegacySignin(app, getCurrentV2RedirectPath(app, locationRef.current), { replace: true });
+          redirectToV2Signin(app, getCurrentV2RedirectPath(app, locationRef.current), { replace: true });
           return;
         }
         if (mounted) {
@@ -199,7 +199,7 @@ const RootRedirect: FC = () => {
 
   useEffect(() => {
     if (!hasToken) {
-      redirectToLegacySignin(app, getDefaultV2AdminRedirectPath(app), { replace: true });
+      redirectToV2Signin(app, getDefaultV2AdminRedirectPath(app), { replace: true });
     }
   }, [app, hasToken]);
 

package/src/theme/globalStyles.ts

@@ -0,0 +1,21 @@
+/**
+ * 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 { injectGlobal } from '@emotion/css';
+
+// Antd v5 has no labelFontWeight token, so a descendant selector on the
+// stable Form structure is the lowest-risk implementation for the bolder
+// form label default. Injected globally because v1's GlobalThemeProvider
+// re-exports v2's, so any v1 app served from this codebase goes through
+// the same provider and should get the same defaults.
+injectGlobal`
+  .ant-form-item-label > label {
+    font-weight: 600;
+  }
+`;

package/src/theme/index.tsx

@@ -13,6 +13,7 @@ import React, { createContext, FC, useCallback, useMemo, useRef } from 'react';
 import compatOldTheme from './compatOldTheme';
 import { addCustomAlgorithmToTheme } from './customAlgorithm';
 import defaultTheme from './defaultTheme';
+import './globalStyles';
 import { ThemeConfig } from './type';
 
 interface ThemeItem {

package/src/utils/globalDeps.ts

@@ -33,7 +33,8 @@ import * as ReactRouter from 'react-router';
 import * as ReactRouterDom from 'react-router-dom';
 import jsxRuntime from 'react/jsx-runtime';
 import * as nocobaseClientV2 from '../index';
-
+import * as dndKitCore from '@dnd-kit/core';
+import * as dndKitSortable from '@dnd-kit/sortable';
 import type { RequireJS } from './requirejs';
 
 /**
@@ -75,6 +76,9 @@ export function defineGlobalDeps(requirejs: RequireJS) {
   requirejs.define('@nocobase/evaluators', () => nocobaseEvaluators);
   requirejs.define('@nocobase/evaluators/client', () => nocobaseEvaluators);
 
+  requirejs.define('@dnd-kit/core', () => dndKitCore);
+  requirejs.define('@dnd-kit/sortable', () => dndKitSortable);
+
   // utils
   requirejs.define('ahooks', () => ahooks);
   requirejs.define('axios', () => axios);